5ca2f22f by 杨威

宗地分割细节优化

1 parent a056251a
...@@ -54,11 +54,16 @@ export default { ...@@ -54,11 +54,16 @@ export default {
54 } 54 }
55 } 55 }
56 li:hover{ 56 li:hover{
57 background: #eee; 57 background: #F0F9FF;
58 }
59 .cantClick{
60 color: #BBB!important;
61 cursor: not-allowed!important;
62 }
63 .cantClick:hover{
64 background: #ffffff!important;
58 } 65 }
59 .choosed{ 66 .choosed{
60 color: #4EB2FF;
61 background-color: #F0F9FF!important;
62 i{ 67 i{
63 display: inline-block; 68 display: inline-block;
64 } 69 }
......
...@@ -31,12 +31,14 @@ ...@@ -31,12 +31,14 @@
31 </div> 31 </div>
32 <ul> 32 <ul>
33 <li v-for="(item,index) in zdZxx.dzList" :key="index+item.xmmc" 33 <li v-for="(item,index) in zdZxx.dzList" :key="index+item.xmmc"
34 :class="[{'search':!zdDzList.includes(item)}]" 34 :class="tempBsmList.indexOf(item.bsm) > -1 ? 'hasChoosed':''"
35 >{{item.displays}} 35 >
36 <i class="iconfont iconduochuang"></i> {{item.displays}}
36 </li> 37 </li>
37 <li v-for="(item,index) in zdZxx.zrzList" :key="index+item.xmmc" 38 <li v-for="(item,index) in zdZxx.zrzList" :key="index+item.xmmc"
38 :class="[{'oddborder':((index+1)%2) === 1},{'search':!zdZrzList.includes(item)}]"> 39 :class="tempBsmList.indexOf(item.bsm) > -1 ? 'hasChoosed':''"
39 {{item.displays}} 40 >
41 <i class="iconfont iconziranchuang"></i> {{item.displays}}
40 </li> 42 </li>
41 </ul> 43 </ul>
42 </el-card> 44 </el-card>
...@@ -132,12 +134,14 @@ ...@@ -132,12 +134,14 @@
132 <div class="fghzxx"> 134 <div class="fghzxx">
133 <div class="choosedZxx"> 135 <div class="choosedZxx">
134 <span v-for="(dzItem,dzIndex) in item.dz" :key="dzIndex+dzItem.xmmc" class="zxx"> 136 <span v-for="(dzItem,dzIndex) in item.dz" :key="dzIndex+dzItem.xmmc" class="zxx">
135 {{dzItem.xmmc}}<span v-if="dzIndex<(item.dz.length-1) || item.zrz.length>0">、</span> 137 {{dzItem.xmmc}}
136 <!-- <i class="fa fa-times" @click="delZxx(index,dzIndex,'dz')"></i> --> 138 <!-- <span v-if="dzIndex<(item.dz.length-1) || item.zrz.length>0">、</span> -->
139 <i class="fa fa-times" @click="delZxx(dzItem,index,dzIndex,'dz')"></i>
137 </span> 140 </span>
138 <span v-for="(zrzItem,zrzIndex) in item.zrz" :key="zrzIndex+zrzItem.xmmc" class="zxx"> 141 <span v-for="(zrzItem,zrzIndex) in item.zrz" :key="zrzIndex+zrzItem.xmmc" class="zxx">
139 {{zrzItem.xmmc}}<span v-if="zrzIndex<(item.zrz.length-1)">、</span> 142 {{zrzItem.xmmc}}
140 <!-- <i class="fa fa-times" @click="delZxx(index,zrzIndex,'zrz')"></i> --> 143 <!-- <span v-if="zrzIndex<(item.zrz.length-1)">、</span> -->
144 <i class="fa fa-times" @click="delZxx(zrzItem,index,zrzIndex,'zrz')"></i>
141 </span> 145 </span>
142 </div> 146 </div>
143 <p class="choose"> 147 <p class="choose">
...@@ -150,14 +154,16 @@ ...@@ -150,14 +154,16 @@
150 <el-tabs v-model="activeName" type="card"> 154 <el-tabs v-model="activeName" type="card">
151 <el-tab-pane label="多幢" name="dz"> 155 <el-tab-pane label="多幢" name="dz">
152 <ul> 156 <ul>
153 <li :class="zdFghData.newZdlist[index].dz.indexOf(childItem) > -1 ? 'choosed':''" @click="dzHandleCommand(childItem,childItem.bsm,index)" v-for="(childItem) in zdDzList" :key="childItem.bsm"> 157 <li :class="[zdFghData.newZdlist[index].dz.indexOf(childItem) > -1 ? 'choosed':'',(zdDzList[childIndex].hasChoosed === index || zdDzList[childIndex].hasChoosed === '' )? '':'cantClick']"
158 @click="dzHandleCommand(childItem,childItem.bsm,index,childIndex)" v-for="(childItem,childIndex) in zdDzList" :key="childItem.bsm+childIndex">
154 {{childItem.xmmc}}<i class="fa fa-check" style="color:'#4EB2FF'"></i> 159 {{childItem.xmmc}}<i class="fa fa-check" style="color:'#4EB2FF'"></i>
155 </li> 160 </li>
156 </ul> 161 </ul>
157 </el-tab-pane> 162 </el-tab-pane>
158 <el-tab-pane label="自然幢" name="zrz"> 163 <el-tab-pane label="自然幢" name="zrz">
159 <ul> 164 <ul>
160 <li :class="zdFghData.newZdlist[index].zrz.indexOf(childItem) > -1 ? 'choosed':''" @click="zrzHandleCommand(childItem,childItem.bsm,index)" v-for="(childItem) in zdZrzList" :key="childItem.bsm"> 165 <li :class="[zdFghData.newZdlist[index].zrz.indexOf(childItem) > -1 ? 'choosed':'',(zdZrzList[childIndex].hasChoosed === index || zdZrzList[childIndex].hasChoosed === '' )? '':'cantClick']"
166 @click="zrzHandleCommand(childItem,childItem.bsm,index,childIndex)" v-for="(childItem,childIndex) in zdZrzList" :key="childItem.bsm+childIndex">
161 {{childItem.xmmc}} <i class="fa fa-check" style="color:'#4EB2FF'"></i> 167 {{childItem.xmmc}} <i class="fa fa-check" style="color:'#4EB2FF'"></i>
162 </li> 168 </li>
163 </ul> 169 </ul>
...@@ -537,7 +543,8 @@ ...@@ -537,7 +543,8 @@
537 }, 543 },
538 fgBoxWidth: 0, 544 fgBoxWidth: 0,
539 tableHeight:0, 545 tableHeight:0,
540 activeName:'dz' 546 activeName:'dz',
547 tempBsmList:[]
541 } 548 }
542 }, 549 },
543 created() { 550 created() {
...@@ -551,9 +558,10 @@ ...@@ -551,9 +558,10 @@
551 }) 558 })
552 }, 559 },
553 methods: { 560 methods: {
554 delZxx(index, chilInd,type) { 561 delZxx(item,index, chilInd,type) {
555 let dz={}; 562 let dz={};
556 let len=this.zdFghData.newZdlist[index].fwlist.length-1; 563 let len=this.zdFghData.newZdlist[index].fwlist.length-1;
564 this.tempBsmList = this.tempBsmList.filter(i => i!== item.bsm);
557 switch (type) { 565 switch (type) {
558 case "dz": 566 case "dz":
559 dz = this.zdFghData.newZdlist[index].dz[chilInd]; 567 dz = this.zdFghData.newZdlist[index].dz[chilInd];
...@@ -565,6 +573,11 @@ ...@@ -565,6 +573,11 @@
565 this.zdFghData.newZdlist[index].fwlist.splice(i, 1); 573 this.zdFghData.newZdlist[index].fwlist.splice(i, 1);
566 } 574 }
567 } 575 }
576 this.zdDzList.forEach(i=>{
577 if (i.bsm == item.bsm) {
578 i.hasChoosed = ""
579 }
580 })
568 break; 581 break;
569 case "zrz": 582 case "zrz":
570 dz = this.zdFghData.newZdlist[index].zrz[chilInd]; 583 dz = this.zdFghData.newZdlist[index].zrz[chilInd];
...@@ -576,6 +589,11 @@ ...@@ -576,6 +589,11 @@
576 this.zdFghData.newZdlist[index].fwlist.splice(i, 1); 589 this.zdFghData.newZdlist[index].fwlist.splice(i, 1);
577 } 590 }
578 } 591 }
592 this.zdZrzList.forEach(i=>{
593 if (i.bsm == item.bsm) {
594 i.hasChoosed = ""
595 }
596 })
579 break; 597 break;
580 default: 598 default:
581 break; 599 break;
...@@ -618,32 +636,54 @@ ...@@ -618,32 +636,54 @@
618 ztype: 'zrz' 636 ztype: 'zrz'
619 }) 637 })
620 }, 638 },
621 dzHandleCommand(obj,bsm, index) { 639 dzHandleCommand(obj,bsm, index,childIndex) {
622 if(this.zdFghData.newZdlist[index].dz.indexOf(obj) < 0){ 640 if(this.zdDzList[childIndex].hasChoosed === '' || this.zdDzList[childIndex].hasChoosed === index){
623 this.zdFghData.newZdlist[index].fwlist.push({ 641 this.zdDzList[childIndex].hasChoosed = index;
624 zbsm: bsm, 642 if(this.zdFghData.newZdlist[index].dz.indexOf(obj) < 0){
625 ztype: 'dz' 643 this.zdFghData.newZdlist[index].fwlist.push({
626 }); 644 zbsm: bsm,
627 this.zdFghData.newZdlist[index].dz.push(obj) 645 ztype: 'dz'
646 });
647 this.zdFghData.newZdlist[index].dz.push(obj);
648 this.tempBsmList.push(bsm);
649 }else{
650 this.zdFghData.newZdlist[index].dz = this.zdFghData.newZdlist[index].dz.filter(i => i.bsm !== bsm);
651 this.tempBsmList = this.tempBsmList.filter(i => i!== bsm);
652 this.zdDzList[childIndex].hasChoosed = '';
653 }
628 }else{ 654 }else{
629 this.zdFghData.newZdlist[index].dz = this.zdFghData.newZdlist[index].dz.filter(i => i.bsm !== bsm) 655 return
630 } 656 }
631 }, 657 },
632 zrzHandleCommand(obj,bsm, index) { 658 zrzHandleCommand(obj,bsm, index,childIndex) {
633 if(this.zdFghData.newZdlist[index].zrz.indexOf(obj) < 0){ 659 if(this.zdZrzList[childIndex].hasChoosed === '' || this.zdZrzList[childIndex].hasChoosed === index){
634 this.zdFghData.newZdlist[index].fwlist.push({ 660 this.zdZrzList[childIndex].hasChoosed = index;
635 zbsm: bsm, 661 if(this.zdFghData.newZdlist[index].zrz.indexOf(obj) < 0){
636 ztype: 'zrz' 662 this.zdFghData.newZdlist[index].fwlist.push({
637 }) 663 zbsm: bsm,
638 this.zdFghData.newZdlist[index].zrz.push(obj) 664 ztype: 'zrz'
665 })
666 this.zdFghData.newZdlist[index].zrz.push(obj);
667 this.tempBsmList.push(bsm);
668 }else{
669 this.zdFghData.newZdlist[index].zrz = this.zdFghData.newZdlist[index].zrz.filter(i => i.bsm !== bsm);
670 this.tempBsmList = this.tempBsmList.filter(i => i!== bsm);
671 this.zdZrzList[childIndex].hasChoosed = '';
672 }
639 }else{ 673 }else{
640 this.zdFghData.newZdlist[index].zrz = this.zdFghData.newZdlist[index].zrz.filter(i => i.bsm !== bsm) 674 return
641 } 675 }
642 }, 676 },
643 ZdgetDzXx(zdbsm) { 677 ZdgetDzXx(zdbsm) {
644 ZdfggetZxx(zdbsm).then(res => { 678 ZdfggetZxx(zdbsm).then(res => {
645 if (res.success) { 679 if (res.success) {
646 console.log(res.result,'res.result'); 680 console.log(res.result,'res.result');
681 res.result.dzList.forEach(item=>{
682 item.hasChoosed = ''
683 })
684 res.result.zrzList.forEach(item=>{
685 item.hasChoosed = ''
686 })
647 this.zdZxx = res.result; 687 this.zdZxx = res.result;
648 this.zdZrzList = res.result.zrzList 688 this.zdZrzList = res.result.zrzList
649 this.zdDzList = res.result.dzList 689 this.zdDzList = res.result.dzList
...@@ -999,7 +1039,7 @@ ...@@ -999,7 +1039,7 @@
999 li { 1039 li {
1000 padding: 5px; 1040 padding: 5px;
1001 line-height: 20px; 1041 line-height: 20px;
1002 color: #BBB; 1042 color: #4A4A4A;
1003 .label{ 1043 .label{
1004 color: #4A4A4A; 1044 color: #4A4A4A;
1005 display: inline-block; 1045 display: inline-block;
...@@ -1015,6 +1055,9 @@ ...@@ -1015,6 +1055,9 @@
1015 word-break: break-all; 1055 word-break: break-all;
1016 } 1056 }
1017 } 1057 }
1058 .hasChoosed{
1059 color: #BBB;
1060 }
1018 } 1061 }
1019 .zdjbxx{ 1062 .zdjbxx{
1020 width: 380px; 1063 width: 380px;
...@@ -1095,7 +1138,7 @@ ...@@ -1095,7 +1138,7 @@
1095 height: auto; 1138 height: auto;
1096 width: 100%; 1139 width: 100%;
1097 position: relative; 1140 position: relative;
1098 top: 36px; 1141 top: 20px;
1099 .table { 1142 .table {
1100 margin-top: 12px; 1143 margin-top: 12px;
1101 box-sizing: border-box; 1144 box-sizing: border-box;
...@@ -1158,6 +1201,7 @@ ...@@ -1158,6 +1201,7 @@
1158 /*padding: 0 18px;*/ 1201 /*padding: 0 18px;*/
1159 overflow: auto; 1202 overflow: auto;
1160 margin-top: 26px; 1203 margin-top: 26px;
1204 margin-bottom: 70px;
1161 table { 1205 table {
1162 margin: 0 20px; 1206 margin: 0 20px;
1163 } 1207 }
...@@ -1171,7 +1215,8 @@ ...@@ -1171,7 +1215,8 @@
1171 text-align: left; 1215 text-align: left;
1172 text-indent: 20px; 1216 text-indent: 20px;
1173 .zxx{ 1217 .zxx{
1174 // padding-right: 10px; 1218 padding-right: 8px;
1219 margin-right: 4px;
1175 position: relative; 1220 position: relative;
1176 i{ 1221 i{
1177 display: none; 1222 display: none;
......