b7f1eeee by 杨威

宗地合并页面重绘

1 parent d2059be8
...@@ -64,7 +64,7 @@ export function getZdxx(bsm) { ...@@ -64,7 +64,7 @@ export function getZdxx(bsm) {
64 } 64 }
65 65
66 /** 66 /**
67 * 宗地分割获取幢信息 67 * 根据zdbsm获取宗地下的幢信息
68 */ 68 */
69 export function ZdfggetZxx(zdbsm) { 69 export function ZdfggetZxx(zdbsm) {
70 return request({ 70 return request({
......
...@@ -70,6 +70,9 @@ ol, ul { list-style:none; } ...@@ -70,6 +70,9 @@ ol, ul { list-style:none; }
70 font-style: normal; 70 font-style: normal;
71 color: red; 71 color: red;
72 } 72 }
73 .top20{
74 top: 20px;
75 }
73 // 滚动条样式 76 // 滚动条样式
74 ::-webkit-scrollbar { 77 ::-webkit-scrollbar {
75 width: 6px; 78 width: 6px;
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
2 <div class="fg" ref="fgBox"> 2 <div class="fg" ref="fgBox">
3 <el-tabs v-model="tabName" type="card" class="menu"> 3 <el-tabs v-model="tabName" type="card" class="menu">
4 <el-tab-pane label="宗地分割" name="zd"> 4 <el-tab-pane label="宗地分割" name="zd">
5 <div class="fg-tabs"> 5 <div class="fg-tabs top20">
6 <span class="tips">分割前宗地信息</span> 6 <span class="tips">分割前宗地信息</span>
7 <el-button type="primary" class="addBtn" @click="newAdd">新增</el-button> 7 <el-button type="primary" class="addBtn" @click="newAdd">新增</el-button>
8 <div class="fgq"> 8 <div class="fgq">
...@@ -186,7 +186,7 @@ ...@@ -186,7 +186,7 @@
186 </div> 186 </div>
187 </el-tab-pane> 187 </el-tab-pane>
188 <el-tab-pane label="多幢分割" name="dz"> 188 <el-tab-pane label="多幢分割" name="dz">
189 <div class="fg-tabs"> 189 <div class="fg-tabs top20">
190 <span class="tips">分割前多幢信息</span> 190 <span class="tips">分割前多幢信息</span>
191 <el-button type="primary" class="addBtn" @click="newAdd">新增</el-button> 191 <el-button type="primary" class="addBtn" @click="newAdd">新增</el-button>
192 <div class="fgq"> 192 <div class="fgq">
......
...@@ -2,10 +2,9 @@ ...@@ -2,10 +2,9 @@
2 <div class="hb" ref="hbBox"> 2 <div class="hb" ref="hbBox">
3 <el-tabs v-model="tabName" class="menu" @tab-click="handleClick"> 3 <el-tabs v-model="tabName" class="menu" @tab-click="handleClick">
4 <el-tab-pane label="宗地合并" name="zd"> 4 <el-tab-pane label="宗地合并" name="zd">
5 <div class="hb-tabs"> 5 <div class="hb-tabs top20">
6 <el-button type="primary" class="addBtn" @click="newAdd">新增</el-button> 6 <span class="tips">合并前宗地信息</span>
7 <div class="hbq"> 7 <div class="hbq">
8 <span class="tips">合并前宗地信息</span>
9 <table border="1"> 8 <table border="1">
10 <tr> 9 <tr>
11 <td class="xh">序号</td> 10 <td class="xh">序号</td>
...@@ -15,7 +14,14 @@ ...@@ -15,7 +14,14 @@
15 <td class="bdcqzh">不动产权证号</td> 14 <td class="bdcqzh">不动产权证号</td>
16 <td class="qlr">权利人</td> 15 <td class="qlr">权利人</td>
17 <td class="zl">坐落</td> 16 <td class="zl">坐落</td>
18 <td>操作</td> 17 <td>
18 <el-button
19 type="primary"
20 class="changeBtn outAdd addMinus"
21 @click="newAdd"
22 >+
23 </el-button>
24 </td>
19 </tr> 25 </tr>
20 <tr v-if="zdhbqData.length==0"> 26 <tr v-if="zdhbqData.length==0">
21 <td colspan="8"> 27 <td colspan="8">
...@@ -36,92 +42,126 @@ ...@@ -36,92 +42,126 @@
36 readonly="readonly"/></td> 42 readonly="readonly"/></td>
37 <td class="zl"><input type="text" class="formInput" v-model="item.zl" 43 <td class="zl"><input type="text" class="formInput" v-model="item.zl"
38 readonly="readonly"/></td> 44 readonly="readonly"/></td>
39 <td class="cz" @click="deleteData(index)"><span>删除</span></td> 45 <td class="cz">
46 <el-button
47 type="primary"
48 class="changeBtn outMinus addMinus"
49 @click="deleteData(item,index)"
50 >-
51 </el-button>
52 </td>
40 </tr> 53 </tr>
41 </table> 54 </table>
42 </div> 55 </div>
56 <span class="tips">合并后宗地信息</span>
43 <div class="hbh"> 57 <div class="hbh">
44 <span class="tips">合并后宗地信息</span> 58 <el-card class="data">
45 <table border="1"> 59 <div slot="header" class="clearfix">
46 <tr> 60 <span>宗地基本信息</span>
47 <th class="xzq">行政区</th> 61 </div>
48 <th class="djq">地籍区</th> 62 <ul class="zdjbxx">
49 <th class="djzq">地籍子区</th> 63 <li>
50 <th class="syqlx">所有权类型</th> 64 <span class="label">行政区:</span>
51 <th class="tdtzm">土地特征码</th> 65 <span class="value">
52 <th class="xmmc">项目名称</th> 66 <el-select v-model="zdhbhData.xzqbsm" @change="changeXzq(zdhbhData.xzqbsm)">
53 <th class="zxx">幢信息</th> 67 <el-option
54 </tr> 68 v-for="i in xzq"
55 <tr> 69 :key="i.bsm"
56 <td class="xzq"> 70 :label="i.mc"
57 <el-select v-model="zdhbhData.xzqbsm" @change="changeXzq(zdhbhData.xzqbsm)"> 71 :value="i.bsm"
58 <el-option 72 ></el-option>
59 v-for="i in xzq" 73 </el-select>
60 :key="i.bsm" 74 </span>
61 :label="i.mc" 75 </li>
62 :value="i.bsm" 76 <li>
63 ></el-option> 77 <span class="label">地籍区:</span>
64 </el-select> 78 <span class="value">
65 </td> 79 <el-select v-model="zdhbhData.djqbsm" @change="changeDjq(zdhbhData.djqbsm)">
66 <td class="djq"> 80 <el-option
67 <el-select v-model="zdhbhData.djqbsm" @change="changeDjq(zdhbhData.djqbsm)">
68 <el-option
69 v-for="i in djq" 81 v-for="i in djq"
70 :key="i.bsm" 82 :key="i.bsm"
71 :label="i.mc" 83 :label="i.mc"
72 :value="i.bsm" 84 :value="i.bsm"
73 ></el-option> 85 ></el-option>
74 </el-select> 86 </el-select>
75 </td> 87 </span>
76 <td class="syqlx"> 88 </li>
77 <el-select v-model="zdhbhData.djzqbsm"> 89 <li>
78 <el-option 90 <span class="label">地籍子区:</span>
79 v-for="i in djzq" 91 <span class="value">
80 :key="i.bsm" 92 <el-select v-model="zdhbhData.djzqbsm" @change="$forceUpdate()">
81 :label="i.mc" 93 <el-option
82 :value="i.bsm" 94 v-for="i in djzq"
83 ></el-option> 95 :key="i.bsm"
84 </el-select> 96 :label="i.mc"
85 </td> 97 :value="i.bsm"
86 <td class="tdtzm"> 98 ></el-option>
87 <el-select v-model="zdhbhData.syqlxbsm"> 99 </el-select>
88 <el-option 100 </span>
101 </li>
102 <li>
103 <span class="label">所有权类型:</span>
104 <span class="value">
105 <el-select v-model="zdhbhData.syqlxbsm">
106 <el-option
89 v-for="i in syq" 107 v-for="i in syq"
90 :key="i.value" 108 :key="i.value"
91 :label="i.label" 109 :label="i.label"
92 :value="i.value" 110 :value="i.value"
93 ></el-option> 111 ></el-option>
94 </el-select> 112 </el-select>
95 </td> 113 </span>
96 <td class="syqlx"> 114 </li>
97 <el-select v-model="zdhbhData.zdtzmbsm"> 115 <li>
98 <el-option 116 <span class="label">宗地特征码:</span>
99 v-for="i in tdtzm" 117 <span class="value">
118 <el-select v-model="zdhbhData.zdtzmbsm">
119 <el-option
120 v-for="i in $store.state.zdtzmList"
100 :key="i.bsm" 121 :key="i.bsm"
101 :label="i.mc" 122 :label="i.mc"
102 :value="i.bsm" 123 :value="i.bsm"
103 ></el-option> 124 ></el-option>
104 </el-select> 125 </el-select>
105 </td> 126 </span>
106 <td class="xmmc"> 127 </li>
107 <input type="text" v-model="zdhbhData.xmmc" class="formInput"/> 128 <li>
108 </td> 129 <span class="label">项目名称:</span>
109 <td class="zxx"> 130 <span class="value">
110 <span class="xz">选择</span> 131 <el-input type="text" v-model="zdhbhData.xmmc"></el-input>
111 </td> 132 </span>
112 </tr> 133 </li>
113 </table> 134 </ul>
135 </el-card>
136 <div class="zxx">
137 <el-card class="zrz">
138 <div slot="header" class="clearfix">
139 <span style="margin-right:10px">幢信息</span>
140 <span style="margin-right:10px"><i class="iconfont iconduochuang"></i>多幢<span style="color:red">{{zdDzList.length}}</span></span>
141 <span><i class="iconfont iconziranchuang"></i>自然幢<span style="color:red">{{zdZrzList.length}}</span></span>
142 </div>
143 <ul>
144 <li v-for="(item,index) in zdDzList" :key="index+item.xmmc"
145 >
146 <i class="iconfont iconduochuang"></i> {{item.displays}}
147 </li>
148 <li v-for="(item,index) in zdZrzList" :key="index+item.xmmc"
149 >
150 <i class="iconfont iconziranchuang"></i> {{item.displays}}
151 </li>
152 </ul>
153 </el-card>
154 </div>
114 </div> 155 </div>
115 <zd-query-data @getData="getData" :centerDialogVisible.sync="centerDialogVisible" :isZdClose="true" 156 <zd-query-data @getData="getData" :centerDialogVisible.sync="centerDialogVisible" :isZdClose="true"
116 @close="close"></zd-query-data> 157 @close="close"></zd-query-data>
117
118 <div class="header-button" :style="{width:fgBoxWidth+'px'}"> 158 <div class="header-button" :style="{width:fgBoxWidth+'px'}">
119 <el-button type="primary" class="saveBtn" @click="save">保存</el-button> 159 <el-button type="primary" class="saveBtn" @click="save">保存</el-button>
120 </div> 160 </div>
121 </div> 161 </div>
122 </el-tab-pane> 162 </el-tab-pane>
123 <el-tab-pane label="多幢合并" name="dz"> 163 <el-tab-pane label="多幢合并" name="dz">
124 <div class="hb-tabs"> 164 <div class="hb-tabs top20">
125 <el-button type="primary" class="addBtn" @click="newAdd">新增</el-button> 165 <el-button type="primary" class="addBtn" @click="newAdd">新增</el-button>
126 <div class="hbq"> 166 <div class="hbq">
127 <span class="tips">合并前多幢信息</span> 167 <span class="tips">合并前多幢信息</span>
...@@ -155,7 +195,7 @@ ...@@ -155,7 +195,7 @@
155 readonly="readonly"/></td> 195 readonly="readonly"/></td>
156 <td class="zl"><input type="text" class="formInput" v-model="item.zl" 196 <td class="zl"><input type="text" class="formInput" v-model="item.zl"
157 readonly="readonly"/></td> 197 readonly="readonly"/></td>
158 <td class="cz" @click="deleteData(index)"><span>删除</span></td> 198 <td class="cz" @click="deleteData(item,index)"><span>删除</span></td>
159 </tr> 199 </tr>
160 </table> 200 </table>
161 </div> 201 </div>
...@@ -203,7 +243,7 @@ ...@@ -203,7 +243,7 @@
203 getDdicByMC 243 getDdicByMC
204 } from "@api/common"; 244 } from "@api/common";
205 import {ZdHb} from "@api/zd" 245 import {ZdHb} from "@api/zd"
206 import {saveDzHb} from "@api/dz" 246 import {saveDzHb,ZdfggetZxx} from "@api/dz"
207 import QueryData from '@components/queryData/queryData' 247 import QueryData from '@components/queryData/queryData'
208 import zdQueryData from '@components/zdQueryData/zdQueryData' 248 import zdQueryData from '@components/zdQueryData/zdQueryData'
209 import hfghb from '../hfghb/index' 249 import hfghb from '../hfghb/index'
...@@ -218,7 +258,6 @@ ...@@ -218,7 +258,6 @@
218 centerDialogVisible: false, 258 centerDialogVisible: false,
219 zdhbqData: [], // 宗地合并前数据 259 zdhbqData: [], // 宗地合并前数据
220 dzhbqData: [], // 多幢合并前数据 260 dzhbqData: [], // 多幢合并前数据
221 hhbqData: [], // 户合并前数据
222 zdhbhData: {}, // 宗地合并后数据 261 zdhbhData: {}, // 宗地合并后数据
223 dzhbhData: [ 262 dzhbhData: [
224 { 263 {
...@@ -230,7 +269,6 @@ ...@@ -230,7 +269,6 @@
230 xzq: [], 269 xzq: [],
231 djq: [], 270 djq: [],
232 djzq: [], 271 djzq: [],
233 tdtzm: [],
234 syq: [ 272 syq: [
235 { 273 {
236 label: "国家所有", 274 label: "国家所有",
...@@ -246,13 +284,14 @@ ...@@ -246,13 +284,14 @@
246 } 284 }
247 ], 285 ],
248 hhbtabs:false, 286 hhbtabs:false,
287 zdDzList:[],
288 zdZrzList:[],
249 } 289 }
250 }, 290 },
251 created() { 291 created() {
252 }, 292 },
253 mounted() { 293 mounted() {
254 this.getXzqList(); 294 this.getXzqList();
255 this.getzdtzm();
256 this.$nextTick(() => { 295 this.$nextTick(() => {
257 this.fgBoxWidth = this.$refs.hbBox.clientWidth; 296 this.fgBoxWidth = this.$refs.hbBox.clientWidth;
258 }) 297 })
...@@ -312,26 +351,23 @@ ...@@ -312,26 +351,23 @@
312 hHb(){ 351 hHb(){
313 352
314 }, 353 },
315 deleteData(index){ 354 deleteData(item,index){
316 switch (this.tabName) { 355 switch (this.tabName) {
317 case "zd": 356 case "zd":
318 this.zdhbqData.splice(index,1) 357 this.zdhbqData.splice(index,1);
358 //删除幢信息中的数据
359 console.log(item);
360 console.log(this.zdZrzList,'this.zdZrzList');
361 this.zdZrzList = this.zdZrzList.filter(i => i.zdbsm!== item.zdbsm);
362 this.zdDzList = this.zdDzList.filter(i => i.zdbsm!== item.zdbsm);
319 break 363 break
320 case "dz": 364 case "dz":
321 this.dzhbqData.splice(index,1) 365 this.dzhbqData.splice(index,1)
322 break 366 break
323 case "h":
324 this.hhbqData.splice(index,1)
325 break
326 default: 367 default:
327 break 368 break
328 } 369 }
329 }, 370 },
330 getzdtzm() {
331 getDdicByMC('宗地(宗海)特征码').then(res => {
332 this.tdtzm = res.result
333 })
334 },
335 getXzqList() { 371 getXzqList() {
336 getAllList() 372 getAllList()
337 .then((res) => { 373 .then((res) => {
...@@ -345,16 +381,12 @@ ...@@ -345,16 +381,12 @@
345 this.djzq = []; 381 this.djzq = [];
346 switch (this.tabName) { 382 switch (this.tabName) {
347 case "zd": 383 case "zd":
348 this.zdhbqData.djqbsm = ''; 384 this.zdhbhData.djqbsm = '';
349 this.zdhbqData.djzqbsm = ''; 385 this.zdhbhData.djzqbsm = '';
350 break 386 break
351 case "dz": 387 case "dz":
352 this.dzhbqData.djqbsm = ''; 388 this.zdhbhData.djqbsm = '';
353 this.dzhbqData.djzqbsm = ''; 389 this.zdhbhData.djzqbsm = '';
354 break
355 case "h":
356 this.hhbqData.djqbsm = '';
357 this.hhbqData.djzqbsm = '';
358 break 390 break
359 default: 391 default:
360 break 392 break
...@@ -374,14 +406,11 @@ ...@@ -374,14 +406,11 @@
374 this.djzq = []; 406 this.djzq = [];
375 switch (this.tabName) { 407 switch (this.tabName) {
376 case "zd": 408 case "zd":
377 this.zdhbqData.djzqbsm = ''; 409 this.zdhbhData.djzqbsm = '';
378 break 410 break
379 case "dz": 411 case "dz":
380 this.dzhbqData.djzqbsm = ''; 412 this.dzhbqData.djzqbsm = '';
381 break 413 break
382 case "h":
383 this.hhbqData.djzqbsm = '';
384 break
385 default: 414 default:
386 break 415 break
387 } 416 }
...@@ -409,11 +438,32 @@ ...@@ -409,11 +438,32 @@
409 let arr=[]; 438 let arr=[];
410 switch (this.tabName) { 439 switch (this.tabName) {
411 case "zd": 440 case "zd":
412 arr=this.zdhbqData.filter(i=>i.zdbsm==data.zdbsm); 441 arr=this.zdhbqData.filter(i=>i.zdbsm==data.zdbsm);
413 if (arr.length>0) { 442 if (arr.length>0) {
414 break 443 break
415 } 444 }
416 this.zdhbqData.push(data); 445 this.zdhbqData.push(data);
446 ZdfggetZxx(data.zdbsm).then(res => {
447 if (res.success) {
448 console.log(res.result,'res.result');
449 res.result.zrzList.forEach(item=>{
450 item.zdbsm = data.zdbsm
451 })
452 res.result.dzList.forEach(item=>{
453 item.zdbsm = data.zdbsm
454 })
455 if(this.zdZrzList.length == 0){
456 this.zdZrzList = res.result.zrzList
457 }else{
458 this.zdZrzList = this.zdZrzList.concat(res.result.zrzList)
459 }
460 if(this.zdDzList.length == 0){
461 this.zdDzList = res.result.dzList
462 }else{
463 this.zdDzList = this.zdDzList.concat(res.result.dzList)
464 }
465 }
466 })
417 break 467 break
418 case "dz": 468 case "dz":
419 arr=this.dzhbqData.filter(i=>i.glbsm==data.glbsm); 469 arr=this.dzhbqData.filter(i=>i.glbsm==data.glbsm);
...@@ -425,16 +475,6 @@ ...@@ -425,16 +475,6 @@
425 } 475 }
426 this.dzhbqData.push(data); 476 this.dzhbqData.push(data);
427 break 477 break
428 case "h":
429 arr=this.hhbqData.filter(i=>i.glbsm==data.glbsm);
430 if (arr.length>0) {
431 break
432 }
433 if (this.hhbqData.includes(data)) {
434 break
435 }
436 this.hhbqData.push(data);
437 break
438 default: 478 default:
439 break; 479 break;
440 } 480 }
...@@ -580,7 +620,7 @@ ...@@ -580,7 +620,7 @@
580 620
581 td { 621 td {
582 text-align: center; 622 text-align: center;
583 height: 36px; 623 height: 40px;
584 min-width: 50px; 624 min-width: 50px;
585 } 625 }
586 626
...@@ -609,16 +649,135 @@ ...@@ -609,16 +649,135 @@
609 } 649 }
610 .tips { 650 .tips {
611 color: #9B9B9B; 651 color: #9B9B9B;
652 margin-left: 20px;
612 } 653 }
613 .hbq { 654 .hbq {
614 margin-top: 12px; 655 margin-left: 20px;
615 box-sizing: border-box; 656 margin-top: 14px;
616 padding: 18px; 657 margin-bottom: 20px;
617 } 658 }
618 .hbh { 659 .hbh {
619 box-sizing: border-box; 660 margin-left: 20px;
620 padding: 0 18px; 661 margin-top: 14px;
621 margin-top: 10px; 662 margin-bottom: 70px;
663 display: flex;
664 flex-direction: column;
665 flex-flow: nowrap;
666 .data{
667 width: 40%;
668 float: left;
669 }
670 .el-card {
671 border: 1px solid #E6E6E6;
672 background-color: white;
673 overflow: auto;
674 .clearfix{
675 span{
676 color: #9B9B9B;
677 }
678 }
679 /deep/ .el-card__body{
680 padding:10px 12px;
681 }
682 ul {
683 li {
684 padding: 5px;
685 line-height: 20px;
686 color: #4A4A4A;
687 .label{
688 vertical-align: middle;
689 color: #4A4A4A;
690 display: inline-block;
691 width: 104px;
692 text-align: right;
693 }
694 .value{
695 vertical-align: middle;
696 color: #6D7278;
697 display: inline-block;
698 padding-left: 10px;
699 width: calc(100% - 116px);
700 word-break: break-all;
701 }
702 }
703 .hasChoosed{
704 color: #BBB;
705 }
706 }
707 .zdjbxx{
708 width: 100%;
709 height: 320px;
710 margin-bottom: 10px;
711 float: left;
712 }
713 .zdmap{
714 width: calc(100% - 380px);
715 height: 200px;
716 float: left;
717 }
718 }
719 .zxx {
720 width: calc(60% - 40px);
721 margin-left: 20px;
722 display: flex;
723 flex-direction: column;
724 flex-flow: nowrap;
725 float: left;
726 .title {
727 color: red;
728 text-align: center;
729 padding: 5px 0;
730 }
731 /deep/ .el-card__body{
732 height: 200px;
733 overflow-y: scroll;
734 position: relative;
735 }
736 .line{
737 width: 1px;
738 height: calc(100% - 20px);
739 background-color: #EDEDED;
740 position: absolute;
741 top: 10px;
742 left: 50%;
743 }
744 .dz {
745 width: 33%;
746 overflow: auto;
747 ul{
748 li{
749 width: 96% !important;
750 }
751 }
752
753 }
754 .zrz {
755 width: 100%;
756 overflow: auto;
757 }
758 ul {
759 overflow: auto;
760 width: 100%;
761 float: left;
762 margin-left: 10px;
763 li {
764 width: 23%;
765 padding: 5px;
766 text-align: left;
767 line-height: 20px;
768 display: inline-block;
769 .label{
770 width: 90px;
771 }
772 }
773 li:nth-of-type(even){
774 .label{
775 width: 110px;
776 text-indent: 20px;
777 }
778 }
779 }
780 }
622 } 781 }
623 } 782 }
624 .cz{ 783 .cz{
......