5ca2f22f by 杨威

宗地分割细节优化

1 parent a056251a
......@@ -54,11 +54,16 @@ export default {
}
}
li:hover{
background: #eee;
background: #F0F9FF;
}
.cantClick{
color: #BBB!important;
cursor: not-allowed!important;
}
.cantClick:hover{
background: #ffffff!important;
}
.choosed{
color: #4EB2FF;
background-color: #F0F9FF!important;
i{
display: inline-block;
}
......
......@@ -31,12 +31,14 @@
</div>
<ul>
<li v-for="(item,index) in zdZxx.dzList" :key="index+item.xmmc"
:class="[{'search':!zdDzList.includes(item)}]"
>{{item.displays}}
:class="tempBsmList.indexOf(item.bsm) > -1 ? 'hasChoosed':''"
>
<i class="iconfont iconduochuang"></i> {{item.displays}}
</li>
<li v-for="(item,index) in zdZxx.zrzList" :key="index+item.xmmc"
:class="[{'oddborder':((index+1)%2) === 1},{'search':!zdZrzList.includes(item)}]">
{{item.displays}}
:class="tempBsmList.indexOf(item.bsm) > -1 ? 'hasChoosed':''"
>
<i class="iconfont iconziranchuang"></i> {{item.displays}}
</li>
</ul>
</el-card>
......@@ -132,12 +134,14 @@
<div class="fghzxx">
<div class="choosedZxx">
<span v-for="(dzItem,dzIndex) in item.dz" :key="dzIndex+dzItem.xmmc" class="zxx">
{{dzItem.xmmc}}<span v-if="dzIndex<(item.dz.length-1) || item.zrz.length>0">、</span>
<!-- <i class="fa fa-times" @click="delZxx(index,dzIndex,'dz')"></i> -->
{{dzItem.xmmc}}
<!-- <span v-if="dzIndex<(item.dz.length-1) || item.zrz.length>0">、</span> -->
<i class="fa fa-times" @click="delZxx(dzItem,index,dzIndex,'dz')"></i>
</span>
<span v-for="(zrzItem,zrzIndex) in item.zrz" :key="zrzIndex+zrzItem.xmmc" class="zxx">
{{zrzItem.xmmc}}<span v-if="zrzIndex<(item.zrz.length-1)">、</span>
<!-- <i class="fa fa-times" @click="delZxx(index,zrzIndex,'zrz')"></i> -->
{{zrzItem.xmmc}}
<!-- <span v-if="zrzIndex<(item.zrz.length-1)">、</span> -->
<i class="fa fa-times" @click="delZxx(zrzItem,index,zrzIndex,'zrz')"></i>
</span>
</div>
<p class="choose">
......@@ -150,14 +154,16 @@
<el-tabs v-model="activeName" type="card">
<el-tab-pane label="多幢" name="dz">
<ul>
<li :class="zdFghData.newZdlist[index].dz.indexOf(childItem) > -1 ? 'choosed':''" @click="dzHandleCommand(childItem,childItem.bsm,index)" v-for="(childItem) in zdDzList" :key="childItem.bsm">
<li :class="[zdFghData.newZdlist[index].dz.indexOf(childItem) > -1 ? 'choosed':'',(zdDzList[childIndex].hasChoosed === index || zdDzList[childIndex].hasChoosed === '' )? '':'cantClick']"
@click="dzHandleCommand(childItem,childItem.bsm,index,childIndex)" v-for="(childItem,childIndex) in zdDzList" :key="childItem.bsm+childIndex">
{{childItem.xmmc}}<i class="fa fa-check" style="color:'#4EB2FF'"></i>
</li>
</ul>
</el-tab-pane>
<el-tab-pane label="自然幢" name="zrz">
<ul>
<li :class="zdFghData.newZdlist[index].zrz.indexOf(childItem) > -1 ? 'choosed':''" @click="zrzHandleCommand(childItem,childItem.bsm,index)" v-for="(childItem) in zdZrzList" :key="childItem.bsm">
<li :class="[zdFghData.newZdlist[index].zrz.indexOf(childItem) > -1 ? 'choosed':'',(zdZrzList[childIndex].hasChoosed === index || zdZrzList[childIndex].hasChoosed === '' )? '':'cantClick']"
@click="zrzHandleCommand(childItem,childItem.bsm,index,childIndex)" v-for="(childItem,childIndex) in zdZrzList" :key="childItem.bsm+childIndex">
{{childItem.xmmc}} <i class="fa fa-check" style="color:'#4EB2FF'"></i>
</li>
</ul>
......@@ -537,7 +543,8 @@
},
fgBoxWidth: 0,
tableHeight:0,
activeName:'dz'
activeName:'dz',
tempBsmList:[]
}
},
created() {
......@@ -551,9 +558,10 @@
})
},
methods: {
delZxx(index, chilInd,type) {
delZxx(item,index, chilInd,type) {
let dz={};
let len=this.zdFghData.newZdlist[index].fwlist.length-1;
this.tempBsmList = this.tempBsmList.filter(i => i!== item.bsm);
switch (type) {
case "dz":
dz = this.zdFghData.newZdlist[index].dz[chilInd];
......@@ -565,6 +573,11 @@
this.zdFghData.newZdlist[index].fwlist.splice(i, 1);
}
}
this.zdDzList.forEach(i=>{
if (i.bsm == item.bsm) {
i.hasChoosed = ""
}
})
break;
case "zrz":
dz = this.zdFghData.newZdlist[index].zrz[chilInd];
......@@ -576,6 +589,11 @@
this.zdFghData.newZdlist[index].fwlist.splice(i, 1);
}
}
this.zdZrzList.forEach(i=>{
if (i.bsm == item.bsm) {
i.hasChoosed = ""
}
})
break;
default:
break;
......@@ -618,32 +636,54 @@
ztype: 'zrz'
})
},
dzHandleCommand(obj,bsm, index) {
dzHandleCommand(obj,bsm, index,childIndex) {
if(this.zdDzList[childIndex].hasChoosed === '' || this.zdDzList[childIndex].hasChoosed === index){
this.zdDzList[childIndex].hasChoosed = index;
if(this.zdFghData.newZdlist[index].dz.indexOf(obj) < 0){
this.zdFghData.newZdlist[index].fwlist.push({
zbsm: bsm,
ztype: 'dz'
});
this.zdFghData.newZdlist[index].dz.push(obj)
this.zdFghData.newZdlist[index].dz.push(obj);
this.tempBsmList.push(bsm);
}else{
this.zdFghData.newZdlist[index].dz = this.zdFghData.newZdlist[index].dz.filter(i => i.bsm !== bsm);
this.tempBsmList = this.tempBsmList.filter(i => i!== bsm);
this.zdDzList[childIndex].hasChoosed = '';
}
}else{
this.zdFghData.newZdlist[index].dz = this.zdFghData.newZdlist[index].dz.filter(i => i.bsm !== bsm)
return
}
},
zrzHandleCommand(obj,bsm, index) {
zrzHandleCommand(obj,bsm, index,childIndex) {
if(this.zdZrzList[childIndex].hasChoosed === '' || this.zdZrzList[childIndex].hasChoosed === index){
this.zdZrzList[childIndex].hasChoosed = index;
if(this.zdFghData.newZdlist[index].zrz.indexOf(obj) < 0){
this.zdFghData.newZdlist[index].fwlist.push({
zbsm: bsm,
ztype: 'zrz'
})
this.zdFghData.newZdlist[index].zrz.push(obj)
this.zdFghData.newZdlist[index].zrz.push(obj);
this.tempBsmList.push(bsm);
}else{
this.zdFghData.newZdlist[index].zrz = this.zdFghData.newZdlist[index].zrz.filter(i => i.bsm !== bsm)
this.zdFghData.newZdlist[index].zrz = this.zdFghData.newZdlist[index].zrz.filter(i => i.bsm !== bsm);
this.tempBsmList = this.tempBsmList.filter(i => i!== bsm);
this.zdZrzList[childIndex].hasChoosed = '';
}
}else{
return
}
},
ZdgetDzXx(zdbsm) {
ZdfggetZxx(zdbsm).then(res => {
if (res.success) {
console.log(res.result,'res.result');
res.result.dzList.forEach(item=>{
item.hasChoosed = ''
})
res.result.zrzList.forEach(item=>{
item.hasChoosed = ''
})
this.zdZxx = res.result;
this.zdZrzList = res.result.zrzList
this.zdDzList = res.result.dzList
......@@ -999,7 +1039,7 @@
li {
padding: 5px;
line-height: 20px;
color: #BBB;
color: #4A4A4A;
.label{
color: #4A4A4A;
display: inline-block;
......@@ -1015,6 +1055,9 @@
word-break: break-all;
}
}
.hasChoosed{
color: #BBB;
}
}
.zdjbxx{
width: 380px;
......@@ -1095,7 +1138,7 @@
height: auto;
width: 100%;
position: relative;
top: 36px;
top: 20px;
.table {
margin-top: 12px;
box-sizing: border-box;
......@@ -1158,6 +1201,7 @@
/*padding: 0 18px;*/
overflow: auto;
margin-top: 26px;
margin-bottom: 70px;
table {
margin: 0 20px;
}
......@@ -1171,7 +1215,8 @@
text-align: left;
text-indent: 20px;
.zxx{
// padding-right: 10px;
padding-right: 8px;
margin-right: 4px;
position: relative;
i{
display: none;
......