01710550 by 焦泽平
2 parents 9f16b523 915e3d02
...@@ -32,3 +32,37 @@ export default { ...@@ -32,3 +32,37 @@ export default {
32 }, 32 },
33 }; 33 };
34 </script> 34 </script>
35
36 <style lang="less">
37 .popper-zxx{
38 padding: 0!important;
39 /deep/ .el-tabs__header{
40 margin-bottom: 10px;
41 }
42 ul{
43 margin-bottom: 10px;
44 li{
45 cursor: pointer;
46 padding: 4px 16px;
47 position: relative;
48 i{
49 position: absolute;
50 right: 20px;
51 top: 6px;
52 color: #4EB2FF;
53 display: none;
54 }
55 }
56 li:hover{
57 background: #eee;
58 }
59 .choosed{
60 color: #4EB2FF;
61 background-color: #F0F9FF!important;
62 i{
63 display: inline-block;
64 }
65 }
66 }
67 }
68 </style>
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -8,9 +8,9 @@ ...@@ -8,9 +8,9 @@
8 <div class="fgq"> 8 <div class="fgq">
9 <el-card class="data"> 9 <el-card class="data">
10 <div slot="header" class="clearfix"> 10 <div slot="header" class="clearfix">
11 <span>基本信息</span> 11 <span>宗地基本信息</span>
12 </div> 12 </div>
13 <ul> 13 <ul class="zdjbxx">
14 <li><span class="label">宗地代码:</span><span class="value">{{zdFgqData.zddm}}</span></li> 14 <li><span class="label">宗地代码:</span><span class="value">{{zdFgqData.zddm}}</span></li>
15 <li><span class="label">不动产单元号:</span><span class="value">{{zdFgqData.bdcdyh}}</span></li> 15 <li><span class="label">不动产单元号:</span><span class="value">{{zdFgqData.bdcdyh}}</span></li>
16 <li><span class="label">项目名称:</span><span class="value">{{zdFgqData.xmmc}}</span></li> 16 <li><span class="label">项目名称:</span><span class="value">{{zdFgqData.xmmc}}</span></li>
...@@ -18,68 +18,52 @@ ...@@ -18,68 +18,52 @@
18 <li><span class="label">权利人:</span><span class="value">{{zdFgqData.qlr}}</span></li> 18 <li><span class="label">权利人:</span><span class="value">{{zdFgqData.qlr}}</span></li>
19 <li><span class="label">坐落:</span><span class="value">{{zdFgqData.zl}}</span></li> 19 <li><span class="label">坐落:</span><span class="value">{{zdFgqData.zl}}</span></li>
20 </ul> 20 </ul>
21 </el-card> 21 <div class="zdmap">
22 <div class="zxx"> 22
23 <el-card class="dz">
24 <div slot="header" class="clearfix">
25 <span>多幢信息({{zdZxx.dzList.length}}个)</span>
26 </div> 23 </div>
27 <ul>
28 <li v-for="(item,index) in zdZxx.dzList" :key="index"
29 :class="[{'search':!zdDzList.includes(item)}]"
30 ><span class="label">多幢名称:</span> <span class="value">{{item.displays}}</span>
31 </li>
32 </ul>
33 </el-card> 24 </el-card>
34 25 <div class="zxx">
35 <el-card class="zrz"> 26 <el-card class="zrz">
36 <div slot="header" class="clearfix"> 27 <div slot="header" class="clearfix">
28 <span>多幢信息({{zdZxx.dzList.length}}个)</span>
37 <span>自然幢信息({{zdZxx.zrzList.length}}个)</span> 29 <span>自然幢信息({{zdZxx.zrzList.length}}个)</span>
38 </div> 30 </div>
39 <ul> 31 <ul>
40 <li v-for="(item,index) in zdZxx.zrzList" :key="index" 32 <li v-for="(item,index) in zdZxx.dzList" :key="index+item.xmmc"
33 :class="[{'search':!zdDzList.includes(item)}]"
34 >{{item.displays}}
35 </li>
36 <li v-for="(item,index) in zdZxx.zrzList" :key="index+item.xmmc"
41 :class="[{'oddborder':((index+1)%2) === 1},{'search':!zdZrzList.includes(item)}]"> 37 :class="[{'oddborder':((index+1)%2) === 1},{'search':!zdZrzList.includes(item)}]">
42 {{item.displays}} 38 {{item.displays}}
43 </li> 39 </li>
44 </ul> 40 </ul>
45 <div class="line"></div>
46 </el-card> 41 </el-card>
47 </div> 42 </div>
48 </div> 43 </div>
49 <div class="fgh"> 44 <div class="fgh" :style="{'minHeight':tableHeight+'px'}">
50 <span class="tips">分割后宗地信息</span> 45 <span class="tips">分割后宗地信息</span>
51 <table border="1"> 46 <table border="1">
52 <tr> 47 <tr>
53 <th class="cz">操作</th> 48 <th class="cz"><el-button
49 type="primary"
50 class="changeBtn outAdd addMinus"
51 @click="addRow"
52 >+
53 </el-button
54 ></th>
54 <th class="xzq">行政区</th> 55 <th class="xzq">行政区</th>
55 <th class="djq">地籍区</th> 56 <th class="djq">地籍区</th>
56 <th class="djzq">地籍子区</th> 57 <th class="djzq">地籍子区</th>
57 <th class="syqlx">所有权类型</th> 58 <th class="syqlx">所有权类型</th>
58 <th class="tdtzm">土地特征码</th> 59 <th class="tdtzm">土地特征码</th>
59 <th class="xmmc">项目名称</th> 60 <th class="xmmc">项目名称</th>
60 <th class="xzzxx">幢信息</th> 61 <!-- <th class="xzzxx">幢信息</th> -->
61 <!-- <th class="">选择</th> --> 62 <!-- <th class="">选择</th> -->
62 </tr> 63 </tr>
63 <tr> 64 <template v-for="(item,index) in zdFghData.newZdlist">
64 <td> 65 <tr :key="item.xzqbsm">
65 <el-button 66 <td class="cz" rowspan="2">
66 type="primary"
67 class="changeBtn outAdd addMinus"
68 @click="addRow"
69 >+
70 </el-button
71 >
72 </td>
73 <td></td>
74 <td></td>
75 <td></td>
76 <td></td>
77 <td></td>
78 <td></td>
79 <td></td>
80 </tr>
81 <tr v-for="(item,index) in zdFghData.newZdlist" :key="index">
82 <td class="cz">
83 <el-button 67 <el-button
84 type="primary" 68 type="primary"
85 class="changeBtn outMinus addMinus" 69 class="changeBtn outMinus addMinus"
...@@ -141,8 +125,8 @@ ...@@ -141,8 +125,8 @@
141 <td class="xmmc"> 125 <td class="xmmc">
142 <input type="text" v-model="item.xmmc" class="formInput"/> 126 <input type="text" v-model="item.xmmc" class="formInput"/>
143 </td> 127 </td>
144 <td class="xzzxx"> 128 <!-- <td class="xzzxx">
145 <!-- <span>多幢:</span> 129 <span>多幢:</span>
146 <ul> 130 <ul>
147 <li v-for="(dzItem,dzIndex) in item.dz" :key="dzIndex" 131 <li v-for="(dzItem,dzIndex) in item.dz" :key="dzIndex"
148 @mouseenter="mouseenter($event,index,dzIndex,'dz')" 132 @mouseenter="mouseenter($event,index,dzIndex,'dz')"
...@@ -158,13 +142,13 @@ ...@@ -158,13 +142,13 @@
158 >{{zrzItem.xmmc}} 142 >{{zrzItem.xmmc}}
159 <span v-if="zrzIndex<item.zrz.length-1">,</span> 143 <span v-if="zrzIndex<item.zrz.length-1">,</span>
160 </li> 144 </li>
161 </ul> --> 145 </ul>
162 <span class="zxx">自然幢1 <i class="fa fa-times"></i></span> 146 <span class="zxx">自然幢1 <i class="fa fa-times"></i></span>
163 <span class="zxx">自然幢2 <i class="fa fa-times"></i></span> 147 <span class="zxx">自然幢2 <i class="fa fa-times"></i></span>
164 <span class="zxx">自然幢3 <i class="fa fa-times"></i></span> 148 <span class="zxx">自然幢3 <i class="fa fa-times"></i></span>
165 <span class="zxx">多幢1 <i class="fa fa-times"></i></span> 149 <span class="zxx">多幢1 <i class="fa fa-times"></i></span>
166 <span class="choose">选择</span> 150 <span class="choose">选择</span>
167 </td> 151 </td> -->
168 <!-- <td class=""> 152 <!-- <td class="">
169 <el-dropdown @command="dzHandleCommand($event,index)"> 153 <el-dropdown @command="dzHandleCommand($event,index)">
170 <span class="el-dropdown-link"> 154 <span class="el-dropdown-link">
...@@ -190,6 +174,47 @@ ...@@ -190,6 +174,47 @@
190 </el-dropdown> 174 </el-dropdown>
191 </td> --> 175 </td> -->
192 </tr> 176 </tr>
177 <tr :key="index">
178 <td colspan="6">
179 <div class="fghzxx">
180 <div class="choosedZxx">
181 <span v-for="(dzItem,dzIndex) in item.dz" :key="dzIndex+dzItem.xmmc" class="zxx">
182 {{dzItem.xmmc}} <i class="fa fa-times" @click="delZxx(index,dzIndex,'dz')"></i>
183 </span>
184 <span v-for="(zrzItem,zrzIndex) in item.zrz" :key="zrzIndex+zrzItem.xmmc" class="zxx">
185 {{zrzItem.xmmc}} <i class="fa fa-times" @click="delZxx(index,zrzIndex,'zrz')"></i>
186 </span>
187 </div>
188 <p class="choose">
189 <el-popover
190 placement="top-end"
191 width="300"
192 popper-class="popper-zxx"
193 style="padding:0 12px"
194 trigger="click">
195 <el-tabs v-model="activeName" type="card">
196 <el-tab-pane label="多幢" name="dz">
197 <ul>
198 <li :class="zdFghData.newZdlist[index].dz.indexOf(childItem) > -1 ? 'choosed':''" @click="dzHandleCommand(childItem,childItem.bsm,index)" v-for="(childItem) in zdDzList" :key="childItem.bsm">
199 {{childItem.xmmc}}<i class="fa fa-check" style="color:'#4EB2FF'"></i>
200 </li>
201 </ul>
202 </el-tab-pane>
203 <el-tab-pane label="自然幢" name="zrz">
204 <ul>
205 <li :class="zdFghData.newZdlist[index].zrz.indexOf(childItem) > -1 ? 'choosed':''" @click="zrzHandleCommand(childItem,childItem.bsm,index)" v-for="(childItem) in zdZrzList" :key="childItem.bsm">
206 {{childItem.xmmc}} <i class="fa fa-check" style="color:'#4EB2FF'"></i>
207 </li>
208 </ul>
209 </el-tab-pane>
210 </el-tabs>
211 <span slot="reference">选择</span>
212 </el-popover>
213 </p>
214 </div>
215 </td>
216 </tr>
217 </template>
193 </table> 218 </table>
194 </div> 219 </div>
195 <zd-query-data @getData="getData" :centerDialogVisible.sync="centerDialogVisible" :isZdClose="true" 220 <zd-query-data @getData="getData" :centerDialogVisible.sync="centerDialogVisible" :isZdClose="true"
...@@ -556,6 +581,8 @@ ...@@ -556,6 +581,8 @@
556 newZdlist: [] 581 newZdlist: []
557 }, 582 },
558 fgBoxWidth: 0, 583 fgBoxWidth: 0,
584 tableHeight:0,
585 activeName:'dz'
559 } 586 }
560 }, 587 },
561 created() { 588 created() {
...@@ -565,57 +592,39 @@ ...@@ -565,57 +592,39 @@
565 this.getzdtzm(); 592 this.getzdtzm();
566 this.$nextTick(() => { 593 this.$nextTick(() => {
567 this.fgBoxWidth = this.$refs.fgBox.clientWidth; 594 this.fgBoxWidth = this.$refs.fgBox.clientWidth;
595 this.tableHeight = (document.documentElement.clientHeight || document.body.clientHeight) - 590;
568 }) 596 })
569 }, 597 },
570 methods: { 598 methods: {
571 mouseenter(event, index, dzIndex,type) { 599 delZxx(index, chilInd,type) {
572 let range = document.createRange();
573 range.selectNodeContents(event.target);
574 let selection = window.getSelection();
575 selection.removeAllRanges();
576 selection.addRange(range);
577 var self=this;
578 document.onkeydown = function (e){
579 let key = e || window.event || arguments.callee.caller.arguments[0];
580 if (key && (key.keyCode == '8' || key.code == 'Delete')) {
581 let dz={}; 600 let dz={};
582 let len=self.zdFghData.newZdlist[index].fwlist.length-1; 601 let len=this.zdFghData.newZdlist[index].fwlist.length-1;
583 switch (type) { 602 switch (type) {
584 case "dz": 603 case "dz":
585 dz = self.zdFghData.newZdlist[index].dz[dzIndex]; 604 dz = this.zdFghData.newZdlist[index].dz[chilInd];
586 // 删除数据 605 // 删除数据
587 self.zdFghData.newZdlist[index].dz.splice(dzIndex, 1); 606 this.zdFghData.newZdlist[index].dz.splice(chilInd, 1);
588 for (let i=0;i<len;i++){ 607 for (let i=0;i<len;i++){
589 let fw=self.zdFghData.newZdlist[index].fwlist[i]; 608 let fw=this.zdFghData.newZdlist[index].fwlist[i];
590 if (fw.ztype=='dz'&& fw.zbsm == dz.bsm){ 609 if (fw.ztype=='dz'&& fw.zbsm == dz.bsm){
591 self.zdFghData.newZdlist[index].fwlist.splice(i, 1); 610 this.zdFghData.newZdlist[index].fwlist.splice(i, 1);
592 } 611 }
593 } 612 }
594 // 添加数据 613 break;
595 self.zdDzList.push(dz)
596 return;
597 case "zrz": 614 case "zrz":
598 dz = self.zdFghData.newZdlist[index].zrz[dzIndex]; 615 dz = this.zdFghData.newZdlist[index].zrz[chilInd];
599 // 删除数据 616 // 删除数据
600 self.zdFghData.newZdlist[index].zrz.splice(dzIndex, 1); 617 this.zdFghData.newZdlist[index].zrz.splice(chilInd, 1);
601 for (let i=0;i<len;i++){ 618 for (let i=0;i<len;i++){
602 let fw=self.zdFghData.newZdlist[index].fwlist[i]; 619 let fw=this.zdFghData.newZdlist[index].fwlist[i];
603 if (fw.ztype=='zrz' && fw.zbsm == dz.bsm){ 620 if (fw.ztype=='zrz' && fw.zbsm == dz.bsm){
604 self.zdFghData.newZdlist[index].fwlist.splice(i, 1); 621 this.zdFghData.newZdlist[index].fwlist.splice(i, 1);
605 } 622 }
606 } 623 }
607 // 添加数据 624 break;
608 self.zdZrzList.push(dz)
609 return;
610 default: 625 default:
611 return; 626 break;
612 }
613 } 627 }
614 };
615 },
616 mouseleave(event) {
617 let selection = window.getSelection();
618 selection.removeAllRanges();
619 }, 628 },
620 // 重置数据 629 // 重置数据
621 result() { 630 result() {
...@@ -654,27 +663,32 @@ ...@@ -654,27 +663,32 @@
654 ztype: 'zrz' 663 ztype: 'zrz'
655 }) 664 })
656 }, 665 },
657 dzHandleCommand(command, index) { 666 dzHandleCommand(obj,bsm, index) {
658 let item = this.zdDzList.filter(i => i.bsm == command)[0]; 667 if(this.zdFghData.newZdlist[index].dz.indexOf(obj) < 0){
659 this.zdFghData.newZdlist[index].fwlist.push({ 668 this.zdFghData.newZdlist[index].fwlist.push({
660 zbsm: command, 669 zbsm: bsm,
661 ztype: 'dz' 670 ztype: 'dz'
662 }); 671 });
663 this.zdFghData.newZdlist[index].dz.push(item) 672 this.zdFghData.newZdlist[index].dz.push(obj)
664 this.zdDzList = this.zdDzList.filter(i => i.bsm !== command); 673 }else{
674 this.zdFghData.newZdlist[index].dz = this.zdFghData.newZdlist[index].dz.filter(i => i.bsm !== bsm)
675 }
665 }, 676 },
666 zrzHandleCommand(command, index) { 677 zrzHandleCommand(obj,bsm, index) {
667 let item = this.zdZrzList.filter(i => i.bsm == command)[0]; 678 if(this.zdFghData.newZdlist[index].zrz.indexOf(obj) < 0){
668 this.zdFghData.newZdlist[index].fwlist.push({ 679 this.zdFghData.newZdlist[index].fwlist.push({
669 zbsm: command, 680 zbsm: bsm,
670 ztype: 'zrz' 681 ztype: 'zrz'
671 }) 682 })
672 this.zdFghData.newZdlist[index].zrz.push(item) 683 this.zdFghData.newZdlist[index].zrz.push(obj)
673 this.zdZrzList = this.zdZrzList.filter(i => i.bsm !== command); 684 }else{
685 this.zdFghData.newZdlist[index].zrz = this.zdFghData.newZdlist[index].zrz.filter(i => i.bsm !== bsm)
686 }
674 }, 687 },
675 ZdgetDzXx(zdbsm) { 688 ZdgetDzXx(zdbsm) {
676 ZdfggetZxx(zdbsm).then(res => { 689 ZdfggetZxx(zdbsm).then(res => {
677 if (res.success) { 690 if (res.success) {
691 console.log(res.result,'res.result');
678 this.zdZxx = res.result; 692 this.zdZxx = res.result;
679 this.zdZrzList = res.result.zrzList 693 this.zdZrzList = res.result.zrzList
680 this.zdDzList = res.result.dzList 694 this.zdDzList = res.result.dzList
...@@ -951,6 +965,7 @@ ...@@ -951,6 +965,7 @@
951 </script> 965 </script>
952 <style scoped lang="less"> 966 <style scoped lang="less">
953 .fg { 967 .fg {
968
954 .menu { 969 .menu {
955 /deep/ .el-tabs__content { 970 /deep/ .el-tabs__content {
956 position: unset; 971 position: unset;
...@@ -990,6 +1005,14 @@ ...@@ -990,6 +1005,14 @@
990 } 1005 }
991 } 1006 }
992 } 1007 }
1008
1009 /deep/ .el-card__header{
1010 padding: 16px 20px;
1011 background-color: #F2F2F2;
1012 border: 1px solid #DBDBDB;
1013 -webkit-box-sizing: border-box;
1014 box-sizing: border-box;
1015 }
993 } 1016 }
994 1017
995 .v-model { 1018 .v-model {
...@@ -1003,7 +1026,7 @@ ...@@ -1003,7 +1026,7 @@
1003 flex-direction: column; 1026 flex-direction: column;
1004 flex-flow: nowrap; 1027 flex-flow: nowrap;
1005 .data{ 1028 .data{
1006 width: 36%; 1029 width: 40%;
1007 } 1030 }
1008 .el-card { 1031 .el-card {
1009 border: 1px solid #E6E6E6; 1032 border: 1px solid #E6E6E6;
...@@ -1027,16 +1050,30 @@ ...@@ -1027,16 +1050,30 @@
1027 display: inline-block; 1050 display: inline-block;
1028 width: 104px; 1051 width: 104px;
1029 text-align: right; 1052 text-align: right;
1053 vertical-align: top;
1030 } 1054 }
1031 .value{ 1055 .value{
1032 color: #6D7278; 1056 color: #6D7278;
1057 display: inline-block;
1033 padding-left: 10px; 1058 padding-left: 10px;
1059 width: calc(100% - 116px);
1060 word-break: break-all;
1034 } 1061 }
1035 } 1062 }
1036 } 1063 }
1064 .zdjbxx{
1065 width: 380px;
1066 height: 200px;
1067 float: left;
1068 }
1069 .zdmap{
1070 width: calc(100% - 380px);
1071 height: 200px;
1072 float: left;
1073 }
1037 } 1074 }
1038 .zxx { 1075 .zxx {
1039 width: calc(64% - 40px); 1076 width: calc(60% - 40px);
1040 margin-left: 20px; 1077 margin-left: 20px;
1041 display: flex; 1078 display: flex;
1042 flex-direction: column; 1079 flex-direction: column;
...@@ -1070,14 +1107,16 @@ ...@@ -1070,14 +1107,16 @@
1070 1107
1071 } 1108 }
1072 .zrz { 1109 .zrz {
1073 width: 66%; 1110 width: 100%;
1074 margin-left: 20px;
1075 overflow: auto; 1111 overflow: auto;
1076 } 1112 }
1077 ul { 1113 ul {
1078 overflow: auto; 1114 overflow: auto;
1115 width: 100%;
1116 float: left;
1117 margin-left: 10px;
1079 li { 1118 li {
1080 width: 48%; 1119 width: 23%;
1081 padding: 5px; 1120 padding: 5px;
1082 text-align: left; 1121 text-align: left;
1083 line-height: 20px; 1122 line-height: 20px;
...@@ -1096,9 +1135,6 @@ ...@@ -1096,9 +1135,6 @@
1096 } 1135 }
1097 } 1136 }
1098 1137
1099 .oddborder {
1100 border-right: 1px solid #000;
1101 }
1102 1138
1103 .fg-tabs { 1139 .fg-tabs {
1104 height: auto; 1140 height: auto;
...@@ -1129,13 +1165,16 @@ ...@@ -1129,13 +1165,16 @@
1129 overflow: visible; 1165 overflow: visible;
1130 text-align: center; 1166 text-align: center;
1131 } 1167 }
1132 tr:nth-of-type(odd) { 1168 // tr:nth-of-type(odd) {
1133 background: #FAFAFA; 1169 // background: #FAFAFA;
1134 } 1170 // }
1135 tr{ 1171 tr{
1136 th,td{ 1172 th,td{
1137 height: 44px; 1173 height: 44px;
1138 } 1174 }
1175 th{
1176 background: #FAFAFA;
1177 }
1139 } 1178 }
1140 1179
1141 tr:hover { 1180 tr:hover {
...@@ -1162,12 +1201,43 @@ ...@@ -1162,12 +1201,43 @@
1162 .fgh { 1201 .fgh {
1163 box-sizing: border-box; 1202 box-sizing: border-box;
1164 /*padding: 0 18px;*/ 1203 /*padding: 0 18px;*/
1165 height: 480px;
1166 overflow: auto; 1204 overflow: auto;
1167 margin-top: 26px; 1205 margin-top: 26px;
1168 table { 1206 table {
1169 margin: 0 20px; 1207 margin: 0 20px;
1170 } 1208 }
1209 .fghzxx{
1210 width: 100%;
1211 height: 100%;
1212 line-height: 44px;
1213 .choosedZxx{
1214 width:calc(100% - 88px);
1215 float: left;
1216 text-align: left;
1217 text-indent: 20px;
1218 .zxx{
1219 padding-right: 10px;
1220 position: relative;
1221 i{
1222 display: none;
1223 position: absolute;
1224 right: 0;
1225 top: -6px;
1226 }
1227 }
1228 .zxx:hover{
1229 i{
1230 display: inline-block;
1231 }
1232 }
1233 }
1234 .choose{
1235 width: 88px;
1236 color: #30A4FD;
1237 cursor: pointer;
1238 float: right;
1239 }
1240 }
1171 .tips { 1241 .tips {
1172 display: inline-block; 1242 display: inline-block;
1173 margin-bottom: 14px; 1243 margin-bottom: 14px;
...@@ -1221,10 +1291,6 @@ ...@@ -1221,10 +1291,6 @@
1221 display: inline; 1291 display: inline;
1222 } 1292 }
1223 } 1293 }
1224 .choose{
1225 color: #30A4FD;
1226 cursor: pointer;
1227 }
1228 } 1294 }
1229 1295
1230 .cz, .xh { 1296 .cz, .xh {
...@@ -1238,4 +1304,7 @@ ...@@ -1238,4 +1304,7 @@
1238 .search { 1304 .search {
1239 color: #BBB !important; 1305 color: #BBB !important;
1240 } 1306 }
1307 /deep/ .el-select{
1308 width: 100%;
1309 }
1241 </style> 1310 </style>
......