Skip to content

任超 / js.CadastralSystem

Go to a project
Toggle navigation
Toggle navigation pinning
a3093e1c by 杨威
Options

权利性质组件修改

1 parent d808f425
Inline Side-by-side
Showing 1 changed file with 115 additions and 102 deletions
...@@ -5,19 +5,20 @@ ...@@ -5,19 +5,20 @@
5 v-for="(items, index) in countList" 5 v-for="(items, index) in countList"
6 :key="items.id" 6 :key="items.id"
7 > 7 >
8 <el-col :span="2" class="btnCol"> 8 <template v-for="(childItem,childIndex) in items.addQjTdytRequestList" >
9 <el-col :span="2" class="btnCol" :key="childIndex+'1'" :class="childIndex>0 ? 'childYT noTopBorder':''">
9 <el-button 10 <el-button
10 v-if="!items.isInside" 11 v-show="childIndex<1"
11 type="primary" 12 type="primary"
12 class="changeBtn" 13 class="changeBtn"
13 @click="handleClick(items.id, index, 'add')" 14 @click="handleClick( index, 'add')"
14 >+</el-button 15 >+</el-button
15 > 16 >
16 <el-button 17 <el-button
17 v-if="!items.isInside" 18 v-show="childIndex<1"
18 type="primary" 19 type="primary"
19 class="changeBtn" 20 class="changeBtn"
20 @click="handleClick(items.id, index, 'minus')" 21 @click="handleClick( index, 'minus')"
21 >-</el-button 22 >-</el-button
22 > 23 >
23 <div 24 <div
...@@ -25,32 +26,34 @@ ...@@ -25,32 +26,34 @@
25 v-if="items.isInside" 26 v-if="items.isInside"
26 ></div> 27 ></div>
27 </el-col> 28 </el-col>
28 <el-col :span="2" class="btnCol"> 29 <el-col :span="2" class="btnCol" :key="childIndex+'8'" :class="childIndex>0 ? 'childYT':''">
29 <span class="qlxz">权利性质</span><br> 30 <!-- <template v-if="childIndex>0"> -->
31 <span class="qlxz" v-show="childIndex<1">权利性质</span><br>
30 <el-button 32 <el-button
31 type="primary" 33 type="primary"
32 class="changeBtn" 34 class="changeBtn"
33 @click="handleInClick(items, index, 'add')" 35 @click="handleInClick(index, childIndex, 'add')"
34 >+</el-button 36 >+</el-button
35 > 37 >
36 <el-button 38 <el-button
37 type="primary" 39 type="primary"
38 class="changeBtn" 40 class="changeBtn"
39 @click="handleInClick(items, index, 'minus')" 41 @click="handleInClick(index, childIndex, 'minus')"
40 >-</el-button 42 >-</el-button
41 > 43 >
44 <!-- </template> -->
42 </el-col> 45 </el-col>
43 <el-col :span="3"> 46 <el-col :span="3" :key="childIndex+'7'" :class="childIndex>0 ? 'childYT':''">
44 <ul> 47 <ul>
45 <li>批准用途</li> 48 <li>批准用途</li>
46 <li>实际用途</li> 49 <li>实际用途</li>
47 <li>土地使用起始时间<i class="requisite">*</i></li> 50 <li>土地使用起始时间<i class="requisite">*</i></li>
48 </ul> 51 </ul>
49 </el-col> 52 </el-col>
50 <el-col :span="4"> 53 <el-col :span="4" :key="childIndex+'6'" :class="childIndex>0 ? 'childYT':''">
51 <ul> 54 <ul>
52 <li> 55 <li>
53 <el-select class="formSelect percent30" v-model="items.pzyt"> 56 <el-select class="formSelect percent30" v-model="childItem.pzytdm">
54 <el-option 57 <el-option
55 v-for="item in $store.state.tdytList" 58 v-for="item in $store.state.tdytList"
56 :key="item.dm" 59 :key="item.dm"
...@@ -61,7 +64,7 @@ ...@@ -61,7 +64,7 @@
61 </el-select> 64 </el-select>
62 </li> 65 </li>
63 <li> 66 <li>
64 <el-select class="formSelect percent30" v-model="items.sjyt"> 67 <el-select class="formSelect percent30" v-model="childItem.sjytdm">
65 <el-option 68 <el-option
66 v-for="item in $store.state.tdytList" 69 v-for="item in $store.state.tdytList"
67 :key="item.dm" 70 :key="item.dm"
...@@ -73,7 +76,7 @@ ...@@ -73,7 +76,7 @@
73 </li> 76 </li>
74 <li> 77 <li>
75 <el-date-picker 78 <el-date-picker
76 v-model="items.tdsyqssj" 79 v-model="childItem.tdsyqssj"
77 type="date" 80 type="date"
78 placeholder="选择日期" 81 placeholder="选择日期"
79 > 82 >
...@@ -81,37 +84,37 @@ ...@@ -81,37 +84,37 @@
81 </li> 84 </li>
82 </ul> 85 </ul>
83 </el-col> 86 </el-col>
84 <el-col :span="3"> 87 <el-col :span="3" :key="childIndex+'5'" :class="childIndex>0 ? 'childYT':''">
85 <ul> 88 <ul>
86 <li>地类编码</li> 89 <li>地类编码</li>
87 <li>地类编码</li> 90 <li>地类编码</li>
88 <li>年限<i class="requisite">*</i></li> 91 <li>年限<i class="requisite">*</i></li>
89 </ul> 92 </ul>
90 </el-col> 93 </el-col>
91 <el-col :span="3"> 94 <el-col :span="3" :key="childIndex+'4'" :class="childIndex>0 ? 'childYT':''">
92 <ul> 95 <ul>
93 <li> 96 <li>
94 <input type="text" v-model="items.pzyt" class="formInput" /> 97 <input type="text" v-model="childItem.pzytdm" class="formInput" />
95 </li> 98 </li>
96 <li> 99 <li>
97 <input type="text" v-model="items.sjyt" class="formInput" /> 100 <input type="text" v-model="childItem.sjytdm" class="formInput" />
98 </li> 101 </li>
99 <li> 102 <li>
100 <input type="text" v-model="items.nx" class="formInput" /> 103 <input type="text" v-model="childItem.syqx " class="formInput" />
101 </li> 104 </li>
102 </ul> 105 </ul>
103 </el-col> 106 </el-col>
104 <el-col :span="3"> 107 <el-col :span="3" :key="childIndex+'2'" :class="childIndex>0 ? 'childYT':''">
105 <ul> 108 <ul>
106 <li>等级</li> 109 <li>等级</li>
107 <li>等级</li> 110 <li>等级</li>
108 <li>土地使用结束时间<i class="requisite">*</i></li> 111 <li>土地使用结束时间<i class="requisite">*</i></li>
109 </ul> 112 </ul>
110 </el-col> 113 </el-col>
111 <el-col :span="4"> 114 <el-col :span="4" :key="childIndex+'3'" class="noRightBorder" :class="childIndex>0 ? 'childYT ':''">
112 <ul> 115 <ul>
113 <li> 116 <li>
114 <el-select class="formSelect percent30" v-model="items.dj1"> 117 <el-select class="formSelect percent30" v-model="childItem.pzdjbsm">
115 <el-option 118 <el-option
116 v-for="item in $store.state.tddjList" 119 v-for="item in $store.state.tddjList"
117 :key="item.bsm" 120 :key="item.bsm"
...@@ -122,7 +125,7 @@ ...@@ -122,7 +125,7 @@
122 </el-select> 125 </el-select>
123 </li> 126 </li>
124 <li> 127 <li>
125 <el-select class="formSelect percent30" v-model="items.dj2"> 128 <el-select class="formSelect percent30" v-model="childItem.sjdjbsm">
126 <el-option 129 <el-option
127 v-for="item in $store.state.tddjList" 130 v-for="item in $store.state.tddjList"
128 :key="item.bsm" 131 :key="item.bsm"
...@@ -134,7 +137,7 @@ ...@@ -134,7 +137,7 @@
134 </li> 137 </li>
135 <li> 138 <li>
136 <el-date-picker 139 <el-date-picker
137 v-model="items.tdsyjssj" 140 v-model="childItem.tdsyjssj"
138 type="date" 141 type="date"
139 placeholder="选择日期" 142 placeholder="选择日期"
140 > 143 >
...@@ -142,6 +145,8 @@ ...@@ -142,6 +145,8 @@
142 </li> 145 </li>
143 </ul> 146 </ul>
144 </el-col> 147 </el-col>
148 </template>
149
145 <div class="title"> 150 <div class="title">
146 <el-select class="formSelect" v-model="items.qlxzdm"> 151 <el-select class="formSelect" v-model="items.qlxzdm">
147 <el-option 152 <el-option
...@@ -161,37 +166,22 @@ ...@@ -161,37 +166,22 @@
161 import { getDdicByMC } from "../../api/common"; 166 import { getDdicByMC } from "../../api/common";
162 export default { 167 export default {
163 props: { 168 props: {
164 widtd: { 169 // widtd: {
165 type: String, 170 // type: String,
166 default: "70%", 171 // default: "70%",
167 }, 172 // },
168 title: {
169 type: String,
170 default: "",
171 },
172 topHeight: {
173 type: String,
174 default: "15vh",
175 },
176 }, 173 },
177 data() { 174 data() {
178 return { 175 return {
179
180 countList: [ 176 countList: [
181 { 177 {
182 id: Math.random(), 178 id: Math.random(),
183 isInside: false, 179 isInside: false,
184 hasNotBorder: false, 180 hasNotBorder: false,
185 qlxzdm: "", 181 "bsm": "",//权利性质标识码
186 pzyt: "", 182 "glbsm": "",//宗地BSM、自然幢BSM、户BSM、多幢BSM、宗海BSM
187 sjyt: "", 183 "qlxzdm": "",
188 tdsyqssj: "", 184 "zhqlxzlx": "", //除宗海数据外，默认都是空；0:用海类型权利性质;2:海岛用途权利性质
189 dlbm: "",
190 dlbm2: "",
191 nx: "",
192 dj1: "",
193 dj2: "",
194 tdsyjssj: "",
195 addQjTdytRequestList:[ 185 addQjTdytRequestList:[
196 { 186 {
197 "pzdjbsm": "", 187 "pzdjbsm": "",
...@@ -220,23 +210,37 @@ export default { ...@@ -220,23 +210,37 @@ export default {
220 }, 210 },
221 methods: { 211 methods: {
222 //外层操作 212 //外层操作
223 handleClick(id, ind, type) { 213 handleClick( ind, type) {
224 if (type === "add") { 214 let outsideObj = {
225 this.countList.push({
226 id: Math.random(), 215 id: Math.random(),
227 isInside: false, 216 isInside: false,
228 hasNotBorder: false, 217 hasNotBorder: false,
229 qlxzdm: "", 218 "bsm": "",//权利性质标识码
230 pzyt: "", 219 "glbsm": "",//宗地BSM、自然幢BSM、户BSM、多幢BSM、宗海BSM
231 sjyt: "", 220 "qlxzdm": "",
232 tdsyqssj: "", 221 "zhqlxzlx": "", //除宗海数据外，默认都是空；0:用海类型权利性质;2:海岛用途权利性质
233 dlbm: "", 222 addQjTdytRequestList:[
234 dlbm2: "", 223 {
235 nx: "", 224 "pzdjbsm": "",
236 dj1: "", 225 "pzdjmc": "",
237 dj2: "", 226 "pzytdm": "",
238 tdsyjssj: "", 227 "pzytmc": "",
239 }); 228 "pzytmj": 0,
229 "qlxzbsm": "",
230 "sjdjbsm": "",
231 "sjdjmc": "",
232 "sjytdm": "",
233 "sjytmc": "",
234 "sjytmj": 0,
235 "syqx": "",
236 "tdsyjssj": "2020-10-23",
237 "tdsyqssj": "2020-10-20",
238 "tdzh": ""
239 }
240 ]
241 };
242 if (type === "add") {
243 this.countList.push(outsideObj);
240 this.outNum++ 244 this.outNum++
241 } else { 245 } else {
242 this.countList.forEach((item, index) => { 246 this.countList.forEach((item, index) => {
...@@ -246,50 +250,34 @@ export default { ...@@ -246,50 +250,34 @@ export default {
246 }); 250 });
247 this.outNum-- 251 this.outNum--
248 } 252 }
249 this.hasBorderOrNot();
250 }, 253 },
251 //内层操作 254 //内层操作
252 handleInClick(obj, ind, type) { 255 handleInClick(index, childIndex, type) {
256 let insideObj = {
257 "pzdjbsm": "",
258 "pzdjmc": "",
259 "pzytdm": "",
260 "pzytmc": "",
261 "pzytmj": 0,
262 "qlxzbsm": "",
263 "sjdjbsm": "",
264 "sjdjmc": "",
265 "sjytdm": "",
266 "sjytmc": "",
267 "sjytmj": 0,
268 "syqx": "",
269 "tdsyjssj": "2020-10-23",
270 "tdsyqssj": "2020-10-20",
271 "tdzh": ""
272 };
253 if (type === "add") { 273 if (type === "add") {
254 this.countList.splice(ind + 1, 0, { 274 this.countList[index].addQjTdytRequestList.splice(childIndex + 1, 0, insideObj);
255 id: obj.id,
256 childId: Math.random(),
257 isInside: true,
258 hasNotBorder: false,
259 qlxzdm: "",
260 pzyt: "",
261 sjyt: "",
262 tdsyqssj: "",
263 dlbm: "",
264 dlbm2: "",
265 nx: "",
266 dj1: "",
267 dj2: "",
268 tdsyjssj: "",
269 });
270 } else {
271 if (obj.childId) {
272 this.countList.forEach((item, index) => {
273 if (item.childId == obj.childId && this.countList.length > 1) {
274 this.countList.splice(index, 1);
275 }
276 });
277 } else { 275 } else {
278 let tempNum = 0; 276 this.countList[index].addQjTdytRequestList.forEach((item, childInd) => {
279 let tempIndex = 0; 277 if (childIndex == childInd && this.countList[index].addQjTdytRequestList.length > 1) {
280 this.countList.forEach((item, index) => { 278 this.countList[index].addQjTdytRequestList.splice(childIndex, 1);
281 if (item.id == obj.id && this.countList.length > 1) {
282 tempIndex = tempNum == 0 ? index : tempIndex;
283 tempNum++;
284 } 279 }
285 }); 280 });
286 //判断外层是否没有增加，如果没有增加，则不能删除当前外层
287 if(ind == 0 && this.outNum == 0){
288
289 }else{
290 this.countList.splice(tempIndex, tempNum);
291 }
292 }
293 } 281 }
294 this.hasBorderOrNot(); 282 this.hasBorderOrNot();
295 }, 283 },
...@@ -313,11 +301,11 @@ export default { ...@@ -313,11 +301,11 @@ export default {
313 .temp { 301 .temp {
314 width: 100%; 302 width: 100%;
315 .qlxzModule { 303 .qlxzModule {
316 height: 148px; 304 height: auto;
317 position: relative; 305 position: relative;
318 border-bottom: 1px solid grey; 306 border-bottom: 1px solid grey;
319 .el-col { 307 .el-col {
320 height: 100%; 308 // height: 100%;
321 border-right: 1px solid grey; 309 border-right: 1px solid grey;
322 position: relative; 310 position: relative;
323 .qlxz { 311 .qlxz {
...@@ -356,6 +344,30 @@ export default { ...@@ -356,6 +344,30 @@ export default {
356 bottom: 2px; 344 bottom: 2px;
357 } 345 }
358 } 346 }
347 .childYT{
348 height: 114px;
349 border-top: 1px solid grey;
350 ul {
351 margin-top: 0;
352 li{
353 .el-input__inner {
354 height: 29px;
355 }
356 }
357 }
358 .changeBtn {
359 margin-top: -48px;
360 }
361 .el-button + .el-button {
362 margin-top: 4px;
363 }
364 }
365 .noTopBorder{
366 border-top: 0;
367 }
368 .noRightBorder{
369 border-right: 0;
370 }
359 .el-col:nth-last-child(2) { 371 .el-col:nth-last-child(2) {
360 border-right: none; 372 border-right: none;
361 } 373 }
...@@ -372,13 +384,14 @@ export default { ...@@ -372,13 +384,14 @@ export default {
372 top: -1px; 384 top: -1px;
373 width: 100%; 385 width: 100%;
374 .el-input__inner { 386 .el-input__inner {
375 height: 34px; 387 height: 32px;
376 } 388 }
377 } 389 }
378 } 390 }
379 } 391 }
380 .btnCol { 392 .btnCol {
381 position: relative; 393 position: relative;
394 height: 147px;
382 .changeBtn { 395 .changeBtn {
383 width: 46px; 396 width: 46px;
384 height: 46px; 397 height: 46px;
......