Merge branch 'master' of http://yun.pashanhoo.com:9090/bdc/bdcdj-web
Showing
23 changed files
with
798 additions
and
1163 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 | ... | ... |
... | @@ -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 | 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> | ... | ... |
src/views/lpb/lpbContent/ch.vue
0 → 100644
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> | ... | ... |
src/views/lpb/lpbContent/ljzs.vue
0 → 100644
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> |
src/views/lpb/lpbContent/zdys.vue
0 → 100644
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> |
... | @@ -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>', '登簿明细', { | ... | ... |
... | @@ -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> | ... | ... |
-
Please register or sign in to post a comment