45aabd6b by renchao@pashanhoo.com
2 parents 605060e2 f735de64
Showing 45 changed files with 1518 additions and 1873 deletions
1 import request from '@/utils/request' 1 import request from '@/utils/request'
2 import SERVER from './config' 2 import SERVER from './config'
3 3 const url = SERVER.LPBSERVERAPI + '/rest/zhcx/lpcx/'
4 /* 4 /*
5 楼盘查询 5 楼盘查询
6 */ 6 */
...@@ -17,7 +17,23 @@ export function getLpZrz (data) { ...@@ -17,7 +17,23 @@ export function getLpZrz (data) {
17 // 获取楼盘表 17 // 获取楼盘表
18 export function getLpb (zrzbsm) { 18 export function getLpb (zrzbsm) {
19 return request({ 19 return request({
20 url: 'service-lpb/rest/zhcx/lpcx/getLpb?zrzbsm=' + zrzbsm, 20 url: url + 'getLpb?scyclx=1&zrzbsm=' + zrzbsm,
21 // url: 'service-lpb/rest/zhcx/lpcx/getLpb?zrzbsm=' + zrzbsm ,
22 method: 'get'
23 })
24 }
25 // 获取楼盘表房屋用途,房屋性质右侧房屋用途统计数据
26 export function getLpbFwytAndQlxz (zrzbsm) {
27 return request({
28 url: url + 'getLpbFwytAndQlxz?scyclx=1&zrzbsm=' + zrzbsm,
21 method: 'get' 29 method: 'get'
22 }) 30 })
23 } 31 }
32 // 获取楼盘表缺失项统计
33 export function getLpbQsxtj (zrzbsm) {
34 return request({
35 url: url + 'getLpbQsxtj?scyclx=1&zrzbsm=' + zrzbsm,
36 method: 'get'
37 })
38 }
39
......
...@@ -3,7 +3,7 @@ ...@@ -3,7 +3,7 @@
3 * @Autor: renchao 3 * @Autor: renchao
4 * @LastEditTime: 2023-03-02 13:25:48 4 * @LastEditTime: 2023-03-02 13:25:48
5 */ 5 */
6 import dialogBox from '@/components/DialogBox/dialogBox.vue' 6 import dialogBox from '@/components/dialogBox/dialogBox.vue'
7 import LbTable from '@/components/LbTable/lb-table.vue' 7 import LbTable from '@/components/LbTable/lb-table.vue'
8 import Theme from '@/components/Theme/theme.vue' 8 import Theme from '@/components/Theme/theme.vue'
9 import Popup from '@/components/Popup/index' 9 import Popup from '@/components/Popup/index'
......
...@@ -10,10 +10,10 @@ ...@@ -10,10 +10,10 @@
10 </router-link> 10 </router-link>
11 </scroll-pane> 11 </scroll-pane>
12 <ul v-show="visible" :style="{left:left+'px',top:top+'px'}" class="contextmenu"> 12 <ul v-show="visible" :style="{left:left+'px',top:top+'px'}" class="contextmenu">
13 <li @click="refreshSelectedTag(selectedTag)">Refresh</li> 13 <li @click="refreshSelectedTag(selectedTag)">刷新</li>
14 <li v-if="!isAffix(selectedTag)" @click="closeSelectedTag(selectedTag)">Close</li> 14 <li v-if="!isAffix(selectedTag)" @click="closeSelectedTag(selectedTag)">关闭</li>
15 <li @click="closeOthersTags">Close Others</li> 15 <li @click="closeOthersTags">关闭其他</li>
16 <li @click="closeAllTags(selectedTag)">Close All</li> 16 <li @click="closeAllTags(selectedTag)">关闭所有</li>
17 </ul> 17 </ul>
18 </div> 18 </div>
19 </template> 19 </template>
...@@ -164,18 +164,17 @@ export default { ...@@ -164,18 +164,17 @@ export default {
164 } 164 }
165 }, 165 },
166 openMenu (tag, e) { 166 openMenu (tag, e) {
167 const menuMinWidth = 105 167 // const menuMinWidth = 105
168 const offsetLeft = this.$el.getBoundingClientRect().left // container margin left 168 // const offsetLeft = this.$el.getBoundingClientRect().left // container margin left
169 const offsetWidth = this.$el.offsetWidth // container width 169 // const offsetWidth = this.$el.offsetWidth // container width
170 const maxLeft = offsetWidth - menuMinWidth // left boundary 170 // const maxLeft = offsetWidth - menuMinWidth // left boundary
171 const left = e.clientX - offsetLeft + 15 // 15: margin right 171 // const left = e.clientX - offsetLeft + 15 // 15: margin right
172 172 // if (left > maxLeft) {
173 if (left > maxLeft) { 173 // this.left = maxLeft
174 this.left = maxLeft 174 // } else {
175 } else { 175 // this.left = left
176 this.left = left 176 // }
177 } 177 this.left = e.clientX
178
179 this.top = e.clientY 178 this.top = e.clientY
180 this.visible = true 179 this.visible = true
181 this.selectedTag = tag 180 this.selectedTag = tag
......
...@@ -369,4 +369,19 @@ aside { ...@@ -369,4 +369,19 @@ aside {
369 369
370 .item-cwnr img { 370 .item-cwnr img {
371 height: 30px; 371 height: 30px;
372 }
...\ No newline at end of file ...\ No newline at end of file
372 }
373
374 //楼盘表的幢/幢单元名称
375 .lpb-xmmc {
376 height: 60px;
377 line-height: 60px;
378 background-color: #ffffff;
379 border: 1px solid #e6e6e6;
380 text-align: center;
381 transition: 0.5s;
382 margin-left: -1px;
383 border-top: 0;
384 .el-checkbox__label {
385 font-size: 16px;
386 }
387 }
......
1 .tableDivCss {
2 width: 100%;
3 height: 100%;
4 background-color: #f5f5f5;
5 padding: 5px;
6 overflow-y: scroll;
7 }
8
9 .tableCss {
10 width: 100%;
11 background: #fff;
12 text-align: center;
13 border-collapse: collapse;
14 color: #333;
15
16 th {
17 border: 1px solid #e8e8e8;
18 line-height: 42px;
19 padding: 0 4px;
20 font-size: 14px;
21 }
22
23 td {
24 border: 1px solid #e8e8e8;
25 line-height: 42px;
26 padding: 0 4px;
27 font-size: 14px;
28 }
29
30 .title {
31 line-height: 68px;
32 font-size: 22px !important;
33 }
34
35
36 }
...\ No newline at end of file ...\ No newline at end of file
1 import { mapGetters } from 'vuex' 1 import { mapGetters } from 'vuex'
2 import { defaultParameters } from "../../views/ywbl/ywsq/javascript/publicDefaultPar";
2 export default { 3 export default {
3 data () { 4 data () {
4 return { 5 return {
...@@ -39,6 +40,13 @@ export default { ...@@ -39,6 +40,13 @@ export default {
39 let deleteAfterPage = Math.ceil((this.tableData.total - 1) / this.pageData.pageSize) 40 let deleteAfterPage = Math.ceil((this.tableData.total - 1) / this.pageData.pageSize)
40 let currentPage = this.pageData.currentPage > deleteAfterPage ? deleteAfterPage : this.pageData.currentPage 41 let currentPage = this.pageData.currentPage > deleteAfterPage ? deleteAfterPage : this.pageData.currentPage
41 this.pageData.currentPage = currentPage < 1 ? 1 : currentPage 42 this.pageData.currentPage = currentPage < 1 ? 1 : currentPage
43 },
44 resetForm(isYwbl){
45 if (isYwbl) {
46 this.queryForm = defaultParameters.defaultParameters();
47 this.pageData.currentPage = 1;
48 this.queryClick()
49 }
42 } 50 }
43 } 51 }
44 } 52 }
......
1 <template> 1 <template>
2 <div class="edit"> 2 <div class="edit">
3 <el-tabs type="card" v-model="activeName" v-if="!isJump"> 3 <el-tabs type="card" v-model="activeName" >
4 <el-tab-pane label="楼盘页面" name="first"></el-tab-pane> 4 <el-tab-pane label="楼盘页面" name="first"></el-tab-pane>
5 <el-tab-pane label="单元列表页面" name="second"></el-tab-pane> 5 <el-tab-pane label="单元列表页面" name="second"></el-tab-pane>
6 </el-tabs> 6 </el-tabs>
7 <!-- <div class="tab-header">
8 <el-row class="searchContent">
9 <el-col :span="24" style="margin:0 0 10px 18px;">
10 <el-radio-group v-model="scyclx" @change="scyclxChange">
11 <el-radio-button label="0">预测</el-radio-button>
12 <el-radio-button label="1">实测</el-radio-button>
13 </el-radio-group>
14 <el-input maxlength="28" v-model="" :style="{ width: inputWidth + 'px' }" class="searchInput"
15 placeholder="输入不动产单元号或室号"><i slot="suffix" class="el-input__icon el-icon-search" @click="inputChange"></i>
16 </el-input>
17 </el-col>
18 </el-row>
19 </div> -->
20 <div class="tab-content" v-if="activeName=='first'" ref="tabContent" :style="{ height: lpbContentHight + 'px' }" v-show="bjztFlag"> 7 <div class="tab-content" v-if="activeName=='first'" ref="tabContent" :style="{ height: lpbContentHight + 'px' }" v-show="bjztFlag">
21 <!-- 楼盘表主体 --> 8 <!-- 楼盘表主体 -->
22 <div class="lp-overview" :style="{ width: lpbContentwidth + 'px' }"> 9 <div class="lp-overview" :style="{ width: lpbContentwidth + 'px' }">
...@@ -53,7 +40,7 @@ ...@@ -53,7 +40,7 @@
53 <tr v-for="(item, index) in dyztList" :key="index" class="cp" 40 <tr v-for="(item, index) in dyztList" :key="index" class="cp"
54 @click="handleChoosedH(item.bsms, item.color)"> 41 @click="handleChoosedH(item.bsms, item.color)">
55 <td> 42 <td>
56 <i class="fa fa-circle" :style="{ color: item.color }"></i>{{ item.name }} 43 <i class="circle" :style="{ 'background-color': item.color }"></i>{{ item.name }}
57 </td> 44 </td>
58 <td>{{ item.ts }}</td> 45 <td>{{ item.ts }}</td>
59 <td>{{ item.mj }}</td> 46 <td>{{ item.mj }}</td>
...@@ -68,7 +55,7 @@ ...@@ -68,7 +55,7 @@
68 <tr v-for="(item, index) in fwxzList" :key="index" class="cp" 55 <tr v-for="(item, index) in fwxzList" :key="index" class="cp"
69 @click="handleChoosedH(item.bsms, item.color)"> 56 @click="handleChoosedH(item.bsms, item.color)">
70 <td> 57 <td>
71 <i class="fa fa-circle" :style="{ color: item.color }"></i>{{ item.name }} 58 <i class="circle" :style="{ 'background-color': item.color }"></i>{{ item.name }}
72 </td> 59 </td>
73 <td>{{ item.ts }}</td> 60 <td>{{ item.ts }}</td>
74 <td>{{ item.mj }}</td> 61 <td>{{ item.mj }}</td>
...@@ -87,7 +74,7 @@ ...@@ -87,7 +74,7 @@
87 <tr v-for="(item, index) in fwytList" :key="index" class="cp" 74 <tr v-for="(item, index) in fwytList" :key="index" class="cp"
88 @click="handleChoosedH(item.bsms, item.color)"> 75 @click="handleChoosedH(item.bsms, item.color)">
89 <td> 76 <td>
90 <i class="fa fa-circle" :style="{ color: item.color }"></i>{{ item.name }} 77 <i class="circle" :style="{ 'background-color': item.color }"></i>{{ item.name }}
91 </td> 78 </td>
92 <td>{{ item.ts }}</td> 79 <td>{{ item.ts }}</td>
93 <td>{{ item.mj }}</td> 80 <td>{{ item.mj }}</td>
...@@ -105,7 +92,7 @@ ...@@ -105,7 +92,7 @@
105 </tr> 92 </tr>
106 <tr v-for="(item, index) in qsxList" :key="index" class="cp" @click="handleChoosedH(item.bsms, item.color)"> 93 <tr v-for="(item, index) in qsxList" :key="index" class="cp" @click="handleChoosedH(item.bsms, item.color)">
107 <td> 94 <td>
108 <i class="fa fa-circle" :style="{ color: item.color }"></i>{{ item.name }} 95 <i class="circle" :style="{ 'background-color': item.color }"></i>{{ item.name }}
109 </td> 96 </td>
110 <td>{{ item.ts }}</td> 97 <td>{{ item.ts }}</td>
111 <td>0</td> 98 <td>0</td>
...@@ -125,6 +112,7 @@ ...@@ -125,6 +112,7 @@
125 <script> 112 <script>
126 import lpbContent from "./lpbContent/index"; 113 import lpbContent from "./lpbContent/index";
127 import selectAllHInfo from "../ywbl/ywsq/components/selectAllHInfo" 114 import selectAllHInfo from "../ywbl/ywsq/components/selectAllHInfo"
115 import { getLpbFwytAndQlxz,getLpbQsxtj } from '@/api/lpb'
128 export default { 116 export default {
129 name: "lpb", 117 name: "lpb",
130 props: { 118 props: {
...@@ -222,58 +210,32 @@ export default { ...@@ -222,58 +210,32 @@ export default {
222 //获取各项单元状态的户bsm 210 //获取各项单元状态的户bsm
223 // this.getDyztBsmList(); 211 // this.getDyztBsmList();
224 //获取房屋用途统计数据 212 //获取房屋用途统计数据
225 // this.getLpbFwytAndQlxz(); 213 this.getLpbFwytAndQlxz();
226 // 楼盘表绘制区域宽度计算:楼盘表区域宽度-图例宽度34-滚动条宽度6 214 // 楼盘表绘制区域宽度计算:楼盘表区域宽度-图例宽度34-滚动条宽度6
227 setTimeout(() => { 215 setTimeout(() => {
228 this.lpbContentwidth = ((document.documentElement.clientWidth || document.body.clientWidth) - 340) - 34 - 6; 216 this.lpbContentwidth = ((document.documentElement.clientWidth || document.body.clientWidth) - 340) - 34 - 6;
229 }, 100); 217 }, 100);
230 }, 218 },
231 methods: { 219 methods: {
232 /* handleTabClick(event){ 220 /* handleTabClick(event){
233 if(event.name=="first"){ 221 if(event.name=="first"){
234 this.$router.push({ 222 this.$router.push({
235 path:"/lpb/index", 223 path:"/lpb/index",
236 }) 224 })
237 }else if(event.name=="second"){ 225 }else if(event.name=="second"){
238 this.$router.push({ 226 this.$router.push({
239 path:"/ywbl/ywsq/components/selectAllHInfo", 227 path:"/ywbl/ywsq/components/selectAllHInfo",
240 }) 228 })
241 } 229 }
242 },*/ 230 },*/
243 loading () {
244 this.getLpbMenuTree(this.$store.state.zrzbsm);
245 },
246 lodding () {
247 this.getlpbData();
248 },
249
250 //获取高度计算lpb内容区高度 231 //获取高度计算lpb内容区高度
251 getHeight () { 232 getHeight () {
252 this.lpbContentHight = window.innerHeight - 190; 233 this.lpbContentHight = window.innerHeight - 190;
253 }, 234 },
254
255 //图例的展开收起 235 //图例的展开收起
256 legendToggle () { 236 legendToggle () {
257 this.legendToggleFlag = !this.legendToggleFlag; 237 this.legendToggleFlag = !this.legendToggleFlag;
258 }, 238 },
259 //获取选中户bsm
260 getHbsm (data, type) {
261 if (type) {
262 // 双击
263
264 } else {
265 //单击 TO DO
266 this.bsms = data;
267 }
268 },
269 //调用楼盘表信息查询和图例统计接口
270 getlpbData () {
271 this.$refs.lpbContent.loadingData(this.$store.state.zrzbsm, this.scyclx);
272 this.getDyztBsmList();
273 this.getLpbFwytAndQlxz();
274 //改变楼盘表子组件的key值,重新渲染
275 // this.time = new Date().getTime();
276 },
277 //切换房屋状态 239 //切换房屋状态
278 handleChoosedH (bsms, color) { 240 handleChoosedH (bsms, color) {
279 //每次切换房屋状态,将之前高亮的户边框颜色重置为默认 241 //每次切换房屋状态,将之前高亮的户边框颜色重置为默认
...@@ -291,13 +253,11 @@ export default { ...@@ -291,13 +253,11 @@ export default {
291 this.$refs.lpbContent.borderColor = color; 253 this.$refs.lpbContent.borderColor = color;
292 }) 254 })
293 }, 255 },
294
295
296 //获取各项单元状态统计数据 256 //获取各项单元状态统计数据
297 getDyztBsmList () { 257 getDyztBsmList () {
298 let data = { 258 let data = {
299 zrzbsm: this.$store.state.zrzbsm, 259 zrzbsm: 'ca71bcc498794a1e0ec3ac93869719f6',
300 scyclx: this.scyclx, 260 scyclx: 1,
301 }; 261 };
302 getLpbTj(data).then((res) => { 262 getLpbTj(data).then((res) => {
303 if (res.code === 200) { 263 if (res.code === 200) {
...@@ -352,11 +312,7 @@ export default { ...@@ -352,11 +312,7 @@ export default {
352 }, 312 },
353 // 获取房屋用途和房屋性质及缺失项统计数据 313 // 获取房屋用途和房屋性质及缺失项统计数据
354 getLpbFwytAndQlxz () { 314 getLpbFwytAndQlxz () {
355 let data = { 315 getLpbFwytAndQlxz('ca71bcc498794a1e0ec3ac93869719f6').then((res) => {
356 zrzbsm: this.$store.state.zrzbsm,
357 scyclx: this.scyclx,
358 };
359 getLpbFwytAndQlxz(data).then((res) => {
360 if (res.code === 200) { 316 if (res.code === 200) {
361 // this.fwytList = res.result 317 // this.fwytList = res.result
362 this.fwytList = res.result.fwyt; 318 this.fwytList = res.result.fwyt;
...@@ -375,32 +331,31 @@ export default { ...@@ -375,32 +331,31 @@ export default {
375 } 331 }
376 } 332 }
377 }); 333 });
378 getLpbQsxtj(data).then((res) => { 334 // getLpbQsxtj('ca71bcc498794a1e0ec3ac93869719f6').then((res) => {
379 if (res.code === 200) { 335 // if (res.code === 200) {
380 this.qsxList = [ 336 // this.qsxList = [
381 { 337 // {
382 name: '坐落', 338 // name: '坐落',
383 bsms: res.result.zl.bsms, 339 // bsms: res.result.zl.bsms,
384 color: '#2591FD', 340 // color: '#2591FD',
385 ts: res.result.zl.bsms.length 341 // ts: res.result.zl.bsms.length
386 }, 342 // },
387 { 343 // {
388 name: '分层分户图', 344 // name: '分层分户图',
389 bsms: res.result.fcfht.bsms, 345 // bsms: res.result.fcfht.bsms,
390 color: '#2591FD', 346 // color: '#2591FD',
391 ts: res.result.fcfht.bsms.length 347 // ts: res.result.fcfht.bsms.length
392 }, 348 // },
393 { 349 // {
394 name: '室号', 350 // name: '室号',
395 bsms: res.result.shbw.bsms, 351 // bsms: res.result.shbw.bsms,
396 color: '#2591FD', 352 // color: '#2591FD',
397 ts: res.result.shbw.bsms.length 353 // ts: res.result.shbw.bsms.length
398 } 354 // }
399 ] 355 // ]
400 } 356 // }
401 }); 357 // });
402 } 358 }
403
404 }, 359 },
405 computed: {}, 360 computed: {},
406 destroyed () { 361 destroyed () {
...@@ -425,60 +380,13 @@ export default { ...@@ -425,60 +380,13 @@ export default {
425 .edit { 380 .edit {
426 height: 100%; 381 height: 100%;
427 background-color: #F4F9FF; 382 background-color: #F4F9FF;
428 .tab-header {
429 border: 1px solid #dedede;
430 box-sizing: border-box;
431 padding: 20px 0;
432 background-color: #ffffff;
433 margin-bottom: 10px;
434 position: relative;
435 .searchContent {
436 margin-left: 62px;
437 box-sizing: border-box;
438 padding: 0 20px;
439 .searchInput {
440 transition: 0.5s;
441 margin-left: 20px;
442 display: inline-block;
443 }
444 }
445 .change {
446 position: absolute;
447 left: 0;
448 top: 0;
449 height: 100%;
450 width: 80px;
451 border-right: 1px solid #dedede;
452 i {
453 cursor: pointer;
454 color: #0090FF;
455 font-size: 36px;
456 display: inherit;
457 text-align: center;
458 line-height: 128px;
459 }
460 }
461
462 .radioBtn {
463 margin-left: 10px;
464 padding: 12px 10px;
465 border: 0;
466 i {
467 font-size: 13px;
468 padding-right: 4px;
469 }
470 /deep/.el-radio-button__inner {
471 border: 1px solid #dcdfe6;
472 border-radius: 4px;
473 box-shadow: 0 0 0 0 #409eff !important;
474 }
475 }
476 }
477
478 .tab-content { 383 .tab-content {
479 border: 1px solid #dedede; 384 border: 1px solid #dedede;
480 background-color: #ffffff; 385 background-color: #ffffff;
481 display: flex; 386 display: flex;
387 &::-webkit-scrollbar {
388 width: 1px;
389 }
482 .lp-tree { 390 .lp-tree {
483 height: 100%; 391 height: 100%;
484 overflow: hidden; 392 overflow: hidden;
...@@ -489,15 +397,12 @@ export default { ...@@ -489,15 +397,12 @@ export default {
489 float: left; 397 float: left;
490 } 398 }
491 } 399 }
492
493 .w0 { 400 .w0 {
494 width: 0; 401 width: 0;
495 } 402 }
496
497 .w260 { 403 .w260 {
498 width: 260px; 404 width: 260px;
499 } 405 }
500
501 .lp-overview { 406 .lp-overview {
502 transition: 0.5s; 407 transition: 0.5s;
503 flex: 1; 408 flex: 1;
...@@ -507,17 +412,14 @@ export default { ...@@ -507,17 +412,14 @@ export default {
507 margin-right: 10px; 412 margin-right: 10px;
508 box-sizing: border-box; 413 box-sizing: border-box;
509 } 414 }
510
511 .lp-legend { 415 .lp-legend {
512 transition: 0.5s; 416 transition: 0.5s;
513 height: 100%; 417 height: 100%;
514 font-size: 14px; 418 font-size: 14px;
515
516 .handleCol { 419 .handleCol {
517 width: 34px; 420 width: 34px;
518 float: right; 421 float: right;
519 height: 100%; 422 height: 100%;
520
521 .btn { 423 .btn {
522 cursor: pointer; 424 cursor: pointer;
523 height: 40px; 425 height: 40px;
...@@ -527,14 +429,12 @@ export default { ...@@ -527,14 +429,12 @@ export default {
527 color: #fff; 429 color: #fff;
528 border-bottom: 1px solid #e6e6e6; 430 border-bottom: 1px solid #e6e6e6;
529 } 431 }
530
531 .dyzt, 432 .dyzt,
532 .fwxz, 433 .fwxz,
533 .fwyt, 434 .fwyt,
534 .qsx { 435 .qsx {
535 height: 122px; 436 height: 122px;
536 } 437 }
537
538 .dyzt, 438 .dyzt,
539 .fwxz, 439 .fwxz,
540 .fwyt, 440 .fwyt,
...@@ -566,7 +466,9 @@ export default { ...@@ -566,7 +466,9 @@ export default {
566 466
567 .legendTable { 467 .legendTable {
568 margin-top: -1px; 468 margin-top: -1px;
569 469 border-color: #e4ebf4 !important;
470 border-collapse: collapse;
471 border-spacing: 0;
570 tr { 472 tr {
571 height: 40px; 473 height: 40px;
572 line-height: 40px; 474 line-height: 40px;
...@@ -585,6 +487,15 @@ export default { ...@@ -585,6 +487,15 @@ export default {
585 height: 40px; 487 height: 40px;
586 text-align: center; 488 text-align: center;
587 white-space: nowrap; 489 white-space: nowrap;
490 .circle{
491 display: inline-block;
492 width: 12px;
493 height: 12px;
494 border-radius: 6px;
495 margin-right: 2px;
496 position: relative;
497 top: 1px;
498 }
588 } 499 }
589 500
590 td:first-child { 501 td:first-child {
...@@ -596,46 +507,5 @@ export default { ...@@ -596,46 +507,5 @@ export default {
596 } 507 }
597 } 508 }
598 } 509 }
599
600 .tab-content::-webkit-scrollbar {
601 width: 1px;
602 }
603
604 .btnGroup {
605 margin: 20px auto 0;
606 width: 260px;
607 }
608
609 .hbjDialog {
610 /deep/ .el-dialog {
611 margin-top: 10vh !important;
612 }
613 }
614
615 .fa {
616 padding-right: 4px;
617 }
618
619 .wrap {
620 width: 100%;
621 height: 30px;
622 position: relative;
623
624 .main-button {
625 display: -webkit-flex;
626 display: flex;
627 flex-direction: column-reverse;
628 flex-wrap: nowrap;
629 position: absolute;
630 left: 165px;
631 top: 18px;
632 }
633
634 .download {
635 position: absolute;
636 left: 312px;
637 top: 19px;
638 }
639 }
640 } 510 }
641 </style> 511 </style>
......
1 <!--
2 * @Author: yangwei
3 * @Date: 2023-02-28 15:47:12
4 * @LastEditors: yangwei
5 * @LastEditTime: 2023-03-02 16:35:36
6 * @FilePath: \bdcdj-web\src\views\lpb\lpbContent\ch.vue
7 * @Description:
8 *
9 * Copyright (c) 2023 by ${git_name_email}, All Rights Reserved.
10 -->
11 <template>
12 <div class="ch-wrap">
13 <table
14 class="chTable"
15 ref="ch"
16 border="1"
17 cellspacing="0"
18 cellpadding="0"
19 v-show="ch.length"
20 >
21 <tr v-for="(cs, csIndex) in ch" :key="csIndex">
22 <!-- 显示层数 -->
23 <td
24 class="floor"
25 ref="cBsm"
26 @contextmenu.prevent="openMenu($event, cs, 'c')"
27 @click="handleClickC($event, cs)"
28 >
29 {{ cs.sjc }}
30 </td>
31 <!-- 显示户 -->
32 <td
33 v-for="(hs, hsIndex) in cs.hs"
34 :rowspan="hs.sjcs"
35 :colspan="hs.sjhs"
36 :data-bsm="hs.bsm"
37 :data-qszt="hs.qszt"
38 ref="hBsm"
39 :key="hsIndex"
40 style="border-color: rgb(230, 230, 230)"
41 :class="hs.select ? 'tdSelect' : ''"
42 @click="handleClickH($event.target, hs.bsm, hs)"
43 @dblclick="dbclick(hs.bsm)"
44 @contextmenu.prevent="openMenu($event, hs, 'h')"
45 >
46 {{ hs.shbw }}
47 <span @click.stop="" class="hqszt lin" v-show="hs.qszt == '0'"
48 ></span
49 >
50 <span @click.stop="" class="hqszt zheng" v-show="hs.qszt == '1'"
51 ></span
52 >
53 <span @click.stop="" class="hqszt xian" v-show="hs.qszt == '2'"
54 ></span
55 >
56 <ul @click.stop="hDyztClick($event, hs.bsm, hs)" class="dyzt">
57 <li style="background-color: #6edee1" v-show="hs.qqzt == '1'">
58
59 </li>
60 <li style="background-color: #8adc88" v-show="hs.bazt == '1'">
61
62 </li>
63 <li style="background-color: #ff8282" v-show="hs.dyzt == '1'">
64
65 </li>
66 <li style="background-color: #d7cecf" v-show="hs.cfzt == '1'">
67
68 </li>
69 <li style="background-color: #d4a3eb" v-show="hs.yyzt == '1'">
70
71 </li>
72 <li style="background-color: #a5a3fb" v-show="hs.xzzt == '1'">
73
74 </li>
75 </ul>
76 </td>
77 </tr>
78 </table>
79 </div>
80 </template>
81
82 <script>
83 export default {
84 name: "BdcdjWebCh",
85 inject: ["openMenu", "selectAll"],
86 props: {
87 ch: {
88 type: Array,
89 default: function () {
90 return [];
91 },
92 },
93 },
94 data() {
95 return {
96 //选中户bsm合集
97 hbsmList: [],
98 //选中层bsm合集
99 cbsmList: [],
100 //选中户qszt集合
101 hqsztList: [],
102 //区分单双击事件的定时器
103 time: null,
104 };
105 },
106 mounted() {},
107 methods: {
108 // 层选中事件
109 handleClickC(e, item) {
110 //判断点击的层是否选中
111 if (e.target.className.indexOf("tdSelect") == -1) {
112 //未选中→选中
113 e.target.className += " tdSelect"; //加边框
114 this.cbsmList.push(item.bsm);
115 } else {
116 //选中→未选中
117 e.target.className = "floor";
118 this.cbsmList = this.cbsmList.filter((i) => i != item.bsm);
119 }
120 // this.$parent.getCbsm(this.cbsmList);
121 },
122 //户单击事件
123 handleClickH(e, bsm, hs) {
124 let self = this;
125 // 开启延时器,200ms的间隔区分单击和双击,解决双击时执行两次单击事件
126 clearTimeout(self.time);
127 self.time = setTimeout(() => {
128 // this.closeMenu();
129 //判断点击的户是否选中
130 if (!hs.select) {
131 //未选中→选中
132 hs.select = true; //加边框
133 this.hbsmList.push(bsm); // 将户bsm放进hbsmList
134 this.hqsztList.push(hs.qszt); // 将户qszt放进hqsztList
135 } else {
136 //选中→未选中
137 hs.select = false;
138 this.hbsmList = this.hbsmList.filter((i) => i != bsm);
139 this.hqsztList = this.hqsztList.filter((i) => i != hs.qszt);
140 }
141 }, 200);
142 },
143 // 户单元状态点击事件
144 hDyztClick(e, bsm, hs) {
145 this.handleClickH(e.target.parentNode, bsm, hs);
146 },
147 //户双击事件
148 dbclick(bsm) {
149 clearTimeout(this.time);
150 },
151 //幢单元全选/反选
152 zdySelectAll(val) {
153 this.ch.forEach((c) => {
154 c.hs.forEach((h) => {
155 if (val) {
156 h.select = true;
157 // 使用hbsmList时,需要去重
158 this.hbsmList.push(h.bsm)
159 } else {
160 h.select = false;
161 this.hbsmList = []
162 }
163 });
164 });
165 },
166 },
167 watch: {
168 selectAll: {
169 handler(val) {
170 this.zdySelectAll(val.selectAll);
171 },
172 immediate: true,
173 deep: true,
174 },
175 },
176 };
177 </script>
178
179 <style lang="scss" scoped>
180 .ch-wrap {
181 display: flex;
182 flex-direction: column-reverse;
183 .chTable {
184 margin-left: -1px;
185 border-color: #e4ebf4 !important;
186 border-collapse: collapse;
187 border-spacing: 0;
188 // position: relative;
189 tr {
190 td {
191 min-width: 138px;
192 height: 72px;
193 line-height: 72px;
194 text-align: center;
195 cursor: pointer;
196 position: relative;
197 .hqszt {
198 display: inline-block;
199 width: 16px;
200 height: 16px;
201 font-size: 12px;
202 line-height: 16px;
203 position: absolute;
204 left: 6px;
205 top: 6px;
206 border: 1px solid;
207 border-radius: 8px;
208 }
209 .lin {
210 color: #f7b500;
211 border-color: #f7b500;
212 }
213 .zheng {
214 color: #1ad6e1;
215 border-color: #1ad6e1;
216 }
217 .xian {
218 color: #45aefd;
219 border-color: #45aefd;
220 }
221 .dyzt {
222 user-select: none;
223 width: 138px;
224 height: 18px;
225 position: absolute;
226 bottom: 32px;
227 box-sizing: border-box;
228 padding: 0 6px;
229 li {
230 display: inline-block;
231 width: 18px;
232 height: 18px;
233 font-size: 12px;
234 line-height: 18px;
235 color: #ffffff;
236 border: 1px solid;
237 border-radius: 9px;
238 }
239 }
240 }
241 .tdSelect {
242 border: 1px solid #006cff !important;
243 background-image: url("./images/tdSelect.png");
244 background-repeat: no-repeat;
245 background-position: right top;
246 background-size: 30px;
247 }
248 .hasBorder {
249 border-width: 1px;
250 border-style: solid;
251 }
252 }
253 }
254 }
255 </style>
1 <template> 1 <template>
2 <div class="lpbContent-wrap" ref="lpbContentWrap"> 2 <div class="lpbContent-wrap" ref="lpbContentWrap">
3 <div class="lpbContent" ref="lpbContent"> 3 <div class="lpbContent">
4 <div :class=" 4 <!-- 纵向倒序排列 逻辑幢位于独立幢单元和独立层户的上方 -->
5 lpbData.cs.length == 0 && lpbData.zdys.length == 0 5 <div class="ch-zdy-wrap">
6 ? 'bottom40 ljz-wrap' 6 <!-- 幢单元 -->
7 : 'ljz-wrap' 7 <zdy-cpn v-if="lpbData.zdys.length" :zdys="lpbData.zdys" />
8 " :style="{ 'width': ljzWidth + 'px' }" v-show="lpbData.ljzs.length > 0"> 8 <!-- 独立层户 -->
9 <!-- 循环逻辑幢数据 --> 9 <ch-cpn v-if="lpbData.cs.length" :ch="lpbData.cs" />
10 <div class="ljz" ref="ljz" v-for="(ljzs, ljzIndex) in lpbData.ljzs" :key="ljzIndex"> 10 </div>
11 <!-- :class="[{ 'mt30': ljzIndex == 0 }, { 'mt60': ljzIndex == 1 || lpbData.ljzs.length == 1 }]" --> 11 <!-- 逻辑幢 -->
12 12 <ljzs-cpn v-if="lpbData.ljzs.length" :ljzs="lpbData.ljzs" />
13 <!-- :style="{'marginTop':ljzs.zdys.length>0?'0':'30px'}" --> 13 </div>
14 <!-- 循环逻辑幢下的幢单元 --> 14 <!-- 自然幢名称 -->
15 <div class="ljz-zdy-wrap" :style="{ 'marginTop': ljzs.zdys.length > 0 ? '0' : '30px' }"> 15 <p class="lpb-xmmc">
16 <div class="ljz-zdy column-reverse" 16 <el-checkbox @change="zdySelectAll($event)">{{
17 :style="{ 'min-height': ljzzdyHeight + 'px', 'marginRight': zdyIndex < (ljzs.zdys.length - 1) || ljzs.cs.length > 1 ? '20px' : '0' }" 17 lpbData.xmmc
18 ref="ljzzdy" v-show="ljzs.zdys.length > 0" v-for="(zdys, zdyIndex) in ljzs.zdys" :key="zdyIndex"> 18 }}</el-checkbox>
19 <!-- 幢单元名称 --> 19 </p>
20 <div class="zdy-name name"> 20 <!-- 右键菜单 -->
21 <p class="cp" @dblclick="openZxx(zdys.bsm, 'zdy')"> 21 <ul
22 <el-checkbox @change='zdySelectAll($event, zdys.cs)'>{{ zdys.zdymc }}</el-checkbox> 22 v-show="lpbChVisible"
23 </p> 23 :style="{ left: lpbChLeft + 'px', top: lpbChTop + 'px' }"
24 </div> 24 class="contextmenu"
25 25 >
26 <!-- 循环幢单元下的层户 --> 26 <li @click="menuClick">菜单一</li>
27 <!-- <div class="chTable-wrap"> --> 27 <li @click="menuClick">菜单二</li>
28 <table class="chTable psr" border="0" cellspacing="0" cellpadding="0" v-show="zdys.cs.length > 0"> 28 </ul>
29 <tr v-for="(cs, csIndex) in zdys.cs" :key="csIndex"> 29 </div>
30 <!-- 显示层数 -->
31 <td class="floor" ref="cBsm" @contextmenu.prevent="openMenu($event, cs, 'c')"
32 @click="handleClickC($event, cs)" @dblclick="openZxx(cs.bsm, 'c')">
33 {{ cs.sjc }}
34 </td>
35 <!-- 显示户 -->
36 <td v-for="(hs, hsIndex) in cs.hs" :rowspan="hs.sjcs" :colspan="hs.sjhs" :data-bsm="hs.bsm"
37 :data-qszt="hs.qszt" ref="hBsm" :key="hsIndex"
38 :class="searchNum == hs.shbw || searchNum == hs.bdcdyh ? 'tdSelect' : ''"
39 @click="handleTdClick($event.target, hs.bsm, hs)" @dblclick="dbclick(hs.bsm)"
40 @contextmenu.prevent="openMenu($event, hs, 'h')">
41 {{ hs.shbw }}
42 <span @click.stop="dyztIconClick" class="hqszt lin" v-show="hs.qszt == '0'"></span>
43 <span @click.stop="dyztIconClick" class="hqszt zheng" v-show="hs.qszt == '1'"></span>
44 <span @click.stop="dyztIconClick" class="hqszt xian" v-show="hs.qszt == '2'"></span>
45 <ul class="dyzt" @click.stop="hDyztClick($event, hs.bsm, hs)">
46 <li style="background-color:#6EDEE1" v-show="hs.qqzt == '1'" @click.stop="dyztIconClick"></li>
47 <li style="background-color:#8ADC88" v-show="hs.bazt == '1'" @click.stop="dyztIconClick"></li>
48 <li style="background-color:#FF8282" v-show="hs.dyzt == '1'" @click.stop="dyztIconClick"></li>
49 <li style="background-color:#D7CECF" v-show="hs.cfzt == '1'" @click.stop="dyztIconClick"></li>
50 <li style="background-color:#D4A3EB" v-show="hs.yyzt == '1'" @click.stop="dyztIconClick"></li>
51 <li style="background-color:#A5A3FB" v-show="hs.xzzt == '1'" @click.stop="dyztIconClick"></li>
52 </ul>
53 </td>
54 </tr>
55 </table>
56
57 <!-- </div> -->
58 </div>
59 </div>
60 <!-- 循环逻辑幢下的层户 -->
61 <div class="ljz-ch" ref="ljzDlch"
62 :style="{ height: 'auto', marginTop: (ljzs.zdys.length > 0 ? '39' : 0) + 'px' }" v-if="ljzs.cs.length > 0">
63 <table class="chTable prs" :style="{
64 top:
65 ljzzdyHeight + 40 - ljzs.cs.length * 65 < 0
66 ? 0
67 : ljzzdyHeight + 40 - ljzs.cs.length * 65 + 'px',
68 }" border="1" cellspacing="0" cellpadding="0">
69 <tr v-for="cs in ljzs.cs" :key="cs.bsm">
70 <!-- 显示层数 -->
71 <td class="floor" ref="cBsm" @contextmenu.prevent="openMenu($event, cs, 'c')"
72 @click="handleClickC($event, cs)" @dblclick="openZxx(cs.bsm, 'c')">
73 {{ cs.sjc }}
74 </td>
75 <!-- 显示户 -->
76 <td v-for="(hs, hsIndex) in cs.hs" :rowspan="hs.sjcs" :colspan="hs.sjhs" :data-bsm="hs.bsm"
77 :data-qszt="hs.qszt" ref="hBsm" :key="hsIndex"
78 :class="searchNum == hs.shbw || searchNum == hs.bdcdyh ? 'tdSelect' : ''"
79 @click="handleTdClick($event.target, hs.bsm, hs)" @dblclick="dbclick(hs.bsm)"
80 @contextmenu.prevent="openMenu($event, hs, 'h')">
81 {{ hs.shbw }}
82 <span @click.stop="dyztIconClick" class="hqszt lin" v-show="hs.qszt == '0'"></span>
83 <span @click.stop="dyztIconClick" class="hqszt zheng" v-show="hs.qszt == '1'"></span>
84 <span @click.stop="dyztIconClick" class="hqszt xian" v-show="hs.qszt == '2'"></span>
85 <ul class="dyzt" @click.stop="hDyztClick($event, hs.bsm, hs)">
86 <li style="background-color:#6EDEE1" v-show="hs.qqzt == '1'" @click.stop="dyztIconClick"></li>
87 <li style="background-color:#8ADC88" v-show="hs.bazt == '1'" @click.stop="dyztIconClick"></li>
88 <li style="background-color:#FF8282" v-show="hs.dyzt == '1'" @click.stop="dyztIconClick"></li>
89 <li style="background-color:#D7CECF" v-show="hs.cfzt == '1'" @click.stop="dyztIconClick"></li>
90 <li style="background-color:#D4A3EB" v-show="hs.yyzt == '1'" @click.stop="dyztIconClick"></li>
91 <li style="background-color:#A5A3FB" v-show="hs.xzzt == '1'" @click.stop="dyztIconClick"></li>
92 </ul>
93 </td>
94 </tr>
95 </table>
96 </div>
97 <!-- 逻辑幢名称 -->
98 <div class="ljz-name name">
99 <p class="cp" @dblclick="openZxx(ljzs.bsm, 'ljz')">
100 {{ ljzs.ljzmc }}
101 </p>
102 </div>
103 </div>
104 </div>
105 <div class="zdy-wrap"
106 :style="{ width: zdyWidth + 'px', marginTop: (lpbData.zdys.length > 0 || lpbData.cs.length > 0) ? '30px' : '0' }">
107 <!-- 循环自然幢下的幢单元 -->
108 <div class="zdy column-reverse" ref="zdy" v-for="(zdys, zdyIndex) in lpbData.zdys" :key="zdyIndex"
109 :style="{ 'min-height': zdyHeight + 'px' }">
110 <!-- 幢单元名称 -->
111 <div class="zdy-name name">
112 <p class="cp" @dblclick="openZxx(zdys.bsm, 'zdy')">
113 <el-checkbox @change='zdySelectAll($event, zdys.cs)'>{{ zdys.zdymc }}</el-checkbox>
114 </p>
115 </div>
116 <!-- 循环幢单元下的层户 -->
117 <table class="chTable" border="1" cellspacing="0" cellpadding="0" v-show="zdys.cs.length > 0">
118 <tr v-for="(cs, csIndex) in zdys.cs" :key="csIndex">
119 <!-- 显示层数 -->
120 <td class="floor" ref="cBsm" @contextmenu.prevent="openMenu($event, cs, 'c')"
121 @click="handleClickC($event, cs)" @dblclick="openZxx(cs.bsm, 'c')">
122 {{ cs.sjc }}
123 </td>
124 <!-- 显示户 -->
125 <td v-for="(hs, hsIndex) in cs.hs" :rowspan="hs.sjcs" :colspan="hs.sjhs" :data-bsm="hs.bsm"
126 :data-qszt="hs.qszt" ref="hBsm" :key="hsIndex"
127 :class="searchNum == hs.shbw || searchNum == hs.bdcdyh ? 'tdSelect' : ''"
128 @click="handleTdClick($event.target, hs.bsm, hs)" @dblclick="dbclick(hs.bsm)"
129 @contextmenu.prevent="openMenu($event, hs, 'h')">
130 {{ hs.shbw }}
131 <span @click.stop="dyztIconClick" class="hqszt lin" v-show="hs.qszt == '0'"></span>
132 <span @click.stop="dyztIconClick" class="hqszt zheng" v-show="hs.qszt == '1'"></span>
133 <span @click.stop="dyztIconClick" class="hqszt xian" v-show="hs.qszt == '2'"></span>
134 <ul class="dyzt" @click.stop="hDyztClick($event, hs.bsm, hs)">
135 <li style="background-color:#6EDEE1" v-show="hs.qqzt == '1'" @click.stop="dyztIconClick"></li>
136 <li style="background-color:#8ADC88" v-show="hs.bazt == '1'" @click.stop="dyztIconClick"></li>
137 <li style="background-color:#FF8282" v-show="hs.dyzt == '1'" @click.stop="dyztIconClick"></li>
138 <li style="background-color:#D7CECF" v-show="hs.cfzt == '1'" @click.stop="dyztIconClick"></li>
139 <li style="background-color:#D4A3EB" v-show="hs.yyzt == '1'" @click.stop="dyztIconClick"></li>
140 <li style="background-color:#A5A3FB" v-show="hs.xzzt == '1'" @click.stop="dyztIconClick"></li>
141 </ul>
142 </td>
143 </tr>
144 </table>
145 </div>
146 <!-- 循环自然幢下的独立层户 -->
147 <!-- <template > -->
148 <div class="zdy column-reverse" ref="zrzDlch" :style="{ 'min-height': cHeight + 'px' }">
149 <table class="chTable" ref="ch" border="1" cellspacing="0" cellpadding="0"
150 v-show="lpbData.cs != null && lpbData.cs.length > 0">
151 <tr v-for="(cs, csIndex) in lpbData.cs" :key="csIndex">
152 <!-- 显示层数 -->
153 <td class="floor" ref="cBsm" @contextmenu.prevent="openMenu($event, cs, 'c')"
154 @click="handleClickC($event, cs)" @dblclick="openZxx(cs.bsm, 'c')">
155 {{ cs.sjc }}
156 </td>
157 <!-- 显示户 -->
158 <td v-for="(hs, hsIndex) in cs.hs" :rowspan="hs.sjcs" :colspan="hs.sjhs" :data-bsm="hs.bsm"
159 :data-qszt="hs.qszt" ref="hBsm" :key="hsIndex"
160 :class="searchNum == hs.shbw || searchNum == hs.bdcdyh ? 'tdSelect' : ''"
161 @click="handleTdClick($event.target, hs.bsm, hs)" @dblclick="dbclick(hs.bsm)"
162 @contextmenu.prevent="openMenu($event, hs, 'h')">
163 {{ hs.shbw }}
164 <span @click.stop="dyztIconClick" class="hqszt lin" v-show="hs.qszt == '0'"></span>
165 <span @click.stop="dyztIconClick" class="hqszt zheng" v-show="hs.qszt == '1'"></span>
166 <span @click.stop="dyztIconClick" class="hqszt xian" v-show="hs.qszt == '2'"></span>
167 <ul class="dyzt" @click.stop="hDyztClick($event, hs.bsm, hs)">
168 <li style="background-color:#6EDEE1" v-show="hs.qqzt == '1'" @click.stop="dyztIconClick"></li>
169 <li style="background-color:#8ADC88" v-show="hs.bazt == '1'" @click.stop="dyztIconClick"></li>
170 <li style="background-color:#FF8282" v-show="hs.dyzt == '1'" @click.stop="dyztIconClick"></li>
171 <li style="background-color:#D7CECF" v-show="hs.cfzt == '1'" @click.stop="dyztIconClick"></li>
172 <li style="background-color:#D4A3EB" v-show="hs.yyzt == '1'" @click.stop="dyztIconClick"></li>
173 <li style="background-color:#A5A3FB" v-show="hs.xzzt == '1'" @click.stop="dyztIconClick"></li>
174 </ul>
175 </td>
176 </tr>
177 </table>
178 </div>
179 </div>
180 <!-- 层户 -->
181 <div class="zrz" :style="{ width: lpbContentWidth + 'px' }">
182 <el-checkbox v-model="zrzChecked" @change='lpbSelectAll'>{{ lpbData.xmmc }}</el-checkbox>
183 </div>
184 </div>
185 <!-- 双击户的弹出框 -->
186 <el-dialog :close-on-click-modal="false" title="户编辑" class="hbjDialog" :visible.sync="hbjVisible" width="80%">
187 <hbj ref="hbj" :bsm="hbsm" :scyclx="scyclx" :lpbParent="lpbParent"></hbj>
188 </el-dialog>
189 </div>
190 </template> 30 </template>
191 <script> 31 <script>
192 import { getLpb } from '@/api/lpb' 32 import { getLpb } from "@/api/lpb";
33 import chCpn from "./ch.vue";
34 import zdyCpn from "./zdys.vue";
35 import ljzsCpn from "./ljzs.vue";
193 export default { 36 export default {
194 name: "", 37 provide() {
195 components: { }, 38 return {
196 props: { 39 openMenu: this.openMenu,
197 zrzbsm: { 40 selectAll: this.selectAllObj,
198 type: String, 41 };
199 default: '' 42 },
200 }, 43 name: "",
201 lpbParent: { 44 components: { chCpn, zdyCpn, ljzsCpn },
202 type: String, 45 props: {
203 default: 'isLpb' 46 zrzbsm: {
204 }, 47 type: String,
205 isHb: { 48 default: "",
206 type: Boolean, 49 },
207 default: true 50 lpbParent: {
208 }, 51 type: String,
209 }, 52 default: "isLpb",
210 data () { 53 },
211 return { 54 isHb: {
212 lpbData: { 55 type: Boolean,
213 ljzs: [], 56 default: true,
214 cs: [], 57 },
215 zdys: [], 58 },
216 }, 59 data() {
217 hbjVisible: false, 60 return {
218 lpbContentWidth: 0, 61 lpbData: {
219 ljzWidth: 10000, 62 ljzs: [],
220 zdyWidth: 1000, 63 cs: [],
221 cHeight: 0, //独立层户的div高度 64 zdys: [],
222 zdyHeight: 0, //独立幢单元的div高度 65 },
223 ljzcHeight: 0, //逻辑幢下层户的div高度 66 //户全选标识 由于依赖注入的绑定并不是可响应的,所以传入可监听的对象以获取其属性的响应
224 ljzzdyHeight: 0, //逻辑幢下幢单元的div高度 67 selectAllObj: {
225 loading: true, 68 selectAll: false,
226 hbsm: '', 69 },
227 hbsmList: [], 70 //层户右键菜单显隐
228 hqsztList: [], 71 lpbChVisible: false,
229 cbsmList: [], 72 //右键菜单定位位置
230 time: null, //区分单双击事件的定时器 73 lpbChLeft: 100,
231 searchNum: Math.random(), 74 lpbChTop: 100,
232 //接收父组件传入的根据单元状态/房屋性质/房屋用途筛选的户bsmList 75 };
233 choosedList: [], 76 },
234 borderColor: "#E6E6E6", 77 mounted() {
235 lpbChVisible: false, //层户右键菜单显隐 78 this.getLpb("dfc08a0cc6a25188990ea53d1d2c500e");
236 lpbChLeft: 100, 79 // setTimeout(() => {
237 lpbChTop: 100, 80 // //让滚动条滚动至最下面 -6是横向滚动条的高度
238 //右键层户数据 81 // this.$refs.lpbContent.scrollTop =
239 chData: "", 82 // this.$refs.lpbContent.scrollHeight -
240 rightClickFlag: "", 83 // this.$refs.lpbContent.clientHeight -
241 84 // 6;
242 formLabelWidth: "120px", 85 // }, 200);
243 yclpbData: {}, 86 // window.lpbContent = this;
244 sclpbData: {}, 87 },
245 88 methods: {
246 89 //全选户
247 zrzChecked: false, //自然幢全选 90 zdySelectAll(val) {
248 }; 91 this.selectAllObj.selectAll = val;
249 }, 92 },
250 mounted () { 93 //获取楼盘表数据
251 this.getLpb(this.zrzbsm ? this.zrzbsm : '9434bdb243ba342cc6c043065fc9e480'); 94 getLpb(zrzbsm, scyclx, actual) {
252 setTimeout(() => { 95 getLpb(zrzbsm, scyclx).then((res) => {
253 //让滚动条滚动至最下面 -6是横向滚动条的高度 96 if (res.code == 200) {
254 this.$refs.lpbContent.scrollTop = 97 res.result.ljzs = res.result.ljzs.sort(this.compare("place"));
255 this.$refs.lpbContent.scrollHeight - 98 this.lpbData = res.result == null ? this.lpbData : res.result;
256 this.$refs.lpbContent.clientHeight - 99 // this.$nextTick(() => {
257 6; 100 // //渲染楼盘表
258 }, 200); 101 // this.dataChange();
259 window.lpbContent = this; 102 // });
260 }, 103 console.log(this.lpbData, "this.lpbData");
261 methods: { 104 } else {
262 loadingData (zrzbsm, scyclx) { 105 this.$message({
263 this.getLpb(zrzbsm, scyclx, true); 106 message: res.message,
264 }, 107 type: "warning",
265 //获取楼盘表数据 108 });
266 getLpb (zrzbsm, scyclx, actual) { 109 }
267 getLpb(zrzbsm, scyclx).then((res) => { 110 });
268 if (res.code == 200) { 111 },
269 res.result.ljzs = res.result.ljzs 112 //户右键点击事件
270 .sort(this.compare("place")) 113 openMenu(e, item, type) {
271 .reverse(); 114 this.lpbChLeft = e.pageX - 96;
272 this.lpbData = res.result == null ? this.lpbData : res.result; 115 this.lpbChTop = e.pageY - 23;
273 this.$nextTick(() => { 116 this.lpbChVisible = true;
274 //渲染楼盘表 117 },
275 this.dataChange(); 118 //关闭户右键菜单
276 }); 119 closeMenu() {
277 } else { 120 this.lpbChVisible = false;
278 this.$message({ 121 },
279 message: res.message, 122 //右键菜单点击
280 type: "warning", 123 menuClick() {
281 }); 124 this.closeMenu();
282 } 125 },
283 }); 126 compare(property) {
284 }, 127 return function (a, b) {
285 compare (property) { 128 var value1 = a[property];
286 return function (a, b) { 129 var value2 = b[property];
287 var value1 = a[property]; 130 return value1 - value2;
288 var value2 = b[property]; 131 };
289 return value1 - value2; 132 },
290 }; 133 },
291 }, 134 watch: {
292 //按照bdcdyh或shbw筛选户 135 //户右键菜单显示时,监听到鼠标点击时关闭户右键菜单
293 lpbDataMap (sh) { 136 lpbChVisible(value) {
294 this.searchNum = sh; 137 if (value) {
295 if (this.hbsmList.length > 0) { 138 document.body.addEventListener("click", this.closeMenu);
296 //清除之前选中户 139 } else {
297 this.clearChoosedH(); 140 document.body.removeEventListener("click", this.closeMenu);
298 } 141 }
299 // console.log("查询searchNum" + searchNum); 142 },
300 }, 143 },
301 //自然幢下元素高度宽度计算
302 dataChange () {
303 //计算逻辑幢宽度 20为marginRight值
304 this.ljzWidth = 0;
305 if (this.$refs.ljzzdy != undefined) {
306 this.$refs.ljzzdy.forEach((item) => {
307 this.ljzWidth += item.offsetWidth + 20;
308 });
309 if (this.$refs.ljzDlch != undefined) {
310 this.$refs.ljzDlch.forEach((item) => {
311 this.ljzWidth += item.offsetWidth;
312 });
313 }
314 } else {
315 if (this.$refs.ljzDlch != undefined) {
316 this.$refs.ljzDlch.forEach((item) => {
317 this.ljzWidth += item.offsetWidth + 20;
318 });
319 }
320 }
321 //计算独立幢单元和独立层户宽度
322 //考虑this.$refs.zdy的length为0的情况,即自然幢下没有独立幢单元
323 if (this.$refs.zdy != undefined && this.$refs.zdy.length > 0) {
324 //判断自然幢下有没有比层户高的幢单元
325 let higher = true;
326 //记录最高的幢单元高度 默认为第一个幢单元高度
327 let highest = this.$refs.zdy[0].offsetHeight;
328 this.zdyWidth = 20;
329 this.$refs.zdy.forEach((item) => {
330 this.zdyWidth += item.offsetWidth + 21;
331 this.cHeight =
332 item.offsetHeight > this.cHeight ? item.offsetHeight : this.cHeight;
333 highest = highest > item.offsetHeight ? highest : item.offsetHeight;
334 });
335 //判断有无独立层户
336 if (this.$refs.ch != undefined) {
337 //计算自然幢下的幢单元高度,如果有比层户高的幢单元,则幢单元高度设为最高的幢单元高度,如果没有,则设为层户高度
338 higher = highest > this.$refs.ch.offsetHeight ? true : false;
339 this.zdyHeight = higher ? highest : this.$refs.ch.offsetHeight;
340 highest = 0;
341 this.zdyWidth += this.$refs.ch.offsetWidth;
342 } else {
343 this.zdyHeight = highest;
344 highest = 0;
345 }
346 } else {
347 //有且仅有独立层户
348 if (this.$refs.zrzDlch != undefined) {
349 this.zdyWidth = this.$refs.zrzDlch.offsetWidth + 20;
350 }
351 }
352 //计算逻辑幢下的幢单元和层户的高度
353 this.ljzzdyHeight = 0;
354 if (this.$refs.ljzzdy != undefined && this.$refs.ljzzdy.length > 0) {
355 //判断自然幢下有没有比层户高的幢单元
356 let higher = true;
357 let zrzhighest = 0;
358 //记录最高的幢单元高度 默认为第一个幢单元高度
359 zrzhighest = this.$refs.ljzzdy[0].offsetHeight;
360 this.$refs.ljzzdy.forEach((item) => {
361 this.ljzcHeight = item.offsetHeight > this.ljzcHeight ? item.offsetHeight : this.ljzcHeight;
362 zrzhighest = zrzhighest > item.offsetHeight ? zrzhighest : item.offsetHeight;
363 });
364 //判断有无独立层户
365 if (this.$refs.ljzch != undefined) {
366 //计算自然幢下的幢单元高度,如果有比层户高的幢单元,则幢单元高度设为最高的幢单元高度,如果没有,则设为层户高度
367 higher = zrzhighest > this.$refs.ljzch.offsetHeight ? true : false;
368 this.$nextTick(() => {
369 this.ljzzdyHeight = higher ? zrzhighest : this.$refs.ljzch.offsetHeight;
370 zrzhighest = 0;
371 });
372 } else {
373 this.$nextTick(() => {
374 this.ljzzdyHeight = zrzhighest;
375 zrzhighest = 0;
376 });
377 }
378 } else {
379
380 }
381 this.$nextTick(() => {
382 this.lpbContentWidth = this.zdyWidth > this.ljzWidth ? this.zdyWidth - 20 : this.ljzWidth - 20;
383 if (this.lpbContentWidth == 0) {
384 //his.lpbContentWidth = this.$refs.lpbContent.offsetWidth
385 }
386 })
387 },
388 //户单击事件
389 handleTdClick (e, bsm, hs) {
390 let self = this;
391 // 开启延时器,200ms的间隔区分单击和双击,解决双击时执行两次单击事件
392 clearTimeout(self.time);
393 self.time = setTimeout(() => {
394 this.closeMenu()
395 //判断点击的户是否选中
396 if (e.className.indexOf("tdSelect") == -1) {
397 //未选中→选中
398 e.className = "tdSelect"; //加边框
399 this.hbsmList.push(bsm); // 将户bsm放进hbsmList
400 this.hqsztList.push(hs.qszt); // 将户qszt放进hqsztList
401 switch (this.lpbParent) {
402 case 'isHbfg':
403 self.fghbChoosedList.push(hs);
404 break;
405 case 'isFwsxbg':
406
407 break;
408 case 'isCxlz':
409
410 break;
411 case 'isLpb':
412 break;
413 default:
414 break;
415 }
416 } else {
417 //选中→未选中
418 e.className = "";
419 this.hbsmList = this.hbsmList.filter(i => i != bsm);
420 this.hqsztList = this.hqsztList.filter(i => i != hs.qszt);
421 switch (this.lpbParent) {
422 case 'isHbfg':
423 self.fghbChoosedList = self.fghbChoosedList.filter(i => i != hs)
424 break;
425 case 'isFwsxbg':
426
427 break;
428 case 'isCxlz':
429
430 break;
431 case 'isLpb':
432 this.hbsmList = this.hbsmList.filter(i => i != bsm);
433 this.hqsztList = this.hqsztList.filter(i => i != hs.qszt);
434 this.$parent.getHbsm(this.hbsmList, false);
435 this.$parent.getQsztList(this.hqsztList, false);
436 break;
437
438 default:
439 break;
440 }
441 }
442 }, 200);
443 },
444 //户双击事件
445 dbclick (bsm) {
446 clearTimeout(this.time);
447 this.hbsm = bsm;
448 this.$store.state.hbsm = bsm;
449 this.hbjVisible = true;
450 this.$nextTick(function () {
451 this.$refs.hbj.$refs.hbj.getHInfo(this.hbsm);
452 });
453 },
454 //删除多重数组中的某一项
455 deleteArrOption (arr, item) {
456 for (var i = arr.length; i > 0; i--) {
457 if (arr[i - 1] == item) {
458 arr.splice(i - 1, 1);
459 }
460 }
461 },
462 //清除选中户
463 clearChoosedH () {
464 // this.$nextTick(() => {
465 //将每个选中的户的选中状态清除
466 this.$refs.hBsm.forEach((item) => {
467 if (item.className == "tdSelect") {
468 item.className = "";
469 }
470 });
471 // 清空hbsmList
472 this.hbsmList = [];
473 this.hqsztList = [];
474 // });
475 },
476 //户右键点击事件
477 openMenu (e, item, type) {
478 this.lpbChLeft = e.pageX;
479 this.lpbChTop = e.pageY;
480 this.chData = item;
481 switch (this.lpbParent) {
482 case 'isHbfg':
483 break;
484 case 'isFwsxbg':
485 break;
486 case 'isCxlz':
487 break;
488 case 'isLpb':
489 this.rightClickFlag = type;
490 this.lpbChVisible = true;
491 break;
492
493 default:
494 break;
495 }
496 },
497 // 户单元状态点击事件
498 hDyztClick (e, bsm, hs) {
499 this.handleTdClick(e.target.parentNode, bsm, hs);
500 },
501 // 层选中事件
502 handleClickC (e, item) {
503 if (this.lpbParent == 'isLpb') {
504 //判断点击的层是否选中
505 if (e.target.className.indexOf("tdSelect") == -1) {
506 //未选中→选中
507 e.target.className += " tdSelect"; //加边框
508 this.cbsmList.push(item.bsm);
509 } else {
510 //选中→未选中
511 e.target.className = "floor";
512 this.deleteArrOption(this.cbsmList, item.bsm);
513 }
514 this.$parent.getCbsm(this.cbsmList);
515 } else {
516
517 }
518 },
519 //关闭右键菜单
520 closeMenu () {
521 this.lpbChVisible = false;
522 },
523 //end
524 //楼盘表户全选
525 lpbSelectAll (val) {
526 if (val) {
527 this.$refs.hBsm.forEach((item) => {
528 item.className = "tdSelect";
529 this.hbsmList.push(item.dataset.bsm); // 将户bsm放进hbsmList
530 this.hqsztList.push(item.dataset.qszt)
531 });
532 } else {
533 this.$refs.hBsm.forEach((item) => {
534 item.className = "";
535 this.hbsmList = [];
536 this.hqsztList = [];
537 });
538 }
539 this.$nextTick(() => {
540 this.$parent.getHbsm(this.hbsmList, false);
541 this.$parent.getQsztList(this.hqsztList, false);
542 })
543 },
544 //幢单元全选
545 zdySelectAll (val, cs) {
546 let zdyHbsmList = [];
547 let zdyHqsztList = [];
548 cs.forEach(i => {
549 i.hs.forEach(j => {
550 zdyHbsmList.push(j.bsm)
551 zdyHqsztList.push(j.qszt)
552 })
553 });
554 if (val) {
555 this.$nextTick(() => {
556 this.$refs.hBsm.forEach((item) => {
557 if (zdyHbsmList.indexOf(item.dataset.bsm) > -1) {
558 item.className = "tdSelect";
559 }
560 });
561 this.hbsmList = this.hbsmList.concat(zdyHbsmList);
562 this.hqsztList = this.hqsztList.concat(zdyHqsztList);
563 })
564 } else {
565 this.$refs.hBsm.forEach((item) => {
566 console.log(item.dataset.bsm);
567 if (zdyHbsmList.indexOf(item.dataset.bsm) > -1) {
568 item.className = "";
569 }
570 zdyHbsmList.forEach(j => {
571 if (item.dataset.bsm == j) {
572 this.hbsmList = this.hbsmList.filter(i => i != j)
573 }
574 })
575 zdyHqsztList.forEach(j => {
576 if (item.dataset.qszt == j) {
577 this.hqsztList = this.hqsztList.filter(i => i != j)
578 }
579 })
580 });
581 }
582 this.$nextTick(() => {
583 this.$parent.getHbsm(this.hbsmList, false);
584 this.$parent.getQsztList(this.hqsztList, false);
585 })
586 },
587 //逻辑幢、幢单元、层双击
588 openZxx (bsm, type) {
589 if (this.lpbParent == 'isLpb') {
590 this.$parent.taskTitle = '编辑';
591 this.$parent.dialogVisible = true;
592 this.$parent.curBsm = bsm;
593 this.$parent.menuType = type;
594 }
595 }
596 },
597 computed: {
598 createFlagChange () {
599 return this.$parent.createFlag;
600 },
601 legendToggleFlagChange () {
602 return this.$parent.legendToggleFlag;
603 },
604 scyclx () {
605 return this.$parent.scyclx;
606 },
607 },
608 watch: {
609 scyclx (n) {
610 this.hqsztList = [];
611 // this.getLpb(this.$store.state.zrzbsm, n);
612 if (n == '0') {
613 this.lpbData = this.yclpbData;
614 } else {
615 this.lpbData = this.sclpbData;
616 }
617 },
618 //监听有无通过输入框查询选择到的户,如果有,将其bsm放入hbsmList
619 searchNum (n) {
620 // 渲染查询到的户
621 this.$nextTick(() => {
622 this.$refs.hBsm.forEach((item) => {
623 if (item.className == "tdSelect") {
624 // console.log(item.offsetLeft,'offsetLeft');
625 // console.log(item.offsetTop,'offsetHeight');
626 //定位到最后一个户所在位置
627 this.$refs.lpbContent.scrollTop = item.offsetTop;
628 this.$refs.lpbContent.scrollLeft = item.offsetLeft;
629 console.log(item.dataset.bsm, "item.dataset.bsm");
630 // 判断hbsmList中是否已经存在
631 if (this.hbsmList.indexOf(item.dataset.bsm) == -1) {
632 this.hbsmList.push(item.dataset.bsm);
633 this.hqsztList.push(item.dataset.qszt);
634 }
635 }
636 });
637 });
638 },
639 //父组件中选择单元状态改变选中户的边框颜色
640 choosedList (n) {
641 if (n.length > 0) {
642 this.$refs.hBsm.forEach((item) => {
643 this.choosedList.forEach((i, ind) => {
644 if (item.dataset.bsm == i) {
645 if (ind == 0) {
646 //定位到第一个户所在位置
647 this.$refs.lpbContent.scrollTop = item.offsetTop;
648 this.$refs.lpbContent.scrollLeft = item.offsetLeft;
649 }
650 item.style.border = '1px solid ' + this.borderColor;
651 item.className = "tdSelect"
652 }
653 });
654 });
655 }
656 },
657 lpbChVisible (value) {
658 if (value) {
659 document.body.addEventListener("click", this.closeMenu);
660 } else {
661 document.body.removeEventListener("click", this.closeMenu);
662 }
663 },
664 },
665 }; 144 };
666 </script> 145 </script>
667 <style scoped lang="scss"> 146 <style scoped lang="scss">
668 .lpbContent-wrap { 147 .lpbContent-wrap {
669 width: 100%; 148 width: 100%;
670 height: 100%; 149 height: 100%;
671 overflow: hidden; 150 overflow: hidden;
672 151 .lpbContent {
673 .lpbContent { 152 width: 100%;
674 width: 100%; 153 height: calc(100% - 62px);
675 height: 100%; 154 position: relative;
676 position: relative; 155 overflow: scroll;
677 overflow: scroll; 156 -webkit-user-select: none;
678 -webkit-user-select: none; 157 -moz-user-select: none;
679 -moz-user-select: none; 158 -ms-user-select: none;
680 -ms-user-select: none; 159 user-select: none;
681 user-select: none; 160 display: flex;
682 161 flex-direction: column-reverse;
683 .ljz-wrap { 162 box-sizing: border-box;
684 height: auto; 163 padding-top: 20px;
685 overflow: hidden; 164 .ch-zdy-wrap {
686 165 display: flex;
687 .ljz { 166 flex-direction: row;
688 display: table; 167 }
689 168 }
690 // margin-top: 30px; 169 .lpb-xmmc {
691 .ljz-zdy-wrap { 170 border: 0;
692 width: auto; 171 border-top: 1px solid #e6e6e6;
693 display: table; 172 }
694 float: left; 173 // 自定义右键菜单样式
695 174 .contextmenu {
696 .ljz-zdy { 175 margin: 0;
697 height: auto; 176 background: #fff;
698 float: left; 177 width: 92px;
699 position: relative; 178 z-index: 3000;
700 179 position: fixed;
701 table { 180 list-style-type: none;
702 bottom: 40px; 181 padding: 5px 0;
703 } 182 border-radius: 4px;
704 183 font-size: 12px;
705 .zdy-name { 184 font-weight: 400;
706 width: 100%; 185 color: #333;
707 // bottom: 0; 186 box-shadow: 2px 2px 3px 0 rgba(0, 0, 0, 0.3);
708 // position: absolute; 187 li {
709 height: 40px; 188 margin: 0;
710 // background-color: rosybrown; 189 padding: 7px 16px;
711 // border:1px solid #E6E6E6 190 cursor: pointer;
712 } 191 position: relative;
713 192 .childUl {
714 // .chTable-wrap{ 193 display: none;
715 // position: absolute; 194 position: absolute;
716 // bottom: 40px; 195 left: 92px !important;
717 // } 196 top: 0 !important;
718 } 197 li {
719 } 198 width: 76px;
720 199 }
721 div:last-child { 200 }
722 margin-right: 0; 201 }
723 } 202 li:hover {
724 203 background: #eee;
725 .ljz-ch { 204 > .childUl {
726 float: left; 205 display: block;
727 } 206 }
728 207 }
729 .ljz-zdy:last-child { 208 .noEdit {
730 margin-right: 0; 209 color: #e6e6e6;
731 } 210 cursor: not-allowed;
732 211 }
733 .column-reverse { 212 .noEdit:hover {
734 display: flex; 213 background: #ffffff;
735 flex-direction: column-reverse; 214 }
736 } 215 }
737
738 // }
739 .ljz-name {
740 width: calc(100% - 32px);
741 height: 40px;
742 // background-color: darkorange;
743
744 }
745 }
746
747 .mt30 {
748 margin-top: 30px;
749 }
750
751 .mt60 {
752 margin-top: 60px;
753 }
754
755 div:last-child {
756 margin-right: 0;
757 }
758 }
759
760 .zdy-wrap {
761 height: auto;
762 overflow: hidden;
763
764 // margin-top: 30px;
765 .zdy {
766 float: left;
767 margin-right: 20px;
768
769 .zdy-zdy-wrap {
770 .zdy-zdy {
771 height: auto;
772 margin-right: 20px;
773 display: inline-table;
774
775 .zdy-name {
776 bottom: 0;
777 // background-color: blanchedalmond;
778 // border:1px solid #E6E6E6
779 }
780 }
781
782 .zdy-zdy:last-child {
783 margin-right: 0;
784 }
785 }
786
787 .zdy-name {
788 width: calc;
789 height: 40px;
790 // background-color: rosybrown;
791 border: 1px solid #E6E6E6
792 }
793 }
794
795 .column-reverse {
796 display: flex;
797 flex-direction: column-reverse;
798 }
799 }
800
801 // 公共部分样式 start
802 .chTable {
803 margin-left: -1px;
804
805 // position: relative;
806 tr {
807 .floor {
808 background-color: #fff;
809 }
810
811 td {
812 min-width: 138px;
813 height: 72px;
814 line-height: 72px;
815 text-align: center;
816 cursor: pointer;
817 position: relative;
818 border: 1px solid #d5d6da;
819
820 .hqszt {
821 display: inline-block;
822 width: 16px;
823 height: 16px;
824 font-size: 12px;
825 line-height: 16px;
826 position: absolute;
827 left: 6px;
828 top: 6px;
829 border: 1px solid;
830 border-radius: 8px;
831 }
832
833 .lin {
834 color: #F7B500;
835 border-color: #F7B500;
836 }
837
838 .zheng {
839 color: #1AD6E1;
840 border-color: #1AD6E1;
841 }
842
843 .xian {
844 color: #45AEFD;
845 border-color: #45AEFD;
846 }
847
848 .dyzt {
849 user-select: none;
850 width: 138px;
851 height: 18px;
852 position: absolute;
853 // background: orange;
854 bottom: 32px;
855 box-sizing: border-box;
856 padding: 0 6px;
857
858 li {
859 display: inline-block;
860 width: 18px;
861 height: 18px;
862 font-size: 12px;
863 line-height: 18px;
864 color: #ffffff;
865 border: 1px solid;
866 border-radius: 9px;
867 }
868 }
869 }
870
871 .tdSelect {
872 border: 1px solid #006cff !important;
873 background-image: url("./images/tdSelect.png");
874 background-repeat: no-repeat;
875 background-position: right top;
876 background-size: 30px;
877 }
878
879 .hasBorder {
880 border-width: 1px;
881 border-style: solid;
882 }
883 }
884 }
885
886 .name {
887 line-height: 40px;
888 text-align: center;
889 display: table-footer-group;
890
891 p {
892 width: calc(100% - 2px);
893 height: 100%;
894 // border: 1px solid #E6E6E6;
895 }
896 }
897
898 // end
899 }
900
901 .column-reverse {
902 display: flex;
903 flex-direction: column-reverse;
904 }
905
906 .zrz {
907 height: 60px;
908 line-height: 60px;
909 background-color: #ffffff;
910 border: 1px solid #E6E6E6;
911 // position: relative;
912 // bottom: 66px;
913 text-align: center;
914 transition: 0.5s;
915 }
916
917 .cantHb {
918 opacity: .5;
919 cursor: not-allowed;
920 }
921
922 .btnGroup {
923 margin: 20px auto 0;
924 width: 150px;
925 }
926
927 .el-checkbox {
928 font-size: 16px;
929
930 /deep/.el-checkbox__label {
931 font-size: 16px;
932 }
933
934 /deep/ .el-checkbox__inner {
935 width: 16px;
936 height: 16px;
937 }
938
939 /deep/ .el-checkbox__inner::after {
940 height: 9px;
941 left: 4px;
942 top: 0px;
943 width: 5px;
944 }
945
946 /deep/ .el-checkbox__input {
947 top: 1px;
948 }
949 }
950
951 .hbjDialog {
952 /deep/.el-dialog {
953 margin-top: 10vh !important;
954 }
955 }
956 } 216 }
957 </style> 217 </style>
......
1 <!--
2 * @Author: yangwei
3 * @Date: 2023-02-28 17:25:45
4 * @LastEditors: yangwei
5 * @LastEditTime: 2023-03-02 17:34:24
6 * @FilePath: \bdcdj-web\src\views\lpb\lpbContent\ljzs.vue
7 * @Description:
8 *
9 * Copyright (c) 2023 by ${git_name_email}, All Rights Reserved.
10 -->
11 <template>
12 <div class="ljzs-wrap">
13 <div v-for="ljzarr in ljzsCptd" :key="ljzarr[0].bsm">
14 <!-- 多个同起始层逻辑幢 横向排列 -->
15 <div class="ch-zdy-wrap" v-if="ljzarr.length > 1">
16 <div v-for="ljz in ljzarr" :key="ljz.ljzmc" class="same-floor-ljz">
17 <div
18 :class="
19 ljz.cs.length ? 'cs-visible ch-zdy-wrap' : 'cs-none ch-zdy-wrap'
20 "
21 >
22 <!-- 逻辑幢名称 -->
23 <p class="lpb-xmmc ljz-xmmc">{{ ljz.ljzmc }}</p>
24 <!-- 独立层户 -->
25 <ch-cpn v-if="ljz.cs.length" :ch="ljz.cs" />
26 <!-- 幢单元 -->
27 <zdy-cpn v-if="ljz.zdys.length" :zdys="ljz.zdys" />
28 </div>
29 </div>
30 </div>
31 <!-- 不同起始层的逻辑幢纵向排列 -->
32 <div
33 :class="
34 ljzarr[0].cs.length ? 'cs-visible ch-zdy-wrap' : 'cs-none ch-zdy-wrap'
35 "
36 v-else
37 >
38 <!-- 逻辑幢名称 -->
39 <p class="lpb-xmmc ljz-xmmc">{{ ljzarr[0].ljzmc }}</p>
40 <!-- 独立层户 -->
41 <ch-cpn v-if="ljzarr[0].cs.length" :ch="ljzarr[0].cs" />
42 <!-- 幢单元 -->
43 <zdy-cpn v-if="ljzarr[0].zdys.length" :zdys="ljzarr[0].zdys" />
44 </div>
45 </div>
46 </div>
47 </template>
48
49 <script>
50 import chCpn from "./ch.vue";
51 import zdyCpn from "./zdys.vue";
52 export default {
53 name: "BdcdjWebLjzs",
54 components: { chCpn, zdyCpn },
55 props: {
56 ljzs: {
57 type: Array,
58 default: function () {
59 return [];
60 },
61 },
62 },
63 data() {
64 return {
65 };
66 },
67
68 mounted() {
69 console.log(this.ljzsCptd);
70 },
71 computed: {
72 ljzsCptd() {
73 let tempArr = [];
74 //逻辑幢数据已经按照place从小到大排序
75 this.ljzs.forEach((item, index) => {
76 //判断当前逻辑幢是否与上一个逻辑幢的起始层数相同,将起始层数相同的逻辑幢放在同一排
77 if (index && item.place == this.ljzs[index - 1].place) {
78 tempArr[index - 1].push(item);
79 } else {
80 tempArr[index] = [];
81 tempArr[index].push(item);
82 }
83 });
84 //过滤假值
85 return tempArr.filter(Boolean)
86 },
87 },
88 methods: {},
89 };
90 </script>
91
92 <style lang="scss">
93 .ljzs-wrap {
94 display: flex;
95 flex-direction: column-reverse;
96 > div {
97 margin-bottom: 80px;
98 margin-right: 20px;
99 display: flex;
100 flex-direction: column;
101 .ch-zdy-wrap {
102 display: flex;
103 flex-direction: row-reverse;
104 width: fit-content;
105 position: relative;
106 .same-floor-ljz{
107 display: flex;
108 flex-direction: row;
109 margin-right: 20px;
110 }
111 .ljz-xmmc {
112 position: absolute;
113 width: calc(100% + 1px);
114 bottom: -60px;
115 }
116 }
117 .cs-none {
118 .zdys-wrap > div:last-child {
119 margin-right: 0;
120 }
121 }
122 }
123 }
124 </style>
1 <!--
2 * @Author: yangwei
3 * @Date: 2023-02-28 16:29:04
4 * @LastEditors: yangwei
5 * @LastEditTime: 2023-03-02 14:45:19
6 * @FilePath: \bdcdj-web\src\views\lpb\lpbContent\zdys.vue
7 * @Description:
8 *
9 * Copyright (c) 2023 by ${git_name_email}, All Rights Reserved.
10 -->
11 <template>
12 <div class="zdys-wrap">
13 <div v-for="zdy in realZdys" :key="zdy.bsm">
14 <!-- 幢单元名称 -->
15 <p class="lpb-xmmc">
16 <el-checkbox @change="zdySelectAll($event,zdy.bsm)">{{
17 zdy.zdymc
18 }}</el-checkbox>
19 </p>
20 <!-- 每个幢单元下的层户 -->
21 <ch-cpn :ref="zdy.bsm" :ch="zdy.cs" />
22 </div>
23 </div>
24 </template>
25
26 <script>
27 import chCpn from "./ch.vue";
28 export default {
29 name: "BdcdjWebZdys",
30 components: { chCpn },
31 props: {
32 zdys: {
33 type: Array,
34 default: function () {
35 return [];
36 },
37 },
38 },
39 data() {
40 return {};
41 },
42
43 mounted() {},
44
45 methods: {
46 //幢单元全选
47 zdySelectAll(val,r) {
48 this.$refs[r][0].zdySelectAll(val)
49 },
50 },
51 computed: {
52 realZdys() {
53 return this.zdys.sort((a, b) => {
54 return a.zdysxh > b.zdysxh ? 1 : -1;
55 });
56 },
57 },
58 };
59 </script>
60
61 <style lang="scss" scoped>
62 .zdys-wrap {
63 display: flex;
64 flex-direction: row;
65 > div {
66 margin-right: 20px;
67 display: flex;
68 flex-direction: column-reverse;
69 .lpb-xmmc {
70 border-top: 0;
71 }
72 }
73 }
74 </style>
1 <template> 1 <template>
2 <div class="zdxx"> 2 <div class="tableDivCss">
3 <div class="tablebox"> 3 <table cellpadding="0" cellspacing="0" class="tableCss">
4 <table cellpadding="0" cellspacing="0" class="zdxxTable"> 4 <tr>
5 <col width="80" /> 5 <th colspan="5" class="title">宗地基本信息</th>
6 <col width="60" /> 6 </tr>
7 <col width="90" /> 7 <tr>
8 <col width="235" /> 8 <td>单位</td>
9 <col width="150" /> 9 <td colspan="4">{{ zdjbxx.mjdw }}</td>
10 <tr> 10 </tr>
11 <td colspan="6" class="title">宗地基本信息</td> 11 <tr>
12 </tr> 12 <td>不动产类型</td>
13 <tr> 13 <td colspan="4">{{ bdclxList[zdjbxx.bdclx] }}</td>
14 <td colspan="2">不动产类型:</td> 14 </tr>
15 <td colspan="2">{{ bdclxList[zdjbxx.bdclx] }}</td> 15 <tr>
16 <td>单位:</td> 16 <td>坐落</td>
17 <td>{{ zdjbxx.mjdw }}</td> 17 <td colspan="4">{{ zdjbxx.zl }}</td>
18 </tr> 18 </tr>
19 <tr> 19 <tr>
20 <td colspan="2">坐落</td> 20 <td rowspan="8">土地状况</td>
21 <td colspan="4">{{ zdjbxx.zl }}</td> 21 </tr>
22 </tr> 22 <tr>
23 <tr> 23 <td style="width:15%">宗地面积</td>
24 <td rowspan="8" class="title2">土地状况</td> 24 <td style="width:30%">{{ zdjbxx.zdmj }}</td>
25 </tr> 25 <td style="width:15%">用途</td>
26 <tr> 26 <td style="width:30%">{{ zdjbxx.ghytmc }}</td>
27 <td colspan="2">宗地面积</td> 27 </tr>
28 <td>{{ zdjbxx.zdmj }}</td> 28 <tr>
29 <td>用途</td> 29 <td>等级</td>
30 <td>{{ zdjbxx.ghytmc }}</td> 30 <td>{{ zdjbxx.djmc }}</td>
31 </tr> 31 <td>价格</td>
32 <tr> 32 <td>{{ zdjbxx.jg }}</td>
33 <td colspan="2">等级</td> 33 </tr>
34 <td>{{ zdjbxx.djmc }}</td> 34 <tr>
35 <td>价格</td> 35 <td>权利类型</td>
36 <td>{{ zdjbxx.jg }}</td> 36 <td>{{ zdjbxx.qllxmc }}</td>
37 </tr> 37 <td>权利性质</td>
38 <tr> 38 <td>{{ zdjbxx.qlxzmc }}</td>
39 <td colspan="2">权利类型</td> 39 </tr>
40 <td>{{ zdjbxx.qllxmc }}</td> 40 <tr>
41 <td>权利性质</td> 41 <td>权利设定方式</td>
42 <td>{{ zdjbxx.qlxzmc }}</td> 42 <td>{{ zdjbxx.qlsdfs }}</td>
43 </tr> 43 <td>容积率</td>
44 <tr> 44 <td>{{ zdjbxx.rjl }}</td>
45 <td colspan="2">权利设定方式</td> 45 </tr>
46 <td>{{ zdjbxx.qlsdfs }}</td> 46 <tr>
47 <td>容积率</td> 47 <td>建筑密度</td>
48 <td>{{ zdjbxx.rjl }}</td> 48 <td>{{ zdjbxx.jzmd }}</td>
49 </tr> 49 <td>建筑限高</td>
50 <tr> 50 <td>{{ zdjbxx.jzxg }}</td>
51 <td colspan="2">建筑密度</td> 51 </tr>
52 <td>{{ zdjbxx.jzmd }}</td> 52 <tr>
53 <td>建筑限高</td> 53 <td>图幅号</td>
54 <td>{{ zdjbxx.jzxg }}</td> 54 <td>{{ zdjbxx.tfh }}</td>
55 </tr> 55 <td>地籍号</td>
56 <tr> 56 <td>{{ zdjbxx.djh }}</td>
57 <td colspan="2">图幅号</td> 57 </tr>
58 <td>{{ zdjbxx.tfh }}</td> 58 <tr>
59 <td>地籍号</td> 59 <td>档案号</td>
60 <td>{{ zdjbxx.djh }}</td> 60 <td>{{ zdjbxx.dah }}</td>
61 </tr> 61 <td>地块代码</td>
62 <tr> 62 <td>{{ zdjbxx.dkdm }}</td>
63 <td colspan="2">档案号</td> 63 </tr>
64 <td>{{ zdjbxx.dah }}</td> 64 <tr>
65 <td>地块代码</td> 65 <td rowspan="5">宗地四至</td>
66 <td>{{ zdjbxx.dkdm }}</td> 66 </tr>
67 </tr>
68 <tr>
69 <td colspan="2">宗地四至-东</td>
70 <td colspan="4">{{ zdjbxx.zdszd }}</td>
71 </tr>
72 <tr>
73 <td colspan="2">宗地四至-南</td>
74 <td colspan="4">{{ zdjbxx.zdszn }}</td>
75 </tr>
76 <tr>
77 <td colspan="2">宗地四至-西</td>
78 <td colspan="4">{{ zdjbxx.zdszx }}</td>
79 </tr>
80 <tr>
81 <td colspan="2">宗地四至-北</td>
82 <td colspan="4">{{ zdjbxx.zdszb }}</td>
83 </tr>
84 <tr>
85 <td class="title2" height="96">备注</td>
86 <td colspan="5">{{ zdjbxx.bz }}</td>
87 </tr>
88 <tr>
89 <td class="title2" height="96">附记</td>
90 <td colspan="5">{{ zdjbxx.fj }}</td>
91 </tr>
92 <tr>
93 <td colspan="2">状态</td>
94 <td colspan="2">{{ zdjbxx.zt }}</td>
95 <td>区县代码</td>
96 <td>{{ zdjbxx.qxdm }}</td>
97 </tr>
98 <tr v-show="showGroup">
99 <td class="title2">变化情况</td>
100 <td colspan="5" class="bhqk">
101 <div class="box">
102 <table cellspacing="0" cellpadding="0" :width="bhqkTableWidth">
103 <tr v-for="(item, index) in bhqkColumns" :key="index">
104 <td class="bhqkTh">{{ item.label }}</td>
105 <!-- <td v-for="(item2, index2) in zdbhqks" :key="index2">
106 {{ item2[item.prop] }}
107 </td> -->
108 </tr>
109 </table>
110 </div>
111 </td>
112 </tr>
113 </table>
114 </div>
115 </div>
116 </template>
117
118 <script>
119 import { getZdjjxxBybdcdyid } from "@/api/registerBook.js";
120
121 export default {
122 data () {
123 return {
124 bhqkColumns: [
125 {
126 prop: "ssywh",
127 label: "上手业务号",
128 },
129 {
130 prop: "zddm",
131 label: "宗地代码",
132 },
133 {
134 prop: "bhqzddm",
135 label: "变化前宗地代码",
136 },
137 {
138 prop: "bhnr",
139 label: "变化内容",
140 },
141 {
142 prop: "bhyy",
143 label: "变化原因",
144 },
145 {
146 prop: "djsj",
147 label: "登记时间",
148 },
149 {
150 prop: "dbr",
151 label: "登簿人",
152 },
153 {
154 prop: "fj",
155 label: "附记",
156 },
157 ],
158 bhqkTableWidth: 745,
159 zdjbxx: {},
160 zdbhqks: [],
161 propsParam: this.$attrs,
162 showGroup: false,
163 bdclxList: ['', '宗地', '宗海', '自然幢', '多幢', '构筑物', '林权', '户']
164 };
165 },
166 created () {
167 this.loadData();
168 },
169 methods: {
170 loadData () {
171 getZdjjxxBybdcdyid({ bdcdyid: this.propsParam.bdcdyid }).then((res) => {
172 if (res.code === 200) {
173 this.zdjbxx = res.result.zdjbxx;
174 this.zdbhqks = res.result.zdbhqkList;
175 if (this.zdbhqks != null && this.zdbhqks.length > 0) {
176 this.showGroup = true;
177 }
178 }
179 });
180 },
181 },
182 };
183 </script>
184
185 <style lang="scss" scoped>
186 .zdxx {
187 width: 100%;
188 height: 100%;
189 background-color: #f5f5f5;
190 padding: 5px;
191 }
192 .tablebox {
193 overflow-x: auto;
194 width: 100%;
195 height: 100%;
196 background: #fff;
197 border: 1px solid rgb(228, 228, 228);
198 text-align: center;
199 padding: 4px;
200 overflow-y: scroll;
201 67
202 .zdxxTable { 68 <tr>
203 width: 100%; 69 <td></td>
204 color: #333; 70 <td colspan="3">{{ zdjbxx.zdszd }}</td>
71 </tr>
72 <tr>
73 <td></td>
74 <td colspan="3">{{ zdjbxx.zdszn }}</td>
75 </tr>
76 <tr>
77 <td>西</td>
78 <td colspan="3">{{ zdjbxx.zdszx }}</td>
79 </tr>
80 <tr>
81 <td></td>
82 <td colspan="3">{{ zdjbxx.zdszb }}</td>
83 </tr>
84 <tr>
85 <td>登记时间</td>
86 <td colspan="2">{{ zdjbxx.bz }}</td>
87 <td>登簿人</td>
88 <td>{{ zdjbxx.bz }}</td>
89 </tr>
205 90
206 td { 91 <tr>
207 border: 1px solid rgb(228, 228, 228); 92 <td>附记</td>
208 line-height: 30px; 93 <td colspan="4">{{ zdjbxx.fj }}</td>
209 padding: 0 4px; 94 </tr>
210 } 95 <!-- <tr>
96 <td>状态</td>
97 <td colspan="2">{{ zdjbxx.zt }}</td>
98 <td>区县代码</td>
99 <td>{{ zdjbxx.qxdm }}</td>
100 </tr> -->
101 <tr v-if="showGroup">
102 <td rowspan="4">变化情况</td>
211 103
212 .title { 104 <!-- <table cellspacing="0" cellpadding="0" :width="bhqkTableWidth">
213 line-height: 68px; 105 <tr v-for="(item, index) in bhqkColumns" :key="index">
214 font-size: 20px; 106 <td class="bhqkTh">{{ item.label }}</td>
215 } 107 </tr>
108 </table> -->
216 109
217 .unit { 110 </tr>
218 text-align: right;
219 }
220 111
221 .title2 { 112 <tr v-if="showGroup">
222 writing-mode: vertical-lr; 113 <td >变化原因</td>
223 letter-spacing: 6px; 114 <td >变化内容</td>
224 } 115 <td >登记时间</td>
116 <td >登簿人</td>
117 </tr>
118 <!-- <tr >
119 <td>{{ zdbhqks[0].bhyy }}</td>
120 <td>{{ zdbhqks[0].bhnr }}</td>
121 <td>{{ zdbhqks[0].djsj }}</td>
122 <td>{{ zdbhqks[0].dbr }}</td>
123 </tr> -->
225 124
226 .bhqk {
227 padding: 0;
228 125
229 .box {
230 width: 745px;
231 overflow: auto;
232 }
233 126
234 .test { 127 </table>
235 } 128 </div>
129 </template>
236 130
237 table { 131 <script>
238 .bhqkTh { 132 import { getZdjjxxBybdcdyid } from "@/api/registerBook.js";
239 width: 110px;
240 line-height: 40px;
241 background-color: #f5f5f5;
242 border: 1px solid rgb(228, 228, 228);
243 font-weight: bold;
244 }
245 133
246 td { 134 export default {
247 width: 180px; 135 data() {
136 return {
137 bhqkColumns: [
138 {
139 prop: "ssywh",
140 label: "上手业务号",
141 },
142 {
143 prop: "zddm",
144 label: "宗地代码",
145 },
146 {
147 prop: "bhqzddm",
148 label: "变化前宗地代码",
149 },
150 {
151 prop: "bhnr",
152 label: "变化内容",
153 },
154 {
155 prop: "bhyy",
156 label: "变化原因",
157 },
158 {
159 prop: "djsj",
160 label: "登记时间",
161 },
162 {
163 prop: "dbr",
164 label: "登簿人",
165 },
166 {
167 prop: "fj",
168 label: "附记",
169 },
170 ],
171 bhqkTableWidth: 745,
172 zdjbxx: {},
173 zdbhqks: [],
174 propsParam: this.$attrs,
175 showGroup: false,
176 bdclxList: ["", "宗地", "宗海", "自然幢", "多幢", "构筑物", "林权", "户"],
177 };
178 },
179 created() {
180 this.loadData();
181 },
182 methods: {
183 loadData() {
184 getZdjjxxBybdcdyid({ bdcdyid: this.propsParam.bdcdyid }).then((res) => {
185 if (res.code === 200) {
186 this.zdjbxx = res.result.zdjbxx;
187 this.zdbhqks = res.result.zdbhqkList;
188 debugger;
189 if (this.zdbhqks != null && this.zdbhqks.length > 0) {
190 this.showGroup = true;
248 } 191 }
249 } 192 }
250 } 193 });
251 } 194 },
252 } 195 },
196 };
197 </script>
198
199 <style lang="scss" scoped>
200 @import "~@/styles/tablecss.scss";
253 </style> 201 </style>
......
...@@ -23,315 +23,315 @@ ...@@ -23,315 +23,315 @@
23 </template> 23 </template>
24 24
25 <script> 25 <script>
26 import { getUuid, judgeSort, realMove, findParents, removeTreeListItem } from '@/utils/operation' 26 import { getUuid, judgeSort, realMove, findParents, removeTreeListItem } from '@/utils/operation'
27 import { editDictNode, getChildDictList } from '@/api/user' 27 import { editDictNode, getChildDictList } from '@/api/user'
28 export default { 28 export default {
29 props: { 29 props: {
30 value: { type: Boolean, default: false }, 30 value: { type: Boolean, default: false },
31 details: { 31 details: {
32 type: Object, 32 type: Object,
33 default: {} 33 default: {}
34 } 34 }
35 }, 35 },
36 data () { 36 data () {
37 return { 37 return {
38 key: 0, 38 key: 0,
39 myValue: this.value, 39 myValue: this.value,
40 keyList: [], 40 keyList: [],
41 ruleForm: { 41 ruleForm: {
42 dcode: '', 42 dcode: '',
43 dname: '' 43 dname: ''
44 },
45 column: [],
46 columns: [
47 {
48 width: '70',
49 renderHeader: (h, scope) => {
50 return (<div>
51 {
52 this.details.isenable === '0' ?
53 <span>序号</span> :
54 <i class="el-icon-plus" onClick={() => { this.handleAdd() }} style="cursor:pointer;color:#409EFF"></i>
55 }
56 </div>)
57 },
58 render: (h, scope) => {
59 return (
60 <span>{scope.row.index}</span>
61 )
62 }
63 }, 44 },
64 { 45 column: [],
65 prop: 'dcode', 46 columns: [
66 width: '100', 47 {
67 label: '字典项编码', 48 width: '70',
68 render: (h, scope) => { 49 renderHeader: (h, scope) => {
69 return ( 50 return (<div>
70 <div> 51 {
71 <el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={scope.row.codeShow} v-fo value={scope.row[scope.column.property]} 52 this.details.isenable === '0' ?
72 onFocus={() => { this.itemShowFalse(); scope.row.codeShow = true; }} 53 <span>序号</span> :
73 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input> 54 <i class="el-icon-plus" onClick={() => { this.handleAdd() }} style="cursor:pointer;color:#409EFF"></i>
55 }
56 </div>)
57 },
58 render: (h, scope) => {
59 return (
60 <span>{scope.row.index}</span>
61 )
62 }
63 },
64 {
65 prop: 'dcode',
66 width: '100',
67 label: '字典项编码',
68 render: (h, scope) => {
69 return (
70 <div>
71 <el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={scope.row.codeShow} v-fo value={scope.row[scope.column.property]}
72 onFocus={() => { this.itemShowFalse(); scope.row.codeShow = true; }}
73 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
74 74
75 75
76 <el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={!scope.row.codeShow} value={scope.row[scope.column.property]} 76 <el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={!scope.row.codeShow} value={scope.row[scope.column.property]}
77 onFocus={() => { this.itemShowFalse(); scope.row.codeShow = true; }} 77 onFocus={() => { this.itemShowFalse(); scope.row.codeShow = true; }}
78 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input> 78 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
79 </div> 79 </div>
80 ) 80 )
81 } 81 }
82 }, 82 },
83 { 83 {
84 prop: 'dname', 84 prop: 'dname',
85 label: '字典项名称', 85 label: '字典项名称',
86 render: (h, scope) => { 86 render: (h, scope) => {
87 return ( 87 return (
88 <div> 88 <div>
89 <el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={scope.row.nameShow} v-fo value={scope.row[scope.column.property]} 89 <el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={scope.row.nameShow} v-fo value={scope.row[scope.column.property]}
90 onFocus={() => { this.itemShowFalse(); scope.row.nameShow = true; }} 90 onFocus={() => { this.itemShowFalse(); scope.row.nameShow = true; }}
91 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input> 91 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input>
92 92
93 <el-input placeholder="字典项名称" disabled={this.details.isenable == 2} v-show={!scope.row.nameShow} value={scope.row[scope.column.property]} 93 <el-input placeholder="字典项名称" disabled={this.details.isenable == 2} v-show={!scope.row.nameShow} value={scope.row[scope.column.property]}
94 onFocus={() => { this.itemShowFalse(); scope.row.nameShow = true; }} 94 onFocus={() => { this.itemShowFalse(); scope.row.nameShow = true; }}
95 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input> 95 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input>
96 </div> 96 </div>
97 ) 97 )
98 } 98 }
99 }, 99 },
100 { 100 {
101 prop: 'normcode', 101 prop: 'normcode',
102 label: '部标编码', 102 label: '部标编码',
103 width: '100', 103 width: '100',
104 render: (h, scope) => { 104 render: (h, scope) => {
105 return ( 105 return (
106 <div> 106 <div>
107 <el-input placeholder="部标编码" disabled={this.details.isenable == 2} v-show={scope.row.normcodeShow} v-fo value={scope.row[scope.column.property]} 107 <el-input placeholder="部标编码" disabled={this.details.isenable == 2} v-show={scope.row.normcodeShow} v-fo value={scope.row[scope.column.property]}
108 onFocus={() => { this.itemShowFalse(); scope.row.normcodeShow = true; }} 108 onFocus={() => { this.itemShowFalse(); scope.row.normcodeShow = true; }}
109 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input> 109 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
110 110
111 <el-input placeholder="部标编码" disabled={this.details.isenable == 2} v-show={!scope.row.normcodeShow} value={scope.row[scope.column.property]} 111 <el-input placeholder="部标编码" disabled={this.details.isenable == 2} v-show={!scope.row.normcodeShow} value={scope.row[scope.column.property]}
112 onFocus={() => { this.itemShowFalse(); scope.row.normcodeShow = true; }} 112 onFocus={() => { this.itemShowFalse(); scope.row.normcodeShow = true; }}
113 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input> 113 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
114 </div> 114 </div>
115 ) 115 )
116 } 116 }
117 }, 117 },
118 { 118 {
119 prop: 'normname', 119 prop: 'normname',
120 label: '部标名称', 120 label: '部标名称',
121 render: (h, scope) => { 121 render: (h, scope) => {
122 return ( 122 return (
123 <div> 123 <div>
124 <el-input placeholder="部标名称" disabled={this.details.isenable == 2} v-show={scope.row.normnameShow} v-fo value={scope.row[scope.column.property]} 124 <el-input placeholder="部标名称" disabled={this.details.isenable == 2} v-show={scope.row.normnameShow} v-fo value={scope.row[scope.column.property]}
125 onFocus={() => { this.itemShowFalse(); scope.row.normnameShow = true; }} 125 onFocus={() => { this.itemShowFalse(); scope.row.normnameShow = true; }}
126 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input> 126 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input>
127 127
128 <el-input placeholder="部标名称" disabled={this.details.isenable == 2} v-show={!scope.row.normnameShow} value={scope.row[scope.column.property]} 128 <el-input placeholder="部标名称" disabled={this.details.isenable == 2} v-show={!scope.row.normnameShow} value={scope.row[scope.column.property]}
129 onFocus={() => { this.itemShowFalse(); scope.row.normnameShow = true; }} 129 onFocus={() => { this.itemShowFalse(); scope.row.normnameShow = true; }}
130 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input> 130 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input>
131 </div> 131 </div>
132 ) 132 )
133 } 133 }
134 }, 134 },
135 { 135 {
136 prop: 'isenable', 136 prop: 'isenable',
137 width: '160', 137 width: '160',
138 label: '是否禁用', 138 label: '是否禁用',
139 render: (h, scope) => { 139 render: (h, scope) => {
140 return ( 140 return (
141 <el-radio-group disabled={this.details.isenable == 2} v-model={scope.row.isenable}> 141 <el-radio-group disabled={this.details.isenable == 2} v-model={scope.row.isenable}>
142 <el-radio label="1">启用</el-radio> 142 <el-radio label="1">启用</el-radio>
143 <el-radio label="0">禁用</el-radio> 143 <el-radio label="0">禁用</el-radio>
144 </el-radio-group> 144 </el-radio-group>
145 ) 145 )
146 }
147 },
148 {
149 width: '130',
150 label: '移动',
151 render: (h, scope) => {
152 return (
153 <div>
154 <el-button type='text' disabled={scope.row.isTop} onClick={() => { this.moveUpward(scope.$index, scope.row) }}>上移</el-button>
155 <el-button type='text' disabled={scope.row.isBottom} onClick={() => { this.moveDown(scope.$index, scope.row) }}>下移</el-button >
156 </div >
157 )
158 }
159 },
160 {
161 width: '150',
162 label: '操作',
163 render: (h, scope) => {
164 return (
165 <div>
166 <el-button type="text" style="margin-right:10px" onClick={() => { this.handleAddSubordinate(scope.row) }}>增加下级</el-button>
167 <el-button type="text" style="margin-left:0" onClick={() => { this.handleMinus(scope.$index, scope.row) }}>删除</el-button>
168 </div>
169 )
170 }
146 } 171 }
172 ],
173 tableData: []
174 }
175 },
176 watch: {
177 value (val) {
178 this.myValue = val
179 },
180 'details.bsmDict': {
181 handler: function (newValue) {
182 if (!this.value) return
183 this.$startLoading();
184 getChildDictList(newValue).then(res => {
185 this.$endLoading();
186 let { result } = res
187 this.tableData = result ? result : []
188 this.tableData.forEach((item, index) => {
189 item.index = index + 1
190 })
191 })
147 }, 192 },
148 { 193 immediate: true
149 width: '130', 194 },
150 label: '移动', 195 details: {
151 render: (h, scope) => { 196 handler: function (newValue) {
152 return ( 197 if (newValue.isenable == 2) {
153 <div> 198 this.column = this.columns.slice(0, 6)
154 <el-button type='text' disabled={scope.row.isTop} onClick={() => { this.moveUpward(scope.$index, scope.row) }}>上移</el-button> 199 } else {
155 <el-button type='text' disabled={scope.row.isBottom} onClick={() => { this.moveDown(scope.$index, scope.row) }}>下移</el-button > 200 this.column = this.columns
156 </div >
157 )
158 } 201 }
202 this.ruleForm = newValue.rowData
203 this.addIndexes()
204 this.key++
159 }, 205 },
160 { 206 deep: true
161 width: '150', 207 }
162 label: '操作',
163 render: (h, scope) => {
164 return (
165 <div>
166 <el-button type="text" style="margin-right:10px" onClick={() => { this.handleAddSubordinate(scope.row) }}>增加下级</el-button>
167 <el-button type="text" style="margin-left:0" onClick={() => { this.handleMinus(scope.$index, scope.row) }}>删除</el-button>
168 </div>
169 )
170 }
171 }
172 ],
173 tableData: []
174 }
175 },
176 watch: {
177 value (val) {
178 this.myValue = val
179 }, 208 },
180 'details.bsmDict': { 209 methods: {
181 handler: function (newValue) { 210 // 添加索引
182 if (!this.value) return 211 addIndexes (data = this.tableData, isAdd = true) {
183 this.$startLoading(); 212 data.forEach((item, index) => {
184 getChildDictList(newValue).then(res => { 213 if (index == 0) {
185 this.$endLoading(); 214 item.codeShow = true
186 let { result } = res 215 item.nameShow = false
187 this.tableData = result ? result : [] 216 item.normcodeShow = false
188 this.tableData.forEach((item, index) => { 217 item.normnameShow = false
218 } else {
219 item.codeShow = false
220 item.nameShow = false
221 item.normcodeShow = false
222 item.normnameShow = false
223 }
224 if (isAdd) {
189 item.index = index + 1 225 item.index = index + 1
190 }) 226 }
227 if (item.children) {
228 this.addIndexes(item.children, false)
229 }
191 }) 230 })
192 }, 231 },
193 immediate: true 232 itemShowFalse () {
194 }, 233 this.tableData.forEach((item, index) => {
195 details: {
196 handler: function (newValue) {
197 if (newValue.isenable == 2) {
198 this.column = this.columns.slice(0, 6)
199 } else {
200 this.column = this.columns
201 }
202 this.ruleForm = newValue.rowData
203 this.addIndexes()
204 this.key++
205 },
206 deep: true
207 }
208 },
209 methods: {
210 // 添加索引
211 addIndexes (data = this.tableData, isAdd = true) {
212 data.forEach((item, index) => {
213 if (index == 0) {
214 item.codeShow = true
215 item.nameShow = false
216 item.normcodeShow = false
217 item.normnameShow = false
218 } else {
219 item.codeShow = false 234 item.codeShow = false
220 item.nameShow = false 235 item.nameShow = false
221 item.normcodeShow = false 236 item.normcodeShow = false
222 item.normnameShow = false 237 item.normnameShow = false
223 }
224 if (isAdd) {
225 item.index = index + 1
226 }
227 if (item.children) {
228 this.addIndexes(item.children, false)
229 }
230 })
231 },
232 itemShowFalse () {
233 this.tableData.forEach((item, index) => {
234 item.codeShow = false
235 item.nameShow = false
236 item.normcodeShow = false
237 item.normnameShow = false
238 })
239 },
240 handleMinus (index, row) {
241 this.$confirm('此操作将永久删除, 是否继续?', '提示', {
242 confirmButtonText: '确定',
243 cancelButtonText: '取消',
244 type: 'warning'
245 }).then(() => {
246 removeTreeListItem(this.tableData, row.bsmDict)
247 this.$message({
248 type: 'success',
249 message: '删除成功!'
250 })
251 }).catch(() => {
252 this.$message({
253 type: 'info',
254 message: '已取消删除'
255 }) 238 })
256 }) 239 },
257 }, 240 handleMinus (index, row) {
258 handleSubmit () { 241 this.$confirm('此操作将永久删除, 是否继续?', '提示', {
259 editDictNode({ 242 confirmButtonText: '确定',
260 bsmDict: this.details.rowData.bsmDict, 243 cancelButtonText: '取消',
261 typeid: this.details.rowData.typeid, 244 type: 'warning'
262 children: this.tableData 245 }).then(() => {
263 }).then(res => { 246 removeTreeListItem(this.tableData, row.bsmDict)
264 if (res.code === 200) {
265 this.$message({ 247 this.$message({
266 message: '修改成功', 248 type: 'success',
267 type: 'success' 249 message: '删除成功!'
268 }) 250 })
269 this.$emit('input', false) 251 }).catch(() => {
252 this.$message({
253 type: 'info',
254 message: '已取消删除'
255 })
256 })
257 },
258 handleSubmit () {
259 editDictNode({
260 bsmDict: this.details.rowData.bsmDict,
261 typeid: this.details.rowData.typeid,
262 children: this.tableData
263 }).then(res => {
264 if (res.code === 200) {
265 this.$message({
266 message: '修改成功',
267 type: 'success'
268 })
269 this.$emit('input', false)
270 }
271 })
272 },
273 closeDialog () {
274 this.$emit('input', false)
275 },
276 // 增加下级
277 handleAddSubordinate (row) {
278 if (!row.children) {
279 row.children = []
270 } 280 }
271 }) 281 row.children.push(
272 }, 282 {
273 closeDialog () { 283 dcode: '',
274 this.$emit('input', false) 284 dname: '',
275 }, 285 isenable: '1',
276 // 增加下级 286 normcode: '',
277 handleAddSubordinate (row) { 287 normname: '',
278 if (!row.children) { 288 bsmDict: getUuid(32),
279 row.children = [] 289 typeid: row.typeid,
290 }
291 )
292 this.keyList = [];
293 this.keyList.push(row.bsmDict)
294 },
295 // 增加
296 handleAdd () {
297 this.$nextTick(() => {
298 let container = this.$el.querySelector('.el-table__body-wrapper');
299 container.scrollTop = container.scrollHeight;
300 })
301 this.tableData.push(
302 {
303 dcode: '',
304 dname: '',
305 isenable: '1',
306 normcode: '',
307 normname: '',
308 bsmDict: getUuid(32),
309 typeid: this.ruleForm.typeid,
310 }
311 )
312 this.addIndexes()
313 this.key++
314 },
315 // 上移下移
316 moveUpward (index, row) {
317 realMove(row.bsmDict, 'UP', this.tableData)
318 this.key++
319 let id = findParents(this.tableData, row.bsmDict)
320 this.keyList = id
321 },
322 moveDown (index, row) {
323 realMove(row.bsmDict, 'DOWN', this.tableData)
324 this.key++
325 let id = findParents(this.tableData, row.bsmDict)
326 this.keyList = id
280 } 327 }
281 row.children.push(
282 {
283 dcode: '',
284 dname: '',
285 isenable: '1',
286 normcode: '',
287 normname: '',
288 bsmDict: getUuid(32),
289 typeid: row.typeid,
290 }
291 )
292 this.keyList = [];
293 this.keyList.push(row.bsmDict)
294 },
295 // 增加
296 handleAdd () {
297 this.$nextTick(() => {
298 let container = this.$el.querySelector('.el-table__body-wrapper');
299 container.scrollTop = container.scrollHeight;
300 })
301 this.tableData.push(
302 {
303 dcode: '',
304 dname: '',
305 isenable: '1',
306 normcode: '',
307 normname: '',
308 bsmDict: getUuid(32),
309 typeid: this.ruleForm.typeid,
310 }
311 )
312 this.addIndexes()
313 this.key++
314 },
315 // 上移下移
316 moveUpward (index, row) {
317 realMove(row.bsmDict, 'UP', this.tableData)
318 this.key++
319 let id = findParents(this.tableData, row.bsmDict)
320 this.keyList = id
321 },
322 moveDown (index, row) {
323 realMove(row.bsmDict, 'DOWN', this.tableData)
324 this.key++
325 let id = findParents(this.tableData, row.bsmDict)
326 this.keyList = id
327 } 328 }
328 } 329 }
329 }
330 </script> 330 </script>
331 <style rel="stylesheet/scss" lang="scss" scoped> 331 <style rel="stylesheet/scss" lang="scss" scoped>
332 @import "~@/styles/dialogBoxheader.scss"; 332 @import "~@/styles/dialogBoxheader.scss";
333 /deep/.el-radio { 333 /deep/.el-radio {
334 margin-right: 5px !important; 334 margin-right: 5px !important;
335 } 335 }
336 </style> 336 </style>
337 337
......
...@@ -4,203 +4,229 @@ ...@@ -4,203 +4,229 @@
4 --> 4 -->
5 <template> 5 <template>
6 <div class='spyj loadingtext'> 6 <div class='spyj loadingtext'>
7 <b class="spyj_title">审批表</b> 7 <div class="box">
8 <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="120px"> 8 <b class="spyj_title">审批表</b>
9 <div class="spyj_form" v-for="(item, index) in tableData" :key="index"> 9 <el-form :model="ruleForm" :rules="rules" ref="ruleForm" label-width="120px">
10 <div class="item_left"> 10 <div class="spyj_form" v-for="(item, index) in tableData" :key="index">
11 {{ item.jdmc }}意见 11 <div class="item_left">
12 {{ item.jdmc }}意见
13 </div>
14 <div class="item_right">
15 <el-row>
16 <el-col :span="24">
17 <el-form-item label-width="0" class="opinion_item" prop="shyj">
18 <el-input type="textarea" :rows="4" class="opinion" placeholder="请输入审批意见"
19 v-if="item.stepShjy == '1' && ableOperation" v-model="ruleForm.shyj"></el-input>
20 <el-input type="textarea" :rows="4" class="opinion" v-model="item.shyj" v-else :disabled="true">
21 </el-input>
22 <el-button class="opinion_btn" @click="commonOpinion"
23 v-if="item.stepShjy == '1' && ableOperation">常用意见</el-button>
24 </el-form-item>
25 </el-col>
26 </el-row>
27 <el-row>
28 <el-col :span="16">
29 <el-form-item label="审查人" prop="shryxm">
30 {{ item.shryxm }}
31 </el-form-item>
32 </el-col>
33 <el-col :span="8">
34 <el-form-item label="审核时间" prop="shjssj" :key="refresh">
35 {{ item.shjssj }}
36 </el-form-item>
37 </el-col>
38 </el-row>
39 </div>
12 </div> 40 </div>
13 <div class="item_right"> 41 <div class="submit_button" v-if="ableOperation">
14 <el-row> 42 <el-button type="primary" @click="onSubmit">保存</el-button>
15 <el-col :span="24">
16 <el-form-item label-width="0" class="opinion_item" prop="shyj">
17 <el-input type="textarea" :rows="4" class="opinion" placeholder="请输入审批意见"
18 v-if="item.stepShjy == '1' && ableOperation" v-model="ruleForm.shyj"></el-input>
19 <el-input type="textarea" :rows="4" class="opinion" v-model="item.shyj" v-else :disabled="true">
20 </el-input>
21 <el-button class="opinion_btn" @click="commonOpinion"
22 v-if="item.stepShjy == '1' && ableOperation">常用意见</el-button>
23 </el-form-item>
24 </el-col>
25 </el-row>
26 <el-row>
27 <el-col :span="16">
28 <el-form-item label="审查人:" prop="shryxm">
29 {{ item.shryxm }}
30 </el-form-item>
31 </el-col>
32 <el-col :span="8">
33 <el-form-item label="审核时间:" prop="shjssj" :key="refresh">
34 {{ item.shjssj }}
35 </el-form-item>
36 </el-col>
37 </el-row>
38 </div> 43 </div>
39 </div> 44 </el-form>
40 <div class="submit_button" v-if="ableOperation"> 45 </div>
41 <el-button type="primary" @click="onSubmit">保存</el-button>
42 </div>
43 </el-form>
44 <el-empty v-if="isNoData" description="暂无数据"></el-empty> 46 <el-empty v-if="isNoData" description="暂无数据"></el-empty>
45 <commonDialog v-model="commonDialog" /> 47 <commonDialog v-model="commonDialog" />
46 </div> 48 </div>
47 </template> 49 </template>
48 <script> 50 <script>
49 import { getSpyjList, saveSpyj, saveSpyjBySlsq } from "@/api/fqsq.js"; 51 import { getSpyjList, saveSpyj, saveSpyjBySlsq } from "@/api/fqsq.js";
50 import { popupDialog } from "@/utils/popup.js"; 52 import { popupDialog } from "@/utils/popup.js";
51 import commonDialog from "./commonOpinion.vue"; 53 import commonDialog from "./commonOpinion.vue";
52 import { mapGetters } from 'vuex' 54 import { mapGetters } from 'vuex'
53 export default { 55 export default {
54 components: { commonDialog }, 56 components: { commonDialog },
55 props: { 57 props: {
56 },
57 computed: {
58 ...mapGetters(['userData'])
59 },
60 data () {
61 return {
62 isNoData: false,
63 bsmSlsq: '',
64 //刷新值
65 refresh: 10,
66 ableOperation: true,
67 bsmSlsq: this.$route.query.bsmSlsq,
68 bestepid: this.$route.query.bestepid,
69 ruleForm: {},
70 rules: {
71 shyj: [
72 { required: true, message: '请输入审批意见', trigger: 'blur' }
73 ],
74 },
75 tableData: [],
76 propsParam: {},
77 commonDialog: false
78 }
79 },
80 mounted () {
81 this.propsParam = this.$attrs;
82 if (this.$route.query.viewtype) {
83 this.ableOperation = false
84 }
85 this.list();
86 },
87 methods: {
88 handleClick () {
89 console.log(1)
90 }, 58 },
91 //审批意见数据初始化 59 computed: {
92 list () { 60 ...mapGetters(['userData'])
93 let that = this
94 this.$startLoading()
95 var formdata = new FormData();
96 formdata.append("bsmBusiness", this.propsParam.bsmBusiness);
97 formdata.append("bestepid", this.$route.query.bestepid);
98 formdata.append("ableOperation", this.ableOperation)
99 getSpyjList(formdata).then((res) => {
100 this.$endLoading()
101 if (res.code === 200 && res.result) {
102 this.tableData = res.result ? res.result : []
103 if (res.result.length == 0) {
104 that.isNoData = true
105 }
106 this.ruleForm = res.result[res.result.length - 1]
107 }
108 })
109 }, 61 },
110 onSubmit () { 62 data () {
111 this.ruleForm.bsmSlsq = this.bsmSlsq 63 return {
112 this.ruleForm.bestepid = this.bestepid 64 isNoData: false,
113 saveSpyjBySlsq(this.ruleForm).then(res => { 65 bsmSlsq: '',
114 if (res.code === 200) { 66 //刷新值
115 this.$message.success("保存成功") 67 refresh: 10,
116 this.refresh += 1 68 ableOperation: true,
117 } else { 69 bsmSlsq: this.$route.query.bsmSlsq,
118 this.$message.error(res.message) 70 bestepid: this.$route.query.bestepid,
119 } 71 ruleForm: {},
120 }) 72 rules: {
73 shyj: [
74 { required: true, message: '请输入审批意见', trigger: 'blur' }
75 ],
76 },
77 tableData: [],
78 propsParam: {},
79 commonDialog: false
80 }
121 }, 81 },
122 //打开常用意见列表弹窗 82 mounted () {
123 commonOpinion () { 83 this.propsParam = this.$attrs;
124 this.commonDialog = true 84 if (this.$route.query.viewtype) {
85 this.ableOperation = false
86 }
87 this.list();
125 }, 88 },
126 //使用常用意见 89 methods: {
127 useOpinion (opinion) { 90 handleClick () {
128 this.ruleForm.shyj = opinion 91 console.log(1)
92 },
93 //审批意见数据初始化
94 list () {
95 let that = this
96 this.$startLoading()
97 var formdata = new FormData();
98 formdata.append("bsmBusiness", this.propsParam.bsmBusiness);
99 formdata.append("bestepid", this.$route.query.bestepid);
100 formdata.append("ableOperation", this.ableOperation)
101 getSpyjList(formdata).then((res) => {
102 this.$endLoading()
103 if (res.code === 200 && res.result) {
104 this.tableData = res.result ? res.result : []
105 if (res.result.length == 0) {
106 that.isNoData = true
107 }
108 this.ruleForm = res.result[res.result.length - 1]
109 }
110 })
111 },
112 onSubmit () {
113 this.ruleForm.bsmSlsq = this.bsmSlsq
114 this.ruleForm.bestepid = this.bestepid
115 saveSpyjBySlsq(this.ruleForm).then(res => {
116 if (res.code === 200) {
117 this.$message.success("保存成功")
118 this.refresh += 1
119 } else {
120 this.$message.error(res.message)
121 }
122 })
123 },
124 //打开常用意见列表弹窗
125 commonOpinion () {
126 this.commonDialog = true
127 },
128 //使用常用意见
129 useOpinion (opinion) {
130 this.ruleForm.shyj = opinion
131 }
129 } 132 }
130 } 133 }
131 }
132 </script> 134 </script>
133 <style scoped lang='scss'> 135 <style scoped lang='scss'>
134 @import '~@/styles/mixin.scss'; 136 @import "~@/styles/mixin.scss";
135
136 .spyj {
137 margin-left: 5px;
138 height: 400px;
139
140 .spyj_title {
141 text-align: center;
142 font-size: 18px;
143 display: block;
144 margin: 5px;
145 }
146 137
147 /deep/.el-form-item { 138 .spyj {
148 margin-bottom: 0; 139 width: 100%;
149 } 140 height: 100%;
150 141 background-color: #f5f5f5;
151 .bottom10 { 142 padding: 5px;
152 margin-bottom: 15px; 143 .box {
153 } 144 overflow-x: auto;
145 width: 100%;
146 height: 95%;
147 background: #fff;
148 text-align: center;
149 padding: 4px;
150 overflow-y: scroll;
151 padding-top: 20px;
152 padding: 20px 40px;
153 }
154 .spyj_title {
155 line-height: 68px;
156 border: 1px solid $borderColor;
157 text-align: center;
158 font-size: 22px;
159 font-weight: 400;
160 background-color: #eceef2;
161 display: block;
162 border-bottom: none;
163 }
154 164
155 .spyj_form { 165 /deep/.el-form-item {
156 display: flex; 166 margin-bottom: 0;
157 border: 1px solid $borderColor; 167 }
158 168
159 .item_left { 169 .bottom10 {
160 width: 150px; 170 margin-bottom: 15px;
161 background-color: #F8F8FA;
162 color: #606266;
163 @include flex-center;
164 border-right: 1px solid $borderColor;
165 } 171 }
166 172
167 .item_right { 173 .spyj_form {
168 flex: 1; 174 display: flex;
169 width: 100%; 175 border: 1px solid $borderColor;
170 176
171 /deep/.el-form-item__label { 177 .item_left {
172 background-color: #F8F8FA; 178 width: 150px;
179 background-color: #f8f8fa;
180 color: #606266;
181 display: flex;
182 font-size: 14px;
183 text-indent: 80px;
184 align-items: center;
185 border-right: 1px solid $borderColor;
173 } 186 }
174 187
175 .opinion_item { 188 .item_right {
176 /deep/.el-form-item__error { 189 flex: 1;
177 margin-top: -16px !important; 190 width: 100%;
178 left: 3px; 191
192 /deep/.el-form-item__label {
193 background-color: #f8f8fa;
179 } 194 }
195 /deep/.el-form-item__content {
196 display: block;
197 text-align: left;
198 padding-left: 15px;
199 text-indent: 10px;
200 }
201 .opinion_item {
202 /deep/.el-form-item__error {
203 margin-top: -16px !important;
204 left: 3px;
205 }
180 206
181 border-bottom: 1px solid $borderColor; 207 border-bottom: 1px solid $borderColor;
182 } 208 }
183 209
184 .opinion { 210 .opinion {
185 position: relative; 211 position: relative;
186 font-size: 16px; 212 font-size: 14px;
187 213
188 /deep/.el-textarea__inner { 214 /deep/.el-textarea__inner {
189 border: none; 215 border: none;
216 }
190 } 217 }
191 }
192 218
193 .opinion_btn { 219 .opinion_btn {
194 position: absolute; 220 position: absolute;
195 right: 15px; 221 right: 15px;
196 bottom: 10px; 222 bottom: 10px;
223 }
197 } 224 }
198 } 225 }
199 }
200 226
201 .submit_button { 227 .submit_button {
202 text-align: center; 228 text-align: center;
203 margin: 15px 0; 229 margin: 15px 0;
230 }
204 } 231 }
205 }
206 </style>
...\ No newline at end of file ...\ No newline at end of file
232 </style>
......
...@@ -3,37 +3,37 @@ export function getForm (tabName, djywbm) { ...@@ -3,37 +3,37 @@ export function getForm (tabName, djywbm) {
3 let form; 3 let form;
4 switch (tabName) { 4 switch (tabName) {
5 case "jsydsyqslxx100": 5 case "jsydsyqslxx100":
6 form = require("@/views/ywbl/ywSlxx/jsydsyq/slxx.vue"); 6 form = require("@/views/ywbl/slsqxx/jsydsyq/slxx.vue");
7 break; 7 break;
8 case "jsydsyqslxx300": 8 case "jsydsyqslxx300":
9 form = require("@/views/ywbl/ywSlxx/jsydsyq/slxx300.vue"); 9 form = require("@/views/ywbl/slsqxx/jsydsyq/slxx300.vue");
10 break; 10 break;
11 case "fwsyqslxx100": 11 case "fwsyqslxx100":
12 form = require("@/views/ywbl/fdcq2/slxx.vue"); 12 form = require("@/views/ywbl/slsqxx/fdcq2/slxx.vue");
13 break; 13 break;
14 case "fwsyqslxx300": 14 case "fwsyqslxx300":
15 form = require("@/views/ywbl/fdcq2/slxx300.vue"); 15 form = require("@/views/ywbl/slsqxx/fdcq2/slxx300.vue");
16 break; 16 break;
17 case "nydsyqslxx100": 17 case "nydsyqslxx100":
18 form = require("@/views/ywbl/ywSlxx/nydsyq/slxx.vue"); 18 form = require("@/views/ywbl/slsqxx/nydsyq/slxx.vue");
19 break; 19 break;
20 case "nydsyqslxx200": 20 case "nydsyqslxx200":
21 form = require("@/views/ywbl/ywSlxx/nydsyq/slxx200.vue"); 21 form = require("@/views/ywbl/slsqxx/nydsyq/slxx200.vue");
22 break; 22 break;
23 case "tdslxxCfdj": 23 case "tdslxxCfdj":
24 form = require("@/views/ywbl/cfdj/tdslxx.vue"); 24 form = require("@/views/ywbl/slsqxx/cfdj/tdslxx.vue");
25 break; 25 break;
26 case "plslxxCfdj": 26 case "plslxxCfdj":
27 form = require("@/views/ywbl/cfdj/plcfslxx.vue"); 27 form = require("@/views/ywbl/slsqxx/cfdj/plcfslxx.vue");
28 break; 28 break;
29 case "diyaqSlxx": 29 case "diyaqSlxx":
30 form = require("@/views/ywbl/ywSlxx/diyaq/slxx.vue"); 30 form = require("@/views/ywbl/slsqxx/diyaq/slxx.vue");
31 break; 31 break;
32 case "diyaqSlxx200": 32 case "diyaqSlxx200":
33 form = require("@/views/ywbl/ywSlxx/diyaq/slxx200.vue"); 33 form = require("@/views/ywbl/slsqxx/diyaq/slxx200.vue");
34 break; 34 break;
35 case "diyaqSlxx300": 35 case "diyaqSlxx300":
36 form = require("@/views/ywbl/ywSlxx/diyaq/slxx200.vue"); 36 form = require("@/views/ywbl/slsqxx/diyaq/slxx200.vue");
37 break; 37 break;
38 case "clxx": 38 case "clxx":
39 form = require("@/views/workflow/components/clxxUnify.vue"); 39 form = require("@/views/workflow/components/clxxUnify.vue");
...@@ -45,17 +45,17 @@ export function getForm (tabName, djywbm) { ...@@ -45,17 +45,17 @@ export function getForm (tabName, djywbm) {
45 form = require("@/views/registerBook/zdjbxx.vue"); 45 form = require("@/views/registerBook/zdjbxx.vue");
46 break; 46 break;
47 case "ygmm100": 47 case "ygmm100":
48 form = require("@/views/ywbl/ywSlxx/ygdj/slxx.vue"); 48 form = require("@/views/ywbl/slsqxx/ygdj/slxx.vue");
49 break; 49 break;
50 case "ygmm300": 50 case "ygmm300":
51 form = require("@/views/ywbl/ywSlxx/ygdj/slxx300.vue"); 51 form = require("@/views/ywbl/slsqxx/ygdj/slxx300.vue");
52 break; 52 break;
53 case "ygdy100": 53 case "ygdy100":
54 case "ygdy300": 54 case "ygdy300":
55 form = require("@/views/ywbl/ywSlxx/ygdy/slxx.vue"); 55 form = require("@/views/ywbl/slsqxx/ygdy/slxx.vue");
56 break; 56 break;
57 case "zjgcdyqSlxx": 57 case "zjgcdyqSlxx":
58 form = require("@/views/ywbl/ywSlxx/zjgcdy/slxx.vue"); 58 form = require("@/views/ywbl/slsqxx/zjgcdy/slxx.vue");
59 break; 59 break;
60 case "cfdjxx": 60 case "cfdjxx":
61 form = require("@/views/registerBook/cfdj.vue"); 61 form = require("@/views/registerBook/cfdj.vue");
......
...@@ -211,7 +211,7 @@ export default { ...@@ -211,7 +211,7 @@ export default {
211 record(formdata).then((res) => { 211 record(formdata).then((res) => {
212 if (res.code === 200) { 212 if (res.code === 200) {
213 if (res.result.length === 1) { 213 if (res.result.length === 1) {
214 res.result[0].state ? that.$alert("登簿成功") : that.$alert(res.result[0].msg);; 214 res.result[0].state ? that.$alert("登簿成功!") : that.$alert(res.result[0].msg);;
215 } 215 }
216 else { 216 else {
217 that.$alert('<div>' + res.result[0].ywh + ',' + res.result[0].msg + '</div>', '登簿明细', { 217 that.$alert('<div>' + res.result[0].ywh + ',' + res.result[0].msg + '</div>', '登簿明细', {
...@@ -230,7 +230,7 @@ export default { ...@@ -230,7 +230,7 @@ export default {
230 sendToNext(obj) { 230 sendToNext(obj) {
231 const h = this.$createElement; 231 const h = this.$createElement;
232 this.$msgbox({ 232 this.$msgbox({
233 title: "您确定转出吗?1", 233 title: "您确定转出吗?",
234 message: h("div", { style: "margin: auto" }, [ 234 message: h("div", { style: "margin: auto" }, [
235 h("span", null, "下个环节名称:"), 235 h("span", null, "下个环节名称:"),
236 h("i", { style: "color: teal" }, obj.taskName), 236 h("i", { style: "color: teal" }, obj.taskName),
......
...@@ -122,13 +122,13 @@ ...@@ -122,13 +122,13 @@
122 </el-form-item> 122 </el-form-item>
123 </el-col> 123 </el-col>
124 </el-row> 124 </el-row>
125 <!-- <div class="slxx_title title-block"> 125 <div class="slxx_title title-block">
126 权利人信息 126 权利人信息
127 <div class="triangle"></div> 127 <div class="triangle"></div>
128 </div> --> 128 </div>
129 <el-divider content-position="left"><i 129 <!-- <el-divider content-position="left"><i
130 style="background-color:#3498db;font-size:16px;color:#fff !important;border-radius: 5px 5px 5px 0px;margin-bottom:10px;" 130 style="background-color:#3498db;font-size:16px;color:#fff !important;border-radius: 5px 5px 5px 0px;margin-bottom:10px;"
131 class="el-icon-edit-outline">权利人信息</i></el-divider> 131 class="el-icon-edit-outline">权利人信息</i></el-divider> -->
132 <el-row :gutter="10"> 132 <el-row :gutter="10">
133 <el-col :span="14"> 133 <el-col :span="14">
134 <el-form-item label="共有方式:"> 134 <el-form-item label="共有方式:">
......
...@@ -24,6 +24,7 @@ ...@@ -24,6 +24,7 @@
24 </el-col> 24 </el-col>
25 <el-col :span="2" class="btnColRight"> 25 <el-col :span="2" class="btnColRight">
26 <el-form-item> 26 <el-form-item>
27 <el-button type="primary" @click="resetForm(true)">重置</el-button>
27 <el-button type="primary" @click="handleSearch">查询</el-button> 28 <el-button type="primary" @click="handleSearch">查询</el-button>
28 </el-form-item> 29 </el-form-item>
29 </el-col> 30 </el-col>
......
...@@ -33,6 +33,7 @@ ...@@ -33,6 +33,7 @@
33 </el-col> 33 </el-col>
34 <el-col :span="2" class="btnColRight"> 34 <el-col :span="2" class="btnColRight">
35 <el-form-item> 35 <el-form-item>
36 <el-button type="primary" @click="resetForm(true)">重置</el-button>
36 <el-button type="primary" @click="handleSearch">查询</el-button> 37 <el-button type="primary" @click="handleSearch">查询</el-button>
37 </el-form-item> 38 </el-form-item>
38 </el-col> 39 </el-col>
......
...@@ -48,6 +48,7 @@ ...@@ -48,6 +48,7 @@
48 48
49 <el-col :span="3" class="btnColRight"> 49 <el-col :span="3" class="btnColRight">
50 <el-form-item> 50 <el-form-item>
51 <el-button type="primary" @click="resetForm(true)">重置</el-button>
51 <el-button type="primary" @click="handleSearch">查询</el-button> 52 <el-button type="primary" @click="handleSearch">查询</el-button>
52 </el-form-item> 53 </el-form-item>
53 </el-col> 54 </el-col>
...@@ -98,6 +99,7 @@ ...@@ -98,6 +99,7 @@
98 99
99 <el-col :span="3" class="btnColRight"> 100 <el-col :span="3" class="btnColRight">
100 <el-form-item> 101 <el-form-item>
102 <el-button type="primary" @click="resetForm(true)">重置</el-button>
101 <el-button type="primary" @click="handleSearch">查询</el-button> 103 <el-button type="primary" @click="handleSearch">查询</el-button>
102 </el-form-item> 104 </el-form-item>
103 </el-col> 105 </el-col>
...@@ -268,8 +270,6 @@ ...@@ -268,8 +270,6 @@
268 } 270 }
269 }) 271 })
270 } 272 }
271
272
273 } 273 }
274 } 274 }
275 </script> 275 </script>
......
...@@ -18,6 +18,7 @@ ...@@ -18,6 +18,7 @@
18 </el-col> 18 </el-col>
19 <el-col :span="4" class="btnColRight"> 19 <el-col :span="4" class="btnColRight">
20 <el-form-item> 20 <el-form-item>
21 <el-button type="primary" @click="resetForm(true)">重置</el-button>
21 <el-button type="primary" @click="handleSearch">查询</el-button> 22 <el-button type="primary" @click="handleSearch">查询</el-button>
22 </el-form-item> 23 </el-form-item>
23 </el-col> 24 </el-col>
......
...@@ -18,6 +18,7 @@ ...@@ -18,6 +18,7 @@
18 </el-col> 18 </el-col>
19 <el-col :span="4" class="btnColRight"> 19 <el-col :span="4" class="btnColRight">
20 <el-form-item> 20 <el-form-item>
21 <el-button type="primary" @click="resetForm(true)">重置</el-button>
21 <el-button type="primary" @click="handleSearch">查询</el-button> 22 <el-button type="primary" @click="handleSearch">查询</el-button>
22 </el-form-item> 23 </el-form-item>
23 </el-col> 24 </el-col>
......
...@@ -33,6 +33,7 @@ ...@@ -33,6 +33,7 @@
33 </el-col> 33 </el-col>
34 <el-col :span="2" class="btnColRight"> 34 <el-col :span="2" class="btnColRight">
35 <el-form-item> 35 <el-form-item>
36 <el-button type="primary" @click="resetForm(true)">重置</el-button>
36 <el-button type="primary" @click="handleSearch">查询</el-button> 37 <el-button type="primary" @click="handleSearch">查询</el-button>
37 </el-form-item> 38 </el-form-item>
38 </el-col> 39 </el-col>
......
...@@ -25,6 +25,7 @@ ...@@ -25,6 +25,7 @@
25 </el-col> 25 </el-col>
26 <el-col :span="2" class="btnColRight"> 26 <el-col :span="2" class="btnColRight">
27 <el-form-item> 27 <el-form-item>
28 <el-button type="primary" @click="resetForm(true)">重置</el-button>
28 <el-button type="primary" @click="handleSearch">查询</el-button> 29 <el-button type="primary" @click="handleSearch">查询</el-button>
29 </el-form-item> 30 </el-form-item>
30 </el-col> 31 </el-col>
......
...@@ -25,6 +25,7 @@ ...@@ -25,6 +25,7 @@
25 </el-col> 25 </el-col>
26 <el-col :span="2" class="btnColRight"> 26 <el-col :span="2" class="btnColRight">
27 <el-form-item> 27 <el-form-item>
28 <el-button type="primary" @click="resetForm(true)">重置</el-button>
28 <el-button type="primary" @click="handleSearch">查询</el-button> 29 <el-button type="primary" @click="handleSearch">查询</el-button>
29 </el-form-item> 30 </el-form-item>
30 </el-col> 31 </el-col>
......
...@@ -33,7 +33,7 @@ ...@@ -33,7 +33,7 @@
33 <el-form-item label="权利人"> 33 <el-form-item label="权利人">
34 <el-input 34 <el-input
35 placeholder="请输入权利人" 35 placeholder="请输入权利人"
36 v-model="queryForm.zl" 36 v-model="queryForm.qlr"
37 clearable 37 clearable
38 class="width300px" 38 class="width300px"
39 > 39 >
...@@ -53,6 +53,7 @@ ...@@ -53,6 +53,7 @@
53 </el-col> 53 </el-col>
54 <el-col :span="4" class="btnColRight"> 54 <el-col :span="4" class="btnColRight">
55 <el-form-item> 55 <el-form-item>
56 <el-button type="primary" @click="resetForm(true)">重置</el-button>
56 <el-button type="primary" @click="handleSearch">查询</el-button> 57 <el-button type="primary" @click="handleSearch">查询</el-button>
57 </el-form-item> 58 </el-form-item>
58 </el-col> 59 </el-col>
...@@ -111,8 +112,10 @@ export default { ...@@ -111,8 +112,10 @@ export default {
111 }, 112 },
112 methods: { 113 methods: {
113 queryClick() { 114 queryClick() {
115 this.$startLoading();
114 this.queryForm.sqywbm = this.sqywInfo.djywbm; 116 this.queryForm.sqywbm = this.sqywInfo.djywbm;
115 selectJsydQlxx({ ...this.queryForm, ...this.pageData }).then((res) => { 117 selectJsydQlxx({ ...this.queryForm, ...this.pageData }).then((res) => {
118 this.$endLoading();
116 if (res.code === 200) { 119 if (res.code === 200) {
117 let { total, records } = res.result; 120 let { total, records } = res.result;
118 this.tableData.total = total; 121 this.tableData.total = total;
......
...@@ -18,6 +18,7 @@ ...@@ -18,6 +18,7 @@
18 </el-col> 18 </el-col>
19 <el-col :span="4" class="btnColRight"> 19 <el-col :span="4" class="btnColRight">
20 <el-form-item> 20 <el-form-item>
21 <el-button type="primary" @click="resetForm(true)">重置</el-button>
21 <el-button type="primary" @click="handleSearch">查询</el-button> 22 <el-button type="primary" @click="handleSearch">查询</el-button>
22 </el-form-item> 23 </el-form-item>
23 </el-col> 24 </el-col>
......
...@@ -25,6 +25,7 @@ ...@@ -25,6 +25,7 @@
25 </el-col> 25 </el-col>
26 <el-col :span="2" class="btnColRight"> 26 <el-col :span="2" class="btnColRight">
27 <el-form-item> 27 <el-form-item>
28 <el-button type="primary" @click="resetForm(true)">重置</el-button>
28 <el-button type="primary" @click="handleSearch">查询</el-button> 29 <el-button type="primary" @click="handleSearch">查询</el-button>
29 </el-form-item> 30 </el-form-item>
30 </el-col> 31 </el-col>
......
...@@ -25,6 +25,7 @@ ...@@ -25,6 +25,7 @@
25 </el-col> 25 </el-col>
26 <el-col :span="2" class="btnColRight"> 26 <el-col :span="2" class="btnColRight">
27 <el-form-item> 27 <el-form-item>
28 <el-button type="primary" @click="resetForm(true)">重置</el-button>
28 <el-button type="primary" @click="handleSearch">查询</el-button> 29 <el-button type="primary" @click="handleSearch">查询</el-button>
29 </el-form-item> 30 </el-form-item>
30 </el-col> 31 </el-col>
......
...@@ -25,6 +25,7 @@ ...@@ -25,6 +25,7 @@
25 </el-col> 25 </el-col>
26 <el-col :span="2" class="btnColRight"> 26 <el-col :span="2" class="btnColRight">
27 <el-form-item> 27 <el-form-item>
28 <el-button type="primary" @click="resetForm">重置</el-button>
28 <el-button type="primary" @click="handleSearch">查询</el-button> 29 <el-button type="primary" @click="handleSearch">查询</el-button>
29 </el-form-item> 30 </el-form-item>
30 </el-col> 31 </el-col>
......