|
@@ -421,11 +421,27 @@ |
|
|
选择城市 |
|
|
选择城市 |
|
|
</div> |
|
|
</div> |
|
|
<div class="right"> |
|
|
<div class="right"> |
|
|
<div v-for="(item,index) in parentAndKidList" :key="index"> |
|
|
|
|
|
<el-select v-model="item.str1" clearable :disabled='item.disabled' placeholder="请选择" style="width:200px; margin-right: 20px;"> |
|
|
|
|
|
<!-- 省 --> |
|
|
|
|
|
|
|
|
<div v-for="(item,index) in firstList" :key="item.id"> |
|
|
|
|
|
<div style="display:flex;"> |
|
|
|
|
|
<div>{{item.name}}</div> |
|
|
|
|
|
<el-select v-model="item.cityIds" clearable multiple placeholder="默认为全部" style="width:400px;"> |
|
|
|
|
|
<el-option |
|
|
|
|
|
v-for="item1 in item.cityAreaList" |
|
|
|
|
|
:key="item1.id" |
|
|
|
|
|
:label="item1.name" |
|
|
|
|
|
:value="item1.id" |
|
|
|
|
|
> |
|
|
|
|
|
</el-option> |
|
|
|
|
|
</el-select> |
|
|
|
|
|
<div @click="delArea(index,0)">X</div> |
|
|
|
|
|
</div> |
|
|
|
|
|
</div> |
|
|
|
|
|
<div v-for="(item,index) in thirdList" :key="item.id"> |
|
|
|
|
|
<div style="display:flex;"> |
|
|
|
|
|
<div> |
|
|
|
|
|
<el-select v-model="item.areaId" clearable :disabled='item.disabled' @change="areaChange(index,0)" placeholder="请选择" style="width:200px; margin-right: 20px;"> |
|
|
<el-option |
|
|
<el-option |
|
|
v-for="item1 in parentAndKidList" |
|
|
|
|
|
|
|
|
v-for="item1 in secondList" |
|
|
:key="item1.id" |
|
|
:key="item1.id" |
|
|
:label="item1.name" |
|
|
:label="item1.name" |
|
|
:value="item1.id" |
|
|
:value="item1.id" |
|
@@ -433,10 +449,27 @@ |
|
|
> |
|
|
> |
|
|
</el-option> |
|
|
</el-option> |
|
|
</el-select> |
|
|
</el-select> |
|
|
<!-- 市 --> |
|
|
|
|
|
<el-select v-model="item.str2" clearable multiple placeholder="请选择" style="width:400px;"> |
|
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
<el-select v-model="item.cityIds" clearable multiple placeholder="默认为全部" style="width:400px;"> |
|
|
<el-option |
|
|
<el-option |
|
|
v-for="item1 in parentAndKidList" |
|
|
|
|
|
|
|
|
v-for="item1 in item.arr" |
|
|
|
|
|
:key="item1.id" |
|
|
|
|
|
:label="item1.name" |
|
|
|
|
|
:value="item1.id" |
|
|
|
|
|
> |
|
|
|
|
|
</el-option> |
|
|
|
|
|
</el-select> |
|
|
|
|
|
<div @click="delArea(index,1)">X</div> |
|
|
|
|
|
</div> |
|
|
|
|
|
</div> |
|
|
|
|
|
<!-- 当没有选择区域的时候 --> |
|
|
|
|
|
<div v-if="managerStr.length==0"> |
|
|
|
|
|
<div v-for="(item,index) in fourthList" :key="item.id"> |
|
|
|
|
|
<div style="display:flex;"> |
|
|
|
|
|
<div> |
|
|
|
|
|
<el-select v-model="item.areaId" clearable :disabled='item.disabled' @change="areaChange(index,1)" placeholder="请选择" style="width:200px; margin-right: 20px;"> |
|
|
|
|
|
<el-option |
|
|
|
|
|
v-for="item1 in allCityList" |
|
|
:key="item1.id" |
|
|
:key="item1.id" |
|
|
:label="item1.name" |
|
|
:label="item1.name" |
|
|
:value="item1.id" |
|
|
:value="item1.id" |
|
@@ -444,7 +477,19 @@ |
|
|
> |
|
|
> |
|
|
</el-option> |
|
|
</el-option> |
|
|
</el-select> |
|
|
</el-select> |
|
|
<div>X</div> |
|
|
|
|
|
|
|
|
</div> |
|
|
|
|
|
<el-select v-model="item.cityIds" clearable multiple placeholder="默认为全部" style="width:400px;"> |
|
|
|
|
|
<el-option |
|
|
|
|
|
v-for="item1 in item.arr" |
|
|
|
|
|
:key="item1.id" |
|
|
|
|
|
:label="item1.name" |
|
|
|
|
|
:value="item1.id" |
|
|
|
|
|
> |
|
|
|
|
|
</el-option> |
|
|
|
|
|
</el-select> |
|
|
|
|
|
<div @click="delArea(index,1)">X</div> |
|
|
|
|
|
</div> |
|
|
|
|
|
</div> |
|
|
</div> |
|
|
</div> |
|
|
<div @click="addArea">+</div> |
|
|
<div @click="addArea">+</div> |
|
|
</div> |
|
|
</div> |
|
@@ -486,10 +531,16 @@ |
|
|
}; |
|
|
}; |
|
|
return { |
|
|
return { |
|
|
managerStr:[], |
|
|
managerStr:[], |
|
|
choseFlag:false, |
|
|
|
|
|
|
|
|
choseFlag:true, |
|
|
// 获取的区域列表 |
|
|
// 获取的区域列表 |
|
|
arealist:[], |
|
|
arealist:[], |
|
|
parentAndKidList:[], |
|
|
parentAndKidList:[], |
|
|
|
|
|
originalData:[], |
|
|
|
|
|
firstList:[], |
|
|
|
|
|
secondList:[], |
|
|
|
|
|
thirdList:[], |
|
|
|
|
|
fourthList:[], |
|
|
|
|
|
allCityList:[], |
|
|
managerList:[], |
|
|
managerList:[], |
|
|
bindFlag:'0', |
|
|
bindFlag:'0', |
|
|
treeClick: '', //点击样式 |
|
|
treeClick: '', //点击样式 |
|
@@ -692,7 +743,16 @@ |
|
|
// 区域改变 |
|
|
// 区域改变 |
|
|
managerChange(){ |
|
|
managerChange(){ |
|
|
console.log(this.managerStr) |
|
|
console.log(this.managerStr) |
|
|
this.getParentAndKidList() |
|
|
|
|
|
|
|
|
// 初始化数据 |
|
|
|
|
|
this.firstList=[] |
|
|
|
|
|
this.secondList=[] |
|
|
|
|
|
this.thirdList=[] |
|
|
|
|
|
this.fourthList=[] |
|
|
|
|
|
if(this.managerStr.length==0){ |
|
|
|
|
|
return |
|
|
|
|
|
} |
|
|
|
|
|
this.getParentAndKidList() |
|
|
|
|
|
|
|
|
}, |
|
|
}, |
|
|
// 通过地区串获取省市 |
|
|
// 通过地区串获取省市 |
|
|
getParentAndKidList(){ |
|
|
getParentAndKidList(){ |
|
@@ -700,31 +760,134 @@ |
|
|
areaIds:this.managerStr.join(',') |
|
|
areaIds:this.managerStr.join(',') |
|
|
}) |
|
|
}) |
|
|
.then(res=>{ |
|
|
.then(res=>{ |
|
|
console.log(res) |
|
|
|
|
|
|
|
|
// console.log(res) |
|
|
|
|
|
// 获取区域下的省数据,对数据进行处理,首先将数据分为三个数组,一个是用来存储没有多选框的,一个用来存储有多选的,一个原始数据 |
|
|
|
|
|
// 原始数据,用来比对数据和添加使用 |
|
|
|
|
|
this.originalData=res.data |
|
|
|
|
|
// 渲染第一个是text的数组 |
|
|
|
|
|
// 这里不考虑禁用 |
|
|
res.data.map(item=>{ |
|
|
res.data.map(item=>{ |
|
|
item.str1='' |
|
|
|
|
|
item.str2='' |
|
|
|
|
|
item.disabled=false |
|
|
|
|
|
|
|
|
item.cityIds='' |
|
|
}) |
|
|
}) |
|
|
this.parentAndKidList=res.data |
|
|
|
|
|
|
|
|
this.firstList=res.data |
|
|
|
|
|
// 初始化数据 |
|
|
|
|
|
this.secondList=[] |
|
|
|
|
|
this.thirdList=[] |
|
|
|
|
|
this.fourthList=[] |
|
|
}) |
|
|
}) |
|
|
}, |
|
|
}, |
|
|
|
|
|
// 删除区域 |
|
|
|
|
|
delArea(idx,flag){ |
|
|
|
|
|
// 第一个删除 |
|
|
|
|
|
if(flag==0){ |
|
|
|
|
|
// 先获取删除数组的内容,将其内容放到第三个数组里面 |
|
|
|
|
|
let obj=this.firstList[idx] |
|
|
|
|
|
// obj.areaId='' |
|
|
|
|
|
// // 这里需要有禁用选项 |
|
|
|
|
|
// obj.disabled=false |
|
|
|
|
|
// // 给定一个空数组,当他的选择时将数组内容改变 |
|
|
|
|
|
// obj.children=[] |
|
|
|
|
|
this.secondList.push(obj) |
|
|
|
|
|
console.log(this.secondList) |
|
|
|
|
|
// 删除数组的指定项 |
|
|
|
|
|
this.firstList.splice(idx,1) |
|
|
|
|
|
}else{ |
|
|
|
|
|
let obj=this.thirdList[idx] |
|
|
|
|
|
this.secondList.push(obj) |
|
|
|
|
|
// 删除数组的指定项 |
|
|
|
|
|
this.thirdList.splice(idx,1) |
|
|
|
|
|
} |
|
|
|
|
|
}, |
|
|
// 点击添加时的操作 |
|
|
// 点击添加时的操作 |
|
|
addArea(){ |
|
|
addArea(){ |
|
|
// 先判断最后一项是否选择如果没选择则返回 |
|
|
|
|
|
if(this.agentList[this.agentList.length-1].str1=''){ |
|
|
|
|
|
this.$message.waring('请选择最后一项在说') |
|
|
|
|
|
|
|
|
// 这是第一种情况 |
|
|
|
|
|
if(this.managerStr.length>0){ |
|
|
|
|
|
// 先判断第二个数组里面是否有数据,有的时候就可以添加没的时候提示 |
|
|
|
|
|
if(this.secondList.length==0){ |
|
|
|
|
|
this.$message.warning('没有更多啦!') |
|
|
|
|
|
return |
|
|
|
|
|
} |
|
|
|
|
|
let num=0 |
|
|
|
|
|
this.secondList.map(item=>{ |
|
|
|
|
|
if(item.disabled){ |
|
|
|
|
|
num++ |
|
|
|
|
|
} |
|
|
|
|
|
}) |
|
|
|
|
|
if(num==this.secondList.length){ |
|
|
|
|
|
this.$message.warning('不能选择更多啦') |
|
|
return |
|
|
return |
|
|
} |
|
|
} |
|
|
this.agentList.map(item=>{ |
|
|
|
|
|
|
|
|
// 在判断最后一项是否选择如果没选择则返回 |
|
|
|
|
|
if(this.thirdList.length>0&&this.thirdList[this.thirdList.length-1].areaId==''){ |
|
|
|
|
|
this.$message.warning('请选择最后一项在说') |
|
|
|
|
|
return |
|
|
|
|
|
} |
|
|
|
|
|
// 然后将所有的都变为禁用 |
|
|
|
|
|
// this.secondList.map(item=>{ |
|
|
|
|
|
// item.disabled=true |
|
|
|
|
|
// }) |
|
|
|
|
|
this.thirdList.map(item=>{ |
|
|
item.disabled=true |
|
|
item.disabled=true |
|
|
}) |
|
|
}) |
|
|
// 在数组里面放入一个对象 |
|
|
// 在数组里面放入一个对象 |
|
|
let obj={ |
|
|
let obj={ |
|
|
str1:'', |
|
|
|
|
|
str2:[], |
|
|
|
|
|
|
|
|
cityIds:'', |
|
|
|
|
|
areaId:'', |
|
|
|
|
|
arr:[], |
|
|
|
|
|
disabled:false |
|
|
|
|
|
} |
|
|
|
|
|
this.thirdList.push(obj) |
|
|
|
|
|
}else{ |
|
|
|
|
|
|
|
|
|
|
|
if(this.fourthList.length>0&&this.fourthList[this.fourthList.length-1].areaId==''){ |
|
|
|
|
|
this.$message.warning('请选择最后一项在说') |
|
|
|
|
|
return |
|
|
|
|
|
} |
|
|
|
|
|
this.fourthList.map(item=>{ |
|
|
|
|
|
item.disabled=true |
|
|
|
|
|
}) |
|
|
|
|
|
// 第二种情况,当没选择的时候 |
|
|
|
|
|
let obj={ |
|
|
|
|
|
cityIds:'', |
|
|
|
|
|
areaId:'', |
|
|
|
|
|
arr:[], |
|
|
|
|
|
disabled:false |
|
|
|
|
|
} |
|
|
|
|
|
this.fourthList.push(obj) |
|
|
} |
|
|
} |
|
|
this.agentList.push(obj) |
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}, |
|
|
|
|
|
// 选择的区域地区改变时给数组的arr赋值 |
|
|
|
|
|
async areaChange(idx,flag){ |
|
|
|
|
|
console.log(idx) |
|
|
|
|
|
// 第一种情况 |
|
|
|
|
|
if(flag==0){ |
|
|
|
|
|
// this.thirdList[idx].areaId |
|
|
|
|
|
// 循环数组获取到当前区域id下的数据给定第三个数组 |
|
|
|
|
|
let num= this.secondList.findIndex(item=>item.id==this.thirdList[idx].areaId) |
|
|
|
|
|
if(num!=-1){ |
|
|
|
|
|
this.thirdList[idx].arr=this.secondList[num].cityAreaList |
|
|
|
|
|
// this.secondList.splice(num,1) |
|
|
|
|
|
this.secondList[num].disabled=true |
|
|
|
|
|
} |
|
|
|
|
|
}else{ |
|
|
|
|
|
// 获取选中的id并且赋值 |
|
|
|
|
|
let num= this.allCityList.findIndex(item=>item.id==this.fourthList[idx].areaId) |
|
|
|
|
|
if(num!=-1){ |
|
|
|
|
|
this.fourthList[idx].arr=await this.getValueByCondition(this.fourthList[idx].areaId) |
|
|
|
|
|
// this.secondList.splice(num,1) |
|
|
|
|
|
this.allCityList[num].disabled=true |
|
|
|
|
|
} |
|
|
|
|
|
|
|
|
|
|
|
} |
|
|
|
|
|
}, |
|
|
|
|
|
// 获取所有省 |
|
|
|
|
|
async getValueByCondition(e){ |
|
|
|
|
|
let res=await this.$api.api.getValueByCondition( |
|
|
|
|
|
{pid:e} |
|
|
|
|
|
) |
|
|
|
|
|
// console.log(res) |
|
|
|
|
|
return res.data |
|
|
}, |
|
|
}, |
|
|
// 下一步 |
|
|
// 下一步 |
|
|
nextshow(){ |
|
|
nextshow(){ |
|
@@ -800,6 +963,10 @@ |
|
|
// 绑定方式改变 |
|
|
// 绑定方式改变 |
|
|
radioChange(e){ |
|
|
radioChange(e){ |
|
|
console.log(e) |
|
|
console.log(e) |
|
|
|
|
|
this.firstList=[] |
|
|
|
|
|
this.secondList=[] |
|
|
|
|
|
this.thirdList=[] |
|
|
|
|
|
this.fourthList=[] |
|
|
}, |
|
|
}, |
|
|
// 查询楼盘 |
|
|
// 查询楼盘 |
|
|
searchHouse(){ |
|
|
searchHouse(){ |
|
@@ -820,7 +987,57 @@ |
|
|
.then(res=>{ |
|
|
.then(res=>{ |
|
|
console.log(res) |
|
|
console.log(res) |
|
|
}) |
|
|
}) |
|
|
|
|
|
}else{ |
|
|
|
|
|
// 省市json串 |
|
|
|
|
|
let areaJsonString=[] |
|
|
|
|
|
// 地区id拼成串 |
|
|
|
|
|
let areaIds=this.managerStr.join(',') |
|
|
|
|
|
// 区域选择 |
|
|
|
|
|
// 两种情况 |
|
|
|
|
|
if(areaIds){ |
|
|
|
|
|
// 当选择的是区域的时候 |
|
|
|
|
|
this.firstList.map(item=>{ |
|
|
|
|
|
let obj={ |
|
|
|
|
|
// 省 |
|
|
|
|
|
provinceList:item.id, |
|
|
|
|
|
// 市 |
|
|
|
|
|
cityList:item.cityIds.join(','), |
|
|
|
|
|
} |
|
|
|
|
|
areaJsonString.push(obj) |
|
|
|
|
|
}) |
|
|
|
|
|
this.thirdList.map(item=>{ |
|
|
|
|
|
let obj={ |
|
|
|
|
|
// 省 |
|
|
|
|
|
provinceList:item.areaId, |
|
|
|
|
|
// 市 |
|
|
|
|
|
cityList:item.cityIds.join(','), |
|
|
|
|
|
} |
|
|
|
|
|
areaJsonString.push(obj) |
|
|
|
|
|
}) |
|
|
|
|
|
}else{ |
|
|
|
|
|
this.fourthList.map(item=>{ |
|
|
|
|
|
let obj={ |
|
|
|
|
|
// 省 |
|
|
|
|
|
provinceList:item.areaId, |
|
|
|
|
|
// 市 |
|
|
|
|
|
cityList:item.cityIds.join(','), |
|
|
|
|
|
} |
|
|
|
|
|
areaJsonString.push(obj) |
|
|
|
|
|
}) |
|
|
|
|
|
} |
|
|
|
|
|
// console.log(areaJsonString,areaIds,'数据') |
|
|
|
|
|
// return |
|
|
|
|
|
this.$api.api.areaAdd({ |
|
|
|
|
|
accountId:this.accountId, |
|
|
|
|
|
areaJsonString:JSON.stringify(areaJsonString), |
|
|
|
|
|
areaIds |
|
|
|
|
|
}) |
|
|
|
|
|
.then(res=>{ |
|
|
|
|
|
console.log(res) |
|
|
|
|
|
}) |
|
|
} |
|
|
} |
|
|
|
|
|
this.houseVisible=true |
|
|
|
|
|
this.roleList() |
|
|
}, |
|
|
}, |
|
|
// 楼盘绑定解绑 |
|
|
// 楼盘绑定解绑 |
|
|
// bindhouse(e){ |
|
|
// bindhouse(e){ |
|
@@ -869,13 +1086,17 @@ |
|
|
}) |
|
|
}) |
|
|
}, |
|
|
}, |
|
|
// 去楼盘管理 |
|
|
// 去楼盘管理 |
|
|
gochosehouse(row){ |
|
|
|
|
|
|
|
|
async gochosehouse(row){ |
|
|
console.log(row) |
|
|
console.log(row) |
|
|
this.accountId=row.accountId |
|
|
this.accountId=row.accountId |
|
|
this.houseVisible=true |
|
|
this.houseVisible=true |
|
|
this.gethouseList() |
|
|
this.gethouseList() |
|
|
// 获取区域列表 |
|
|
// 获取区域列表 |
|
|
this.areamanagerList() |
|
|
this.areamanagerList() |
|
|
|
|
|
// 获取所有省列表 |
|
|
|
|
|
// console.log(await this.getValueByCondition(0)) |
|
|
|
|
|
this.allCityList=await this.getValueByCondition(0) |
|
|
|
|
|
|
|
|
}, |
|
|
}, |
|
|
// 获取区域 |
|
|
// 获取区域 |
|
|
areamanagerList(){ |
|
|
areamanagerList(){ |
|
@@ -1409,7 +1630,7 @@ |
|
|
.province{ |
|
|
.province{ |
|
|
display: flex; |
|
|
display: flex; |
|
|
.right{ |
|
|
.right{ |
|
|
display: flex; |
|
|
|
|
|
|
|
|
// display: flex; |
|
|
} |
|
|
} |
|
|
} |
|
|
} |
|
|
</style> |
|
|
</style> |
|
|