Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
a1831b0f by 任超
Options

feat:楼盘表

1 parent b5b2b3f7
Inline Side-by-side
Showing 57 changed files with 12234 additions and 90 deletions
1 export default { 1 export default {
2 SERVERAPI: '/service-bdcdj9', 2 SERVERAPI: '/service-bdcdj-Tian',
3 SERVERCAI: 'service-cai' 3 SERVERCAI: '/service-bdcdj-Tian'
4 } 4 }
...\ No newline at end of file ...\ No newline at end of file
......
1 {
2 "exprotTextAttr": "[属性描述]\n格式版本号=1.0\n数据产生单位=国土资源信息中心\n数据产生日期=2013-06-06\n坐标系=80国家大地坐标系\n几度分带=3\n投影类型=高斯克吕格\n计量单位=米\n带号=36\n精度=0.01\n转换参数=0,0,0,0,0,0,0\n"
3 }
...\ No newline at end of file ...\ No newline at end of file
1 {
2 "pointSymbol": {
3 "bufferSymbol": {
4 "type": "simple-marker",
5 "style": "circle",
6 "color": "black",
7 "size": "8px",
8 "outline": {
9 "color": [ 255, 255, 0 ],
10 "width": 1
11 }
12 }
13 },
14 "lineSymbol": {
15
16 },
17 "fillSymbol": {
18 "defaultSymbol": {
19 "type": "simple-fill",
20 "color": [ 0,233, 245, 0.4 ],
21 "style": "solid",
22 "outline": {
23 "color": "#00e9f5",
24 "width": 1
25 }
26 },
27 "highlightSymbol": {
28 "type": "simple-fill",
29 "color": [ 245,3, 37, 0.4 ],
30 "style": "solid",
31 "outline": {
32 "color": "#f50325",
33 "width": 1
34 }
35 },
36 "importSymbol": {
37 "type": "simple-fill",
38 "color": [ 245,3, 37, 0.4 ],
39 "style": "none",
40 "outline": {
41 "color": "#006cff",
42 "width": 2
43 }
44 },
45 "bufferSymbol": {
46 "type": "simple-fill",
47 "color": [ 86,81, 81, 0.5 ],
48 "style": "solid",
49 "outline": {
50 "color": [45,44,44,1],
51 "width": 2
52 }
53 },
54 "bufferGeoSymbol": {
55 "type": "simple-fill",
56 "color": [ 86,81, 81, 0.5 ],
57 "style": "solid",
58 "outline": {
59 "color": [45,44,44,1],
60 "width": 0
61 }
62 }
63 }
64 }
...\ No newline at end of file ...\ No newline at end of file
1 [{
2 "label":"专题树",
3 "id":"1",
4 "type":"layerGroup",
5 "alpha":100,
6 "children":[
7 {
8 "label":"西安市阎良区",
9 "id":"1-1",
10 "type":"layerGroup",
11 "alpha":100,
12 "children":[{
13 "label":"行政区划",
14 "id":"1-1-1",
15 "type":"layerGroup",
16 "alpha":100,
17 "children":[
18 {
19 "label":"行政区界限",
20 "id":"1-1-1-1",
21 "type":"layer",
22 "layerId":20,
23 "children":null
24 },
25 {
26 "label":"行政区",
27 "id":"1-1-1-2",
28 "type":"layer",
29 "layerId":19,
30 "children":null
31 }
32 ]
33 },
34 {
35 "label":"地籍分区",
36 "id":"1-1-2",
37 "type":"layerGroup",
38 "alpha":100,
39 "children":[
40 {
41 "label":"地籍区",
42 "id":"1-1-2-1",
43 "type":"layer",
44 "layerId":13,
45 "children":null
46 },
47 {
48 "label":"地籍子区",
49 "id":"1-1-2-2",
50 "type":"layer",
51 "layerId":14,
52 "children":null
53 }
54 ]
55 },
56 {
57 "label":"不动产单元",
58 "id":"1-1-3",
59 "type":"layerGroup",
60 "alpha":100,
61 "children":[
62 {
63 "label":"线状定着物",
64 "id":"1-1-3-1",
65 "type":"layer",
66 "layerId":7,
67 "children":null
68 },
69 {
70 "label":"宗海",
71 "id":"1-1-3-2",
72 "type":"layer",
73 "layerId":9,
74 "children":null
75 },
76 {
77 "label":"宗地",
78 "id":"1-1-3-3",
79 "type":"layer",
80 "layerId":8,
81 "children":null
82 },
83 {
84 "label":"林权",
85 "id":"1-1-3-4",
86 "type":"layer",
87 "layerId":5,
88 "children":null
89 },
90 {
91 "label":"构筑物",
92 "id":"1-1-3-5",
93 "type":"layer",
94 "layerId":2,
95 "children":null
96 },
97 {
98 "label":"面状定着物",
99 "id":"1-1-3-6",
100 "type":"layer",
101 "layerId":6,
102 "children":null
103 },
104 {
105 "label":"界址线",
106 "id":"1-1-3-7",
107 "type":"layer",
108 "layerId":4,
109 "children":null
110 },
111 {
112 "label":"点状定着物",
113 "id":"1-1-3-8",
114 "type":"layer",
115 "layerId":1,
116 "children":null
117 },
118 {
119 "label":"自然幢",
120 "id":"1-1-3-9",
121 "type":"layer",
122 "layerId":10,
123 "children":null
124 },
125 {
126 "label":"界址点",
127 "id":"1-1-3-10",
128 "type":"layer",
129 "layerId":4,
130 "children":null
131 }
132 ]
133 },
134 {
135 "label":"自然地理",
136 "id":"1-1-4",
137 "type":"layerGroup",
138 "alpha":100,
139 "children":[
140 {
141 "label":"辅助面",
142 "id":"1-1-4-1",
143 "type":"layer",
144 "layerId":15,
145 "children":null
146 },
147 {
148 "label":"植被",
149 "id":"1-1-4-2",
150 "type":"layer",
151 "layerId":17,
152 "children":null
153 },
154 {
155 "label":"水系",
156 "id":"1-1-4-3",
157 "type":"layer",
158 "layerId":16,
159 "children":null
160 }
161 ]
162 }
163 ]
164 }]
165 }]
...\ No newline at end of file ...\ No newline at end of file
1 [{
2 "layerName": "ZDJBXX",
3 "layerLabel": "宗地",
4 "layerUrl": "https://192.168.2.146:6443/arcgis/rest/services/qj/backupService/MapServer",
5 "id":8,
6 "fieldAliases": {
7 "BSM": "标识码",
8 "YSDM": "要素代码",
9 "ZDDM": "宗地代码",
10 "BDCDYH": "不动产单元号",
11 "ZDTZM": "宗地特征码",
12 "ZL": "坐落",
13 "ZDMJ": "宗地面积",
14 "MJDW": "面积单位",
15 "YT": "用途",
16 "DJ": "等级",
17 "JG": "价格",
18 "QLLX": "权利类型",
19 "QLXZ": "权利性质",
20 "QLSDFS": "权利设定方式",
21 "RJL": "容积率",
22 "JZMD": "建筑密度",
23 "JZXG": "建筑限高",
24 "ZDSZD": "宗地四至-东",
25 "ZDSZN": "宗地四至-南",
26 "ZDSZX": "宗地四至-西",
27 "ZDSZB": "宗地四至-北",
28 "TFH": "图幅号",
29 "DJH": "地籍号",
30 "DAH": "档案号",
31 "BZ": "备注",
32 "ZT": "状态",
33 "YWZT": "业务状态",
34 "XMMC": "项目名称",
35 "BGRQ": "变更日期",
36 "TDZH": "土地证号"
37 }
38 },
39 {
40 "layerName": "ZRZ",
41 "layerLabel": "自然幢",
42 "layerUrl": "https://192.168.2.146:6443/arcgis/rest/services/qj/backupService/MapServer",
43 "id": 10,
44 "fieldAliases": {
45 "YSDM": "要素代码",
46 "BDCDYH": "不动产单元号",
47 "ZDDM": "宗地代码",
48 "ZRZH": "自然幢号",
49 "XMMC": "项目名称",
50 "JZWMC": "建筑物名称",
51 "JGRQ": "竣工日期",
52 "JZWGD": "建筑物高度",
53 "ZZDMJ": "幢占地面积",
54 "ZYDMJ": "幢用地面积",
55 "YCJZMJ": "预测建筑面积",
56 "SCJZMJ": "实测建筑面积",
57 "ZCS": "总层数",
58 "DSCS": "地上层数",
59 "DXCS": "地下层数",
60 "DXSD": "地下深度",
61 "GHYT": "规划用途",
62 "FWJG": "房屋结构",
63 "ZTS": "总套数",
64 "JZWJBYT": "建筑物基本用途",
65 "DAH": "档案号",
66 "BZ": "备注",
67 "ZT": "状态",
68 "YWZT": "业务状态",
69 "BSM": "标识码"
70 }
71 },
72 {
73 "layerName": "DJQ",
74 "layerLabel": "地籍区",
75 "layerUrl": "https://192.168.2.146:6443/arcgis/rest/services/qj/backupService/MapServer",
76 "id": 13,
77 "fieldAliases": {
78 "BSM": "标识码",
79 "YSDM": "要素代码",
80 "DJQDM": "地籍区代码",
81 "DJQMC": "地籍区名称"
82 }
83 },
84 {
85 "layerName": "DJZQ",
86 "layerLabel": "地籍子区",
87 "layerUrl": "https://192.168.2.146:6443/arcgis/rest/services/qj/backupService/MapServer",
88 "id": 14,
89 "fieldAliases": {
90 "BSM": "标识码",
91 "YSDM": "要素代码",
92 "DJZQDM": "地籍子区代码",
93 "DJZQMC": "地籍子区名称"
94 }
95 },
96 {
97 "layerName": "XJZQ",
98 "layerLabel": "行政区",
99 "layerUrl": "https://192.168.2.146:6443/arcgis/rest/services/qj/backupService/MapServer",
100 "id": 19,
101 "fieldAliases": {
102 "BSM": "标识码",
103 "YSDM": "要素代码",
104 "XZQDM": "行政区代码",
105 "XZQMC": "行政区名称",
106 "XZQMJ": "行政区面积"
107 }
108 },
109 {
110 "layerName":"JZD",
111 "layerLabel":"界址点",
112 "layerUrl":"https://192.168.2.146:6443/arcgis/rest/services/qj/backupService/MapServer",
113 "id":3
114 },
115 {
116 "layerName":"JZX",
117 "layerLabel":"界址线",
118 "layerUrl":"https://192.168.2.146:6443/arcgis/rest/services/qj/backupService/MapServer",
119 "id":4
120 }
121 ]
...\ No newline at end of file ...\ No newline at end of file
...@@ -8,7 +8,7 @@ import SERVER from './config' ...@@ -8,7 +8,7 @@ import SERVER from './config'
8 // } 8 // }
9 export function getMenuInfo () { 9 export function getMenuInfo () {
10 return request({ 10 return request({
11 url: SERVER.SERVERCAI + '/rest/user/getUserAuthorizationMenus', 11 url: SERVER.SERVERAPI + '/rest/user/getUserAuthorizationMenus',
12 method: 'get', 12 method: 'get',
13 }) 13 })
14 } 14 }
...\ No newline at end of file ...\ No newline at end of file
......
...@@ -3,10 +3,11 @@ import SERVER from './config' ...@@ -3,10 +3,11 @@ import SERVER from './config'
3 /* 3 /*
4 业务办理-获取收藏业务集合 4 业务办理-获取收藏业务集合
5 */ 5 */
6 export function getCollectBiz () { 6 export function getCollectBiz (headers) {
7 return request({ 7 return request({
8 url: SERVER.SERVERAPI + '/rest/ywbl/BusinessApply/getCollectBiz', 8 url: SERVER.SERVERAPI + '/rest/ywbl/BusinessApply/getCollectBiz',
9 method: 'post' 9 method: 'post',
10 headers
10 }) 11 })
11 } 12 }
12 13
...@@ -16,16 +17,20 @@ export function getCollectBiz () { ...@@ -16,16 +17,20 @@ export function getCollectBiz () {
16 export function getleftMenu () { 17 export function getleftMenu () {
17 return request({ 18 return request({
18 url: SERVER.SERVERAPI + '/rest/ywbl/BusinessApply/getleftMenu', 19 url: SERVER.SERVERAPI + '/rest/ywbl/BusinessApply/getleftMenu',
19 method: 'post' 20 method: 'post',
21 headers: {
22 showLoading: false
23 }
20 }) 24 })
21 } 25 }
22 /* 26 /*
23 业务办理-获取下个节点内容 27 业务办理-获取下个节点内容
24 */ 28 */
25 export function getNextNode (bsmSqyw) { 29 export function getNextNode (bsmSqyw, headers) {
26 return request({ 30 return request({
27 url: SERVER.SERVERAPI + '/rest/ywbl/BusinessApply/getNextNode?parentid=' + bsmSqyw, 31 url: SERVER.SERVERAPI + '/rest/ywbl/BusinessApply/getNextNode?parentid=' + bsmSqyw,
28 method: 'post', 32 method: 'post',
33 headers
29 }) 34 })
30 } 35 }
31 36
...@@ -36,8 +41,7 @@ export function selectScBdcdy (data) { ...@@ -36,8 +41,7 @@ export function selectScBdcdy (data) {
36 return request({ 41 return request({
37 url: SERVER.SERVERAPI + '/rest/ywbl/ywsq/selectScBdcdy', 42 url: SERVER.SERVERAPI + '/rest/ywbl/ywsq/selectScBdcdy',
38 method: 'post', 43 method: 'post',
39 data, 44 data
40 showLoading: true
41 }) 45 })
42 } 46 }
43 47
...@@ -54,12 +58,12 @@ export function selectScBdcdy (data) { ...@@ -54,12 +58,12 @@ export function selectScBdcdy (data) {
54 // } 58 // }
55 59
56 // 待办箱列表查询接口 60 // 待办箱列表查询接口
57 export function searchTaskToDo (data) { 61 export function searchTaskToDo (data, headers) {
58 return request({ 62 return request({
59 url: SERVER.SERVERAPI + '/rest/workBox/search/searchTaskToDo', 63 url: SERVER.SERVERAPI + '/rest/workBox/search/searchTaskToDo',
60 method: 'post', 64 method: 'post',
61 data, 65 data,
62 showLoading: true 66 headers
63 }) 67 })
64 } 68 }
65 // 待办箱/不动产单元删除接口 69 // 待办箱/不动产单元删除接口
...@@ -95,12 +99,12 @@ export function searchTaskDone (data) { ...@@ -95,12 +99,12 @@ export function searchTaskDone (data) {
95 /* 99 /*
96 业务办理-选择权利信息-根据条件进行列表查询 100 业务办理-选择权利信息-根据条件进行列表查询
97 */ 101 */
98 export function selectQlxx (data) { 102 export function selectQlxx (data, headers) {
99 return request({ 103 return request({
100 url: SERVER.SERVERAPI + '/rest/ywbl/ywsq/selectQlxx', 104 url: SERVER.SERVERAPI + '/rest/ywbl/ywsq/selectQlxx',
101 method: 'post', 105 method: 'post',
102 data, 106 data,
103 showLoading: true 107 headers
104 }) 108 })
105 } 109 }
106 /* 110 /*
......
1 <template>
2 <div class="temp">
3 <table class="tempTable" cellspacing="0" cellpadding="0" border="1">
4 <tr>
5 <template v-if="lq == ''">
6 <td colspan="2"><span class="table-title">权利人信息</span></td>
7 <td colspan="2">共有方式</td>
8 </template>
9 <template v-else>
10 <td colspan="2">共有方式</td>
11 </template>
12 <td :colspan="lq == '' ? 8 : 10">
13 <el-row>
14 <el-col :span="14" class="fl" style="line-height:32px">
15 <el-radio-group v-model="gyfs" @change="updateGyfs">
16 <el-radio :label="item.bsm" :disabled="+qszt !== 0 || item.disabled" :key="item.bsm"
17 v-for="item in gyfsList">{{ item.mc }}</el-radio>
18 </el-radio-group>
19 </el-col>
20 <el-col :span="10" class="fr">
21 <!-- <div v-show="qszt=='0'" class="fr" style="margin-right:20px">
22 <el-button class="qlrBtn" size="mini" @click="addRow">
23 <i class="iconfont iconxinzeng"></i> 新增
24 </el-button>
25 <el-button class="qlrBtn" size="mini" @click="changeRow">
26 <i class="iconfont iconbianji"></i> 编辑
27 </el-button>
28 <el-button class="qlrBtn" size="mini" @click="delRow">
29 <i class="iconfont iconshanchu"></i> 删除
30 </el-button>
31 </div>-->
32 <div v-show="+qszt === 0" class="fr" style="margin-right:20px">
33 <el-button class="qlrBtn" size="mini"
34 :disabled="+qszt !== 0 || (tableData.length > 0 && gyfs === 'PSHGSBDCQJDC000000000000DC340010')"
35 @click="addRow">
36 <i class="iconfont iconxinzeng" :disabled="+qszt !== 0"></i> 新增
37 </el-button>
38 <el-button class="qlrBtn" size="mini" :disabled="+qszt !== 0" @click="changeRow">
39 <i class="iconfont iconbianji"></i> 编辑
40 </el-button>
41 <el-button class="qlrBtn" size="mini" :disabled="+qszt !== 0" @click="delRow">
42 <i class="iconfont iconshanchu"></i> 删除
43 </el-button>
44 </div>
45 </el-col>
46 </el-row>
47 </td>
48 </tr>
49 </table>
50
51 <el-table class="qlrTable" :data="tableData" style="width: 100%" @selection-change="handleSelectionChange"
52 @row-dblclick="rowDbclick" border>
53 <el-table-column type="selection" width="40" align="center">
54 </el-table-column>
55 <el-table-column prop="qlrmc" label="权利人名称" align="center">
56 </el-table-column>
57 <el-table-column prop="qlrlxbsm_dictText" label="权利人类型" align="center">
58 </el-table-column>
59 <el-table-column prop="zjzlbsm_dictText" label="证件种类" align="center">
60 </el-table-column>
61 <el-table-column prop="zjh" label="证件号" align="center">
62 </el-table-column>
63 <el-table-column prop="dz" label="通讯地址" align="center">
64 </el-table-column>
65 <el-table-column prop="dh" label="联系电话" align="center">
66 </el-table-column>
67 </el-table>
68 <el-dialog v-dialogDrag :close-on-click-modal="false" title="权利人信息" :visible.sync="dialogVisible"
69 custom-class="insetDialog" append-to-body width="50%">
70 <el-form :model="formData" class="qlrForm">
71 <table class="zdjbxxTable" cellspacing="0" cellpadding="0" border="1">
72 <tr>
73 <td colspan="4" class="tdright"><i class="requisite">*</i>权利人名称</td>
74 <td colspan="6">
75 <el-input v-model="formData.qlrmc" ref="qlrmc" @blur="inputBlur($event)"></el-input>
76 </td>
77 <td colspan="4" class="tdright"><i class="requisite">*</i>权利人类型</td>
78 <td colspan="6">
79 <el-select class="formSelect" v-model="formData.qlrlxbsm" ref="qlrlxbsm">
80 <el-option v-for="item in $store.state.qlrlxList" :key="item.bsm" :label="item.mc" :value="item.bsm">
81 </el-option>
82 </el-select>
83 </td>
84 </tr>
85 <tr>
86 <td colspan="4" class="tdright"><i class="requisite">*</i>证件类型</td>
87 <td colspan="6">
88 <el-select class="formSelect" v-model="formData.zjzlbsm" ref="zjzlbsm">
89 <el-option v-for="item in $store.state.zjzlList" :key="item.bsm" :label="item.mc" :value="item.bsm">
90 </el-option>
91 </el-select>
92 </td>
93 <td colspan="4" class="tdright"><i class="requisite">*</i>证件号</td>
94 <td colspan="6">
95 <el-input maxlength="18" v-model="formData.zjh" ref="zjh" @blur="inputBlur($event)"></el-input>
96 </td>
97 </tr>
98 <tr>
99 <td colspan="4" class="tdright"><i class="requisite">*</i>电话</td>
100 <td colspan="6">
101 <!-- @blur="inputBlur($event)"-->
102 <el-input v-model="formData.dh" ref="dh" @blur="inputBlur($event)"></el-input>
103 </td>
104 <td colspan="4" class="tdright"><i class="requisite">*</i>地址</td>
105 <td colspan="6">
106 <el-input v-model="formData.dz" ref="dz" @blur="inputBlur($event)"></el-input>
107 </td>
108 </tr>
109 <tr>
110 <td colspan="4" class="tdright">国家</td>
111 <td colspan="6">
112 <el-select class="formSelect" v-model="formData.gjbsm">
113 <el-option v-for="item in $store.state.gjList" :key="item.bsm" :label="item.mc" :value="item.bsm">
114 </el-option>
115 </el-select>
116 </td>
117 <td colspan="4" class="tdright">户籍所在省市</td>
118 <td colspan="6">
119 <el-select class="formSelect" v-model="formData.hjszssbsm">
120 <el-option v-for="item in $store.state.ssList" :key="item.bsm" :label="item.mc" :value="item.bsm">
121 </el-option>
122 </el-select>
123 </td>
124 </tr>
125 <tr>
126 <td colspan="4" class="tdright">性别</td>
127 <td colspan="6">
128 <el-select class="formSelect" v-model="formData.xbbsm">
129 <el-option v-for="item in $store.state.xbList" :key="item.bsm" :label="item.mc" :value="item.bsm">
130 </el-option>
131 </el-select>
132 </td>
133 <td colspan="4" class="tdright">邮编</td>
134 <td colspan="6">
135 <el-input v-model="formData.yb" />
136 </td>
137 </tr>
138 <tr>
139 <td colspan="4" class="tdright">所属行业</td>
140 <td colspan="6">
141 <el-select class="formSelect" v-model="formData.sshy">
142 <el-option v-for="item in $store.state.sshyList" :key="item.bsm" :label="item.mc" :value="item.bsm">
143 </el-option>
144 </el-select>
145 </td>
146 <td colspan="4" class="tdright">电子邮件</td>
147 <td colspan="6">
148 <el-input v-model="formData.dzyj" />
149 </td>
150 </tr>
151 <tr>
152 <th colspan="20">法人信息</th>
153 </tr>
154 <tr>
155 <td colspan="4" class="tdright">法定代表人或负责人姓名</td>
156 <td colspan="6">
157 <el-input v-model="formData.fr.dlrfrmc" />
158 </td>
159 <td colspan="4" class="tdright">证件类型</td>
160 <td colspan="6">
161 <el-select class="formSelect" v-model="formData.fr.zjzlbsm">
162 <el-option v-for="item in $store.state.zjzlList" :key="item.bsm" :label="item.mc" :value="item.bsm">
163 </el-option>
164 </el-select>
165 </td>
166 </tr>
167 <tr>
168 <td colspan="4" class="tdright">证件号码</td>
169 <td colspan="6">
170 <el-input v-model="formData.fr.zjh" />
171 </td>
172 <td colspan="4" class="tdright">电话</td>
173 <td colspan="6">
174 <el-input v-model="formData.fr.dh" />
175 </td>
176 </tr>
177 <tr>
178 <th colspan="20">代理人信息</th>
179 </tr>
180 <template v-for="(item, index) in formData.dlrList">
181 <tr :key="item.index">
182 <td :rowspan="(formData.dlrList.length - 1) * 2 + 2" v-if="index == 0" class="btnCol">
183 <span :style="{ 'padding-top': (formData.dlrList.length - 1) * 36 + 20 + 'px' }">
184 <i v-show="index == 0" class="iconfont iconicon-test2" @click="handleClick(item, index, 'add')"></i>
185 </span>
186 <!-- <div class="line" v-show=" index != formData.dlrList.length-1"></div> -->
187 </td>
188 <td rowspan="2" class="minusBtnCol">
189 <span>
190 <i class="iconfont icon-" @click="handleClick(item, index, 'minus')"></i>
191 </span>
192 </td>
193 <td class="tdright" colspan="2">代理人姓名</td>
194 <td colspan="6">
195 <el-input v-model="item.dlrfrmc" />
196 </td>
197 <td colspan="4" class="tdright">证件类型</td>
198 <td colspan="6">
199 <el-select class="formSelect" v-model="item.zjzlbsm">
200 <el-option v-for="item in $store.state.zjzlList" :key="item.bsm" :label="item.mc" :value="item.bsm">
201 </el-option>
202 </el-select>
203 </td>
204 </tr>
205 <!-- <tr :key="item.dh">-->
206 <tr :key="'dh' + index">
207 <td class="tdright" colspan="2">证件号码</td>
208 <td colspan="6">
209 <el-input v-model="item.zjh" />
210 </td>
211 <td colspan="4" class="tdright">电话</td>
212 <td colspan="6">
213 <el-input v-model="item.dh" />
214 </td>
215 </tr>
216 </template>
217
218 <tr>
219 <th colspan="20">权利信息</th>
220 </tr>
221 <tr>
222 <td colspan="4" class="tdright">共有方式</td>
223 <td colspan="6">
224 <el-select class="formSelect" v-model="formData.gyfsbsm" disabled>
225 <el-option v-for="item in $store.state.gyfsList" :key="item.bsm" :label="item.mc" :value="item.bsm">
226 </el-option>
227 </el-select>
228 </td>
229 <td colspan="4" class="tdright">权利比例(%)</td>
230 <td colspan="6">
231 <el-input v-model="formData.qlbl"></el-input>
232 </td>
233 </tr>
234 <tr>
235 <td colspan="4" class="tdright">房产证号</td>
236 <td colspan="6">
237 <el-input v-model="formData.fczh"></el-input>
238 </td>
239 <td colspan="4" class="tdright">土地证号</td>
240 <td colspan="6">
241 <el-input v-model="formData.tdzh"></el-input>
242 </td>
243 </tr>
244 <tr>
245 <td colspan="4" class="tdright">共有情况</td>
246 <td colspan="12">
247 <el-input v-model="formData.gyqk"></el-input>
248 </td>
249 </tr>
250 </table>
251 </el-form>
252 <div class="dialog-footer">
253 <el-button type="primary" @click="addNewQlrInfo">确 定</el-button>
254 <el-button @click="dialogVisible = false">取 消</el-button>
255 </div>
256 </el-dialog>
257 </div>
258 </template>
259
260 <script>
261 // import { getDdicByMC } from "@api/common";
262 // import { insertQlrDlrFr, getQlrInfoByGlbsm, updateQlrDlrFr, deleteQlrDlrFrByQlrbsm, updateGyGyQlrQk, getQlrByGlbsmAndType } from "@api/qlr";
263
264 export default {
265 props: {
266 qszt: {
267 type: String,
268 default: "0",
269 },
270 title: {
271 type: String,
272 default: "",
273 },
274 topHeight: {
275 type: String,
276 default: "15vh",
277 },
278 bsm: {
279 type: String,
280 default: "",
281 },
282 type: {
283 type: String,
284 default: "",
285 },
286 lq: {
287 type: String,
288 default: "",
289 }
290 },
291 data () {
292 return {
293 update: false,
294 gyfs: this.$store.state.gyfsList[0].bsm,
295 tableData: [],
296 gyfsList: [],
297 //表格选中项
298 multipleSelection: [],
299 dialogVisible: false,
300 formData: {
301 addQjDlrFrRequest: [],
302 dlrList: [
303 {
304 dh: "",
305 dlrfrmc: "",
306 qlrbsm: "",
307 zjh: "",
308 zjzlbsm: "",
309 },
310 ],
311 fr: {
312 dh: "",
313 dlrfrmc: "",
314 qlrbsm: "",
315 zjh: "",
316 zjzlbsm: "",
317 },
318 bz: "",
319 dh: "",
320 dz: "",
321 dzyj: "",
322 fczh: "",
323 fzjg: "",
324 gjbsm: "PSHGSBDCQJDC000000000000DC350010", //默认中国
325 glbsm: "",
326 gyfsbsm: "",
327 gyqk: "",
328 gzdw: "",
329 hjszssbsm: "",
330 isdel: 0,
331 qlbl: "",
332 qlrlxbsm: "",
333 qlrmc: "",
334 sshy: "",
335 sxh: 0,
336 tdzh: "",
337 xbbsm: "",
338 yb: "",
339 zjh: "",
340 zjzlbsm: "",
341 lqqlrtype: ""
342 },
343 glbsm: '',
344 rules: [],
345 };
346 },
347 methods: {
348 inputBlur (e) {
349 if (e.target.value != '') {
350 e.target.style.border = ""
351 } else {
352 e.target.style.border = "1px solid red";
353 e.target.style.boxSizing = 'border-box';
354 }
355 },
356
357 //新增行数据
358 addRow () {
359
360 console.log(this.gyfs, '共有方式')
361
362 this.update = false;
363 let flag = false;
364 for (let i = 0; i < this.$store.state.gyfsList.length; i++) {
365 let item = this.$store.state.gyfsList[i];
366 if (item.mc === "单独所有" && item.bsm === this.gyfs) {
367 flag = true;
368 }
369 }
370 if (flag) {
371 if (this.tableData.length > 0) {
372 this.$message({
373 message: "当前方式不可再新增权利人",
374 type: "warning",
375 });
376 } else {
377 this.formData.gyfsbsm = this.gyfs;
378 this.dialogVisible = true;
379 }
380 } else {
381 this.formData.gyfsbsm = this.gyfs;
382 this.dialogVisible = true;
383 }
384 },
385 //确认权利人信息按钮；可以进行新增；可以进行更新；
386 addNewQlrInfo () {
387
388 this.rules = [
389 {
390 data: this.formData.qlrmc,
391 name: '权利人名称',
392 dom: this.$refs.qlrmc,
393 rule: /^\s*$/g, //非空
394 },
395 {
396 data: this.formData.qlrlxbsm,
397 name: '权利人类型',
398 dom: this.$refs.qlrlxbsm,
399 rule: /^\s*$/g, //非空
400 },
401 {
402 data: this.formData.zjzlbsm,
403 name: '证件类型',
404 dom: this.$refs.zjzlbsm,
405 rule: /^\s*$/g, //非空
406 },
407 {
408 data: this.formData.zjh,
409 name: '证件号',
410 dom: this.$refs.zjh,
411 rule: /^\s*$/g, //非空
412 },
413 {
414 data: this.formData.dh,
415 name: '电话',
416 dom: this.$refs.dh,
417 rule: /^\s*$/g, //非空
418 },
419 {
420 data: this.formData.dz,
421 name: '地址',
422 dom: this.$refs.dz,
423 rule: /^\s*$/g, //非空
424 },
425 ]
426 let flag = true;
427 this.rules.forEach(item => {
428 if (item.rule.test(item.data) || item.data == null) {
429 if (item.dom.$el) {
430 item.dom.$el.style.border = '1px solid red';
431 item.dom.$el.style.boxSizing = 'border-box';
432 } else {
433 item.dom.style.border = '1px solid red';
434 item.dom.style.boxSizing = 'border-box';
435 }
436 flag = false;
437 return false
438 }
439 console.log(this.tableData, '权利人信息')
440 console.log(this.$store.state.gyfsList[0].bsm, '确定之后共有方式')
441 })
442 this.$nextTick(() => {
443 if (flag) {
444 //todo 权利人页面调整
445 this.formData.addQjDlrFrRequest = [];
446 this.formData.glbsm = this.bsm;
447 //将代理人，法人数据合在一起，名称为addQjDlrFrRequest；
448 //法人的type字段类型为0,
449 this.formData.fr.type = 0;
450 this.formData.addQjDlrFrRequest.push(this.formData.fr);
451 for (let k = 0; k < this.formData.dlrList.length; k++) {
452 //代理人的type字段类型为1,
453 this.formData.dlrList[k].type = 1;
454 this.formData.addQjDlrFrRequest.push(this.formData.dlrList[k]);
455 }
456 //林权权利人类型判断
457 this.formData.lqqlrtype = this.lq;
458 //如果是从更新按钮点击确定的则进行更新操作，如果不是，则进行添加操作
459 if (this.update) {
460 console.log(this.formData)
461 updateQlrDlrFr(this.formData).then((res) => {
462 if (res.code === 200) {
463 this.dialogVisible = false;
464 this.$message.success("修改完成！");
465 this.getQlrInfo(this.bsm);
466 this.update = false;
467 }
468 })
469 } else {
470 insertQlrDlrFr(this.formData).then((res) => {
471 if (res.code === 200) {
472 this.dialogVisible = false;
473 this.tableData.push(this.formData);
474 this.getQlrInfo(this.bsm);
475 Object.assign(this.$data, this.$options.data())
476
477 }
478 })
479 }
480 }
481 })
482
483
484 },
485 //修改行数据
486 changeRow () {
487 if (this.multipleSelection.length === 1) {
488 this.dialogVisible = true;
489 this.update = true;
490 this.formData = this.multipleSelection[0];
491 if (this.multipleSelection[0].frList.length > 0) {
492 this.formData.fr = this.multipleSelection[0].frList[0];
493 }
494 } else {
495 this.$message({
496 message: "请选择一条信息后继续操作",
497 type: "warning",
498 });
499 }
500 },
501
502 updateGyfs (val) {
503 console.log(val, this.type)
504 updateGyGyQlrQk(this.bsm, this.type, val).then((res) => {
505 if (res.code === 200) {
506 console.log("修改完成！")
507 //todo 修改该建筑物的所有权利人的相关共有方式
508 }
509 })
510 },
511
512 //父组件改变子组件的共有方式
513 changeGyfs (val) {
514 this.gyfs = val;
515 },
516
517 //行双击事件
518 rowDbclick (row) {
519 if (+this.qszt == 0) {
520 this.dialogVisible = true;
521 this.update = true;
522 this.formData = row;
523 if (row.frList.length > 0) {
524 this.formData.fr = row.frList[0];
525 }
526 }
527 },
528
529 // inputBlur(e){
530 // if(e.target.value!=''){
531 // console.log(e.target.value)
532 // console.log(!(/^1(3|4|5|6|7|8|9)d{9}$/.test(e.target.value)))
533 // if(!(/^1(3|4|5|6|7|8|9)d{9}$/.test(e.target.value))){
534 // e.target.style.border="1px solid red";
535 // e.target.style.boxSizing = 'border-box';
536 // }else {
537 // e.target.style.border=""
538 // }
539 // }else{
540 // e.target.style.border="1px solid red";
541 // e.target.style.boxSizing = 'border-box';
542 // }
543 // },
544
545 //删除行数据
546 delRow () {
547 if (this.multipleSelection.length > 0) {
548 let qlrbsms = [];
549 for (let i = 0; i < this.multipleSelection.length; i++) {
550 qlrbsms.push(this.multipleSelection[i].qlrbsm)
551 }
552 console.log(qlrbsms)
553 deleteQlrDlrFrByQlrbsm(qlrbsms).then((res) => {
554 if (res.code === 200) {
555 this.$message.success("删除完成！")
556 this.getQlrInfo(this.bsm);
557 }
558 })
559 } else {
560 this.$message({
561 message: "请至少选择一条信息后继续操作",
562 type: "warning",
563 });
564 }
565 },
566 //选中表格某一项
567 handleSelectionChange (val) {
568 this.multipleSelection = val;
569 },
570
571 //供父组件调用来获取共有方式
572 getQlgyfsData () {
573 return this.gyfs;
574 },
575 //供父组件调用来获取权利人表格数据
576 getQlrxxData () {
577 return this.tableData;
578 },
579 //增删代理人
580 handleClick (obj, ind, type) {
581 if (type === "add") {
582 this.formData.dlrList.push({
583 id: Math.random(),
584 dh: "",
585 dlrfrmc: "",
586 qlrbsm: "",
587 zjh: "",
588 zjzlbsm: "",
589 });
590 } else {
591 this.formData.dlrList.forEach((item, index) => {
592 if (index == ind && this.formData.dlrList.length > 1) {
593 this.formData.dlrList.splice(ind, 1);
594 }
595 });
596 }
597 },
598 getQlrInfo (bsm) {
599 if (this.lq == "") {
600 getQlrInfoByGlbsm(bsm).then((res) => {
601 if (res.code) {
602 if (res.result != null) {
603 this.tableData = res.result;
604 if (this.tableData.length === 0) {
605 this.gyfs = this.$store.state.gyfsList[0].bsm;
606 } else {
607 this.gyfs = res.result[0].gyfsbsm;
608 }
609 }
610 }
611 })
612 } else {
613 let params = {
614 bsm: bsm,
615 type: this.lq
616 }
617 getQlrByGlbsmAndType(params).then((res) => {
618 if (res.code) {
619 if (res.result != null) {
620 this.tableData = res.result;
621 if (this.tableData.length === 0) {
622 this.gyfs = this.$store.state.gyfsList[0].bsm;
623 } else {
624 this.gyfs = res.result[0].gyfsbsm;
625 }
626 }
627 }
628 })
629 }
630 }
631 },
632 created () {
633 this.gyfsList = this.$store.state.gyfsList;
634 },
635 mounted () {
636 this.getQlrInfo(this.bsm);
637 },
638 watch: {
639 tableData: {
640 handler: function (v) {
641 this.gyfsList[0].disabled = v.length > 1;
642 },
643 deep: true
644 },
645 dialogVisible (n) {
646 if (n === false) {
647 this.formData = {
648 addQjDlrFrRequest: [],
649 dlrList: [
650 {
651 dh: "",
652 dlrfrmc: "",
653 qlrbsm: "",
654 zjh: "",
655 zjzlbsm: "",
656 },
657 ],
658 fr: {
659 dh: "",
660 dlrfrmc: "",
661 qlrbsm: "",
662 zjh: "",
663 zjzlbsm: "",
664 },
665 bz: "",
666 dh: "",
667 dz: "",
668 dzyj: "",
669 fczh: "",
670 fzjg: "",
671 gjbsm: "PSHGSBDCQJDC000000000000DC350010", //默认中国
672 glbsm: "",
673 gyfsbsm: "",
674 gyqk: "",
675 gzdw: "",
676 hjszssbsm: "",
677 isdel: 0,
678 qlbl: "",
679 qlrlxbsm: "",
680 qlrmc: "",
681 sshy: "",
682 sxh: 0,
683 tdzh: "",
684 xbbsm: "",
685 yb: "",
686 zjh: "",
687 zjzlbsm: "",
688 }
689 }
690 },
691
692 "formData.qlrlxbsm": function (val) {
693 if (val != '') {
694 this.$refs.qlrlxbsm.$el.style.border = '';
695 }
696 },
697 }
698 };
699 </script>
700 <style lang="scss">
701 .temp {
702 width: 100%;
703
704 table {
705 border-bottom: 0;
706 background-color: #fff;
707 font-size: 14px;
708 width: 100%;
709 table-layout: fixed;
710
711 .qlrBtn {
712 border: 0;
713 font-size: 14px;
714 }
715
716 .qlrBtn:hover {
717 background-color: none !important;
718 }
719
720 .iconfont {
721 font-size: 14px !important;
722 }
723
724 .span {
725 color: #409eff;
726 margin-right: 10px;
727 cursor: pointer;
728 }
729
730 .noEdit {
731 color: #606266;
732 margin-right: 10px;
733 cursor: not-allowed;
734 }
735
736 .el-radio {
737 margin-right: 20px !important;
738 }
739
740 td {
741 text-align: center;
742 padding: 8px 0;
743 }
744 }
745
746 .table-title {
747 font-weight: 700;
748 font-size: 15px;
749 }
750
751 .el-table th {
752 background-color: #fff !important;
753 }
754
755 el-table td,
756 .el-table th.is-leaf,
757 .el-table--border,
758 .el-table--group {
759 border-color: black;
760 }
761
762 .el-table--border::after,
763 .el-table--group::after,
764 .el-table::before {
765 background-color: rgba(0, 0, 0, 0);
766 }
767
768 .el-table--border td,
769 .el-table--border th,
770 .el-table__body-wrapper .el-table--border.is-scrolling-left~.el-table__fixed {
771 border-right: 1px solid#E6E6E6;
772 }
773
774 .el-table td,
775 .el-table th {
776 padding: 12px 0;
777 color: #333 !important;
778 font-weight: normal;
779 }
780
781 .el-table td,
782 .el-table th.is-leaf {
783 border-bottom: 1px solid#E6E6E6;
784 border-color: #E6E6E6 !important;
785 }
786
787 .qlrTable {
788 border-color: #E6E6E6 !important;
789 border-bottom: 0;
790 border-right: 0;
791 position: relative;
792 top: -1px;
793
794 .el-input__inner {
795 height: 20px;
796 margin: 0;
797 line-height: 20px;
798 outline: none;
799 border: none;
800 color: #606764;
801 overflow: visible;
802 cursor: text;
803 text-align: center;
804 }
805 }
806 }
807
808 .insetDialog {
809 .qlrForm {
810 height: 500px;
811 overflow-y: scroll;
812 }
813
814 .zdjbxxTable {
815 margin: 10px 0;
816 background-color: #fff;
817 font-size: 14px;
818 width: 100%;
819 border-bottom: 1px solid #000;
820
821 .btnCol,
822 .minusBtnCol {
823 position: relative;
824 padding-right: 0;
825
826 span {
827 display: inline-block;
828 width: 100%;
829 height: 100%;
830 position: relative;
831 box-sizing: border-box;
832 padding-right: 10px;
833 padding-top: 20px;
834 }
835
836 .line {
837 width: 100%;
838 height: 2px;
839 background: #fff;
840 }
841
842 i {
843 color: #66b1ff;
844 font-size: 30px;
845 cursor: pointer;
846 z-index: 1;
847 }
848 }
849
850 .minusBtnCol {
851 i {
852 color: #FA6400;
853 }
854 }
855
856 th {
857 height: 36px;
858 line-height: 36px;
859 }
860
861 td {
862 text-align: right;
863 height: 36px;
864 }
865
866 /deep/.el-input__inner {
867 margin: 0;
868 height: 36px;
869 outline: none;
870 border: none;
871 color: #606764;
872 overflow: visible;
873 text-align: left;
874 cursor: text;
875 }
876
877 .percent68 {
878 width: 68% !important;
879 float: left;
880 position: relative;
881 top: 7px;
882 }
883
884 .percent30 {
885 width: 30% !important;
886 float: left;
887 }
888
889 .el-input__icon {
890 line-height: 37px;
891 }
892
893 .el-select {
894 width: 100%;
895 }
896 }
897
898 .dialog-footer {
899 width: 160px;
900 margin: 20px auto 0;
901 }
902 }
903 </style>
1 <template>
2 <div class="temp">
3 <div class="qlxzAdd fl">
4 <span>权利性质</span>
5 <i class="iconfont iconicon-test2" v-if="formData.qszt == '0'" @click="handleClick(0, 'add')"></i>
6 <i class="iconfont iconicon-test2" v-if="formData.qszt != '0'" style="cursor: not-allowed;"></i>
7 </div>
8 <el-row class="qlxzModule fl" v-for="(items, index) in countList" :key="items.id">
9 <template v-for="(childItem, childIndex) in items.list">
10 <el-col :span="1" class="btnCol " :key="childIndex + '1'" :class="childIndex > 0 ? 'childYT noTopBorder' : ''">
11 <i v-show="childIndex == 0 && formData.qszt == '0'"
12 :style="{ 'margin-top': (items.list.length - 1) * 57 - 18 + 'px' }" class="iconfont icon- qlxzMinus"
13 @click="handleClick(index, 'minus')"></i>
14 <i v-show="childIndex == 0 && formData.qszt != '0'"
15 :style="{ 'margin-top': (items.list.length - 1) * 57 - 18 + 'px' }" class="iconfont icon- qlxzMinus"
16 style="cursor: not-allowed;"></i>
17 <div :class="items.hasNotBorder ? 'itemShow whiteItem' : 'whiteItem'" v-if="items.isInside"></div>
18 </el-col>
19 <el-col :span="2" class="btnCol tdytAdd" :key="childIndex + '17'"
20 :class="childIndex > 0 ? 'childYT noTopBorder' : ''">
21 <template>
22 <span v-show="childIndex == 0"
23 :style="{ 'margin-top': (items.list.length - 1) * 57 - 40 + 'px' }">土地用途</span>
24 <i class="iconfont iconicon-test1" v-show="childIndex == 0 && formData.qszt == '0'"
25 :style="{ 'margin-top': (items.list.length - 1) * 57 + 'px' }"
26 @click="handleInClick(index, childIndex, 'add')"></i>
27 <i class="iconfont iconicon-test1" v-show="childIndex == 0 && formData.qszt != '0'"
28 :style="{ 'margin-top': (items.list.length - 1) * 57 + 'px' }" style="cursor: not-allowed;"></i>
29 </template>
30 </el-col>
31 <el-col :span="1" class="btnCol tdytMinus pr10" :key="childIndex + '18'"
32 :class="childIndex > 0 ? 'childYT' : ''">
33 <i class="iconfont iconicon-test" v-if="formData.qszt == '0'"
34 @click="handleInClick(index, childIndex, 'minus')"></i>
35 <i class="iconfont iconicon-test" v-if="formData.qszt != '0'" style="cursor: not-allowed;"></i>
36 </el-col>
37 <template v-if="hasSyqx">
38 <el-col :span="3" :key="childIndex + '7'" :class="childIndex > 0 ? 'childYT' : ''">
39 <ul>
40 <li class="pr10"><i class="requisite">*</i>批准用途</li>
41 <li class="pr10"><i class="requisite">*</i>实际用途</li>
42 <li class="pr10"><i class="requisite">*</i>土地使用起始时间</li>
43 </ul>
44 </el-col>
45 <el-col :span="4" :key="childIndex + '6'" :class="childIndex > 0 ? 'childYT' : ''">
46 <ul>
47 <li>
48 <el-select-tree class="formSelect percent30" v-if="show" :default-expand-all="defaultExpandAll"
49 ref="pzytdm" :multiple="multiple" :placeholder="placeholder" :disabled="formData.qszt != '0'"
50 :data="$store.state.tdytList" :props="treeProps" :check-strictly="checkStrictly"
51 :clearable="clearable" v-model="childItem.pzytdm"></el-select-tree>
52 </li>
53 <li>
54 <el-select-tree class="formSelect percent30" v-if="show" :default-expand-all="defaultExpandAll"
55 ref="sjytdm" :multiple="multiple" :placeholder="placeholder" :disabled="formData.qszt != '0'"
56 :data="$store.state.tdytList" :props="treeProps" :check-strictly="checkStrictly"
57 :clearable="clearable" v-model="childItem.sjytdm"></el-select-tree>
58 </li>
59 <li>
60 <el-date-picker :disabled="formData.qszt != '0'" v-model="childItem.tdsyqssj" type="date" ref="tdsyqssj"
61 :picker-options="childItem.pickerStart" value-format="yyyy-MM-dd" placeholder="选择日期"
62 @blur="inputBlur($event, true)" @input="startTime(index, childIndex)">
63 </el-date-picker>
64 </li>
65 </ul>
66 </el-col>
67 <el-col :span="3" :key="childIndex + '5'" :class="childIndex > 0 ? 'childYT' : ''">
68 <ul>
69 <li class="pr10">地类编码</li>
70 <li class="pr10">地类编码</li>
71 <li class="pr10"><i class="requisite">*</i>年限</li>
72 </ul>
73 </el-col>
74 <el-col :span="3" :key="childIndex + '4'" :class="childIndex > 0 ? 'childYT' : ''">
75 <ul>
76 <li>
77 <input type="text" style="top: -1px;" :disabled="formData.qszt != '0'" v-model="childItem.pzytdm"
78 class="formInput" />
79 </li>
80 <li>
81 <input type="text" :disabled="formData.qszt != '0'" v-model="childItem.sjytdm" class="formInput" />
82 </li>
83 <li>
84 <input type="text" ref="syqx" @blur="inputBlur($event, false)" maxlength="3"
85 onkeyup="value=value.replace(/[^\d]/g,'')"
86 @input="sumTime(index, childIndex, childItem.syqx, childItem.syqx)" :disabled="formData.qszt != '0'"
87 v-model="childItem.syqx" class="formInput" />
88 </li>
89 </ul>
90 </el-col>
91 <el-col class="pr10" :span="3" :key="childIndex + '2'" :class="childIndex > 0 ? 'childYT' : ''">
92 <ul>
93 <li>等级</li>
94 <li>等级</li>
95 <li><i class="requisite">*</i>土地使用结束时间</li>
96 </ul>
97 </el-col>
98 <el-col :span="4" :key="childIndex + '3'" class="noRightBorder" :class="childIndex > 0 ? 'childYT ' : ''">
99 <ul>
100 <li>
101 <el-select :disabled="formData.qszt != '0'" class="formSelect percent30" v-model="childItem.pzdjbsm">
102 <el-option v-for="item in $store.state.tddjList" :key="item.bsm" :label="item.mc" :value="item.bsm">
103 </el-option>
104 </el-select>
105 </li>
106 <li>
107 <el-select :disabled="formData.qszt != '0'" class="formSelect percent30" v-model="childItem.sjdjbsm">
108 <el-option v-for="item in $store.state.tddjList" :key="item.bsm" :label="item.mc" :value="item.bsm">
109 </el-option>
110 </el-select>
111 </li>
112 <li>
113 <el-date-picker :disabled="formData.qszt != '0'" v-model="childItem.tdsyjssj" type="date" ref="tdsyjssj"
114 @blur="inputBlur($event, true)" :picker-options="childItem.pickerEnd"
115 @input="endTime(index, childIndex, $event)" value-format="yyyy-MM-dd" placeholder="选择日期">
116 </el-date-picker>
117 </li>
118 </ul>
119 </el-col>
120 </template>
121 <template v-if="!hasSyqx">
122 <el-col :span="5" :key="childIndex + '7'" :class="childIndex > 0 ? 'childYT' : ''">
123 <ul>
124 <li class="pr10"><i class="requisite">*</i>批准用途</li>
125 <li class="pr10"><i class="requisite">*</i>实际用途</li>
126 <li class="pr10"><i class="requisite">*</i>土地使用起始时间</li>
127 </ul>
128 </el-col>
129 <el-col :span="5" :key="childIndex + '6'" :class="childIndex > 0 ? 'childYT' : ''">
130 <ul>
131 <li>
132 <el-select-tree v-if="show" class="formSelect percent30" :default-expand-all="defaultExpandAll"
133 ref="pzytdm" :multiple="multiple" :placeholder="placeholder" :disabled="formData.qszt != '0'"
134 :data="$store.state.tdytList" :props="treeProps" :check-strictly="checkStrictly"
135 :clearable="clearable" v-model="childItem.pzytdm"></el-select-tree>
136 </li>
137 <li>
138 <el-select-tree v-if="show" class="formSelect percent30" :default-expand-all="defaultExpandAll"
139 ref="sjytdm" :multiple="multiple" :placeholder="placeholder" :disabled="formData.qszt != '0'"
140 :data="$store.state.tdytList" :props="treeProps" :check-strictly="checkStrictly"
141 :clearable="clearable" v-model="childItem.sjytdm"></el-select-tree>
142 </li>
143 <li>
144 <el-date-picker v-model="childItem.tdsyqssj" ref="tdsyqssj" :disabled="formData.qszt != '0'"
145 :picker-options="childItem.pickerStart" type="date" value-format="yyyy-MM-dd" placeholder="选择日期"
146 @blur="inputBlur($event, true)" @input="startTime(index, childIndex)">
147 </el-date-picker>
148 </li>
149 </ul>
150 </el-col>
151 <el-col :span="5" :key="childIndex + '5'" :class="childIndex > 0 ? 'childYT' : ''">
152 <ul>
153 <li class="pr10">地类编码</li>
154 <li class="pr10">地类编码</li>
155 <li class="pr10"><i class="requisite">*</i>土地使用结束时间</li>
156 </ul>
157 </el-col>
158 <el-col :span="5" :key="childIndex + '4'" :class="childIndex > 0 ? 'childYT' : ''">
159 <ul>
160 <li>
161 <input type="text" style="top: -1px;" :disabled="formData.qszt != '0'" v-model="childItem.pzytdm"
162 class="formInput" />
163 </li>
164 <li>
165 <input type="text" :disabled="formData.qszt != '0'" v-model="childItem.sjytdm" class="formInput" />
166 </li>
167 <li>
168 <el-date-picker v-model="childItem.tdsyjssj" :disabled="formData.qszt != '0'" ref="tdsyjssj" type="date"
169 value-format="yyyy-MM-dd" :picker-options="childItem.pickerEnd" placeholder="选择日期"
170 @blur="inputBlur($event, true)" @input="endTime(index, childIndex)">
171 </el-date-picker>
172 </li>
173 </ul>
174 </el-col>
175 </template>
176 </template>
177
178 <div class="title">
179 <el-select-tree v-if="show" class="formSelect" :disabled="formData.qszt != '0'"
180 :default-expand-all="defaultExpandAll" :multiple="multiple" :placeholder="placeholder"
181 :data="$store.state.qlxzList" :props="treeProps" :check-strictly="checkStrictly" :clearable="clearable"
182 ref="qlxzdm" v-model="items.qlxzdm"></el-select-tree>
183 </div>
184 </el-row>
185 </div>
186 </template>
187
188 <script>
189 // import { getDdicByMC } from "@api/common";
190 export default {
191 props: {
192 formData: {
193 type: Object,
194 default: () => {
195 return {};
196 },
197 },
198 hasSyqx: {
199 type: Boolean,
200 default: false
201 }
202 },
203 data () {
204 return {
205 //树型结构
206 show: true,
207 clearable: true,
208 defaultExpandAll: true,
209 multiple: false,
210 placeholder: "请选择",
211 disabled: false,
212 checkStrictly: true,
213 treeProps: {
214 value: "dm",
215 children: "children",
216 label: "mc",
217 },
218
219 countList: [
220 {
221 id: Math.random(),
222 isInside: false,
223 hasNotBorder: false,
224 bsm: "", //权利性质标识码
225 glbsm: "", //宗地BSM、自然幢BSM、户BSM、多幢BSM、宗海BSM
226 qlxzdm: "",
227 qlxzmc: "",
228 zhqlxzlx: "", //除宗海数据外，默认都是空；0:用海类型权利性质;2:海岛用途权利性质
229 list: [
230 {
231 pzdjbsm: "",
232 pzdjmc: "",
233 pzytdm: "",
234 pzytmc: "",
235 pzytmj: 0,
236 qlxzbsm: "",
237 sjdjbsm: "",
238 sjdjmc: "",
239 sjytdm: "",
240 sjytmc: "",
241 sjytmj: 0,
242 syqx: "",
243 tdsyjssj: "",
244 pickerStart: {},
245 pickerEnd: {},
246 tdsyqssj: "",
247 tdzh: "",
248 },
249 ],
250 },
251 ],
252 outNum: 0,
253 rulesResult: true,//权利性质表单校验结果
254 };
255 },
256 created () { },
257 mounted () {
258 },
259 methods: {
260 startTime (index, childIndex) {
261 let startTime = this.countList[index].list[childIndex].tdsyqssj;
262 let endTime = this.countList[index].list[childIndex].tdsyjssj;
263 this.countList[index].list[childIndex].pickerEnd = {
264 disabledDate: (time) => {
265 if (Object.keys(startTime).length > 0) {
266 return new Date(startTime).getTime() > time.getTime();
267 } else {
268 return time.getTime() < Date.now();
269 }
270 }
271 }
272 if (Object.keys(startTime).length > 0 && Object.keys(endTime).length > 0) {
273 let startYear = new Date(startTime).getFullYear();
274 let endYear = new Date(endTime).getFullYear();
275 //年限暂时不算
276 // this.countList[index].list[childIndex].syqx=endYear-startYear;
277 }
278 },
279 sumTime (index, childIndex, syqx, e) {
280 this.$refs.syqx.forEach((item, index) => {
281 if (item.value == syqx) {
282 this.$refs.tdsyjssj[index].$el.style.border = ""
283 }
284 })
285 let startTime = this.countList[index].list[childIndex].tdsyqssj;
286 this.countList[index].list[childIndex].tdsyjssj = Number(startTime.substring(0, 4)) + Number(syqx) + startTime.slice(4, 10);
287 },
288 endTime (index, childIndex, e) {
289 let startTime = this.countList[index].list[childIndex].tdsyqssj;
290 let endTime = this.countList[index].list[childIndex].tdsyjssj;
291 this.countList[index].list[childIndex].pickerStart = {
292 disabledDate: (time) => {
293 if (Object.keys(endTime).length > 0) {
294 return new Date(endTime).getTime() < time.getTime();
295 } else {
296 return time.getTime() > Date.now();
297 }
298 }
299 }
300 if (Object.keys(startTime).length > 0 && Object.keys(endTime).length > 0) {
301 let startYear = new Date(startTime).getFullYear();
302 let endYear = new Date(endTime).getFullYear();
303 // this.countList[index].list[childIndex].syqx=endYear-startYear;
304 }
305 },
306 //外层操作
307 handleClick (ind, type) {
308 let outsideObj = {
309 id: Math.random(),
310 isInside: false,
311 hasNotBorder: false,
312 bsm: "", //权利性质标识码
313 glbsm: "", //宗地BSM、自然幢BSM、户BSM、多幢BSM、宗海BSM
314 qlxzdm: "",
315 qlxzmc: "",
316 zhqlxzlx: "", //除宗海数据外，默认都是空；0:用海类型权利性质;2:海岛用途权利性质
317 list: [
318 {
319 pzdjbsm: "",
320 pzdjmc: "",
321 pzytdm: "",
322 pzytmc: "",
323 pzytmj: 0,
324 qlxzbsm: "",
325 sjdjbsm: "",
326 sjdjmc: "",
327 sjytdm: "",
328 pickerStart: {},
329 pickerEnd: {},
330 sjytmc: "",
331 sjytmj: 0,
332 syqx: "",
333 tdsyjssj: "",
334 tdsyqssj: "",
335 tdzh: "",
336 },
337 ],
338 };
339 if (type === "add") {
340 this.countList.push(outsideObj);
341 this.outNum++;
342 } else {
343 this.countList.forEach((item, index) => {
344 if (index == ind && this.countList.length > 1) {
345 this.countList.splice(index, 1);
346 }
347 });
348 this.outNum--;
349 }
350 },
351 reset () {
352 this.countList = [
353 {
354 id: Math.random(),
355 isInside: false,
356 hasNotBorder: false,
357 bsm: "", //权利性质标识码
358 glbsm: "", //宗地BSM、自然幢BSM、户BSM、多幢BSM、宗海BSM
359 qlxzdm: "",
360 qlxzmc: "",
361 zhqlxzlx: "", //除宗海数据外，默认都是空；0:用海类型权利性质;2:海岛用途权利性质
362 list: [
363 {
364 pzdjbsm: "",
365 pzdjmc: "",
366 pzytdm: "",
367 pzytmc: "",
368 pzytmj: 0,
369 qlxzbsm: "",
370 sjdjbsm: "",
371 sjdjmc: "",
372 sjytdm: "",
373 sjytmc: "",
374 sjytmj: 0,
375 syqx: "",
376 tdsyjssj: "",
377 pickerStart: {},
378 pickerEnd: {},
379 tdsyqssj: "",
380 tdzh: "",
381 },
382 ],
383 },
384 ];
385 },
386 //内层操作
387 handleInClick (index, childIndex, type) {
388 let insideObj = {
389 pzdjbsm: "",
390 pzdjmc: "",
391 pzytdm: "",
392 pzytmc: "",
393 pzytmj: 0,
394 qlxzbsm: "",
395 sjdjbsm: "",
396 sjdjmc: "",
397 sjytdm: "",
398 sjytmc: "",
399 sjytmj: 0,
400 pickerStart: {},
401 pickerEnd: {},
402 syqx: "",
403 tdsyjssj: "",
404 tdsyqssj: "",
405 tdzh: "",
406 };
407 if (type === "add") {
408 this.countList[index].list.splice(childIndex + 1, 0, insideObj);
409 } else {
410 this.countList[index].list.forEach((item, childInd) => {
411 if (childIndex == childInd && this.countList[index].list.length > 1) {
412 this.countList[index].list.splice(childIndex, 1);
413 }
414 });
415 }
416 this.hasBorderOrNot();
417 },
418 //判断是否显示边框
419 hasBorderOrNot () {
420 this.countList.forEach((item, index) => {
421 if (index == this.countList.length - 1) {
422 item.hasNotBorder = true;
423 } else {
424 item.hasNotBorder =
425 item.isInside && !this.countList[index + 1].isInside ? true : false;
426 }
427 });
428 },
429 getQlxzDataList () {
430 return this.countList;
431 },
432 getRules () {
433 let rules = [];
434 let temp = 0;
435 this.countList.forEach((item, index) => {
436 rules.push({
437 data: this.countList[index].qlxzdm,
438 name: '权利性质',
439 dom: this.$refs.qlxzdm[index],
440 rule: /^\s*$/g, //非空
441 })
442 item.list.forEach((j, ind) => {
443 rules.push(
444 {
445 data: item.list[ind].tdsyqssj,
446 name: '土地使用起始时间',
447 dom: this.$refs.tdsyqssj[temp + ind],
448 // val:this.$refs.tdsyqssj[temp+ind].value,
449 rule: /^\s*$/g, //非空
450 },
451 {
452 data: item.list[ind].tdsyjssj,
453 name: '土地使用结束时间',
454 dom: this.$refs.tdsyjssj[temp + ind],
455 // val:this.$refs.tdsyjssj[temp+ind].value,
456 rule: /^\s*$/g, //非空
457 },
458 {
459 data: item.list[ind].pzytdm,
460 name: '批准用途',
461 dom: this.$refs.pzytdm[temp + ind],
462 // val:this.$refs.tdsyjssj[temp+ind].value,
463 rule: /^\s*$/g, //非空
464 },
465 {
466 data: item.list[ind].sjytdm,
467 name: '实际用途',
468 dom: this.$refs.sjytdm[temp + ind],
469 // val:this.$refs.tdsyjssj[temp+ind].value,
470 rule: /^\s*$/g, //非空
471 },
472 )
473 if (this.hasSyqx) {
474 rules.push(
475 {
476 data: item.list[ind].syqx,
477 name: '使用期限',
478 dom: this.$refs.syqx[temp + ind],
479 // val:this.$refs.syqx[temp+ind].value,
480 rule: /^\s*$/g, //非空
481 }
482 )
483 }
484 if (ind == item.list.length - 1) {
485 temp += item.list.length;
486 }
487 })
488 })
489 this.rulesResult = true;
490 rules.forEach(item => {
491 if (item.rule.test(item.data) || item.data == null) {
492 if (item.dom.$el) {
493 item.dom.$el.style.border = '1px solid red';
494 item.dom.$el.style.boxSizing = 'border-box';
495 } else {
496 item.dom.style.border = '1px solid red';
497 item.dom.style.boxSizing = 'border-box';
498 }
499 // this.$message({
500 // // message: item.name+'不能为空',
501 // message: '不能为空',
502 // type: "warning",
503 // });
504 this.rulesResult = false;
505 return false
506 }
507 })
508 // console.log(rules,'rules');
509 },
510 getRulesResult () {
511 return this.rulesResult
512 },
513 inputBlur (e, flag) {
514 if (flag) {
515 if (e.value != '') {
516 e.$el.style.border = ""
517 } else {
518 e.$el.style.border = "1px solid red"
519 e.$el.style.boxSizing = 'border-box';
520 }
521 } else {
522 if (e.target.value != '') {
523 e.target.style.border = ""
524 } else {
525 e.target.style.border = "1px solid red"
526 e.target.style.boxSizing = 'border-box';
527 }
528 }
529 },
530 //后续考虑在点击加减号时操作校验规则
531 // addRules(){
532 // this.tempQssj.push()
533 // },
534 // minusRules(){
535
536 // },
537 },
538 watch: {
539 countList: {
540 handler: function (newVal, oldVal) {
541 newVal.forEach((i, ind) => {
542 if (i.qlxzdm != '' && i.qlxzdm != null) {
543 console.log(this.$refs.qlxzdm, 'this.$refs.qlxzdm[ind]');
544 i.qlxzmc = this.$refs.qlxzdm[ind].name;
545 this.$refs.qlxzdm[ind].$el.style.border = ""
546 }
547 i.list.forEach((item, index) => {
548 if (item.sjytdm != '' && item.sjytdm != null) {
549 this.$refs.sjytdm[ind].$el.style.border = ""
550 }
551 if (item.pzytdm != '' && item.pzytdm != null) {
552 this.$refs.pzytdm[ind].$el.style.border = ""
553 }
554 })
555 })
556 },
557 deep: true
558 },
559 }
560 };
561 </script>
562 <style lang="scss">
563 .temp {
564 width: 100%;
565 height: 100%;
566
567 .iconfont {
568 cursor: pointer;
569 }
570
571 .qlxzAdd {
572 width: 100px;
573 height: 100%;
574 border-right: 1px solid #E6E6E6;
575 position: relative;
576
577 span {
578 font-size: 14px;
579 height: 140px;
580 text-align: center;
581 -webkit-writing-mode: vertical-rl;
582 writing-mode: vertical-rl;
583 position: absolute;
584 top: 50%;
585 margin-top: -70px;
586 left: 30%;
587 }
588
589 i {
590 color: #66b1ff;
591 font-size: 30px;
592 position: absolute;
593 top: 50%;
594 margin-top: -18px;
595 left: 55%;
596 z-index: 1;
597 }
598 }
599
600 .qlxzModule {
601 width: calc(100% - 102px);
602 height: auto;
603 position: relative;
604 border-bottom: 1px solid #E6E6E6;
605
606 .pr10 {
607 padding-right: 10px !important;
608 }
609
610 .el-col {
611 // height: 100%;
612 border-right: 1px solid #E6E6E6;
613 position: relative;
614 text-align: right;
615
616 .qlxz {
617 line-height: 34px;
618 }
619
620 .qlxzMinus {
621 color: #FA6400;
622 font-size: 30px;
623 position: absolute;
624 top: 50%;
625 left: 50%;
626 margin: -18px 0 0 -18px;
627 z-index: 1;
628 }
629
630 ul {
631 margin-top: 34px;
632
633 li {
634 height: 37px;
635 line-height: 37px;
636 text-decoration: none;
637 border-bottom: 1px solid #e6e6e6;
638
639 .el-select {
640 width: 100%;
641 }
642
643 .el-input {
644 width: 100%;
645 }
646
647 input {
648 position: relative;
649 top: -2px;
650 height: 35px;
651 width: calc(100% - 1px) !important;
652 }
653
654 .el-input__inner {
655 height: 34px;
656 }
657 }
658
659 li:last-child {
660 border-bottom: none;
661 }
662 }
663
664 .whiteItem {
665 background-color: #fff;
666 position: absolute;
667 width: 100%;
668 height: 2px;
669 bottom: -1px;
670 left: 0;
671 }
672
673 .itemShow {
674 bottom: 2px;
675 }
676 }
677
678 .childYT {
679 height: 114px;
680 border-top: 1px solid #E6E6E6;
681
682 ul {
683 margin-top: 0;
684
685 li {
686 .el-input__inner {
687 height: 29px;
688 }
689 }
690 }
691
692 .changeBtn {
693 margin-top: -48px;
694 }
695
696 .el-button+.el-button {
697 margin-top: 4px;
698 }
699 }
700
701 .noTopBorder {
702 border-top: 0;
703 }
704
705 .noRightBorder {
706 border-right: 0;
707 }
708
709 .el-col:nth-last-child(2) {
710 border-right: none;
711 }
712
713 .title {
714 width: 95.83333%;
715 height: 34px;
716 line-height: 34px;
717 background-color: #fff;
718 border-bottom: 1px solid #E6E6E6;
719 position: absolute;
720 right: 0;
721 top: 0;
722
723 .formSelect {
724 top: -1px;
725 width: 100%;
726
727 .el-input__inner {
728 height: 32px;
729 }
730 }
731 }
732 }
733
734 .btnCol {
735 position: relative;
736 height: 146px;
737
738 .changeBtn {
739 width: 46px;
740 height: 46px;
741 font-size: 30px;
742 padding: 4px 6px;
743 position: absolute;
744 top: 50%;
745 left: 50%;
746 margin-top: -38px;
747 margin-left: -23px;
748 }
749
750 .el-button+.el-button {
751 margin-left: -23px;
752 margin-top: 16px;
753 }
754 }
755
756 .tdytAdd {
757 width: 100px;
758 }
759
760 .tdytAdd,
761 .tdytMinus {
762 span {
763 font-size: 14px;
764 height: 114px;
765 text-align: center;
766 -webkit-writing-mode: vertical-rl;
767 writing-mode: vertical-rl;
768 position: absolute;
769 top: 50%;
770 left: 30%;
771 }
772
773 i {
774 color: #66b1ff;
775 font-size: 30px;
776 position: absolute;
777 top: 50%;
778 margin-top: 0px;
779 left: 55%;
780 z-index: 1;
781 }
782 }
783
784 .tdytMinus {
785 i {
786 color: #FA6400;
787 left: 50%;
788 margin-left: -18px;
789 }
790 }
791
792 .childYT {
793 i {
794 top: 50%;
795 margin-top: -18px;
796 }
797 }
798
799 .el-row:nth-last-child(1) {
800 border-bottom: none;
801 }
802
803 /deep/.el-select-tree {
804 width: 100%;
805
806 .el-input__inner {
807 height: 34px !important;
808 position: relative;
809 top: -1px;
810 }
811 }
812 }
813 </style>
1 <template>
2 <div class="temp">
3 <el-row class="qlxzModule" v-for="(items, index) in countList" :key="items.id">
4 <template v-for="(childItem, childIndex) in items.list">
5 <el-col :span="2" class="btnCol" :key="childIndex + '1'" :class="childIndex > 0 ? 'childYT noTopBorder' : ''">
6 <el-button v-show="childIndex < 1" type="primary" class="changeBtn addMinus outAdd"
7 @click="handleClick(index, 'add')">+</el-button>
8 <el-button v-show="childIndex < 1" type="primary" class="changeBtn addMinus outMinus"
9 @click="handleClick(index, 'minus')">-</el-button>
10 <div :class="items.hasNotBorder ? 'itemShow whiteItem' : 'whiteItem'" v-if="items.isInside"></div>
11 </el-col>
12 <el-col :span="2" class="btnCol" :key="childIndex + '8'" :class="childIndex > 0 ? 'childYT' : ''">
13 <!-- <template v-if="childIndex>0"> -->
14 <span class="qlxz" v-show="childIndex < 1">权利性质</span><br />
15 <el-button type="primary" class="changeBtn addMinus inAdd" @click="handleInClick(index, childIndex, 'add')">+
16 </el-button>
17 <el-button type="primary" class="changeBtn addMinus inMinus"
18 @click="handleInClick(index, childIndex, 'minus')">-</el-button>
19 <!-- </template> -->
20 </el-col>
21 <el-col :span="5" :key="childIndex + '7'" :class="childIndex > 0 ? 'childYT' : ''">
22 <ul>
23 <li>批准用途</li>
24 <li>实际用途</li>
25 <li>土地使用起始时间<i class="requisite">*</i></li>
26 </ul>
27 </el-col>
28 <el-col :span="5" :key="childIndex + '6'" :class="childIndex > 0 ? 'childYT' : ''">
29 <ul>
30 <li>
31 <el-select-tree v-if="show" :default-expand-all="defaultExpandAll" :multiple="multiple"
32 :placeholder="placeholder" :disabled="disabled" :data="$store.state.tdytList" :props="treeProps"
33 :check-strictly="checkStrictly" :clearable="clearable" v-model="childItem.pzytdm"></el-select-tree>
34 </li>
35 <li>
36 <el-select-tree v-if="show" :default-expand-all="defaultExpandAll" :multiple="multiple"
37 :placeholder="placeholder" :disabled="disabled" :data="$store.state.tdytList" :props="treeProps"
38 :check-strictly="checkStrictly" :clearable="clearable" v-model="childItem.sjytdm"></el-select-tree>
39 </li>
40 <li>
41 <el-date-picker v-model="childItem.tdsyqssj" :picker-options="childItem.pickerStart" type="date"
42 value-format="yyyy-MM-dd" placeholder="选择日期" @input="startTime(index, childIndex)">
43 </el-date-picker>
44 </li>
45 </ul>
46 </el-col>
47 <el-col :span="5" :key="childIndex + '5'" :class="childIndex > 0 ? 'childYT' : ''">
48 <ul>
49 <li>地类编码</li>
50 <li>地类编码</li>
51 <li>土地使用结束时间<i class="requisite">*</i></li>
52 </ul>
53 </el-col>
54 <el-col :span="5" :key="childIndex + '4'" :class="childIndex > 0 ? 'childYT' : ''">
55 <ul>
56 <li>
57 <input type="text" style="top: -1px;" v-model="childItem.pzytdm" class="formInput" />
58 </li>
59 <li>
60 <input type="text" v-model="childItem.sjytdm" class="formInput" />
61 </li>
62 <li>
63 <el-date-picker v-model="childItem.tdsyjssj" type="date" value-format="yyyy-MM-dd"
64 :picker-options="childItem.pickerEnd" placeholder="选择日期" @input="endTime(index, childIndex)">
65 </el-date-picker>
66 </li>
67 </ul>
68 </el-col>
69 </template>
70
71 <div class="title">
72 <el-select class="formSelect" v-model="items.qlxzdm">
73 <el-option v-for="item in $store.state.qlxzList" :key="item.dm" :label="item.mc" :value="item.dm">
74 </el-option>
75 </el-select>
76 </div>
77 </el-row>
78 </div>
79 </template>
80
81 <script>
82 // import { getDdicByMC } from "@api/common";
83 export default {
84 props: {
85 // widtd: {
86 // type: String,
87 default: "70%",
88 ,
89 a () {
90 return {
91 //树型结构
92 how: true,
93 arable: true,
94 aultExpandAll: true,
95 tiple: false,
96 ceholder: "请选择",
97 abled: false,
98 ckStrictly: true,
99 eProps: {
100 lue: "dm",
101 ildren: "children",
102 bel: "mc",
103
104 ntList: [
105
106 id: Math.random(),
107 isInside: false,
108 hasNotBorder: false,
109 bsm: "", //权利性质标识码
110 lbsm: "", //宗地BSM、自然幢BSM、户BSM、多幢BSM、宗海BSM
111 lxzdm: "",
112 zhqlxzlx: "", //除宗海数据外，默认都是空；0:用海类型权利性质;2:海岛用途权利性质
113 list: [
114 {
115 pzdjbsm: "",
116 pzdjmc: "",
117 pzytdm: "",
118 pzytmc: "",
119 pzytmj: 0,
120 qlxzbsm: "",
121 sjdjbsm: "",
122 sjdjmc: "",
123 sjytdm: "",
124 sjytmc: "",
125 jytmj: 0,
126 syqx: "",
127 tdsyjssj: "",
128 tdsyqssj: "",
129 pickerStart: {},
130 pickerEnd: {},
131 tdzh: "",
132 },
133
134
135
136 Num: 0,
137
138
139 ed () { },
140 hods: {
141 外层操作
142 ndleClick (ind, type) {
143 outsideObj = {
144 Math.random(),
145 Inside: false,
146 sNotBorder: false,
147 "", //权利性质标识码
148 bsm: "", //宗地BSM、自然幢BSM、户BSM、多幢BSM、宗海BSM
149 xzdm: "",
150 zhqlxzlx: "", //除宗海数据外，默认都是空；0:用海类型权利性质;2:海岛用途权利性质
151 list: [
152 {
153 pzdjbsm: "",
154 pzdjmc: "",
155 pzytdm: "",
156 pzytmc: "",
157 pzytmj: 0,
158 qlxzbsm: "",
159 sjdjbsm: "",
160 sjdjmc: "",
161 sjytdm: "",
162 sjytmc: "",
163 sjytmj: 0,
164 syqx: "",
165 tdsyjssj: "",
166 tdsyqssj: "",
167 tdzh: "",
168
169
170 };
171 (type === "add") {
172 is.countList.push(outsideObj);
173 is.outNum++;
174 lse {
175 .countList.forEach((item, index) => {
176 f (index == ind && this.countList.length > 1) {
177 this.countList.splice(index, 1);
178 }
179 });
180 this.outNum--;
181
182 Click (index, childIndex, type) {
183 eObj = {
184 ",
185 ,
186 "",
187 "",
188 : 0,
189 m: "",
190 m: "",
191 "",
192 : "",
193 : "",
194 : 0,
195 "",
196 jssj: "",
197 sj: "",
198 : "",
199 e === "add") {
200 ountList[index].list.splice(childIndex + 1, 0, insideObj);
201
202 ountList[index].list.forEach((item, childInd) => {
203 (childIndex == childInd && this.countList[index].list.length > 1) {
204 this.countList[index].list.splice(childIndex, 1);
205 }
206 });
207
208 s.hasBorderOrNot();
209 是否显示边框
210 orderOrNot () {
211 s.countList.forEach((item, index) => {
212 (index == this.countList.length - 1) {
213 m.hasNotBorder = true;
214 {
215 sNotBorder =
216 sInside && !this.countList[index + 1].isInside ? true : false;
217 aList () {
218 this.countList;
219 时间判断
220 tTime (index, childIndex) {
221 tartTime = this.countList[index].list[childIndex].tdsyqssj;
222 endTime = this.countList[index].list[childIndex].tdsyjssj;
223 s.countList[index].list[childIndex].pickerEnd = {
224 bledDate: (time) => {
225 f (Object.keys(startTime).length > 0) {
226 return new Date(startTime).getTime() > time.getTime();
227 lse {
228 rn time.getTime() < Date.now();
229 t.keys(startTime).length > 0 && Object.keys(endTime).length > 0) {
230 ear = new Date(startTime).getFullYear();
231 ear = new Date(endTime).getFullYear();
232 ime (index, childIndex, e) {
233 onsole.log(e, 'eeeeee');
234 let startTime = this.countList[index].list[childIndex].tdsyqssj;
235 let endTime = this.countList[index].list[childIndex].tdsyjssj;
236 this.countList[index].list[childIndex].pickerStart = {
237 disabledDate: (time) => {
238 if (Object.keys(endTime).length > 0) {
239 return new Date(endTime).getTime() < time.getTime();
240 } else {
241 return time.getTime() > Date.now();
242 }
243 }
244 }
245 if (Object.keys(startTime).length > 0 && Object.keys(endTime).length > 0) {
246 let startYear = new Date(startTime).getFullYear();
247 let endYear = new Date(endTime).getFullYear();
248 }
249 },
250 },
251 };
252 </script>
253 <style lang="scss">
254 .temp {
255 width: 100%;
256
257 .qlxzModule {
258 height: auto;
259 position: relative;
260 border-bottom: 1px solid #e6e6e6;
261
262 .el-col {
263 // height: 100%;
264 border-right: 1px solid #E6E6E6;
265 position: relative;
266 text-align: right;
267 padding-right: 10px;
268
269 .qlxz {
270 line-height: 34px;
271 }
272
273 ul {
274 margin-top: 34px;
275
276 li {
277 height: 37px;
278 line-height: 37px;
279 text-decoration: none;
280 border-bottom: 1px solid #e6e6e6;
281
282 .el-select {
283 width: 100%;
284 }
285
286 .el-input {
287 width: 100%;
288 }
289
290 .el-input__inner {
291 height: 34px;
292 }
293
294 input {
295 position: relative;
296 top: -2px;
297 height: 35px;
298 width: calc(100% - 1px) !important;
299 }
300 }
301
302 li:last-child {
303 border-bottom: none;
304 }
305 }
306
307 .whiteItem {
308 background-color: #fff;
309 position: absolute;
310 width: 100%;
311 height: 2px;
312 bottom: -1px;
313 left: 0;
314 }
315
316 .itemShow {
317 bottom: 2px;
318 }
319 }
320
321 .childYT {
322 height: 114px;
323 border-top: 1px solid #E6E6E6;
324
325 ul {
326 margin-top: 0;
327
328 li {
329 .el-input__inner {
330 height: 29px;
331 }
332 }
333 }
334
335 .changeBtn {
336 margin-top: -48px;
337 }
338
339 .el-button+.el-button {
340 margin-top: 4px;
341 }
342 }
343
344 .noTopBorder {
345 border-top: 0;
346 }
347
348 .noRightBorder {
349 border-right: 0;
350 }
351
352 .el-col:nth-last-child(2) {
353 border-right: none;
354 }
355
356 .title {
357 width: 83.33333%;
358 height: 34px;
359 line-height: 34px;
360 background-color: #fff;
361 border-bottom: 1px solid #E6E6E6;
362 position: absolute;
363 right: 0;
364 top: 0;
365
366 .formSelect {
367 top: -1px;
368 width: 100%;
369
370 .el-input__inner {
371 height: 32px;
372 }
373 }
374 }
375 }
376
377 .btnCol {
378 position: relative;
379 height: 146px;
380
381 .changeBtn {
382 width: 46px;
383 height: 46px;
384 font-size: 30px;
385 padding: 4px 6px;
386 position: absolute;
387 top: 50%;
388 left: 50%;
389 margin-top: -38px;
390 margin-left: -23px;
391 }
392
393 .el-button+.el-button {
394 margin-left: -23px;
395 margin-top: 16px;
396 }
397 }
398
399 .el-row:nth-last-child(1) {
400 border-bottom: none;
401 }
402
403 /deep/.el-select-tree {
404 width: 100%;
405
406 .el-input__inner {
407 height: 30px !important;
408 }
409 }
410 }
411 </style>
1 <template>
2 <el-dialog v-dialogDrag :close-on-click-modal="false" title="户重新落宗" :visible.sync="isVisible" width="50%"
3 @close="close" :modal-append-to-body="false">
4 <div class="content">
5 <table>
6 <tr>
7 <td class="label">宗地:</td>
8 <td class="input">
9 <el-input placeholder="请选择宗地" v-model="zdxx" :disabled="true"></el-input>
10 </td>
11 <td>
12 <el-button type="primary" @click="xzzdVisible = true">选择宗地</el-button>
13 </td>
14 </tr>
15 <tr>
16 <td class="label">自然幢:</td>
17 <td class="input">
18 <el-select v-model="hcxlzData.zrzbsm" filterable placeholder="请选择" @change="zrzChange">
19 <el-option v-for="(item, index) in zrzList" :key="index" :label="item.label"
20 :value="item.bsm">
21 </el-option>
22 </el-select>
23 </td>
24 </tr>
25 <tr>
26 <td class="label">逻辑幢:</td>
27 <td class="input">
28 <el-select v-model="hcxlzData.ljzbsm" filterable placeholder="请选择" @change="ljzChange">
29 <el-option v-for="(item, index) in ljzList" :key="index" :label="item.ljzmc"
30 :value="item.bsm">
31 </el-option>
32 </el-select>
33 </td>
34 </tr>
35 <tr>
36 <td class="label">幢单元:</td>
37 <td class="input">
38 <el-select v-model="hcxlzData.zdybsm" filterable placeholder="请选择">
39 <el-option v-for="(item, index) in zdyList" :key="index" :label="item.zdymc"
40 :value="item.bsm">
41 </el-option>
42 </el-select>
43 </td>
44 </tr>
45 </table>
46 </div>
47 <div class="footer">
48 <el-button type="primary" @click="save">保存</el-button>
49 <el-button type="primary" @click="close">取消</el-button>
50 </div>
51 <!-- <zd-query-data :isCxlz=true :centerDialogVisible="xzzdVisible" @close="xzzdClose" @getData="getZdxx"
52 :isZdClose="true"></zd-query-data> -->
53 </el-dialog>
54 </template>
55
56 <script>
57 // import zdQueryData from '@/components/zdQueryData/zdQueryData'
58 // import { zdXlcd, hzl } from '@api/zd'
59 import { Message } from 'element-ui'
60 export default {
61 name: "hCxlz",
62 components: { zdQueryData },
63 data () {
64 return {
65 zd: {},
66 zrz: {},
67 ljz: {},
68 zdy: {},
69 xzzdVisible: false,
70 isVisible: false,
71 zdxx: '', // 宗地信息
72 hcxlzData: {
73 bsms: [],
74 zrzbsm: '',
75 ljzbsm: '',
76 zdybsm: ''
77 },
78 total: 1,
79 zrzList: [],
80 ljzList: [],
81 zdyList: []
82 }
83 },
84 props: {
85 hCxlzVisble: {
86 type: Boolean,
87 default: false
88 },
89 bsms: {
90 type: Array
91 }
92 },
93 mounted () {
94 this.hcxlzData.bsms = this.bsms;
95 },
96 methods: {
97 ljzChange: function () {
98 const item = this.ljzList.find(i => i.bsm == this.hcxlzData.ljzbsm)
99 this.hcxlzData.zdybsm = ''
100 this.zdyList = item.list;
101 this.zdyList.push({
102 zdymc: '空',
103 bsm: ''
104 })
105 },
106 zrzChange: function () {
107 const item = this.zrzList.find(i => i.bsm === this.hcxlzData.zrzbsm);
108 this.hcxlzData.ljzbsm = '';
109 this.hcxlzData.zdybsm = '';
110 this.ljzList = item.ljzList;
111 this.ljzList.push({
112 ljzmc: '空',
113 bsm: ''
114 })
115 this.zdyList = item.zdyList;
116 this.zdyList.push({
117 zdymc: '空',
118 bsm: ''
119 })
120 },
121 getZrz: function (bsm) {
122 zdXlcd(bsm).then(res => {
123 if (res.success) {
124 this.zrzList = res.result;
125 this.xzzdClose();
126 } else {
127 Message.error(res.message)
128 }
129 })
130 },
131 getZdxx: function (val) {
132 this.zd = val
133 this.zdxx = val.xmmc + "(" + val.zddm + ")";
134 },
135 xzzdClose: function () {
136 this.xzzdVisible = false;
137 },
138 result: function () {
139 this.hcxlzData = {
140 zrzbsm: '',
141 ljzbsm: '',
142 zdybsm: ''
143 };
144 this.hcxlzData.bsms = this.bsms;
145 },
146 save () {
147 if (this.hcxlzData.zrzbsm === '') {
148 Message.error("请选择自然幢");
149 return;
150 }
151 hzl(this.hcxlzData).then(res => {
152 if (res.success) {
153 this.$router.push({
154 path: '/zrz',
155 query: {
156 bsm: this.hcxlzData.zrzbsm,
157 source: 2,
158 auth: '0,1,2'
159 }
160 })
161 } else {
162 Message.error(res.message)
163 }
164 });
165 },
166 close () {
167 this.$emit('close', false);
168 this.result();
169 },
170 },
171 watch: {
172 hCxlzVisble: function (val) {
173 this.isVisible = val
174 },
175 zd: function (val) {
176 this.hcxlzData.zrzbsm = '';
177 this.hcxlzData.zdybsm = '';
178 this.hcxlzData.ljzbsm = '';
179 this.getZrz(val.zdbsm)
180 }
181 }
182 }
183 </script>
184
185 <style scoped lang="scss">
186 .input-suffix {
187 input {
188 width: 210px;
189 height: 30px;
190 border-radius: 3px;
191 border-color: #BBB;
192 }
193 }
194
195 .content {
196 text-align: center;
197 }
198
199 table {
200 border-collapse: separate;
201 border-spacing: 10px;
202 display: inline-block;
203 text-align: center;
204
205 .label {
206 width: 60px;
207 font-size: 15px;
208 text-align: justify;
209 text-align-last: justify
210 }
211
212 .input {
213 width: 300px;
214
215 .el-select {
216 width: 300px;
217 }
218 }
219 }
220
221 .footer {
222 margin-top: 20px;
223 text-align: center;
224 }
225 </style>
1 <template>
2 <div class="tree_item_box">
3 <div class="column-start-start linkLine_default" v-for="(item, s_index) in list" :key="s_index" :class="{
4 linkLine_first: (s_index === 0) & (list.length > 1),
5 linkLine_half_top: s_index === 0 && list.length === 1,
6 linkLine_last: s_index === list.length - 1 && s_index !== 0,
7 third_layer: !item.children,
8 second_layer: item.children,
9 curNode: $route.query.bsm && $route.query.bsm == item.bsm,
10 zxxNode: item.qszt,
11 iszd: item.qszt && item.type == 'zd',
12 isdz: item.qszt && item.type == 'dz',
13 iszrz: item.qszt && item.type == 'zrz',
14 isgzw: item.qszt && item.type == 'gzw'
15 }">
16 <div class="row-flex-start basic_banner" @click="itemClick(item)" @dblclick="dbclick(item, item.zdbsm)" :class="{
17 active_color: item.expand,
18 }">
19 <div class="layer_text nowrap" @contextmenu.prevent="openMenu($event, item, list)" :class="{
20 active_color: item.expand
21 }" :ref="($route.query.bsm && $route.query.bsm == item.bsm) ? 'curZxx' : ''" :data-zdbsm="item.zdbsm"
22 :title=item.mc>
23 <i v-show="!islpb && !item.qszt && !item.type" class="iconfont iconguoyou" style="margin-right:6px"></i>
24 <template v-if="islpb && item.type == 'ljz' && item.children.length > 0">
25 <i v-if="!item.expand" class="iconfont iconxiala lpbTree-node"></i>
26 <i v-if="item.expand" class="iconfont iconxialazhankai lpbTree-node"></i>
27 </template>
28 <!-- <i v-show="islpb && item.expand && item.children.length > 0" class="iconfont iconxiala" style="margin-right:6px"></i>
29 <i v-show="islpb && !item.expand && item.children.length > 0" class="iconfont iconxialazhankai" style="margin-right:6px"></i> -->
30 <span class="qsztImg" v-if="item.bblx == 1 || (item.bhqkbsm != '' && item.bhqkbsm != null)">
31 <!-- <span class="qsztFont" style="color: #9e9b9b">变</span> -->
32 <i
33 :class="$route.query.bsm && $route.query.bsm == item.bsm ? 'iconfont iconbianing' : 'iconfont iconbian'"></i>
34 </span>
35 <template v-else>
36 <span class="qsztImg" v-if="item.qszt == '0'">
37 <!-- <span class="qsztFont" style="color: #2FA3FA; ">临</span> -->
38 <i :class="$route.query.bsm && $route.query.bsm == item.bsm ? 'iconfont iconlining' : 'iconfont iconlin'"
39 style="color: #F7B500;"></i>
40 </span>
41 <span class="qsztImg" v-if="item.qszt == '1'">
42 <!-- <span class="qsztFont" style="color: #1AD6E1; ">正</span> -->
43 <i :class="$route.query.bsm && $route.query.bsm == item.bsm ? 'iconfont iconzhenging' : 'iconfont iconzheng'"
44 style="color: #15D7E2;"></i>
45 </span>
46 <span class="qsztImg" v-if="item.qszt == '2'">
47 <!-- <span class="qsztFont" style="color: #45AEFD; ">现</span> -->
48 <i :class="$route.query.bsm && $route.query.bsm == item.bsm ? 'iconfont iconxianing' : 'iconfont iconxian'"
49 style="color: #2FA3FA;"></i>
50 </span>
51 </template>
52 <i class="iconfont iconziranchuang1 mr4" v-if="item.type == 'zrz'"></i>
53 <i class="iconfont iconduochuang1 mr4" v-if="item.type == 'dz'"></i>
54 <i class="iconfont icongouzhuwu mr4" v-if="item.type == 'gzw'"></i>
55 <span v-if="islpb">({{ item.type | bdcLxFilter }})</span>
56 <span>{{ item.mc }}</span>
57
58 </div>
59 <div v-if="item.children" class="reTree_icon" :style="{
60 height: 10 + 'px',
61 width: 10 + 'px',
62 }" :class="{
63 reTree_default_icon: item.children.length === 0,
64 reTree_collapse_icon: !islpb && item.expand && item.children.length > 0,
65 reTree_expand_icon: !islpb && !item.expand && item.children.length > 0,
66 }"></div>
67 <div v-if="item.children == null" class="reTree_icon" :class="{
68 reTree_default_icon: item.dm != 'G' && item.dm != 'J' && item.dm != 'Z',
69 reTree_expand_icon: item.dm == 'G' || item.dm == 'J' || item.dm == 'Z',
70 }" :style="{
71 height: 10 + 'px',
72 width: 10 + 'px',
73 }"></div>
74 </div>
75 <line-item :list="item.children" v-on="$listeners" :islpb="islpb" :size="size"
76 v-if="item.expand && item.children && item.children.length > 0"></line-item>
77 </div>
78 </div>
79 </template>
80 <script>
81 // import { getZdDetailList } from "@api/common"
82 export default {
83 name: "line-item",
84 props: {
85 list: {
86 ype: Array,
87 ault: () => {
88 turn [];
89 ,
90 },
91 formatData: {
92 ype: Array,
93 ault: () => {
94 turn [];
95
96 : {
97 e: Number,
98 ault: 16,
99 ble: {
100 e: Boolean,
101 ault: false,
102 b: {
103 e: Boolean,
104 efault: false,
105 }
106 ,
107 a () {
108 rn {
109 e: null,
110 reeXzqHeight: 0,
111 linshi: require("@/image/lpb/lin.png"),
112 zhengshi: require("@/image/lpb/zheng.png"),
113 ianshi: require("@/image/lpb/xian.png"),
114 }
115 ,
116 nted () {
117 onsole.log(this.$refs.curZxx,'this.$refs.curZxx');
118 this.$refs.curZxx) {
119 onsole.log(this.$refs.curZxx[0].dataset.zdbsm);
120 his.$store.state.oldZdbsm = this.$refs.curZxx[0].dataset.zdbsm;
121 : {
122 Click (item) {
123 self = this;
124 开启延时器，300ms的间隔区分单击和双击，解决双击时执行两次单击事件
125 learTimeout(self.time);
126 elf.time = setTimeout(() => {
127 em.expand = item.expand == undefined ? true : !item.expand;
128 self.$emit("itemClick", item);
129 source = ''
130 itch (this.$route.path) {
131 ase '/add':
132 source = '1,2'
133 break;
134 case '/change':
135 source = '2'
136 break;
137 case '/panel':
138 source = '0,1,2'
139 break;
140 e '/modify':
141 source = '1'
142 break;
143 e '/search':
144 source = '0,1,2'
145 break;
146 default:
147 break;
148
149 目录树的所有权类型单击时加载子节点
150 (!item.children && !item.type) {
151 et data = {
152 xzqbsm: item.xzq,
153 djqbsm: item.djq,
154 djzqbsm: item.djzq,
155 syqlx: item.dm,
156 source: source
157
158 / getZdDetailList(data).then((res) => {
159 // if (res.result.length > 0) {
160 / res.result.forEach(i => {
161 // if (i.children.length > 0) {
162 / i.expand = false;
163 }
164 / })
165 // self.$emit("ownerMethod", item, res.result);
166 / }
167 / }).catch((error) => {
168 / });
169
170 0);
171 键点击事件
172 enMenu (e, item, list) {
173 onsole.log(item, '右键list');
174 his.$emit("changeTop", e.pageY);
175 s.$emit("changeLeft", e.pageX);
176 s.$emit("changeZdData", item);
177 $emit("changeVisible", false);
178 所有权类型
179 e.log(item.dm,'item.dm ');
180 dm == 'G' || item.dm == 'J' ||item.dm == 'Z'){
181 mit("changeCreateVisible", true);
182
183 (item.type) {
184 zd':
185 $emit("changeIsZD", true);
186 mit("changeVisible", true);
187 ;
188 dz':
189 $emit("changeDzVisible", true);
190 ;
191 'zrz':
192 $emit("changeIsZD", false);
193 s.$emit("changeVisible", true);
194 ;
195 zdy':
196 $emit("changeLpbVisible", true);
197
198 ljz':
199 s.$emit("changeLpbVisible", true);
200 reak;
201 case 'gzw':
202 this.$emit("changeGzwVisible", true);
203 break;
204 fault:
205 reak;
206 键双击事件
207 ick (item, bsm) {
208 Timeout(this.time);
209 tore.state.newZdbsm = bsm;
210 tem.type) {
211 ':
212 tore.state.zdbsm = item.bsm;
213
214 :
215 tore.state.zrzbsm = item.bsm;
216 ;
217 'dz':
218 his.$store.state.dzbsm = item.bsm;
219 reak;
220 'gzw':
221 his.$store.state.gzwbsm = item.bsm;
222 reak;
223 fault:
224 reak;
225 m.type == 'zd' || item.type == 'dz' || item.type == 'zrz' || item.type == 'gzw') {
226 = {
227 2,
228 .bsm,
229 his.$route.query.auth ? this.$route.query.auth : '0,1,2'
230 .$route.query.workitemInstanceId) {
231 workitemInstanceId = this.$route.query.workitemInstanceId;
232 (this.$route.query.ywbsm) {
233 data.ywbsm = this.$route.query.ywbsm;
234 }
235 this.$router.push({
236 path: '/' + item.type,
237 query: data
238 });
239 }
240 },
241 closeMenu () {
242 this.$emit("changeVisible", false);
243 },
244 },
245 watch: {
246 visible (value) {
247 if (value) {
248 document.body.addEventListener("click", this.closeMenu);
249 } else {
250 document.body.removeEventListener("click", this.closeMenu);
251 }
252 },
253 },
254 };
255 </script>
256 <style lang="scss">
257 .content {
258 height: 100%;
259 width: 100%;
260 }
261
262 .column-start-center {
263 display: flex;
264 display: -webkit-flex;
265 flex-direction: column;
266 justify-content: flex-start;
267 align-items: center;
268 }
269
270 .row-flex-start {
271 display: flex;
272 display: -webkit-flex;
273 flex-direction: row;
274 justify-content: flex-start;
275 align-items: center;
276 }
277
278 .nowrap {
279 overflow: hidden;
280 text-overflow: ellipsis;
281 white-space: nowrap;
282 }
283
284 // .active_color {
285 // color: #ffffff;
286 // }
287 .reTree_icon {
288 width: 17px;
289 height: 17px;
290 margin-right: 16px;
291 }
292
293 .no_icon {
294 width: 17px;
295 height: 17px;
296 }
297
298 .tree_item_box {
299 position: relative;
300 width: 100%;
301 cursor: pointer;
302 }
303
304 // .ofy_scroll{
305 // overflow-y: scroll;
306 // overflow-x: hidden;
307 // }
308 .basic_layer {
309 width: 100%;
310 position: relative;
311 color: #4a4a4a;
312 cursor: pointer;
313
314 .layer_text {
315 flex: 1;
316 line-height: 40px;
317 }
318 }
319
320 .first_vertical_line {
321 content: "";
322 position: absolute;
323 width: 1px;
324 left: 6px;
325 top: 17px;
326 background: #c3c5c8;
327 }
328
329 .basic_banner {
330 position: relative;
331 width: 279px;
332 height: 40px;
333 box-sizing: border-box;
334 padding-left: 20px;
335 }
336
337 .lpb_basic_banner {
338 padding-left: 42px;
339 }
340
341 .second_layer {
342 position: relative;
343 width: calc(100% - 20px);
344 cursor: pointer;
345 padding-left: 20px;
346
347 .basic_banner {
348 width: 100%;
349 }
350 }
351
352 .zxxNode {
353 width: 279px !important;
354 position: relative;
355 left: -80px;
356 text-indent: 80px;
357 }
358
359 .iszd {
360 .tree_item_box {
361 .zxxNode {
362 padding-left: 0;
363 left: 0;
364 }
365 }
366 }
367
368 .iszrz,
369 .isgzw {
370 left: 0px !important;
371 text-indent: 96px;
372 }
373
374 .isdz {
375 text-indent: 96px !important;
376
377 .iszrz {
378 left: 0 !important;
379 text-indent: 112px !important;
380 }
381 }
382
383 .third_layer {
384 position: relative;
385 width: calc(100% - 20px);
386 cursor: pointer;
387 padding-left: 20px;
388 }
389
390 .white_layer {
391 color: black !important;
392 }
393
394 .lpbTree-node {
395 position: absolute;
396 top: 1px;
397 left: 0;
398 }
399
400 // .second_layer::before {
401 // content: "";
402 // position: absolute;
403 // height: 1px;
404 // width: 16px;
405 // left: 8px;
406 // top: 8px;
407 // opacity: .5;
408 // background: url('../../assets/images/rowline1.png');
409 // background-position-y: center;
410 // }
411 // .third_layer::before {
412 // content: "";
413 // position: absolute;
414 // height: 1px;
415 // width: 16px;
416 // left: 8px;
417 // top: 8px;
418 // opacity: .5;
419 // background: url('../../assets/images/rowline1.png');
420 // background-position-y: center;
421 // }
422
423 // .linkLine_default::after {
424 // content: "";
425 // position: absolute;
426 // height: 100%;
427 // width: 1px;
428 // left: 7px;
429 // top: 0px;
430 // opacity: .5;
431 // background: url('../../assets/images/colline1.png');
432 // background-position-x: center;
433 // }
434 // .linkLine_first::after {
435 // content: "";
436 // position: absolute;
437 // /* 为了触顶 */
438 // top: -16px;
439 // height: calc(100% + 16px);
440 // width: 1px;
441 // left: 7px;
442 // opacity: .5;
443 // background: url('../../assets/images/colline1.png');
444 // background-position-x: center;
445 // }
446 // // 上半截
447 // .linkLine_half_top::after {
448 // content: "";
449 // position: absolute;
450 // height: 23px;
451 // top: -14px;
452 // width: 1px;
453 // left: 7px;
454 // opacity: .5;
455 // background: url('../../assets/images/colline1.png');
456 // background-position-x: center;
457 // }
458 // .linkLine_last::after {
459 // content: "";
460 // position: absolute;
461 // height: 9px;
462 // width: 1px;
463 // left: 7px;
464 // top: 0px;
465 // opacity: .5;
466 // background: url('../../assets/images/colline1.png');
467 // background-position-x: center;
468 // }
469
470 .reTree_default_icon {
471 // opacity: .5;
472 background-size: contain;
473 }
474
475 .reTree_collapse_icon {
476 // opacity: .5;
477 background: url("../../assets/images/arrow-down-bold.svg") no-repeat center center;
478 background-size: contain;
479 }
480
481 .reTree_expand_icon {
482 // opacity: .5;
483 background: url("../../assets/images/arrow-left-bold.svg") no-repeat center center;
484 background-size: contain;
485 }
486
487 .lpbTree_collapse_icon {
488 // opacity: .5;
489 background-size: contain;
490 }
491
492 .lpbTree_expand_icon {
493 // opacity: .5;
494 background: url("../../assets/images/arrow-left-bold.svg") no-repeat center center;
495 background-size: contain;
496 }
497
498
499 .reTree_focus_icon {
500 // opacity: .5;
501 background: url("../../assets/images/reTree_focus_.svg") no-repeat center center;
502 background-size: contain;
503 }
504
505 .qsztImg {
506 width: 16px;
507 margin-right: 6px;
508 // border-radius: 50%; height: 20px; width: 20px; display: inline-block;
509 }
510
511 .curNode {
512 >.basic_banner {
513 background: #E9F5FF;
514 box-shadow: inset 2px 0 0 0 #0C71FB;
515 color: #0C71FB;
516 }
517 }
518
519 .qsztFont {
520 text-align: center;
521
522 display: inline-block;
523 width: 16px;
524 height: 16px;
525 font-size: 12px;
526 line-height: 16px;
527 border: 1px solid;
528 border-radius: 8px;
529 }
530
531 .mr4 {
532 margin-right: 4px;
533 }
534 </style>
1 <template>
2 <div class="content column-start-center reTree_box"
3 :style="{ fontSize: (size || 16) + 'px', lineHeight: (size || 16) + 'px', width: (islpb ? '200' : '286') + 'px' }">
4 <div class="column-start-center basic_layer" :class="islpb ? 'white_layer' : ''" v-for="(item, index) in formatData"
5 :key="index">
6 <div class="row-flex-start basic_banner" :class="{
7 active_color: item.expand && item.children.length > 0,
8 }" @click="itemClick(item)">
9
10 <div class="layer_text nowrap" @contextmenu.prevent="openMenu($event, item)"><i class="iconfont iconguoyou"></i>
11 {{ item.mc }}</div>
12 <div class="reTree_icon" :style="{
13 height: 10 + 'px',
14 width: 10 + 'px',
15 }" :class="{
16 reTree_default_icon: item.children.length === 0,
17 reTree_collapse_icon: !islpb && item.expand && item.children.length > 0,
18 reTree_expand_icon: !islpb && !item.expand && item.children.length > 0,
19 lpbTree_collapse_icon: islpb && item.expand && item.children.length > 0,
20 lpbTree_expand_icon: islpb && !item.expand && item.children.length > 0,
21 }"></div>
22 </div>
23
24 <lineItem v-if="item.expand && item.children.length > 0" v-on="$listeners" @ownerMethod="ownerMethod(arguments)"
25 @changeTop="changeTop" @changeZdData="changeZdData" @changeLeft="changeLeft" @changeVisible="changeVisible"
26 @changeLpbVisible="changeLpbVisible" @changeIsZD="changeIsZD" @changeCreateVisible="changeCreateVisible"
27 @changeDzVisible="changeDzVisible" @changeGzwVisible="changeGzwVisible" :list="item.children"
28 :visible="zrzVisible" :size="size" :islpb="islpb" :formatData="formatData"></lineItem>
29 </div>
30
31 <ul v-show="zrzVisible" :style="{ left: left + 'px', top: top + 'px' }" class="contextmenu">
32 <li @click="postionToMap">定位</li>
33 <li @click="importGeo">导入图形</li>
34 <li>
35 导出图形
36 <ul class="contextmenu childUl">
37 <li @click="exportText">文本</li>
38 <li @click="exportCad">CAD</li>
39 <li @click="exportExcel">Excel</li>
40 <li @click="exportToShp">ESRI Shape</li>
41 </ul>
42 </li>
43 <li @click="drsx" :class="zdQszt == '0' ? '' : 'noEdit'">导入属性</li>
44 <li @click="dcsx">导出属性</li>
45 <li v-show="!isZD">导入楼盘</li>
46 <!-- <li>重叠分析</li> -->
47 <li v-show="isZD && (zdQszt == '1' || zdQszt == '2')" @click="openCreateDialog('dzw')">添加定着物</li>
48 <li v-show="isZD && (zdQszt != '1' && zdQszt != '2')" class="noEdit">添加定着物</li>
49 <li @click="deleteByBsm()">删除</li>
50 <li @click="deleteGeoByBsm()">删除图形</li>
51 </ul>
52 <ul v-show="dzVisible" :style="{ left: left + 'px', top: top + 'px' }" class="contextmenu">
53 <li @click="openCreateDialog('zrz')">新建自然幢</li>
54 <li @click="deleteByBsm()">删除</li>
55 </ul>
56 <ul v-show="createVisible" :style="{ left: left + 'px', top: top + 'px' }" class="contextmenu">
57 <li @click="openCreateDialog">新建宗地</li>
58 </ul>
59 <!-- 构筑物删除 -->
60 <ul v-show="gzwVisible" :style="{ left: left + 'px', top: top + 'px' }" class="contextmenu">
61 <li @click="deleteByBsm">删除</li>
62 </ul>
63 <ul v-show="lpbvisible" :style="{ left: lpbleft + 'px', top: lpbtop + 'px' }" class="contextmenu">
64 <li v-show="zdData.type == 'zrz'" @click="openLpbDialog('ljz')">添加逻辑幢</li>
65 <li v-show="zdData.type == 'zrz' || zdData.type == 'ljz'" @click="openLpbDialog('zdy')">添加幢单元</li>
66 <li v-show="zdData.type == 'zrz' || zdData.type == 'ljz' || zdData.type == 'zdy'" @click="openLpbDialog('ch')">
67 添加层户</li>
68 <li v-show="zdData.type == 'ljz'" @click="deleteLjz">删除</li>
69 <li v-show="zdData.type == 'zdy'" @click="deleteZdy">删除</li>
70 </ul>
71
72 <!--@close="closeImportDialog"-->
73 <el-dialog v-dialogDrag :close-on-click-modal="false" title="导入图形" :modal="false" custom-class="importDialog"
74 :visible.sync="improtDialog" width="30%" @close="closeImportDialog">
75 <import-geo :property-info="zdData" :timeLine="new Date().getTime()" :geo-info="currentClickZdGeo"
76 @closeImportDialog="closeImportDialog"></import-geo>
77 </el-dialog>
78 <!-- 添加定着物弹框 -->
79 <el-dialog v-dialogDrag :close-on-click-modal="false" title="新建" :modal="false" :visible.sync="dialogVisible"
80 width="48%">
81 <!-- <Create @closeDialog="closeDialog" :auth="true" :createZrz="createZrz" ></Create> -->
82 </el-dialog>
83 <!-- <sxdr :sxdr-visible="sxdrVisible" @close="sxdrClose" :dylx="zdData.type" :bsm="zdData.bsm"></sxdr> -->
84 </div>
85 </template>
86 <script>
87 import lineItem from "./lineItem.vue";
88 // import { deleteZdInfoByBsm, exportShp, exportExcel, delJzdByBsm, delJzxByBsm } from "@api/zd";
89 // import Create from "../../views/panel/create/index";
90 import ImportGeo from './tx/importGeo'
91 port geoUtils from "@/components/lineTree/tx/js/geoUtils";
92 rt featureUpdate from "@/libs/map/featureUpdate";
93 ort { deleteLjz, deleteZdy } from "@api/lpb"
94 exportTemJson from '@/api/json/exportTemplate.json'
95 mport sxdr from '@/components/sxdr/sxdr'
96 port default {
97 nheritAttrs: false,
98 ps: {
99 {
100 e: Array,
101 ault: () => {
102 turn [];
103
104 : {
105 e: Number,
106 ault: 16,
107 b: {
108 e: Boolean,
109 ault: false,
110
111 omponents: { lineItem, Create, ImportGeo, sxdr },
112 ixins: [geoUtils, featureUpdate],
113 a () {
114 rn {
115 rVisible: false,
116 electedDetail: {},
117 timer: {},
118 formatData: this.$store.state.treeData,
119 isible: false,
120 top: 0,
121 left: 0,
122 sZD: true,
123 ata: {},
124 rentClickZdGeo: "",
125 mprotDialog: false,
126 ialogVisible: false,
127 制自然幢右键菜单
128 Visible: false,
129 盘表
130 visible: false,
131 top: 0,
132 left: 0,
133 /控制新建宗地菜单
134 reateVisible: false,
135 幢
136 isible: false,
137 属状态
138 szt: null,
139 : "PROJCS[\"XADFZBX\",GEOGCS[\"GCS_WGS_1984\",DATUM[\"D_WGS_1984\",SPHEROID[\"WGS_1984\",6378137.0,298.257223563]],PRIMEM[\"Greenwich\",0.0],UNIT[\"Degree\",0.0174532925199433]],PROJECTION[\"Transverse_Mercator\"],PARAMETER[\"False_Easting\",0.0],PARAMETER[\"False_Northing\",0.0],PARAMETER[\"Central_Meridian\",0.0],PARAMETER[\"Scale_Factor\",1.0],PARAMETER[\"Latitude_Of_Origin\",0.0],UNIT[\"Meter\",1.0]]",
140 ateZrz: false,
141 /构筑物
142 zwVisible: false
143
144 ch: {
145 (n, o) {
146 s.formatData = this.preDealData(n);
147 isible (value) {
148 (value) {
149 ment.body.addEventListener("click", this.closeMenu);
150 lse {
151 cument.body.removeEventListener("click", this.closeMenu);
152
153
154 Visible (value) {
155 (value) {
156 cument.body.addEventListener("click", this.closeMenu);
157 lse {
158 cument.body.removeEventListener("click", this.closeMenu);
159 wVisible (value) {
160 f (value) {
161 document.body.addEventListener("click", this.closeMenu);
162 lse {
163 cument.body.removeEventListener("click", this.closeMenu);
164 }
165 zrzVisible (value) {
166 (value) {
167 ment.body.addEventListener("click", this.closeMenu);
168 lse {
169 document.body.removeEventListener("click", this.closeMenu);
170 reateVisible(value) {
171 (value) {
172 document.body.addEventListener("click", this.closeMenu);
173 } else {
174 document.body.removeEventListener("click", this.closeMenu);
175 }
176 }
177 ed () {
178 nextTick(() => {
179 eDealData(this.pd);
180 ndTreeItemById(["6b5af49d803f97baf06afb897de257f5"]);
181
182 {
183 .log(this.zdData, 'zdData')
184 ow.open(`api/tx/excelGeo/export?bsm=${this.zdData.bsm}&type=${this.zdData.type}`)
185 `api/tx/excelGeo/export?bsm=${this.zdData.bsm}&type=${this.zdData.type}`
186 mIF = document.createElement("iframe");
187 src = url;
188 style.display = "none";
189 t.body.appendChild(elemIF)
190 {
191 his.zdQszt != '0') {
192
193 drVisible = true;
194 e () {
195 sxdrVisible = false;
196 ading () {
197 his.$emit("loading")
198
199 eleteLjz () {
200 console.log("删除逻辑幢")
201 console.log(this.zdData, "zdData")
202 deleteLjz(this.zdData.bsm).then(res => {
203 if (res.success) {
204 this.loading()
205 else {
206 dy () {
207 log("删除幢单元")
208 e.log(this.zdData, "zdData")
209 teZdy(this.zdData.bsm).then(res => {
210 f (res.success) {
211 this.loading()
212 }
213
214 ,
215 变菜单数据
216 Visible (data) {
217 s.zrzVisible = data;
218 s.lpbvisible = false;
219 dzVisible = false;
220 wVisible = false;
221 ta (data) {
222 = data;
223 zt = data.qszt;
224 (data) {
225 p = data;
226 lpbtop = data;
227 angeLeft (data) {
228 this.left = data;
229 this.lpbleft = data;
230 },
231 changeIsZD (data) {
232 this.isZD = data;
233 },
234 changeLpbVisible (data) {
235 this.lpbvisible = data;
236 this.zrzVisible = false;
237 this.dzVisible = false;
238 this.gzwVisible = false;
239 },
240 changeCreateVisible (data) {
241 this.createVisible = true;
242 },
243 //多幢
244 changeDzVisible (data) {
245 this.dzVisible = data;
246 this.zrzVisible = false;
247 this.lpbvisible = false;
248 this.gzwVisible = false;
249 },
250 //构筑物
251 changeGzwVisible (data) {
252 this.gzwVisible = data;
253 this.zrzVisible = false;
254 this.lpbvisible = false;
255 this.dzVisible = false;
256 },
257 //添加定着物
258 openCreateDialog (type) {
259 if (type == 'zrz') {
260 this.createZrz = true;
261 }
262 console.log(this.zdData, 'this.zdData');
263 this.dialogVisible = true;
264 this.$store.state.zdbsm = this.zdData.zdbsm;
265 if (this.zdData.type == 'dz') {
266 this.$store.state.dzbsm = this.zdData.bsm;
267 } else {
268 this.$store.state.dzbsm = '';
269 }
270 },
271 //关闭添加定着物弹框
272 closeDialog () {
273 this.dialogVisible = false;
274 this.createZrz = false;
275 },
276 preDealData (list) {
277 //楼盘表目录树没有expand属性
278 // if(list == null){
279 // return list
280 // }else{
281 list.forEach((x) => {
282 if (x.expand == undefined) this.$set(x, "expand", true);
283 if (x.children && x.children.length > 0) {
284 this.preDealData(x.children);
285 }
286 });
287 return list;
288 // }
289 },
290 // 根据id展开树的具体项
291 expandTreeItemById (idList) {
292 let _this = this;
293 function loopTree (list) {
294 list.forEach((x) => {
295 if (idList.includes(x.zdbsm)) {
296 _this.$set(x, "expand", true);
297 } else {
298 _this.$set(x, "expand", false);
299 }
300 if (x.children && x.children.length > 0) loopTree(x.children);
301 });
302 return list;
303 }
304 this.formatData = loopTree(this.pd);
305 console.log(this.formatData, "this.formatData");
306 },
307 itemClick (item) {
308 // item.expand = item.expand == undefined? true:!item.expand;
309 this.formatData.forEach(i => {
310 if (i.bsm != item.bsm) {
311 i.expand = false
312 } else {
313 // i.expand = !item.expand
314 }
315 })
316 item.expand = !item.expand;
317 // this.$emit("itemClick", item);
318 },
319 //给所有权类型添加子节点
320 ownerMethod (arr) {
321 let item = arr[0];
322 let list = arr[1]
323 this.formatData.forEach(i => {
324 if (i.bsm == item.xzq) {
325 i.children.forEach(j => {
326 if (j.bsm == item.djq) {
327 j.children.forEach(k => {
328 if (k.bsm == item.djzq) {
329 k.children.forEach(n => {
330 if (n.dm == item.dm) {
331 this.$nextTick(() => {
332 n.children = list;
333 })
334 }
335 })
336 }
337 })
338 }
339 })
340 }
341 });
342 this.$store.state.treeData = this.formatData;
343 },
344 //自然幢右键点击事件
345 openMenu (e, item) {
346 this.lpbleft = e.pageX;
347 this.lpbtop = e.pageY;
348 this.zdData = item;
349 this.changeLpbVisible(true);
350 },
351 //关闭右键菜单
352 closeMenu () {
353 this.zrzVisible = false;
354 this.lpbvisible = false;
355 this.dzVisible = false;
356 this.gzwVisible = false;
357 },
358 //楼盘表右键菜单项打开父组件弹框
359 openLpbDialog (type) {
360 this.$parent.openLpbDialog(this.zdData, type);
361 },
362 detailDoubleClick (data) {
363 clearTimeout(this.timer);
364 this.selectedDetail = data;
365 this.$emit("detailDoubleClick", data);
366 },
367 //右键菜单的删除
368 deleteByBsm () {
369 let name = '';
370 switch (this.zdData.type) {
371 case 'zd':
372 name = '宗地'
373 break;
374 case 'dz':
375 name = '多幢'
376 break;
377 case 'zrz':
378 name = '自然幢'
379 break;
380 case 'gzw':
381 name = '构筑物'
382 break;
383
384 default:
385 break;
386 }
387 this.$confirm('是否确定删除该' + name + '?', '提示', {
388 confirmButtonText: '确定',
389 cancelButtonText: '取消',
390 type: 'warning'
391 }).then(() => {
392 let params = { "bsm": this.zdData.bsm, "type": this.zdData.type };
393 deleteZdInfoByBsm(params)
394 .then((res) => {
395 console.log(res);
396 if (res.success) {
397 this.$message({
398 type: 'success',
399 message: '删除成功!'
400 });
401 this.$router.push("/panel");
402 } else {
403 this.$message({
404 message: res.message,
405 type: "warning",
406 });
407 }
408 })
409 .catch((error) => { });
410 }).catch(() => {
411
412 });
413 var self = this;
414 var BSM = "";
415 var type = this.zdData.type;
416 if (type == "zd") {
417 BSM = this.zdData.zdbsm;
418 } else {
419 BSM = this.zdData.bsm;
420 }
421 //删除图形相关信息
422 var type = this.zdData.type;
423 this.queryGeoByBsm(BSM, type, function (features) {
424 if (features && features.length > 0) {
425 var layer = null;
426 if (type == 'zd') {
427 layer = self.getLayerByName("ZDJBXX");
428 } else {
429 layer = self.getLayerByName("ZRZ");
430
431 }
432 var featureUrl = layer.layerUrl.replace("MapServer", "FeatureServer");
433 featureUrl += "/" + layer.id;
434 self.delGraphic(featureUrl, features[0], null);
435 }
436 });
437 },
438 //删除图形
439 deleteGeoByBsm () {
440 var self = this;
441 var BSM = "";
442 var type = this.zdData.type;
443 if (type == "zd") {
444 BSM = this.zdData.zdbsm;
445 } else {
446 BSM = this.zdData.bsm;
447 }
448 //删除图形相关信息
449 var type = this.zdData.type;
450 this.queryGeoByBsm(BSM, type, function (features) {
451 if (features && features.length > 0 && features[0].geometry.rings.length > 0) {
452 var layer = null;
453 if (type == 'zd') {
454 layer = self.getLayerByName("ZDJBXX");
455 } else {
456 layer = self.getLayerByName("ZRZ");
457 }
458 var featureUrl = layer.layerUrl.replace("MapServer", "FeatureServer");
459 featureUrl += "/" + layer.id;
460 features[0].geometry = null;
461 self.updateGraphic(featureUrl, features, function (res) {
462 if (!res.updateFeatureResults[0].error) {
463 self.$message.warning("删除成功!!!")
464 //清除图层
465 self.clearHighlightLayer("testMap");
466 //self.addGeoByBsm(BSM,type,"testMap");
467 //删除界址点 界址线
468 if (type == 'zd') {
469 self.delJzdAndJzx(BSM);
470 }
471 }
472
473 });
474 } else {
475 self.$message.warning("暂无图形信息!!!")
476 }
477 });
478 },
479 //删除宗地界址点 界址线
480 delJzdAndJzx (bsm) {
481 delJzdByBsm({ zdbsm: bsm }).then(res => {
482 if (res.success) {
483 console.log("删除界址点成功!!!");
484 }
485 });
486 delJzxByBsm({ zdbsm: bsm }).then(res => {
487 if (res.success) {
488 console.log("删除界址线成功!!!");
489 }
490 })
491 },
492 /*
493 * 导入图形
494 * */
495 importGeo () {
496 var self = this;
497 var BSM = "";
498 if (this.zdData.qszt != '0') {
499 this.$message.warning("不是临时数据，不能导入图形!!!");
500 return;
501 }
502 var type = this.zdData.type;
503 if (type == "zd") {
504 BSM = this.zdData.zdbsm;
505 } else {
506 BSM = this.zdData.bsm;
507 }
508 //当确定导入图形是 跳转到图形界面
509 this.queryGeoByBsm(BSM, type, function (features) {
510 if (features && features.length > 0) {
511 if (features[0].geometry && features[0].geometry.rings.length > 0) {
512 self.$confirm('该条数据有地块信息，是否继续导入?', '提示', {
513 confirmButtonText: '继续',
514 cancelButtonText: '取消',
515 type: 'warning'
516 }).then(() => {
517 self.postionToMap();
518 self.improtDialog = true;
519 self.currentClickZdGeo = features[0];
520 }).catch(() => {
521 self.$message({
522 type: 'info',
523 message: '已取消'
524 });
525 });
526 } else {
527 self.postionToMap();
528 self.currentClickZdGeo = features[0];
529 self.improtDialog = true;
530 }
531
532 } else {
533 self.postionToMap();
534 self.currentClickZdGeo = null;
535 self.improtDialog = true;
536 }
537 });
538 },
539 //导出文本文件
540 exportText () {
541 var self = this;
542 var type = this.zdData.type;
543 var BSM = type == 'zd' ? this.zdData.zdbsm : this.zdData.bsm;
544 this.queryGeoByBsm(BSM, type, function (features) {
545 if (features && features.length > 0 && features[0].geometry.rings.length > 0) {
546 var data = features[0];
547 var jzdInfo = self.craetJZPoint(data);
548 var textCotent = "";
549 textCotent += exportTemJson.exprotTextAttr;
550 textCotent += "[地块坐标]\n";
551 var dkMc = "", dkYt = "";
552 if (type == 'zd') {
553 dkMc = data.attributes.ZL;
554 dkYt = data.attributes.YT;
555 } else {
556 dkMc = data.attributes.XMMC + data.attributes.JZWMC;
557 dkYt = "建设用地";
558 }
559 textCotent += ",,," + dkMc + ",面,," + dkYt + ",,@\n";
560 for (var i = 0; i < jzdInfo.length; i++) {
561 textCotent += jzdInfo[i].jzdh + "," + jzdInfo[i].sxh + "," +
562 jzdInfo[i].x + "," + jzdInfo[i].y + "\n"
563 }
564 self.downloadTxt(textCotent, "outPut.txt");
565 }
566 }, { wkt: this.wkt });
567 },
568 //导出shp文件
569 exportToShp () {
570 var self = this;
571 var type = this.zdData.type;
572 var BSM = type == 'zd' ? this.zdData.zdbsm : this.zdData.bsm;
573 this.queryGeoByBsm(BSM, type, function (features) {
574 if (features && features.length > 0 && features[0].geometry.rings.length > 0) {
575 var data = JSON.stringify(features[0]);
576 window.location.href = "/api/tx/shpUtils/writeShp?strObj=" + encodeURI(data)
577 /* exportShp({
578 "strObj":encodeURI(data)
579 }).then(res => {
580 debugger
581 });*/
582 } else {
583 self.$message.warning("暂无空间信息!!!!");
584 }
585 }, { wkt: this.wkt });
586 },
587 //导出excel
588 exportExcel () {
589 var self = this;
590 var type = this.zdData.type;
591 var BSM = type == 'zd' ? this.zdData.zdbsm : this.zdData.bsm;
592 this.queryGeoByBsm(BSM, type, function (features) {
593 if (features && features.length > 0 && features[0].geometry.rings.length > 0) {
594 var data = features[0];
595 var jzdInfo = self.craetJZPoint(data);
596 var submitData = [];
597 for (var i = 0; i < jzdInfo.length; i++) {
598 var obj = {
599 jzdHao: jzdInfo[i].jzdh,
600 x: jzdInfo[i].x,
601 y: jzdInfo[i].y,
602 diKuaiQuanHao: jzdInfo.sxh
603 }
604 submitData.push(obj);
605 }
606 exportExcel(submitData).then((res) => {
607 if (res.code == 200) {
608 var path = res.result;
609 window.location.href = "/api/tx/excelGeo/download?filePath=" + encodeURI(path);
610 }
611 });
612 } else {
613 self.$message.warning("还没有空间信息!!!!")
614 }
615 }, { wkt: this.wkt })
616 },
617 //导出CAD
618 exportCad () {
619 //TODO
620 },
621 downloadTxt (text, fileName) {
622 let element = document.createElement('a')
623 element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text))
624 element.setAttribute('download', fileName)
625 element.style.display = 'none'
626 element.click()
627 },
628 //图形定位
629 postionToMap () {
630 var type = this.zdData.type;
631 var BSM = type == 'zd' ? this.zdData.zdbsm : this.zdData.bsm;
632 if (this.$route.path == "/viewMap") {
633 //定位到当前空间位置
634 // TODO 这个方法只是为了支撑功能
635 this.postionToThisGeo(BSM, type);
636 return;
637 }
638 var curretRouterInfo = {
639 path: this.$route.path,
640 query: this.$route.query
641 }
642 sessionStorage.setItem("curretRouterInfo", JSON.stringify(curretRouterInfo));
643 this.$router.push({
644 path: "/viewMap",
645 query: {
646 bsm: BSM,
647 type: type
648 }
649 });
650 },
651
652 //关闭图形弹框
653 closeImportDialog () {
654 this.improtDialog = false;
655 this.clearOverLayer();
656 }
657
658 },
659 };
660 </script>
661 <style lang="scss" scoped>
662 .content {
663 height: 100%;
664 width: 100%;
665 overflow-y: scroll;
666 overflow-x: hidden;
667 }
668
669 .column-start-center {
670 display: flex;
671 display: -webkit-flex;
672 flex-direction: column;
673 justify-content: flex-start;
674 align-items: center;
675
676 }
677
678 .row-flex-start {
679 display: flex;
680 display: -webkit-flex;
681 flex-direction: row;
682 justify-content: flex-start;
683 align-items: center;
684 }
685
686 .nowrap {
687 overflow: hidden;
688 text-overflow: ellipsis;
689 white-space: nowrap;
690 }
691
692 .reTree_icon {
693 width: 17px;
694 height: 17px;
695 margin-right: 16px;
696 }
697
698 .basic_layer {
699 width: 100%;
700 position: relative;
701 color: #4a4a4a;
702 cursor: pointer;
703 -moz-user-select: none;
704 -o-user-select: none;
705 -khtml-user-select: none;
706 -webkit-user-select: none;
707 -ms-user-select: none;
708 user-select: none;
709
710 .layer_text {
711 flex: 1;
712 }
713 }
714
715 .white_layer {
716 color: black !important;
717 }
718
719 .first_vertical_line {
720 content: "";
721 position: absolute;
722 width: 1px;
723 left: 6px;
724 top: 17px;
725 background: #c3c5c8;
726 }
727
728 .basic_banner {
729 position: relative;
730 width: 280px;
731 height: 40px;
732 }
733
734 .second_layer {
735 position: relative;
736 width: 100%;
737 cursor: pointer;
738 padding-left: 25px;
739 }
740
741 .second_layer::before {
742 content: "";
743 position: absolute;
744 height: 1px;
745 width: 16px;
746 left: 9px;
747 top: 9px;
748 background: #c3c5c8;
749 }
750
751 .linkLine_default::after {
752 content: "";
753 position: absolute;
754 height: 100%;
755 width: 1px;
756 left: 9px;
757 top: 0px;
758 background: #c3c5c8;
759 }
760
761 .linkLine_first::after {
762 content: "";
763 position: absolute;
764 /* 为了触顶 */
765 top: -16px;
766 height: calc(100% + 16px);
767 width: 1px;
768 left: 9px;
769 background: #c3c5c8;
770 }
771
772 // 上半截
773 .linkLine_half_top::after {
774 content: "";
775 position: absolute;
776 height: 23px;
777 top: -14px;
778 width: 1px;
779 left: 9px;
780 background: #c3c5c8;
781 }
782
783 .linkLine_last::after {
784 content: "";
785 position: absolute;
786 height: 9px;
787 width: 1px;
788 left: 9px;
789 top: 0px;
790 background: #c3c5c8;
791 }
792
793 .reTree_collapse_icon {
794 background: url("../../assets/images/arrow-down-bold.svg") no-repeat center center;
795 background-size: contain;
796 }
797
798 .reTree_default_icon {
799 background: url("../../assets/images/reTree_default_.svg") no-repeat center center;
800 background-size: contain;
801 }
802
803 .reTree_expand_icon {
804 background: url("../../assets/images/arrow-left-bold.svg") no-repeat center center;
805 background-size: contain;
806 }
807
808 .lpbTree_collapse_icon {
809 // opacity: .5;
810 background: url("../../assets/images/lpbTree_expand_.svg") no-repeat center center;
811 background-size: contain;
812 }
813
814 .lpbTree_expand_icon {
815 // opacity: .5;
816 background: url("../../assets/images/lpbTree_collapse_.svg") no-repeat center center;
817 background-size: contain;
818 }
819
820 .reTree_focus_icon {
821 background: url("../../assets/images/reTree_focus_.svg") no-repeat center center;
822 background-size: contain;
823 }
824
825 /* /deep/ .importDialog{
826 margin-top: 120px!important;
827 margin-left: 291px;
828 } */
829 </style>
1 <template>
2 <div>
3 <ul class="importDiv" v-if="!resultDialog && !txtResultDialog && !dealDialog">
4 <li>
5 <el-upload class="avatar-uploader" action="#" accept=".txt" :auto-upload="false" :show-file-list="false"
6 :on-change="txtFileChange">
7 <!-- <el-button size="small" type="primary">点击上传</el-button>-->
8 <i class="iconfont iconshangchuan"></i>
9 <div class="title">TXT文本格式</div>
10 <div class="templateDowload">
11 <a href="#" @click.stop="downloadFile('./fileTemplate/txttemplet.txt', 'txttemplet.txt')">TXT模板下载</a>
12 </div>
13 </el-upload>
14 </li>
15 <li>
16 <el-upload class="avatar-uploader" action="/api/tx/shpUtils/readShp" accept=".zip" :show-file-list="false"
17 :on-success="shpFileSuccess">
18 <!--<el-button size="small" type="primary">点击上传</el-button>-->
19 <i class="iconfont iconshangchuan"></i>
20 <div class="title">ESRI Shape文件格式</div>
21 </el-upload>
22 </li>
23 <li>
24 <el-upload class="avatar-uploader" action="https://jsonplaceholder.typicode.com/posts/" accept=".dwg,.dxf"
25 :show-file-list="false" :on-success="cadFileSuccess">
26 <!-- <el-button size="small" type="primary">点击上传</el-button>-->
27 <i class="iconfont iconshangchuan"></i>
28 <div class="title">CAD文件</div>
29 </el-upload>
30 </li>
31 <li>
32 <el-upload class="avatar-uploader" action="/api/tx/excelGeo/readExcel" accept=".xls,.xlsx"
33 :show-file-list="false" :on-success="excelFileSuccess">
34 <!--<el-button size="small" type="primary">点击上传</el-button>-->
35 <i class="iconfont iconshangchuan"></i>
36 <div class="title">Excel文件格式</div>
37 <div class="templateDowload">
38 <a href="#"
39 @click.stop="downloadFile('./fileTemplate/exceltemplet.xlsx', 'exceltemplet.xlsx')">Excel模板下载</a>
40 </div>
41 </el-upload>
42 </li>
43 </ul>
44 <div v-if="resultDialog">
45 <el-form :model="zdForm" ref="zdCheckForm" label-width="100px" size="small" @submit.native.prevent
46 class="demo-ruleForm">
47 <el-form-item label="宗地" prop="zdBsm" :rules="[
48 { required: true, message: '请选择宗地', trigger: 'change' },
49 ]">
50 <el-select v-model="zdForm.zdBsm" filterable placeholder="请选择" @change="zdChange">
51 <el-option v-for="item in resultData" :key="item.objectid" :label="item.XMMC" :value="item">
52 </el-option>
53 </el-select>
54 </el-form-item>
55 <el-form-item>
56 <el-button type="primary" @click="submitForm('zdCheckForm')">导入</el-button>
57 <el-button @click="cancel('zdCheckForm')">取消</el-button>
58 </el-form-item>
59 </el-form>
60 </div>
61 <div v-if="txtResultDialog">
62 <el-form :model="txtZd" ref="txtZdForm" label-width="100px" size="small" @submit.native.prevent
63 class="demo-ruleForm">
64 <el-form-item label="地块名称" prop="name" :rules="[
65 { required: true, message: '请选择地块', trigger: 'change' },
66 ]">
67 <el-select v-model="txtZd.name" filterable placeholder="请选择" @change="txtChange">
68 <el-option v-for="(item, index) in txtResult" :key="index" :label="item.attributes.name"
69 :value="item.attributes.name">
70 </el-option>
71 </el-select>
72 </el-form-item>
73 <el-form-item>
74 <el-button type="primary" @click="submitTxtForm('txtZdForm')">导入</el-button>
75 <el-button @click="cancelTxtForm('txtZdForm')">取消</el-button>
76 </el-form-item>
77 </el-form>
78 </div>
79 <div v-if="dealDialog">
80 <el-form :model="dealForm" ref="dealForm" label-width="100px" size="small" @submit.native.prevent
81 class="demo-ruleForm">
82 <el-form-item label="处理方法" prop="method" :rules="[
83 { required: true, message: '请选择', trigger: 'change' },
84 ]">
85 <el-select v-model="dealForm.method" filterable placeholder="请选择">
86 <el-option v-for="(item, index) in dealMethods" :key="index" :label="item.label" :value="item.value">
87 </el-option>
88 </el-select>
89 </el-form-item>
90 <el-form-item>
91 <el-button type="primary" @click="submitDealForm('dealForm')">确定</el-button>
92 <el-button @click="cancelDealForm('dealForm')">取消</el-button>
93 </el-form-item>
94 </el-form>
95 </div>
96 </div>
97 </template>
98 <script>
99 import geoUtils from "@components/lineTree/tx/js/geoUtils";
100 import featureUpdate from "@libs/map/featureUpdate";
101 // import { addjzd, addjzx } from "@/api/zd"
102 export default {
103 props: {
104 propertyInfo: {
105 type: Object,
106 default: null
107 },
108 geoInfo: {
109 type: Object,
110 default: null
111 },
112 timeLine: {
113 type: Number,
114 default: null
115 }
116 },
117 mixins: [geoUtils, featureUpdate],
118 data () {
119 return {
120 resultData: [],
121 resultDialog: false,
122 zdForm: {
123 zdBsm: ""
124 },
125 currentClickZd: null,
126 txtResult: [],
127 txtResultDialog: null,
128 txtZd: {
129 name: ""
130 },
131 overResults: [],//与导入宗地重叠的地块
132 currntDealGraphic: null,
133 dealMethods: [{
134 label: "不做处理",
135 value: "1"
136 }, {
137 label: "删除叠加部分",
138 value: "2"
139 }, {
140 label: "删除已重叠部分",
141 value: "3"
142 }, {
143 label: "删除原图形",
144 value: "4"
145 }],
146 dealDialog: false,
147 dealForm: {
148 method: ""
149 }
150 }
151 },
152 watch: {
153 timeLine (newValue, oldValue) {
154 this.resultDialog = false;
155 this.txtResultDialog = false;
156 this.dealDialog = false;
157 }
158 },
159 methods: {
160 txtFileChange (file, fileList) {
161 var self = this;
162 var fileReader = new FileReader();
163 fileReader.readAsText(file.raw);
164 fileReader.onload = function (res) {
165 var content = this.result;
166 if (!content || content.length == 0) {
167 self.$message.warning("文件内容为空!!!");
168 return;
169 }
170 self.analysisTextFile(content);
171 }
172 },
173 analysisTextFile (content) {
174 var index = content.indexOf("[地块坐标]"),
175 geoInfos = content.substr(index),
176 geoList = geoInfos.split("\n");
177 if (geoList.length < 1) {
178 this.$message.warning("文本内容格式有误，请效验文本内容格式!!!");
179 return;
180 }
181 //this.$emit("closeImportDialog");
182 var features = [], attributes = {}, points = [], j = 1;
183 for (var i = 1; i < geoList.length; i++) {
184 var rowData = geoList[i];
185 if ((rowData.indexOf("J") != -1 && rowData.indexOf("J") == 0) || (rowData.indexOf("j") != -1 && rowData.indexOf("j") == 0)) {
186 //解析坐标点信息
187 var pointInfo = rowData.split(",");
188 var point = [parseFloat(pointInfo[2]), parseFloat(pointInfo[3])];
189 points.push(point);
190 } else {
191 if (points.length > 0) {
192 var graphic = {
193 attributes: JSON.parse(JSON.stringify(attributes)),
194 geometry: {
195 rings: [points]
196 }
197 }
198 features.push(graphic);
199 }
200 //新建一个信息 坐标名称 类型
201 attributes = {};
202 points = []
203 var info = rowData.split(",");
204 if (info[3] || info[3] == 'null') {
205 attributes.name = '地块' + j;
206 j++
207 } else {
208 attributes.name = info[3];
209 }
210 }
211 }
212 if (points.length > 0) {
213 var graphic = {
214 attributes: JSON.parse(JSON.stringify(attributes)),
215 geometry: {
216 rings: [[points.concat()]]
217 }
218 }
219 features.push(graphic);
220 }
221 //新建一个信息 坐标名称 类型
222 attributes = {};
223 points = []
224 this.txtResult = features;
225 this.txtZd.name = "";
226 this.txtResultDialog = true;
227 },
228 shpFileSuccess (response, file, fileList) {
229 var self = this;
230 if (response.success) {
231 this.resultData = response.result;
232 this.resultDialog = true;
233 } else {
234 this.$message.warning(response.message);
235 }
236 },
237 cadFileSuccess (response, file, fileList) {
238
239 },
240 excelFileSuccess (response, file, fileList) {
241 var self = this;
242 if (response.success) {
243 var result = response.result;
244 var points = [];
245 for (var i = 0; i < result.length; i++) {
246 var point = [];
247 point[0] = parseFloat(result[i].x);
248 point[1] = parseFloat(result[i].y);
249 points.push(point);
250 }
251 var wkt = "PROJCS[\"XADFZBX\",GEOGCS[\"GCS_WGS_1984\",DATUM[\"D_WGS_1984\",SPHEROID[\"WGS_1984\",6378137.0,298.257223563]],PRIMEM[\"Greenwich\",0.0],UNIT[\"Degree\",0.0174532925199433]],PROJECTION[\"Transverse_Mercator\"],PARAMETER[\"False_Easting\",0.0],PARAMETER[\"False_Northing\",0.0],PARAMETER[\"Central_Meridian\",0.0],PARAMETER[\"Scale_Factor\",1.0],PARAMETER[\"Latitude_Of_Origin\",0.0],UNIT[\"Meter\",1.0]]";
252 var geometry = {
253 rings: [points],
254 spatialReference: {
255 wkt: wkt
256 },
257 type: "polygon"
258 }
259 var graphic = {
260 attributes: null,
261 geometry: geometry
262 }
263 self.checkGeo(graphic);
264 } else {
265 this.$message.warning(response.message);
266 }
267 },
268 //文本文档导入
269 submitTxtForm (formName) {
270 var self = this;
271 this.$refs[formName].validate((valid) => {
272 if (valid) {
273 var wkt = "PROJCS[\"XADFZBX\",GEOGCS[\"GCS_WGS_1984\",DATUM[\"D_WGS_1984\",SPHEROID[\"WGS_1984\",6378137.0,298.257223563]],PRIMEM[\"Greenwich\",0.0],UNIT[\"Degree\",0.0174532925199433]],PROJECTION[\"Transverse_Mercator\"],PARAMETER[\"False_Easting\",0.0],PARAMETER[\"False_Northing\",0.0],PARAMETER[\"Central_Meridian\",0.0],PARAMETER[\"Scale_Factor\",1.0],PARAMETER[\"Latitude_Of_Origin\",0.0],UNIT[\"Meter\",1.0]]";
274 var graphics = self.txtResult.filter(item => {
275 return item.attributes.name == self.txtZd.name;
276 })
277 var graphic = graphics[0];
278 graphic.geometry.type = "polygon";
279 graphic.geometry.spatialReference = {
280 wkt: wkt
281 }
282 self.checkGeo(graphic);
283 } else {
284 console.log('error submit!!');
285 return false;
286 }
287 })
288 },
289 txtChange (value) {
290 var wkt = "PROJCS[\"XADFZBX\",GEOGCS[\"GCS_WGS_1984\",DATUM[\"D_WGS_1984\",SPHEROID[\"WGS_1984\",6378137.0,298.257223563]],PRIMEM[\"Greenwich\",0.0],UNIT[\"Degree\",0.0174532925199433]],PROJECTION[\"Transverse_Mercator\"],PARAMETER[\"False_Easting\",0.0],PARAMETER[\"False_Northing\",0.0],PARAMETER[\"Central_Meridian\",0.0],PARAMETER[\"Scale_Factor\",1.0],PARAMETER[\"Latitude_Of_Origin\",0.0],UNIT[\"Meter\",1.0]]";
291 var graphics = this.txtResult.filter(item => {
292 return item.attributes.name == value;
293 })
294 var graphic = graphics[0];
295 graphic.geometry.type = "polygon";
296 graphic.geometry.spatialReference = {
297 wkt: wkt
298 }
299 this.addOverLayer(graphic.geometry, []);
300 },
301 //校验空间完整性
302 checkGeo (graphic) {
303 var self = this;
304 //校验完整性 直接调用空间方法 提交空间表
305 self.geoJoint(graphic.geometry, function (isJoint, message) {
306 if (isJoint) {
307 self.$message.warning(message)
308 return;
309 } else {
310 var type = self.propertyInfo.type;
311 if (type == 'zd') {
312 //重叠分析
313 self.zdOverAnalys(self.propertyInfo.zdbsm, graphic, function (flag, results) {
314 if (flag) {
315 self.$message.warning("导入的宗地与其他宗地有重叠，请处理！！");
316 self.dealOverData(results, graphic);
317 } else {
318 self.saveZd(graphic);
319 }
320 });
321 } else {
322 self.zrzOverAnalys(self.propertyInfo.bsm, graphic, function (flag, mes) {
323 if (flag) {
324 self.$message.warning(mes);
325 return;
326 } else {
327 self.saveZRZ(graphic);
328 }
329 });
330 }
331 }
332 });
333 },
334 //选择处理方式
335 submitDealForm (formName) {
336 var self = this;
337 this.$refs[formName].validate((valid) => {
338 if (valid) {
339 //选择处理方式
340 var value = self.dealForm.method;
341 self.currntDealGraphic.attributes = {};
342 switch (value) {
343 case '1': self.currntDealGraphic.attributes.BGZT = 1; self.saveZd(self.currntDealGraphic); break;
344 case "2": self.getDifference(self.currntDealGraphic, self.overResults, self.delOverGeo); break;
345 case "3": self.getResultsDif(self.overResults, self.currntDealGraphic, self.delOtherGeo, true); break;
346 case "4": self.getResultsDif(self.overResults, self.currntDealGraphic, self.delOtherGeo, false); break;
347 }
348 } else {
349 console.log('error submit!!');
350 return false;
351 }
352 })
353 },
354 //裁剪自己在保存
355 delOverGeo (geometry) {
356 if (!this.currntDealGraphic.attributes) {
357 this.currntDealGraphic.attributes = {};
358 }
359 this.currntDealGraphic.attributes.BGZT = 2;
360 if (geometry == null) {
361 this.$message.warning("完全重叠，已删除图形信息!!!")
362 this.currntDealGraphic.geometry = geometry;
363 }
364 this.saveZd(this.currntDealGraphic);
365 },
366 //裁剪别的在保存
367 delOtherGeo (results) {
368 //执行编辑操作
369 var layer = this.getLayerByName("ZDJBXX");
370 var featureUrl = layer.layerUrl.replace("MapServer", "FeatureServer");
371 featureUrl += "/" + layer.id;
372 this.updateGraphic(featureUrl, results);
373 this.saveZd(this.currntDealGraphic);
374 },
375 //下载文档模板
376 downloadFile (url, fileName) {
377 let link = document.createElement("a");
378 link.style.display = "none";
379 link.href = url;
380 link.setAttribute("download", fileName);
381 document.body.appendChild(link);
382 link.click();
383 document.body.removeChild(link);
384 },
385 //导入
386 submitForm (formName) {
387 //校验完整性 直接调用空间方法 提交空间表
388 var self = this;
389 this.$refs[formName].validate((valid) => {
390 if (valid) {
391 var geometry = self.parseWktToArc(self.currentClickZd.wkt);
392 geometry.type = "polygon";
393 var wkt = "PROJCS[\"XADFZBX\",GEOGCS[\"GCS_WGS_1984\",DATUM[\"D_WGS_1984\",SPHEROID[\"WGS_1984\",6378137.0,298.257223563]],PRIMEM[\"Greenwich\",0.0],UNIT[\"Degree\",0.0174532925199433]],PROJECTION[\"Transverse_Mercator\"],PARAMETER[\"False_Easting\",0.0],PARAMETER[\"False_Northing\",0.0],PARAMETER[\"Central_Meridian\",0.0],PARAMETER[\"Scale_Factor\",1.0],PARAMETER[\"Latitude_Of_Origin\",0.0],UNIT[\"Meter\",1.0]]";
394 geometry.spatialReference = {
395 wkt: wkt
396 }
397 var graphic = {
398 attributes: self.currentClickZd,
399 geometry: geometry
400 }
401 self.checkGeo(graphic);
402 } else {
403 console.log('error submit!!');
404 return false;
405 }
406 });
407 },
408 dealOverData (results, graphic) {
409 this.overResults = results;
410 this.currntDealGraphic = graphic;
411 this.resultDialog = false;
412 this.txtResultDialog = false;
413 this.dealDialog = true;
414 },
415 saveZd (graphic) {
416 var self = this;
417 var points = null, lines = null,
418 layer = self.getLayerByName("ZDJBXX");
419 var featureUrl = layer.layerUrl.replace("MapServer", "FeatureServer");
420 featureUrl += "/" + layer.id;
421 if (self.geoInfo) {
422 //替换 生成图像 高亮
423 if (graphic.attributes && graphic.attributes.BGZT) {
424 self.geoInfo.attributes.BGZT = graphic.attributes.BGZT;
425 }
426 self.geoInfo.attributes.BSM = this.propertyInfo.zdbsm;
427 self.geoInfo.attributes.ZDDM = this.propertyInfo.zddm;
428 self.geoInfo.attributes.XMMC = this.propertyInfo.mc;
429 graphic.attributes = self.geoInfo.attributes;
430 self.updateGraphic(featureUrl, graphic, function (res) {
431 //保存成功之后生成界址点 界址线
432 //生成坐标点
433 //跳转至map界面updateResults
434 var updResult = res.updateFeatureResults[0];
435 if (updResult.objectId) {
436 var OBJECTID = updResult.objectId;
437 if (graphic.geometry) {
438 points = self.craetJZPoint(graphic);
439 self.savejzd(points)
440 //生成边框线
441 self.createJZLine(graphic, function (res) {
442 lines = res;
443 self.saveJzx(lines);
444 });
445 }
446 self.$message.success("保存成功!!!");
447 self.goMap();
448 }
449 });
450 } else {
451 //生成图像 保存
452 var attributes = {
453 BSM: this.propertyInfo.zdbsm,
454 ZDDM: this.propertyInfo.zddm,
455 XMMC: this.propertyInfo.mc
456 };
457 if (graphic.attributes && graphic.attributes.BGZT) {
458 attributes.BGZT = graphic.attributes.BGZT;
459 }
460 graphic.attributes = attributes;
461 self.addGraphic(featureUrl, graphic, function (res) {
462 var addRresult = res.addFeatureResults[0];
463 if (addRresult.objectId) {
464 var OBJECTID = addRresult.objectId;
465 if (graphic.geometry) {
466 points = self.craetJZPoint(graphic);
467 self.savejzd(points)
468 //生成边框线
469 self.createJZLine(graphic, function (res) {
470 lines = res;
471 self.saveJzx(lines);
472 });
473 }
474 self.$message.success("保存成功!!!");
475 self.goMap();
476 }
477 });
478 }
479 },
480 savejzd (points) {
481 var savePoints = []
482 for (var i = 0; i < points.length; i++) {
483 var obj = {
484 glbsm: this.propertyInfo.zdbsm,
485 jzdh: points[i].jzdh,
486 sxh: points[i].sxh,
487 xzbz: points[i].x,
488 yzbz: points[i].y,
489 jblx: "",
490 jzdlx: ""
491 }
492 savePoints.push(obj);
493 }
494 //保存矢量数据表
495 // addjzd(savePoints).then(res => {
496 // if (res.succcess) {
497 // console.log("界址点保存成成功！！！");
498 // }
499 // });
500 //保存空间数据
501
502 },
503 saveJzx (lines) {
504 var jzxLines = [];
505 for (var i = 0; i < lines.length; i++) {
506 var obj = {
507 glbsm: this.propertyInfo.zdbsm,
508 qsd: lines[i].startPoint,
509 zzd: lines[i].endPoint,
510 jzjj: lines[i].distance,
511 qdh: lines[i].qdh,
512 zdh: lines[i].zdh,
513 jzxlx: "",
514 jzxwz: "",
515 jxxz: "",
516 sm: ""
517 }
518 jzxLines.push(obj);
519 }
520 //保存矢量数据表
521 // addjzx(jzxLines).then(res => {
522 // if (res.success) {
523 // //触发查询界址线
524 // console.log("界址线保存成功!!!!!");
525 // }
526 // });
527 //保存空间数据表
528 },
529 saveZRZ (graphic) {
530 var self = this;
531 var layer = null;
532 layer = self.getLayerByName("ZRZ");
533 var featureUrl = layer.layerUrl.replace("MapServer", "FeatureServer");
534 featureUrl += "/" + layer.id;
535 if (self.geoInfo) {
536 self.geoInfo.BSM = self.propertyInfo.bsm;
537 graphic.attributes = self.geoInfo.attributes;
538 //替换 生成图像 高亮
539 self.updateGraphic(featureUrl, graphic, function (res) {
540 var addRresult = res.updateFeatureResults[0];
541 if (addRresult.objectId) {
542 self.$message.success("保存成功!!!");
543 self.goMap();
544 }
545 });
546 } else {
547 var attributes = {
548 BSM: this.propertyInfo.bsm,
549 XMMC: this.propertyInfo.xmmc
550 }
551 graphic.attributes = attributes;
552 //生成图像 保存
553 self.addGraphic(featureUrl, graphic, function (res) {
554 var addRresult = res.addFeatureResults[0];
555 if (addRresult.objectId) {
556 self.$message.success("保存成功!!!");
557 self.goMap();
558 }
559 });
560 }
561 },
562 //操作成功不需要跳转地图 (直接定位新导入的图形)
563 goMap () {
564 var bsm = "", type = this.propertyInfo.type;
565 if (type == "zd") {
566 bsm = this.propertyInfo.zdbsm;
567 } else {
568 bsm = this.propertyInfo.bsm;
569 }
570 this.resultDialog = false;
571 this.txtResultDialog = false;
572 this.dealDialog = false;
573 this.$emit("closeImportDialog");
574 //TODO 定位当前新导入的图形
575 this.addGeoByBsm(bsm, type, "testMap");
576 },
577 //取消
578 cancel () {
579 this.zdForm.zdBsm = "";
580 this.currentClickZd = null;
581 this.resultDialog = false;
582 // 清空当前图层上显示的图形
583 this.clearOverLayer();
584 },
585 //取消文本选择的弹出框
586 cancelTxtForm () {
587 this.txtZd.name = "";
588 this.txtResultDialog = false;
589 // 清空当前图层上显示的图形
590 this.clearOverLayer();
591 },
592 //取消导入处理的结果
593 cancelDealForm () {
594 this.dealForm.method = "";
595 this.dealDialog = false;
596 this.overResults = [];
597 // 清空当前图层上显示的图形
598 this.clearOverLayer();
599 },
600 //宗地选择发生改变
601 zdChange (value) {
602 this.zdForm.zdBsm = value.XMMC;
603 this.currentClickZd = value;
604 var geometry = this.parseWktToArc(this.currentClickZd.wkt);
605 geometry.type = "polygon";
606 var wkt = "PROJCS[\"XADFZBX\",GEOGCS[\"GCS_WGS_1984\",DATUM[\"D_WGS_1984\",SPHEROID[\"WGS_1984\",6378137.0,298.257223563]],PRIMEM[\"Greenwich\",0.0],UNIT[\"Degree\",0.0174532925199433]],PROJECTION[\"Transverse_Mercator\"],PARAMETER[\"False_Easting\",0.0],PARAMETER[\"False_Northing\",0.0],PARAMETER[\"Central_Meridian\",0.0],PARAMETER[\"Scale_Factor\",1.0],PARAMETER[\"Latitude_Of_Origin\",0.0],UNIT[\"Meter\",1.0]]";
607 geometry.spatialReference = {
608 wkt: wkt
609 }
610 this.addOverLayer(geometry, []);
611 }
612 }
613 }
614 </script>
615 <style scoped lang="scss">
616 .importDiv {
617 display: flex;
618 justify-content: center;
619 align-content: center;
620
621 li {
622 margin: 5px;
623 width: 50%;
624
625 .title {
626 line-height: 1;
627 margin-top: -57px;
628 font-size: 14px;
629 }
630
631 .templateDowload {
632 line-height: 1;
633 margin-top: 7px;
634
635 a {
636 color: #409eff;
637 }
638 }
639 }
640 }
641
642 /deep/ .avatar-uploader .el-upload {
643 border: 1px dashed #d9d9d9;
644 border-radius: 6px;
645 cursor: pointer;
646 position: relative;
647 overflow: hidden;
648 width: 100%;
649 height: 178px;
650 line-height: 178px;
651 }
652
653 /deep/ .avatar-uploader .el-upload:hover {
654 border-color: #409EFF;
655 }
656
657 /deep/ .iconfont {
658 font-size: 20px;
659 color: #8c939d;
660 width: 100%;
661 text-align: center;
662 }
663 </style>
...\ No newline at end of file ...\ No newline at end of file
1 
2 export default {
3 methods:{
4 downloadTxt(text, fileName){
5 let element = document.createElement('a')
6 element.setAttribute('href', 'data:text/plain;charset=utf-8,' + encodeURIComponent(text))
7 element.setAttribute('download', fileName)
8 element.style.display = 'none'
9 element.click()
10 },
11 createTextContent(jzdInfo){
12 var textContent = "";
13 for(var i = 0;i < jzdInfo.length;i++){
14 textContent += jzdInfo[i].jzdh +","+jzdInfo[i].sxh+"," +
15 jzdInfo[i].x+","+jzdInfo[i].y+"\n"
16 }
17 return textContent;
18 },
19
20 }
21 }
...\ No newline at end of file ...\ No newline at end of file
1 /*
2 * 图形相关的操作 js
3 * */
4
5 import layers from '@/api/json/layers.json'
6 import queryUtils from "@/utils/map/queryUtils";
7 import identifyUtils from '@/utils/map/IdentifyUtils'
8 import { loadModules } from "esri-loader"
9 import featureUpdate from "@/utils/map/featureUpdate";
10 import arcgisParser from 'terraformer-arcgis-parser'
11 import wktParse from 'terraformer-wkt-parser'
12 import { maps } from '@/utils/map/mapUtils'
13 import graphicSymbol from '@/api/json/graphicSymbol.json'
14
15 export default {
16 data () {
17 return {
18
19 }
20 },
21 methods: {
22 getLayerByName (name) {
23 for (var i = 0; i < layers.length; i++) {
24 if (layers[i].layerName == name) {
25 return layers[i];
26 }
27 }
28 return null;
29 },
30 queryGeoByBsm (bsm, type, callBackFunction, outSpatialReference) {
31 var layer = null;
32 if (type == 'zd') {
33 layer = this.getLayerByName("ZDJBXX");
34 } else if (type == 'zrz') {
35 layer = this.getLayerByName("ZRZ");
36 } else {
37 console.log("未定义类型！！");
38 return;
39 }
40 if (!layer) {
41 console.log("没有找到图层，不能查询");
42 return;
43 }
44 queryUtils.methods.queryByWhere(layer.layerUrl + "/" + layer.id, { "BSM": bsm }, null, true, null, outSpatialReference, function (res) {
45 var features = res.features;
46 if (callBackFunction && typeof callBackFunction == 'function') {
47 callBackFunction(features);
48 }
49 });
50 },
51 //生成介质点
52 craetJZPoint (graphic) {
53 var geomtry = graphic.geometry, rings = geomtry.rings[0];
54 var pointInfos = [];
55 this.getPointByRings(rings, pointInfos);
56 return pointInfos;
57 },
58 getPointByRings (rings, pointInfos) {
59 for (var i = 0; i < rings.length; i++) {
60 var children = rings[i];
61 if (children.length == 2 && typeof children[0] == 'number') {
62 var obj = {};
63 obj.jzdh = "j" + pointInfos.length;
64 obj.sxh = pointInfos.length;
65 obj.x = children[0];
66 obj.y = children[1];
67 pointInfos.push(obj);
68 } else {
69 this.getPointByRings(children, pointInfos);
70 }
71 }
72 },
73 //生成介质线
74 createJZLine (graphic, callBackFunction) {
75 var self = this;
76 loadModules([
77 "esri/geometry/support/geodesicUtils",
78 "esri/geometry/Point",
79 "esri/geometry/Polyline"
80
81 ]).then(([
82 geodesicUtils,
83 Point,
84 Polyline
85 ]) => {
86 //取得各个坐标点 然后生成外围坐标线
87 var geometry = graphic.geometry,
88 rings = geometry.rings,
89 points = [];
90 if (rings.length > 0) {
91 for (var i = 0; i < rings.length; i++) {
92 var danPoints = [];
93 self.getPointByRings(rings[i], danPoints);
94 points.push(danPoints);
95 }
96 } else {
97 var danPoints = [];
98 self.getPointByRings(rings, danPoints);
99 points.push(danPoints);
100 }
101 var lines = [];
102 //meters
103 for (var i = 0; i < points.length; i++) {
104 for (var j = 0; j < points[i].length; j++) {
105 if (j < (points[i].length - 1)) {
106 const join = geodesicUtils.geodesicDistance(
107 new Point({ x: points[i][j].x, y: points[i][j].y }),
108 new Point({ x: points[i][j + 1].x, y: points[i][j + 1].y }),
109 "meters"
110 );
111 const { distance, azimuth } = join;
112
113 var obj = {
114 startPoint: points[i][j].x + "," + points[i][j].y,
115 endPoint: points[i][j + 1].x + "," + points[i][j + 1].y,
116 qdh: points[i][j].sxh,
117 zdh: points[i][j + 1].sxh,
118 distance: distance,
119 jzxlx: "",
120 jzxwz: "",
121 jzxxz: "",
122 remark: ""
123 }
124 lines.push(obj);
125 } else {
126 const join = geodesicUtils.geodesicDistance(
127 new Point({ x: points[i][j].x, y: points[i][j].y }),
128 new Point({ x: points[i][0].x, y: points[i][0].y }),
129 "meters"
130 );
131 const { distance, azimuth } = join;
132 var obj = {
133 startPoint: points[i][j].x + "," + points[i][j].y,
134 endPoint: points[i][0].x + "," + points[i][0].y,
135 qdh: points[i][j].sxh,
136 zdh: points[i][0].sxh,
137 distance: distance,
138 jzxlx: "",
139 jzxwz: "",
140 jzxxz: "",
141 remark: ""
142 }
143 lines.push(obj);
144 }
145 }
146 }
147 if (callBackFunction && typeof callBackFunction == "function") {
148 callBackFunction(lines);
149 }
150 }).catch(err => {
151 throw (err);
152 })
153 },
154 //wkt转换成arcgis
155 parseWktToArc (wkt) {
156 var primitive = wktParse.parse(wkt);
157 /*if(primitive.type == "MultiPolygon"){
158 primitive.type = "Polygon"
159 }*/
160 return arcgisParser.convert(primitive)
161 },
162 postionToThisGeo (bsm, type) {
163 var view = maps["testMap"];
164 var layer = view.map.findLayerById("highlightLayer");
165 if (layer) {
166 var graphics = layer.graphics;
167 if (graphics.length > 0 && graphics.items[0].attributes.BSM == bsm) {
168 // view.extent = graphics.items[0].geometry.extent;
169 view.center = graphics.items[0].geometry.extent.center;
170 view.zoom = 15;
171 }
172 } else {
173 this.$message.success("暂无图形信息！！！");
174 }
175 },
176 //导入空间图形是 先判断数据是否跨界
177 geoJoint (geometry, callBacFunction) {
178 var self = this;
179 loadModules([
180 "esri/geometry/geometryEngine",
181 "esri/geometry/Polygon"
182 ]).then(([
183 geometryEngine,
184 Polygon
185 ]) => {
186 var djqLayer = null, djzqLayer = null, xjzqLayer = null;
187 djqLayer = self.getLayerByName("DJQ");
188 djzqLayer = self.getLayerByName("DJZQ");
189 xjzqLayer = self.getLayerByName("XJZQ");
190 var layerIds = [];
191 layerIds.push(djqLayer.id);
192 layerIds.push(djzqLayer.id);
193 layerIds.push(xjzqLayer.id);
194 var polygon = new Polygon(geometry);
195 identifyUtils.methods.identify(djqLayer.layerUrl, layerIds, polygon, function (res) {
196 var results = res.results;
197 var isJoint = false, layerName = "", message = "";
198 if (!results || results.length == 0) {
199 callBacFunction(true, "不在行政区内，请检查空间位置信息!!!");
200 }
201 for (var i = 0; i < results.length; i++) {
202 var feature = results[i].feature;
203 var flag = geometryEngine.intersects(polygon, feature.geometry);
204 var withinFlag = geometryEngine.within(polygon, feature.geometry);
205 if (!withinFlag && flag) {
206 isJoint = true;
207 layerName = results[i].layerName;
208 switch (layerName) {
209 case 'DJQ': message = "地块跨越地籍区，数据不合法!!!"; break;
210 case 'DJZQ': message = "地块跨越地籍子区，数据不合法!!!"; break;
211 case 'XJZQ': message = "地块跨越行政区，数据不合法!!!"; break;
212 }
213 break
214 }
215 }
216 if (callBacFunction && typeof callBacFunction == "function") {
217 callBacFunction(isJoint, message);
218 }
219 }, true)
220 }).catch(err => {
221 console.log(err);
222 throw (err);
223 })
224 },
225 //保存或者编辑属性信息
226 updAttributes (bsm, type, attributes, callBackFunction, ydybsm) {
227 var layer = null;
228 if (type == 'zd') {
229 layer = this.getLayerByName("ZDJBXX");
230 } else {
231 layer = this.getLayerByName("ZRZ");
232 }
233 var featureUrl = layer.layerUrl.replace("MapServer", "FeatureServer");
234 featureUrl += "/" + layer.id;
235 this.queryGeoByBsm(ydybsm ? ydybsm : bsm, type, function (features) {
236 if (features && features.length > 0) {
237 attributes.OBJECTID = features[0].attributes.OBJECTID;
238 features[0].attributes = attributes;
239 /* var wkt = "PROJCS[\"XADFZBX\",GEOGCS[\"GCS_WGS_1984\",DATUM[\"D_WGS_1984\",SPHEROID[\"WGS_1984\",6378137.0,298.257223563]],PRIMEM[\"Greenwich\",0.0],UNIT[\"Degree\",0.0174532925199433]],PROJECTION[\"Transverse_Mercator\"],PARAMETER[\"False_Easting\",0.0],PARAMETER[\"False_Northing\",0.0],PARAMETER[\"Central_Meridian\",0.0],PARAMETER[\"Scale_Factor\",1.0],PARAMETER[\"Latitude_Of_Origin\",0.0],UNIT[\"Meter\",1.0]]";
240 features[0].geometry.spatialReference = {
241 wkt:wkt
242 }*/
243 if (ydybsm) {
244 features[0].attributes.BSM = ydybsm;
245 }
246 featureUpdate.methods.updateGraphic(featureUrl, features[0], callBackFunction);
247 } else {
248 var graphic = {
249 attributes: attributes
250 }
251 featureUpdate.methods.addGraphic(featureUrl, graphic, callBackFunction);
252 }
253 });
254 },
255 //叠加分析 同一个图层的叠加分析
256 zdOverAnalys (bsm, graphic, callBacFunction) {
257 var self = this;
258 loadModules([
259 "esri/geometry/Polygon"
260 ]).then(([
261 Polygon
262 ]) => {
263 var zdLayer = null;
264 zdLayer = self.getLayerByName("ZDJBXX");
265 var layerIds = [];
266 layerIds.push(zdLayer.id);
267 var polygon = new Polygon(graphic.geometry);
268 identifyUtils.methods.identify(zdLayer.layerUrl, layerIds, polygon, function (res) {
269 var results = res.results;
270 //判断数据是否与其他数据有重叠
271 var flag = false;
272 if (results && results.length > 0) {
273 flag = true;
274 //加载在图层上 原本的要导入的数据 和重叠数据
275 self.addOverLayer(polygon, results);
276 }
277 callBacFunction(flag, results);
278 }, true)
279 }).catch(err => {
280 console.log(err);
281 throw (err);
282 })
283 },
284 //添加添加元素和覆盖的元素到地图上
285 addOverLayer (geometry, results) {
286 var view = maps["testMap"];
287 loadModules([
288 "esri/Graphic",
289 "esri/geometry/Polygon",
290 "esri/layers/GraphicsLayer",
291 "esri/geometry/geometryEngineAsync",
292 "esri/geometry/Extent"
293 ]).then(([
294 Graphic,
295 Polygon,
296 GraphicsLayer,
297 geometryEngineAsync,
298 Extent
299 ]) => {
300 var graphic = new Graphic({
301 geometry: geometry
302 })
303 var layer = view.map.findLayerById("overLayer");
304 if (layer) {
305 layer.removeAll();
306 } else {
307 layer = new GraphicsLayer({
308 id: "overLayer"
309 })
310 view.map.add(layer);
311 }
312 var impotSymbol = graphicSymbol.fillSymbol.importSymbol,
313 defaultSymbol = graphicSymbol.fillSymbol.defaultSymbol;
314 for (var i = 0; i < results.length; i++) {
315 var feature = results[i].feature;
316 feature.symbol = defaultSymbol;
317 layer.add(feature);
318 var geo = geometryEngineAsync.intersect(feature.geometry, geometry);
319 geo.then(function (res) {
320 var interGra = new Graphic({
321 geometry: res,
322 symbol: graphicSymbol.fillSymbol.highlightSymbol
323 })
324 layer.add(interGra);
325 })
326 }
327 graphic.symbol = impotSymbol
328 layer.add(graphic);
329 var extent = new Extent(JSON.parse(JSON.stringify(graphic.geometry.extent)))
330 extent.spatialReference = view.spatialReference;
331 // view.extent = extent;
332 view.center = extent.center;
333 view.zoom = 15;
334 }).catch(err => {
335 console.log(err);
336
337 })
338 },
339 clearOverLayer () {
340 var view = maps["testMap"];
341 var layer = view.map.findLayerById("overLayer");
342 if (layer) {
343 layer.removeAll();
344 }
345 },
346 //自然幢叠加分析 不能跨宗地 图层本身的叠加分析
347 zrzOverAnalys (bsm, graphic, callBacFunction) {
348 var self = this;
349 loadModules([
350 "esri/geometry/Polygon",
351 "esri/geometry/geometryEngine"
352 ]).then(([
353 Polygon,
354 geometryEngine
355 ]) => {
356 var polygon = new Polygon(graphic.geometry);
357 var zdLayer = null,
358 zrzLayer = null;
359 zdLayer = self.getLayerByName("ZDJBXX");
360 zrzLayer = self.getLayerByName("ZRZ");
361 var layerIds = [];
362 layerIds.push(zdLayer.id);
363 layerIds.push(zrzLayer.id);
364 identifyUtils.methods.identify(zdLayer.layerUrl, layerIds, polygon, function (res) {
365 var results = res.results;
366 //判断数据是否与其他数据有重叠
367 var flag = false,
368 mesge = "";
369 if (results && results.length > 0) {
370 for (var i = 0; i < results.length; i++) {
371 var feature = results[i].feature,
372 layerName = results[i].layerName;
373 if (layerName == 'ZRZ') {
374 if (!feature.attributes['标识码'] || feature.attributes['标识码'] != bsm) {
375 var interFlag = geometryEngine.intersects(polygon, feature.geometry);
376 if (interFlag) {
377 flag = true;
378 mesge = "导入的自然幢与其他自然幢重叠，不能导入!!!";
379 break;
380 }
381 }
382 } else if (layerName == 'ZDJBXX') {
383 var interFlag = geometryEngine.intersects(polygon, feature.geometry);
384 var withinFlag = geometryEngine.within(polygon, feature.geometry);
385 if (!withinFlag && interFlag) {
386 flag = true;
387 mesge = "导入的自然幢与其跨宗地，不能导入!!!";
388 break;
389 }
390 }
391 }
392 }
393 callBacFunction(flag, mesge);
394 }, true)
395 }).catch(err => {
396 console.log(err);
397 })
398 },
399 //去除重叠部分
400 getDifference (inputGraphic, subGraphic, callBackFuncton) {
401 loadModules([
402 "esri/geometry/Polygon",
403 "esri/geometry/geometryEngine",
404 "esri/Graphic"
405 ]).then(([
406 Polygon,
407 geometryEngine,
408 Graphic
409 ]) => {
410 var inputGeometry = new Polygon(inputGraphic.geometry);
411 var outGeometry = null;
412 for (var i = 0; i < subGraphic.length; i++) {
413 var feature = subGraphic[i].feature;
414 outGeometry = geometryEngine.difference(inputGeometry, feature.geometry);
415 }
416 if (callBackFuncton && typeof callBackFuncton == 'function') {
417 callBackFuncton(outGeometry);
418 }
419 }).catch(err => {
420 console.log(err);
421 })
422 },
423 //业务处理 先用query方法 查询将所有属性查询 在做空间裁剪
424 getResultsDif (subGraphics, currntGraphic, callBackFunction, flag) {
425 var self = this;
426 loadModules([
427 "esri/geometry/geometryEngine",
428 "esri/geometry/Polygon"
429 ]).then(([
430 geometryEngine,
431 Polygon
432 ]) => {
433 var objectIds = [];
434 subGraphics.filter(item => {
435 objectIds.push(item.feature.attributes.OBJECTID);
436 })
437 var inputGeometry = new Polygon(currntGraphic.geometry);
438 var zdLayer = self.getLayerByName("ZDJBXX");
439 queryUtils.methods.queryByWhere(zdLayer.layerUrl + "/" + zdLayer.id, { OBJECTID: objectIds }, null, true, "", subGraphics[0].feature.geometry.spatialReference, function (result) {
440 var features = result.features;
441 if (flag) {
442 for (var i = 0; i < features.length; i++) {
443 features[i].geometry = geometryEngine.difference(features[i].geometry, inputGeometry);
444 features[i].attributes.BGZT = 3;
445 }
446 } else {
447 for (var i = 0; i < features.length; i++) {
448 features[i].geometry = null;
449 features[i].attributes.BGZT = 4;
450 }
451 }
452 if (callBackFunction && typeof callBackFunction == 'function') {
453 callBackFunction(features);
454 }
455 })
456
457 }).catch(err => {
458 console.log(err);
459 })
460
461 },
462 addGeoByBsm (bsm, type, viewId) {
463 var self = this;
464 var layer = null;
465 if (type == 'zd') {
466 layer = this.getLayerByName("ZDJBXX");
467 } else if (type == 'zrz') {
468 layer = this.getLayerByName("ZRZ");
469 } else {
470 console.log("未定义类型！！");
471 return;
472 }
473 if (!layer) {
474 console.log("没有找到图层，不能查询");
475 return;
476 }
477 queryUtils.methods.queryByWhere(layer.layerUrl + "/" + layer.id, { "BSM": bsm }, null, true, null, null, function (res) {
478 var features = res.features;
479 if (features && features.length > 0) {
480 if (!features[0].geometry || features[0].geometry.rings.length == 0) {
481 self.$message.success("暂无图形信息！！");
482 return;
483 }
484 loadModules([
485 "esri/layers/GraphicsLayer"
486 ]).then(([
487 GraphicsLayer
488 ]) => {
489 var view = maps[viewId];
490 var layer = view.map.findLayerById("highlightLayer");
491 if (layer) {
492 layer.removeAll();
493 } else {
494 layer = new GraphicsLayer({
495 id: "highlightLayer"
496 })
497 view.map.add(layer, 5);
498 }
499 var symbol = graphicSymbol.fillSymbol.highlightSymbol;
500 var graphic = features[0];
501 graphic.symbol = symbol;
502 layer.add(graphic);
503 // view.extent = graphic.geometry.extent;
504 view.center = graphic.geometry.extent.center;
505 view.zoom = 15;
506 }).catch(err => {
507 thow(err);
508 })
509 } else {
510 self.$message.success("暂无图形信息！！");
511 return;
512 }
513 });
514 },
515 //清空当前图层
516 clearHighlightLayer (viewId) {
517 var view = maps[viewId];
518 var layer = view.map.findLayerById("highlightLayer");
519 if (layer) {
520 layer.removeAll();
521 }
522 }
523 }
524 }
...\ No newline at end of file ...\ No newline at end of file
1 import service from './src/index';
2
3 export default {
4 install (Vue) {
5 Vue.prototype.$loading = service;
6 },
7 service
8 };
1 import Vue from 'vue';
2 import loadingVue from './loading.vue';
3 import { addClass, removeClass, getStyle } from 'element-ui/src/utils/dom';
4 import { PopupManager } from 'element-ui/src/utils/popup';
5 import afterLeave from 'element-ui/src/utils/after-leave';
6 import merge from 'element-ui/src/utils/merge';
7
8 const LoadingConstructor = Vue.extend(loadingVue);
9
10 const defaults = {
11 text: null,
12 fullscreen: true,
13 body: false,
14 lock: false,
15 customClass: ''
16 };
17
18 let fullscreenLoading;
19
20 LoadingConstructor.prototype.originalPosition = '';
21 LoadingConstructor.prototype.originalOverflow = '';
22
23 LoadingConstructor.prototype.close = function() {
24 if (this.fullscreen) {
25 fullscreenLoading = undefined;
26 }
27 afterLeave(this, _ => {
28 const target = this.fullscreen || this.body
29 ? document.body
30 : this.target;
31 removeClass(target, 'el-loading-parent--relative');
32 removeClass(target, 'el-loading-parent--hidden');
33 if (this.$el && this.$el.parentNode) {
34 this.$el.parentNode.removeChild(this.$el);
35 }
36 this.$destroy();
37 }, 300);
38 this.visible = false;
39 };
40
41 const addStyle = (options, parent, instance) => {
42 let maskStyle = {};
43 if (options.fullscreen) {
44 instance.originalPosition = getStyle(document.body, 'position');
45 instance.originalOverflow = getStyle(document.body, 'overflow');
46 maskStyle.zIndex = PopupManager.nextZIndex();
47 } else if (options.body) {
48 instance.originalPosition = getStyle(document.body, 'position');
49 ['top', 'left'].forEach(property => {
50 let scroll = property === 'top' ? 'scrollTop' : 'scrollLeft';
51 maskStyle[property] = options.target.getBoundingClientRect()[property] +
52 document.body[scroll] +
53 document.documentElement[scroll] +
54 'px';
55 });
56 ['height', 'width'].forEach(property => {
57 maskStyle[property] = options.target.getBoundingClientRect()[property] + 'px';
58 });
59 } else {
60 instance.originalPosition = getStyle(parent, 'position');
61 }
62 Object.keys(maskStyle).forEach(property => {
63 instance.$el.style[property] = maskStyle[property];
64 });
65 };
66
67 const Loading = (options = {}) => {
68 if (Vue.prototype.$isServer) return;
69 options = merge({}, defaults, options);
70 if (typeof options.target === 'string') {
71 options.target = document.querySelector(options.target);
72 }
73 options.target = options.target || document.body;
74 if (options.target !== document.body) {
75 options.fullscreen = false;
76 } else {
77 options.body = true;
78 }
79 if (options.fullscreen && fullscreenLoading) {
80 return fullscreenLoading;
81 }
82
83 let parent = options.body ? document.body : options.target;
84 let instance = new LoadingConstructor({
85 el: document.createElement('div'),
86 data: options
87 });
88
89 addStyle(options, parent, instance);
90 if (instance.originalPosition !== 'absolute' && instance.originalPosition !== 'fixed' && instance.originalPosition !== 'sticky') {
91 addClass(parent, 'el-loading-parent--relative');
92 }
93 if (options.fullscreen && options.lock) {
94 addClass(parent, 'el-loading-parent--hidden');
95 }
96 parent.appendChild(instance.$el);
97 Vue.nextTick(() => {
98 instance.visible = true;
99 });
100 if (options.fullscreen) {
101 fullscreenLoading = instance;
102 }
103 return instance;
104 };
105
106 export default Loading;
1 <template>
2 <transition name="el-loading-fade" @after-leave="handleAfterLeave">
3 <div v-show="visible" class="el-loading-mask" :style="{ backgroundColor: background || '' }"
4 :class="[customClass, { 'is-fullscreen': fullscreen }]">
5 <div class="el-loading-spinner">
6 <!-- <svg v-if="!spinner" class="circular" viewBox="25 25 50 50">
7 <circle class="path" cx="50" cy="50" r="20" fill="none" />
8 </svg>
9 <i v-else :class="spinner"></i> -->
10 <img class="img" src="../../../image/progress.gif" alt="">
11 <p v-if="text" class="el-loading-text">{{ text }}</p>
12 </div>
13 </div>
14 </transition>
15 </template>
16
17 <script>
18 export default {
19 data () {
20 return {
21 text: null,
22 spinner: null,
23 background: null,
24 fullscreen: true,
25 visible: false,
26 customClass: ''
27 };
28 },
29
30 methods: {
31 handleAfterLeave () {
32 this.$emit('after-leave');
33 },
34 setText (text) {
35 this.text = text;
36 }
37 }
38 };
39 </script>
40 <style scoped lang="scss">
41 .el-loading-spinner {
42 margin-top: -100px !important;
43
44 .img {
45 width: 80px;
46 height: 80px;
47 }
48 }
49 </style>
...\ No newline at end of file ...\ No newline at end of file
1 <template>
2 <div>
3 <el-dialog v-dialogDrag :close-on-click-modal="false" title="移动户" :visible.sync="isVisible" width="50%"
4 @close="close" :modal-append-to-body="false">
5 <div>
6 <div class="bottom-radio">
7 <el-radio-group v-model="moveHdata.sxzylx">
8 <el-radio label="up">向上</el-radio>
9 <el-radio label="down">向下</el-radio>
10 <el-radio label="left">向左</el-radio>
11 <el-radio label="right">向右</el-radio>
12 </el-radio-group>
13 </div>
14 <div class="bottom-buttom">
15 <el-button type="primary" @click="save">确认</el-button>
16 <el-button type="primary" @click="cacel">取消</el-button>
17 </div>
18 </div>
19 </el-dialog>
20 </div>
21 </template>
22
23 <script>
24 // import { moveH } from '@api/lpb'
25 import { Message } from 'element-ui'
26
27 export default {
28 name: "moveH",
29 data () {
30 return {
31 isVisible: false,
32 moveHdata: {
33 hbsm: "",
34 sxzylx: "",
35 type: ""
36 }
37 }
38 },
39 props: {
40 moveHvisible: {
41 type: Boolean,
42 default: false
43 },
44 hbsm: {
45 type: String
46 },
47 type: {
48 type: String
49 }
50 },
51 methods: {
52 loading: function () {
53 this.$emit('loading')
54 },
55 save () {
56 this.moveHdata.hbsm = this.hbsm
57 this.moveHdata.type = this.type
58 // moveH(this.moveHdata).then(res => {
59 // console.log(res)
60 // if (res.success) {
61 // this.loading();
62 // this.close();
63 // Message.success("移动成功")
64 // } else {
65 // Message.error(res.message)
66 // }
67 // })
68 },
69 cacel () {
70 this.close()
71 },
72 close () {
73 this.$emit('close');
74 }
75 },
76 watch: {
77 moveHvisible (val) {
78 this.isVisible = val
79 }
80 }
81 }
82 </script>
83
84 <style scoped lang="scss">
85 .bottom-radio {
86 text-align: center;
87 }
88
89 .el-radio {
90 padding: 20px;
91 }
92
93 .bottom-buttom {
94 margin-top: 20px;
95 text-align: center;
96 }
97 </style>
1 <template>
2 <div>
3 <el-dialog v-dialogDrag :close-on-click-modal="false" title="批量层" :visible.sync="isVisible" width="50%"
4 @close="close" :modal-append-to-body="false">
5 <div>
6 <table border="1">
7 <tr>
8 <td class="tdright">层建筑面积(㎡)</td>
9 <td>
10 <el-input v-model="qlcData.cjzmj"
11 oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null"></el-input>
12 </td>
13 <td class="tdright">
14 层套内建筑面积(㎡)
15 </td>
16 <td>
17 <el-input v-model="qlcData.ctnjzmj"
18 oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null"></el-input>
19 </td>
20 </tr>
21 <tr>
22 <td class="tdright">层阳台面积(㎡)</td>
23 <td>
24 <el-input v-model="qlcData.cytmj" class=""
25 oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null"></el-input>
26 </td>
27 <td class="tdright">
28 层半墙面积(㎡)
29 </td>
30 <td>
31 <el-input v-model="qlcData.cbqmj" class=""
32 oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null"></el-input>
33 </td>
34 </tr>
35 <tr>
36 <td class="tdright">层共有建筑面积(㎡)</td>
37 <td>
38 <el-input v-model="qlcData.cgyjzmj" class=""
39 oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null"></el-input>
40 </td>
41 <td class="tdright">
42 层分摊建筑面积(㎡)
43 </td>
44 <td>
45 <el-input v-model="qlcData.cftjzmj" class=""
46 oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null"
47 placeholder="层分摊建筑面积(㎡)"></el-input>
48 </td>
49 </tr>
50 <tr>
51 <td class="tdright">层高(m)</td>
52 <td>
53 <el-input v-model="qlcData.cg" class=""
54 oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null" placeholder="层高(m)">
55 </el-input>
56 </td>
57 <td class="tdright">
58 水平投影面积(㎡)
59 </td>
60 <td>
61 <el-input v-model="qlcData.sptymj" class=""
62 oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null" placeholder="水平投影面积(㎡)">
63 </el-input>
64 </td>
65 </tr>
66 </table>
67 </div>
68 <div class="shop">
69 <el-button type="primary" @click="save">保存</el-button>
70 <el-button type="primary" @click="result" icon="el-icon-refresh">重置</el-button>
71 <el-button type="primary" @click="cancel">取消</el-button>
72 </div>
73 </el-dialog>
74 </div>
75 </template>
76
77 <script>
78 // import { updatePlc } from '@api/zrz'
79 export default {
80 name: "plC",
81 data () {
82 return {
83 isVisible: false,
84 qlcData: {
85 cbqmj: '', // 层半墙面积
86 cftjzmj: '', // 层分摊建筑面积
87 cg: '', // 层高
88 cgyjzmj: '', // 层共有建筑面积
89 cjzmj: '', // 层建筑面积
90 ctnjzmj: '', // 层套内建筑面积
91 cytmj: '', // 层阳台面积
92 sptymj: '' // 水平投影面积
93 }
94 }
95 },
96 props: {
97 bsms: {
98 type: Array,
99 },
100 plcVisible: {
101 type: Boolean,
102 default: function () {
103 return false
104 }
105 }
106 },
107 methods: {
108 lodding: function () {
109 this.$emit('lodding')
110 },
111 save: function () {
112 this.qlcData['bsms'] = this.bsms
113 // updatePlc(this.qlcData).then(res => {
114 // if (res.success) {
115 // Message.success("保存成功")
116 // this.lodding()
117 // this.close()
118 // } else {
119 // Message.error(res.message)
120 // }
121 // })
122 },
123 close: function () {
124 this.$emit('close')
125 this.isVisible = false
126 this.result()
127 },
128 cancel: function () {
129 this.$emit('close')
130 this.isVisible = false
131 },
132 result: function () {
133 this.qlcData = {
134 cbqmj: '', // 层半墙面积
135 cftjzmj: '', // 层分摊建筑面积
136 cg: '', // 层高
137 cgyjzmj: '', // 层共有建筑面积
138 cjzmj: '', // 层建筑面积
139 ctnjzmj: '', // 层套内建筑面积
140 cytmj: '', // 层阳台面积
141 sptymj: '' // 水平投影面积
142 }
143 }
144 },
145 watch: {
146 plcVisible (val) {
147 this.isVisible = val
148 }
149 }
150 }
151 </script>
152
153 <style scoped>
154 table {
155 margin-top: 10px;
156 background-color: #fff;
157 font-size: 14px;
158 width: 100%;
159 }
160
161 td {
162 text-align: center;
163 height: 36px;
164 min-width: 50px;
165 }
166
167 table:hover {
168 cursor: pointer;
169 }
170
171 .inputtitle {
172 line-height: 41px;
173 width: 95%;
174 border: none;
175 height: 98%;
176 outline: none;
177 }
178
179
180 .shop {
181 margin-top: 20px;
182 text-align: center;
183 }
184 </style>
1 <template>
2 <div>
3 <el-dialog v-dialogDrag :close-on-click-modal="false" title="批量户" :visible.sync="isVisible" width="72%"
4 @close="close" :modal-append-to-body="false">
5 <div>
6 <table border="1">
7 <tr>
8 <td colspan="2" class="tdright">建筑面积(㎡)</td>
9 <td colspan="4"><input type="text" v-model="form.jzmj" class="inputtitle" /></td>
10 <td colspan="2" class="tdright">套内建筑面积(㎡)</td>
11 <td colspan="4"><input type="text" v-model="form.tnjzmj" class="inputtitle" /></td>
12 </tr>
13 <tr>
14 <td colspan="2" class="tdright">分摊建筑面积(㎡)</td>
15 <td colspan="4"><input type="text" v-model="form.ftjzmj" class="inputtitle" /></td>
16 <td colspan="2" class="tdright">地下部分建筑面积(㎡)</td>
17 <td colspan="4"><input type="text" v-model="form.dxbfjzmj" class="inputtitle" /></td>
18 </tr>
19 <tr>
20 <td colspan="2" class="tdright">其他建筑面积(㎡)</td>
21 <td colspan="4"><input type="text" v-model="form.qtjzmj" class="inputtitle" /></td>
22 <td colspan="2" class="tdright">分摊系数</td>
23 <td colspan="4"><input type="number" @blur="inputBlur($event)" ref="ftxs" v-model="form.ftxs"
24 class="inputtitle" /></td>
25 </tr>
26 <tr>
27 <td colspan="2" class="tdright">户型</td>
28 <td colspan="4">
29 <el-select class="selectTitle" v-model="form.hxbsm">
30 <el-option v-for="i in $store.state.hxList" :key="i.bsm" :label="i.mc" :value="i.bsm">
31 </el-option>
32 </el-select>
33 </td>
34 <td colspan="2" class="tdright">户型结构</td>
35 <td colspan="4">
36 <el-select class="selectTitle" v-model="form.hxjgbsm">
37 <el-option v-for="i in $store.state.hxjgList" :key="i.bsm" :label="i.mc" :value="i.bsm">
38 </el-option>
39 </el-select>
40 </td>
41 </tr>
42 <tr>
43 <td colspan="2" class="tdright">共有土地面积(㎡)</td>
44 <td colspan="4"><input type="text" class="inputtitle" v-model="form.gytdmj" /></td>
45 <td colspan="2" class="tdright">分摊土地面积(㎡)</td>
46 <td colspan="4"><input type="text" class="inputtitle" v-model="form.fttdmj" /></td>
47 </tr>
48 <tr>
49 <td colspan="2" class="tdright">独有土地面积(㎡)</td>
50 <td colspan="4"><input type="text" class="inputtitle" v-model="form.dytdmj" /></td>
51 <td colspan="2" class="tdright">房屋类型</td>
52 <td colspan="4">
53 <el-select class="selectTitle" v-model="form.fwlxbsm">
54 <el-option v-for="i in $store.state.fwlxList" :key="i.bsm" :label="i.mc" :value="i.bsm">
55 </el-option>
56 </el-select>
57 </td>
58 </tr>
59 <tr>
60 <td colspan="2" class="tdright">产别</td>
61 <td colspan="4">
62 <el-select class="selectTitle" v-model="form.fwcbbsm">
63 <el-option v-for="i in $store.state.cbOptions" :key="i.bsm" :label="i.mc"
64 :value="i.bsm"></el-option>
65 </el-select>
66 </td>
67 <td colspan="2" class="tdright">产权来源</td>
68 <td colspan="4">
69 <el-select class="selectTitle" v-model="form.fwcqlybsm">
70 <el-option v-for="i in $store.state.cqlyOptions" :key="i.bsm" :label="i.mc"
71 :value="i.bsm"></el-option>
72 </el-select>
73 </td>
74 </tr>
75 <tr>
76 <td colspan="2" class="tdright">房屋性质</td>
77 <td colspan="4">
78 <el-select class="selectTitle" v-model="form.fwxzbsm">
79 <el-option v-for="i in $store.state.fwxzOptions" :key="i.bsm" :label="i.mc"
80 :value="i.bsm"></el-option>
81 </el-select>
82 </td>
83 <td colspan="2"></td>
84 <td colspan="4"></td>
85 </tr>
86 <tr>
87 <td colspan="2" class="tdright">东墙体归属</td>
88 <td colspan="4"><input type="text" class="inputtitle" v-model="form.dqtgs" /></td>
89 <td colspan="2" class="tdright">南墙体归属</td>
90 <td colspan="4"><input type="text" class="inputtitle" v-model="form.nqtgs" /></td>
91 </tr>
92 <tr>
93 <td colspan="2" class="tdright">西墙体归属</td>
94 <td colspan="4"><input type="text" class="inputtitle" v-model="form.xqtgs" /></td>
95 <td colspan="2" class="tdright">北墙体归属</td>
96 <td colspan="4"><input type="text" class="inputtitle" v-model="form.bqtgs" /></td>
97 </tr>
98
99 <tr height="30" v-for="(item1, index) in form.fwytList" :key="index">
100 <td v-if="index === 0" colspan="2" :rowspan="ytTitleRowspan" align="center" id="ytTitle"
101 class="tdright">
102 <i class="iconfont iconicon-test2" style="margin-right: 8px;color:#66b1ff;font-size:30px"
103 @click="addYtInfo"></i>
104 <span>房屋用途</span>
105 </td>
106
107 <td width="30" colspan="1" align="center" class="tdright">
108 <i class="iconfont iconicon-test" style="color:#FA6400;font-size:30px"
109 @click="deleteYtInfo(index)"></i>
110 规划用途
111 </td>
112 <td width="30" colspan="3" align="center">
113 <el-select-tree style="width:100%" v-if="show" :default-expand-all="defaultExpandAll"
114 :multiple="multiple" :placeholder="placeholder" :disabled="disabled"
115 :data="$store.state.fwytList" :props="treeProps" :check-strictly="checkStrictly"
116 :clearable="clearable" v-model="item1.fwytzdbsm"></el-select-tree>
117 </td>
118 <td width="30" colspan="2" align="center" class="tdright">用途</td>
119 <td width="30" colspan="4" align="center">
120 <el-select-tree style="width:100%" v-if="show" :default-expand-all="defaultExpandAll"
121 :multiple="multiple" :placeholder="placeholder" :disabled="disabled"
122 :data="$store.state.fwytList" :props="treeProps" :check-strictly="checkStrictly"
123 :clearable="clearable" v-model="item1.fwsjytbsm"></el-select-tree>
124 </td>
125 </tr>
126
127 <tr height="30" v-for="(item1, index) in form.fwjgList" :key="'jg' + index">
128 <td colspan="2" v-if="index === 0" :rowspan="fwjgTitleRowspan" align="center" class="tdright">
129 <i class="iconfont iconicon-test2" style="margin-right: 8px;color:#66b1ff;font-size:30px"
130 @click="addFwjgInfo"></i>
131 <span>房屋结构</span>
132 </td>
133 <td colspan="1" align="center">
134 <i class="iconfont iconicon-test" style="margin-right: 8px;color:#FA6400;font-size:30px"
135 @click="deleteFwjgInfo(index)"></i>
136 <span>房屋结构</span>
137 </td>
138 <td colspan="9">
139 <el-select style="width:100%" v-model="item1.fwjgzdbsm" placeholder="请选择">
140 <el-option v-for="item in $store.state.jgOptions" :key="item.bsm" :label="item.mc"
141 :value="item.bsm">
142 </el-option>
143 </el-select>
144 </td>
145 </tr>
146
147 <tr>
148 <td colspan="12" align="center">
149 <Qlxz ref="qlxzModule" :hasSyqx='false' :formData="form"></Qlxz>
150 </td>
151 </tr>
152
153 </table>
154 </div>
155 <div class="shop">
156 <el-button type="primary" @click="save">保存</el-button>
157 <el-button type="primary" @click="reset" icon="el-icon-refresh">重置</el-button>
158 <el-button type="primary" @click="cancel">取消</el-button>
159 </div>
160 </el-dialog>
161 </div>
162 </template>
163
164 <script>
165 import Qlxz from "@/components/formMenu/qlxz";
166 // import { batchUpdateQjH } from "@api/h";
167 export default {
168 name: "plH",
169 components: {
170 Qlxz
171 },
172 props: {
173 bsms: {
174 type: Array
175 },
176 plhVisible: {
177 type: Boolean,
178 default: false
179 }
180 },
181 data () {
182 return {
183 //树型结构
184 show: true,
185 clearable: true,
186 defaultExpandAll: true,
187 multiple: false,
188 placeholder: '请选择',
189 disabled: false,
190 checkStrictly: true,
191 treeProps: {
192 value: 'bsm',
193 children: 'children',
194 label: 'mc'
195 },
196 form: {
197 qszt: '0',
198 jzmj: '',
199 tnjzmj: '',
200 ftjzmj: '',
201 dxbfjzmj: '',
202 qtjzmj: '',
203 ftxs: '',
204 hxbsm: '',
205 hxjgbsm: '',
206 gytdmj: '',
207 fttdmj: '',
208 dytdmj: '',
209 fwlxbsm: '',
210 fwcbbsm: '',
211 fwcqlybsm: '',
212 fwxzbsm: '',
213 dqtgs: '',
214 nqtgs: '',
215 xqtgs: '',
216 bqtgs: '',
217 fwjgbsm: '',
218 fwytList: [{
219 glbsm: '', //关联标识码
220 fwytzdbsm: '', //房屋用途字典标识码
221 sx: '', //顺序
222 fwsjytbsm: '', //房屋实际用途字典标识码
223 }],
224 fwjgList: [{
225 fwjgzdbsm: '', //房屋结构字典标识码
226 glbsm: '', //关联标识码
227 sx: '', //顺序
228 }],
229 qlxzList: [{
230 qlxzdm: '', //权利性质代码
231 glbsm: '', //宗地BSM、自然幢BSM、户BSM、多幢BSM、宗海BSM
232 qlxzzdbsm: '', //权利性质字典表标识码
233 qlxzmc: '', //权利名称名称
234 zhqlxzlx: '', //除宗海数据外，默认都是空；0:用海类型权利性质;2:海岛用途权利性质
235 addQjTdytRequestList: [{
236 }], //土地用途新增实体列表
237 }]
238 },
239 isVisible: false,
240 hx: [{
241 label: '一居室',
242 key: '1',
243 value: '一居室'
244 }, {
245 label: '二居室',
246 key: '2',
247 value: '二居室'
248 }, {
249 label: '三居室',
250 key: '3',
251 value: '三居室'
252 }
253 ],
254 ytTitleRowspan: 1, //用途的单元格垂直合并数量
255 fwjgTitleRowspan: 1, //房屋结构的单元格垂直合并数量
256 }
257 },
258 methods: {
259
260 inputBlur (e) {
261 if (e.target.value !== '' && +e.target.value > 0 && +e.target.value < 10) {
262 e.target.style.border = ""
263 } else {
264 e.target.style.border = "1px solid red";
265 e.target.style.boxSizing = 'border-box';
266 }
267 },
268
269 lodding: function () {
270 this.$emit('lodding')
271 },
272 addYtInfo () {
273 this.form.fwytList.push({
274 glbsm: '',
275 fwytzdbsm: '',
276 fwsjytbsm: '',
277 sx: '',
278 });
279 this.ytTitleRowspan = this.form.fwytList.length;
280 },
281 deleteYtInfo (index) {
282 if (this.form.fwytList.length <= 1) {
283 this.$message({
284 message: '不能删除，最少含有一条用途信息',
285 type: 'warning'
286 });
287 } else {
288 this.form.fwytList.splice(index, 1);
289 this.ytTitleRowspan = this.form.fwytList.length;
290 }
291 },
292 addFwjgInfo () {
293 this.form.fwjgList.push({
294 fwjgzdbsm: '', //房屋结构字典标识码
295 glbsm: '', //关联标识码
296 sx: '', //顺序
297 });
298 this.fwjgTitleRowspan = this.form.fwjgList.length;
299 },
300 deleteFwjgInfo (index) {
301 if (this.form.fwjgList.length <= 1) {
302 this.$message({
303 message: '不能删除，最少含有一条房屋结构信息',
304 type: 'warning'
305 });
306 } else {
307 this.form.fwjgList.splice(index, 1);
308 this.fwjgTitleRowspan = this.form.fwjgList.length;
309 }
310 },
311 close: function () {
312 this.$emit('close')
313 this.isVisible = false
314 this.reset()
315 },
316 reset: function () {
317 this.form = {
318 qszt: '0',
319 jzmj: '',
320 tnjzmj: '',
321 ftjzmj: '',
322 dxbfjzmj: '',
323 qtjzmj: '',
324 ftxs: '',
325 hxbsm: '',
326 hxjgbsm: '',
327 gytdmj: '',
328 fttdmj: '',
329 dytdmj: '',
330 fwlxbsm: '',
331 fwcbbsm: '',
332 fwcqlybsm: '',
333 fwxzbsm: '',
334 dqtgs: '',
335 nqtgs: '',
336 xqtgs: '',
337 bqtgs: '',
338 fwjgbsm: '',
339 fwytList: [{
340 glbsm: '', //关联标识码
341 fwytzdbsm: '', //房屋用途字典标识码
342 sx: '', //顺序
343 fwsjytbsm: '', //房屋实际用途字典标识码
344 }],
345 fwjgList: [{
346 fwjgzdbsm: '', //房屋结构字典标识码
347 glbsm: '', //关联标识码
348 sx: '', //顺序
349 }],
350 qlxzList: [{
351 qlxzdm: '', //权利性质代码
352 glbsm: '', //宗地BSM、自然幢BSM、户BSM、多幢BSM、宗海BSM
353 qlxzzdbsm: '', //权利性质字典表标识码
354 qlxzmc: '', //权利名称名称
355 zhqlxzlx: '', //除宗海数据外，默认都是空；0:用海类型权利性质;2:海岛用途权利性质
356 addQjTdytRequestList: [{
357 }], //土地用途新增实体列表
358 }]
359 };
360 this.$refs.qlxzModule.reset();
361 this.ytTitleRowspan = 1; //用途的单元格垂直合并数量
362 this.fwjgTitleRowspan = 1; //房屋结构的单元格垂直合并数量
363 },
364 save: function () {
365
366 this.rules = [
367 {
368 data: this.form.ftxs,
369 name: '分摊系数',
370 dom: this.$refs.ftxs,
371 rule: /^(?!0(\.0{1,2})?$)(\d(\.\d{1,2})?)$/, //大于0小于10的所有保留两位的数字
372 },
373 ];
374 let flag = true;
375 this.rules.forEach(item => {
376 if (item.data !== "") {
377 if (!item.rule.test(+item.data) || item.data == null) {
378 if (item.dom.$el) {
379 item.dom.$el.style.border = '1px solid red';
380 item.dom.$el.style.boxSizing = 'border-box';
381 } else {
382 item.dom.style.border = '1px solid red';
383 item.dom.style.boxSizing = 'border-box';
384 }
385 flag = false;
386 return false
387 }
388 }
389 })
390
391 this.form['hbsms'] = this.bsms
392 this.form.qlxzList = this.$refs.qlxzModule.getQlxzDataList();
393 this.$nextTick(() => {
394 if (flag) {
395 for (let i = 0; i < this.form.fwjgList.length; i++) {
396 if (this.form.fwjgList[i].fwjgzdbsm === '') {
397 this.form.fwjgList.splice(i, 1);
398 }
399 }
400 for (let i = 0; i < this.form.fwytList.length; i++) {
401 if (this.form.fwytList[i].fwsjytbsm === '') {
402 this.form.fwytList.splice(i, 1);
403 }
404 }
405 for (let i = 0; i < this.form.qlxzList.length; i++) {
406 if (this.form.qlxzList[i].qlxzdm === '') {
407 this.form.qlxzList.splice(i, 1);
408 }
409 }
410 console.log("批量户信息")
411 // batchUpdateQjH(this.form).then((res) => {
412 // if (res.code === 200) {
413 // this.lodding()
414 // this.$message.success("保存成功！")
415 // this.$nextTick(() => {
416 // this.reset();
417 // })
418 // this.close();
419 // } else {
420 // this.$message.error(res.message)
421 // }
422 // })
423 } else {
424 this.$message({
425 // message: item.name+'不能为空',
426 message: '表单数据有误',
427 type: "warning",
428 });
429 }
430 })
431 },
432 cancel: function () {
433 this.close()
434 }
435 },
436 mounted () {
437
438 },
439 watch: {
440 plhVisible (val) {
441 this.isVisible = val
442 }
443 }
444 }
445 </script>
446
447 <style scoped>
448 table {
449 margin-top: 10px;
450 background-color: #fff;
451 font-size: 14px;
452 width: 100%;
453 table-layout: fixed;
454 }
455
456 td {
457 text-align: center;
458 height: 36px;
459 min-width: 60px;
460 }
461
462 table:hover {
463 cursor: pointer;
464 }
465
466 .inputtitle {
467 line-height: 40px;
468 width: 95%;
469 border: none;
470 outline: none;
471 height: 95%;
472 }
473
474 .selectTitle {
475 width: 100%;
476 border-radius: 0;
477 -webkit-appearance: none;
478 -moz-appearance: none;
479 appearance: none;
480 border: none;
481 position: relative;
482 display: block;
483 }
484
485 .shop {
486 text-align: center;
487 margin-top: 20px;
488 }
489
490 /deep/.el-input__inner {
491 width: 100%;
492 border: 0;
493 }
494 </style>
1 <template>
2 <div class="">
3 <el-dialog v-dialogDrag :close-on-click-modal="false" title="批量室号" :visible.sync="isVisible" width="50%"
4 @close="close" :modal-append-to-body="false">
5 <div>
6 <table border="1">
7 <tr>
8 <th>室号前缀</th>
9 <th>幢单元号</th>
10 <th>分割符A</th>
11 <th>层号前自动补0</th>
12 <th>层号</th>
13 <th>分割符B</th>
14 <th>户号前自动补零</th>
15 <th>户号</th>
16 <th>室号后缀</th>
17 </tr>
18 <tr>
19 <td>
20 <el-input v-model="plshData.shqz"></el-input>
21 </td>
22 <td>
23 <el-checkbox v-model="plshData.selectDyh"></el-checkbox>
24 </td>
25 <td>
26 <el-input v-model="plshData.fgfA"></el-input>
27 </td>
28 <td>
29 <el-checkbox v-model="plshData.chqbl"></el-checkbox>
30 </td>
31 <td>
32 <el-select v-model="plshData.c">
33 <el-option v-for="i in cs" :key="i.key" :label="i.label" :value="i.value"></el-option>
34 </el-select>
35 </td>
36 <td>
37 <el-input v-model="plshData.fgfB"></el-input>
38 </td>
39 <td>
40 <el-checkbox v-model="plshData.hhqbl"></el-checkbox>
41 </td>
42 <td>
43 </td>
44 <td>
45 <el-input v-model="plshData.shhz"></el-input>
46 </td>
47 </tr>
48 </table>
49 <div class="gz">
50 <span>室号规则：{{ gz }}</span>
51 </div>
52 <div class="xlgz">
53 <span>
54 样例1：1011 <span>（1单元01层01室）</span>([单元号][层号]，勾选“层号自动补0”)
55 <br />
56 样例2：1131室<span>（1单元13层01室）</span>([单元号][层号][后缀],后缀填写'室')
57 <br />
58 样例3：101<span>(1层01室)</span>([层号],勾选“户号自动补0”)
59 <br />
60 样例4：1-011<span>(1单元-01层01室)</span>([单元号][分隔符A][层号]，勾选“层号自动补0”)
61 <br />
62 样例5：1-12-1<span>(1单元12层01室)</span>([单元号][分隔符A][层号][分隔符B])
63 <br />
64 样例6：1-12<span>(1层12室)</span>([层号][分隔符B])
65 </span>
66 </div>
67 </div>
68 <div class="shop">
69 <el-button type="primary" @click="save">保存</el-button>
70 <el-button type="primary" @click="result" icon="el-icon-refresh">重置</el-button>
71 <el-button type="primary" @click="cancel">取消</el-button>
72 </div>
73 </el-dialog>
74 </div>
75 </template>
76
77 <script>
78 // import { updateSh } from '@api/zrz'
79 import { Message } from 'element-ui'
80
81 export default {
82 name: "plSh",
83 props: {
84 plShVisible: {
85 type: Boolean,
86 default: false
87 },
88 bsms: {
89 type: Array
90 }
91 },
92 data () {
93 return {
94 isVisible: false,
95 plshData: {
96 shqz: '',
97 selectDyh: false,
98 fgfA: '',
99 chqbl: false,
100 c: '',
101 fgfB: '',
102 hhqbl: false,
103 shhz: ''
104 },
105 cs: [
106 {
107 key: '1',
108 label: '名义层',
109 value: '1'
110 }, {
111 key: '2',
112 label: '实际层',
113 value: '2'
114 }, {
115 key: '3',
116 label: '空',
117 value: '3'
118 }
119 ]
120 }
121 },
122 methods: {
123 test: function () {
124 for (let key in this.plshData) {
125 if (key === 'chqbl') {
126 continue;
127 }
128 if (this.plshData[key] !== '' && this.plshData[key] !== '3' && this.plshData[key] !== false) {
129 return true;
130 }
131 }
132 return false;
133 },
134 lodding: function () {
135 this.$emit('lodding')
136 },
137 close: function () {
138 this.$emit("close")
139 this.isVisible = false
140 this.result();
141 },
142 result: function () {
143 this.plshData = {
144 shqz: '',
145 selectDyh: false,
146 fgfA: '',
147 chqbl: false,
148 hhqbl: false,
149 c: '',
150 fgfB: '',
151 shhz: ''
152 }
153 },
154 save: function () {
155 if (!this.test()) {
156 this.$message.info("请选择")
157 return;
158 }
159 this.plshData['bsms'] = this.bsms
160 // updateSh(this.plshData).then(res => {
161 // if (res.success) {
162 // this.lodding();
163 // this.close();
164
165 // } else {
166 // Message.error(res.message)
167 // }
168 // })
169 },
170 cancel: function () {
171 this.close()
172 }
173 },
174 computed: {
175 gz: function () {
176 let gz = "";
177 if (this.plshData.shqz !== "") {
178 gz += this.plshData.shqz
179 }
180 if (this.plshData.selectDyh) {
181 gz += "[单元号]"
182 }
183 if (this.plshData.fgfA !== "") {
184 gz += this.plshData.fgfA
185 }
186 if (+this.plshData.c === 1) {
187 gz += "[名义层]"
188 } else if (+this.plshData.c === 2) {
189 gz += "[实际层]"
190 }
191 if (this.plshData.fgfB !== "") {
192 gz += this.plshData.fgfB
193 }
194 gz += "[户号]";
195 if (this.plshData.shhz !== "") {
196 gz += this.plshData.shhz
197 }
198 return gz;
199 }
200 },
201 watch: {
202 plShVisible: function (val) {
203 this.isVisible = val
204 }
205 }
206 }
207 </script>
208
209 <style scoped lang="scss">
210 table {
211 margin-top: 10px;
212 background-color: #fff;
213 font-size: 14px;
214 width: 100%;
215
216 :hover {
217 cursor: pointer;
218 }
219 }
220
221 th {
222 height: 36px;
223 }
224
225 td {
226 text-align: center;
227 height: 36px;
228 min-width: 60px;
229 }
230
231 .xl {
232 color: blue;
233 float: right;
234 }
235
236 .xl:hover {
237 cursor: pointer;
238 }
239
240 .inputtitle {
241 line-height: 38px;
242 width: 90%;
243 border: none;
244 outline: none;
245 }
246
247 .shop {
248 text-align: center;
249 margin-top: 20px;
250 }
251
252 .gz {
253 color: #b2b2b2;
254 font-size: 14px;
255 margin-top: 40px;
256 }
257
258 .xlgz {
259 span {
260 font-size: 16px;
261 line-height: 22px;
262
263 span {
264 color: red;
265 }
266 }
267 }
268 </style>
1 <template>
2 <div>
3 <el-dialog v-dialogDrag :close-on-click-modal="false" title="批量坐落" :visible.sync="isVisible" width="60%"
4 @close="close" :modal-append-to-body="false">
5 <div>
6 <table border="1">
7 <tr>
8 <th>前缀</th>
9 <th>宗地</th>
10 <th>自然幢</th>
11 <th>逻辑幢</th>
12 <th>幢单元</th>
13 <th>层</th>
14 <th>户</th>
15 <th>后缀</th>
16 </tr>
17 <tr>
18 <td>
19 <el-input v-model="plzlData.qz"></el-input>
20 </td>
21 <td>
22 <el-select v-model="plzlData.zd">
23 <el-option v-for="i in zdgz" :key="i.label" :label="i.label" :value="i.value"
24 :disabled="i.disabled">
25 </el-option>
26 </el-select>
27 </td>
28 <td>
29 <el-select v-model="plzlData.zrz">
30 <el-option v-for="i in zrzgz" :key="i.label" :label="i.label" :value="i.value"
31 :disabled="i.disabled">
32 </el-option>
33 </el-select>
34 </td>
35 <td>
36 <el-select v-model="plzlData.ljz">
37 <el-option v-for="i in ljzgz" :key="i.label" :label="i.label" :value="i.value">
38
39 </el-option>
40 </el-select>
41 </td>
42 <td>
43 <el-select v-model="plzlData.zdy">
44 <el-option v-for="i in zdygz" :key="i.label" :label="i.label" :value="i.value">
45
46 </el-option>
47 </el-select>
48 </td>
49 <td>
50 <el-select v-model="plzlData.c">
51 <el-option v-for="i in cgz" :key="i.label" :label="i.label" :value="i.value">
52
53 </el-option>
54 </el-select>
55 </td>
56 <td>
57 <el-select v-model="plzlData.h">
58 <el-option v-for="i in hgz" :key="i.label" :label="i.label" :value="i.value">
59
60 </el-option>
61 </el-select>
62 </td>
63 <td>
64 <el-input v-model="plzlData.hz"></el-input>
65 </td>
66 </tr>
67 </table>
68 <div class="gz">
69 <span>户坐落规则：{{ gz }}</span>
70 </div>
71 </div>
72 <div class="shop">
73 <el-button type="primary" @click="save">保存</el-button>
74 <el-button type="primary" @click="result" icon="el-icon-refresh">重置</el-button>
75 <el-button type="primary" @click="close">取消</el-button>
76 </div>
77 </el-dialog>
78 </div>
79 </template>
80
81 <script>
82 // import { updateZl } from '@api/zrz'
83 import { Message } from 'element-ui'
84
85 export default {
86 name: "plZl",
87 props: {
88 plZlVisible: {
89 type: Boolean,
90 default: false
91 },
92 bsms: {
93 type: Array
94 }
95 },
96 data () {
97 return {
98 isVisible: false,
99 plzlData: {
100 qz: '',
101 zd: '3',
102 zrz: '3',
103 ljz: '3',
104 zdy: '3',
105 c: '3',
106 h: '3',
107 hz: ''
108 },
109 zdgz: [
110 {
111 label: '宗地坐落',
112 value: '1',
113 disabled: false
114 }, {
115 label: "宗地名称",
116 value: '2',
117 disabled: false
118 }, {
119 label: "空",
120 value: '3',
121 disabled: false
122 }
123 ],
124 zrzgz: [
125 {
126 label: '自然幢坐落',
127 value: '1',
128 disabled: false
129 }, {
130 label: "自然幢名称",
131 value: '2',
132 disabled: false
133 }, {
134 label: "空",
135 value: '3'
136 }
137 ],
138 ljzgz: [
139 {
140 label: '逻辑幢名称',
141 value: '1'
142 }, {
143 label: "逻辑幢号",
144 value: '2'
145 }, {
146 label: "空",
147 value: '3'
148 }
149 ],
150 zdygz: [
151 {
152 label: '幢单元名称',
153 value: '1'
154 }, {
155 label: "幢单元号",
156 value: '2'
157 }, {
158 label: "空",
159 value: '3'
160 }
161 ],
162 cgz: [
163 {
164 key: '1',
165 label: '名义层',
166 value: '1'
167 }, {
168 key: '2',
169 label: '实际层',
170 value: '2'
171 }, {
172 label: "空",
173 value: '3'
174 }
175 ],
176 hgz: [
177 {
178 key: '1',
179 label: '室号',
180 value: '1'
181 }, {
182 key: '2',
183 label: '户号',
184 value: '2'
185 }, {
186 label: "空",
187 value: '3'
188 }
189 ]
190 }
191 },
192 methods: {
193 lodding: function () {
194 this.$emit('lodding')
195 },
196 save: function () {
197 if (!this.test()) {
198 this.$message.info("请选择")
199 return;
200 }
201 this.plzlData['bsms'] = this.bsms;
202 // updateZl(this.plzlData).then(res => {
203 // if (res.success) {
204 // this.lodding()
205 // this.close();
206 // } else {
207 // Message.error(res.message)
208 // }
209 // })
210 },
211 test: function () {
212 for (let key in this.plzlData) {
213 if (this.plzlData[key] !== '' && this.plzlData[key] !== '3') {
214 return true;
215 }
216 }
217 return false;
218 },
219 cancel: function () {
220 this.close();
221 },
222 close: function () {
223 this.$emit("close")
224 this.isVisible = false
225 this.result();
226 },
227 result: function () {
228 this.plzlData = {
229 qz: '',
230 zd: '',
231 zrz: '',
232 ljz: '',
233 zdy: '',
234 c: '',
235 h: '',
236 hz: ''
237 }
238 }
239 },
240 computed: {
241 gz: function () {
242 // [前缀][宗地][自然幢][单元][室号][室号][后缀]
243 let gz = "";
244 if (this.plzlData.qz !== '') {
245 gz += this.plzlData.qz
246 }
247 if (+this.plzlData.zd === 1) {
248 gz += "[宗地坐落]";
249 } else if (+this.plzlData.zd === 2) {
250 gz += "[宗地名称]";
251 }
252
253 if (+this.plzlData.zrz === 1) {
254 gz += "[自然幢坐落]"
255 } else if (+this.plzlData.zrz === 2) {
256 gz += "[自然幢名称]";
257 }
258 if (+this.plzlData.ljz === 1) {
259 gz += "[逻辑幢名称]"
260 } else if (+this.plzlData.ljz === 2) {
261 gz += "[逻辑幢号]"
262 }
263 if (+this.plzlData.zdy === 1) {
264 gz += "[幢单元名称]";
265 } else if (+this.plzlData.zdy === 2) {
266 gz += "[幢单元号]"
267 }
268 if (+this.plzlData.c === 1) {
269 gz += "[名义层]"
270 } else if (+this.plzlData.c === 2) {
271 gz += "[实际层]"
272 }
273 if (+this.plzlData.h === 1) {
274 gz += "[室号]"
275 } else if (+this.plzlData.h === 2) {
276 gz += "[户号]"
277 }
278 if (this.plzlData.hz !== "") {
279 gz += this.plzlData.hz
280 }
281 if (gz === "") {
282 gz += "无"
283 }
284 return gz;
285 }
286 },
287 watch: {
288 plZlVisible: function (val) {
289 this.isVisible = val
290 },
291 plzlData: {
292 handler (val) {
293 this.zrzgz[0].disabled = +val.zd === 1;
294 this.zdgz[0].disabled = +val.zrz === 1;
295 },
296 deep: true
297 }
298 }
299 }
300 </script>
301
302 <style scoped lang="scss">
303 table {
304 margin-top: 10px;
305 background-color: #fff;
306 font-size: 14px;
307 width: 100%;
308
309 :hover {
310 cursor: pointer;
311 }
312 }
313
314 th {
315 height: 36px;
316 }
317
318 td {
319 text-align: center;
320 height: 36px;
321 min-width: 60px;
322 }
323
324 .xl {
325 color: blue;
326 float: right;
327 }
328
329 .xl:hover {
330 cursor: pointer;
331 }
332
333 .inputtitle {
334 line-height: 38px;
335 width: 90%;
336 border: none;
337 outline: none;
338 }
339
340 .shop {
341 text-align: center;
342 margin-top: 20px;
343 }
344
345 .gz {
346 color: #b2b2b2;
347 font-size: 12px;
348 margin-top: 40px;
349 }
350
351 .xlgz {
352 span {
353 font-size: 16px;
354 line-height: 22px;
355
356 span {
357 color: red;
358 }
359 }
360 }
361 </style>
...@@ -2,13 +2,13 @@ import Vue from 'vue' ...@@ -2,13 +2,13 @@ import Vue from 'vue'
2 import Popup from './index.vue' 2 import Popup from './index.vue'
3 3
4 const PopupBox = Vue.extend(Popup) 4 const PopupBox = Vue.extend(Popup)
5 Popup.install = function (data) { 5 Popup.install = function (title, editItem, data) {
6 data.title = title
7 data.editItem = editItem
6 let instance = new PopupBox({ 8 let instance = new PopupBox({
7 data 9 data
8 }).$mount() 10 }).$mount()
9
10 document.body.appendChild(instance.$el) 11 document.body.appendChild(instance.$el)
11
12 Vue.nextTick(() => { 12 Vue.nextTick(() => {
13 instance.isShow = true 13 instance.isShow = true
14 }) 14 })
......
1 <template> 1 <template>
2 <transition name="fade" mode="out-in" v-if="isShow"> 2 <transition name="dialog-fade" mode="out-in" v-if="isShow">
3 <div class="ls-mask" v-loading="loading"> 3 <div class="ls-mask" v-loading="loading">
4 <div class="ls-mask-window" :style="{ 'width': width, 'height': height }"> 4 <div class="ls-mask-window" :style="{ 'width': width, 'height': height }">
5 <div class="ls-head"> 5 <div class="ls-head">
...@@ -25,19 +25,19 @@ export default { ...@@ -25,19 +25,19 @@ export default {
25 name: 'index', 25 name: 'index',
26 data () { 26 data () {
27 return { 27 return {
28 btnShow: false,
29 title: '标题', 28 title: '标题',
29 editItem: "",
30 formData: undefined,//父组件传递的参数 负责传给子组件
31 btnShow: false,
32 cancel: function () { },
33 confirm: function () { },
30 cancelText: '取消', 34 cancelText: '取消',
31 confirmText: '确认', 35 confirmText: '确认',
32 isSync: false, 36 isSync: false,
33 isShow: false, 37 isShow: false,
34 cancel: function () { },
35 confirm: function () { },
36 editItem: "",
37 titleStyle: 'center', 38 titleStyle: 'center',
38 width: "75%", 39 width: "75%",
39 height: "auto", 40 height: "auto",
40 formData: undefined,//父组件传递的参数 负责传给子组件
41 contentHeight: "", 41 contentHeight: "",
42 iconClass: "", 42 iconClass: "",
43 key: 0 43 key: 0
...@@ -95,6 +95,12 @@ export default { ...@@ -95,6 +95,12 @@ export default {
95 r(require(`@/views/${view}.vue`)) 95 r(require(`@/views/${view}.vue`))
96 ); 96 );
97 } 97 }
98 },
99 destroyed () {
100 // if appendToBody is true, remove DOM node after destroy
101 if (this.appendToBody && this.$el && this.$el.parentNode) {
102 this.$el.parentNode.removeChild(this.$el);
103 }
98 } 104 }
99 } 105 }
100 </script> 106 </script>
......
...@@ -2,10 +2,7 @@ ...@@ -2,10 +2,7 @@
2 1.在main.js中引入 import Popup from './components/tanchuang/index' 2 1.在main.js中引入 import Popup from './components/tanchuang/index'
3 Vue.prototype.$popup = Popup.install 3 Vue.prototype.$popup = Popup.install
4 2.用法以及参数： 4 2.用法以及参数：
5 this.$popup({ 5 this.$popup('提示','ywbl/dbx/aa',{
6 title: '提示', // 弹窗标题
7 titleStyle:"", //标题存在的位置 center left
8 editItem: 'ywbl/dbx/aa', // 子组件的路径 相当于你平时img取的路径
9 formData:this.formData, //父组件传给子组件的参数 6 formData:this.formData, //父组件传给子组件的参数
10 cancel: function () {}, //取消事件的回调 7 cancel: function () {}, //取消事件的回调
11 confirm: function () {}, //确认事件的回调 8 confirm: function () {}, //确认事件的回调
......
1 import {loadModules} from 'esri-loader'
2
3 export default {
4 methods: {
5
6 identify(url,layerIds,geometry,callBackFunction,returnGeometry,layerOption,tolerance,mapExtent){
7 var self = this;
8 loadModules([
9 "esri/tasks/IdentifyTask",
10 "esri/tasks/support/IdentifyParameters"
11 ]).then(([
12 IdentifyTask,
13 IdentifyParameters
14 ]) => {
15 var identifyTask = new IdentifyTask({
16 url:url
17 }),
18 identifyParameters = new IdentifyParameters();
19 identifyParameters.geometry = geometry;
20 if(layerIds){
21 identifyParameters.layerIds = layerIds;
22 }
23 identifyParameters.layerOption = layerOption ? layerOption : "all";
24 identifyParameters.tolerance = tolerance ? tolerance : 3;
25 identifyParameters.mapExtent = mapExtent ? mapExtent : geometry.extent;
26 identifyParameters.returnGeometry = returnGeometry ? returnGeometry : false;
27 //identifyParameters.returnFieldName = true;
28 identifyParameters.spatialReference = geometry.spatialReference;
29 identifyTask.execute(identifyParameters).then(result => {
30 if(callBackFunction && typeof callBackFunction == 'function'){
31 callBackFunction(result);
32 }
33 });
34 }).catch(err => {
35 throw(err);
36 });
37
38 }
39 }
40 }
...\ No newline at end of file ...\ No newline at end of file
1 import {maps} from '@/libs/map/mapUtils'
2 import {loadModules} from 'esri-loader'
3
4 export default {
5 data() {
6 return {
7 drawAction:null,
8 graphicLayer:null,
9 creatEvent:null,
10 }
11 },
12 methods: {
13 initDraw(type,viewId,creationMode,callBackFunction){
14 var self = this;
15 loadModules([
16 "esri/widgets/Sketch",
17 "esri/layers/GraphicsLayer"
18 ]).then(([
19 Sketch,
20 GraphicsLayer
21 ]) => {
22 var view = maps[viewId];
23 if(!self.drawAction){
24 self.graphicLayer = new GraphicsLayer({
25 id:"_drawLayer"
26 })
27 self.drawAction = new Sketch({
28 view: view,
29 layer:self.graphicLayer,
30 creationMode: "single"
31 });
32 }else {
33 // this.drawAction.cancel();
34 if(creationMode){
35 self.drawAction.creationMode = creationMode;
36 }
37 // graphicLayer = view.map.findLayerById("_drawLayer");
38 }
39 self.drawAction.create(type);
40 if(self.creatEvent){
41 self.creatEvent.remove();
42 }
43 self.creatEvent = self.drawAction.on("create", function(event) {
44 if (event.state === "complete") {
45 self.graphicLayer.remove(event.graphic);
46 if(callBackFunction && typeof callBackFunction == 'function'){
47 callBackFunction(event.graphic.geometry);
48 }
49
50 }
51 })
52 }).catch(err=>{
53 throw(err);
54 });
55 },
56 destroyeDraw() {
57 if(this.drawAction){
58 this.drawAction.cancel();
59 }
60 }
61 }
62 }
...\ No newline at end of file ...\ No newline at end of file
1 /*
2 * 空间图层数据添加、修改、删除
3 * */
4 import {loadModules} from "esri-loader"
5
6 export default {
7 methods:{
8 addGraphic(url,graphic,callBackFunction){
9 loadModules([
10 "esri/layers/FeatureLayer",
11 "esri/Graphic",
12 "esri/geometry/Point",
13 "esri/geometry/Polygon",
14 "esri/geometry/Polyline"
15 ]).then(([
16 FeatureLayer,
17 Graphic,
18 Point,
19 Polygon,
20 Polyline
21 ])=>{
22 var featureLayer = new FeatureLayer({
23 url:url
24 })
25 var saveGraphics = [];
26 if(!Array.isArray(graphic)){
27 graphic = [graphic];
28 }
29 for(var i = 0;i < graphic.length;i++){
30 var geo = null;
31 if(!graphic[i].geometry){
32 geo = null;
33 }else if(graphic[i].geometry.type == 'point'){
34 geo = new Point(graphic[i].geometry);
35 }else if(graphic[i].geometry.type == 'polyline'){
36 geo = new Polyline(graphic[i].geometry);
37 }else if(graphic[i].geometry.type == 'polygon'){
38 geo = new Polygon(graphic[i].geometry);
39 }
40 var saveGraphic = new Graphic({
41 attributes:graphic[i].attributes,
42 geometry:geo
43 });
44 saveGraphics.push(saveGraphic);
45 }
46 console.log(saveGraphic)
47 featureLayer.applyEdits({
48 addFeatures:saveGraphics,
49 // updateFeatures
50 }).then(function (res){
51 if(callBackFunction && typeof callBackFunction == 'function'){
52 console.log(res);
53 callBackFunction(res);
54 }
55 })
56 }).catch( err => {
57 throw (err);
58 })
59 },
60 updateGraphic(url,graphic,callBackFunction){
61 loadModules([
62 "esri/layers/FeatureLayer",
63 "esri/Graphic",
64 "esri/geometry/Point",
65 "esri/geometry/Polygon",
66 "esri/geometry/Polyline"
67 ]).then(([
68 FeatureLayer,
69 Graphic,
70 Point,
71 Polygon,
72 Polyline
73 ])=>{
74 var featureLayer = new FeatureLayer({
75 url:url
76 })
77 var updGraphics = [];
78 if(!Array.isArray(graphic)){
79 graphic = [graphic];
80 }
81 for(var i = 0;i < graphic.length;i++){
82 var geo = null;
83 if(!graphic[i].geometry){
84 geo = new Polygon();
85 }else if(graphic[i].geometry.type == 'point'){
86 geo = new Point(graphic[i].geometry);
87 }else if(graphic[i].geometry.type == 'polyline'){
88 geo = new Polyline(graphic[i].geometry);
89 }else if(graphic[i].geometry.type == 'polygon'){
90 geo = new Polygon(graphic[i].geometry);
91 }
92 var updGraphic = new Graphic({
93 attributes:graphic[i].attributes,
94 geometry:geo
95 });
96 updGraphics.push(updGraphic);
97 }
98
99 featureLayer.applyEdits({
100 updateFeatures:updGraphics
101 }).then(function (res){
102 if(callBackFunction && typeof callBackFunction == 'function'){
103 callBackFunction(res);
104 }
105 })
106 }).catch( err => {
107 throw (err);
108 })
109 },
110 delGraphic(url,graphic,callBackFunction){
111 loadModules([
112 "esri/layers/FeatureLayer",
113 "esri/Graphic",
114 "esri/geometry/Point",
115 "esri/geometry/Polygon",
116 "esri/geometry/Polyline"
117 ]).then(([
118 FeatureLayer,
119 Graphic,
120 Point,
121 Polygon,
122 Polyline
123 ])=>{
124 var featureLayer = new FeatureLayer({
125 url:url
126 })
127 var delGraphics = [];
128 if(!Array.isArray(graphic)){
129 graphic = [graphic];
130 }
131 for(var i = 0;i < graphic.length;i++){
132 var geo = null;
133 if(!graphic[i].geometry){
134 geo = null;
135 }else if(graphic[i].geometry.type == 'point'){
136 geo = new Point(graphic[i].geometry);
137 }else if(graphic[i].geometry.type == 'polyline'){
138 geo = new Polyline(graphic[i].geometry);
139 }else if(graphic[i].geometry.type == 'polygon'){
140 geo = new Polygon(graphic[i].geometry);
141 }
142 var delGraphic = new Graphic({
143 attributes:graphic[i].attributes,
144 geometry:geo
145 });
146 delGraphics.push(delGraphic);
147 }
148
149
150 featureLayer.applyEdits({
151 deleteFeatures:delGraphics
152 }).then(function (res){
153 console.log(res);
154 if(callBackFunction && typeof callBackFunction == 'function'){
155 callBackFunction(res);
156 }
157 })
158 }).catch( err => {
159 throw (err);
160 })
161 }
162 }
163 }
...\ No newline at end of file ...\ No newline at end of file
1 import {loadModules} from 'esri-loader'
2
3 export default {
4
5 methods:{
6 findByPro(url,layerIds,searchFields,searchText,returnGeometry,callBackFunction){
7 loadModules([
8 "esri/tasks/FindTask",
9 "esri/tasks/support/FindParameters"
10 ]).then(([
11 FindTask,
12 FindParameters
13 ]) => {
14 var findTask = new FindTask({
15 url:url
16 }),
17 findParameters = new FindParameters();
18 findParameters.returnGeometry = returnGeometry ? returnGeometry : false;
19 findParameters.layerIds = layerIds;
20 findParameters.searchFields = searchFields;
21 findParameters.searchText = searchText;
22 findParameters.outSpatialReference = {wkid:3857};
23 findTask.execute(findParameters).then(function (result) {
24 if(callBackFunction){
25 callBackFunction(result);
26 }
27 });
28 }).catch(err => {
29 throw (err);
30 })
31
32 }
33
34 }
35 }
...\ No newline at end of file ...\ No newline at end of file
1
2 import {loadCss,loadScript} from "esri-loader"
3
4 export function init(){
5 // loadScript({url:"http://192.168.2.38/4.16/init.js"});
6 // loadCss("http://192.168.2.38/4.16/esri/themes/light/main.css");
7 loadScript({ url:"http://192.168.2.146/arcgis_js_api/library/4.17/init.js"});
8 loadCss("http://192.168.2.146/arcgis_js_api/library/esri/css/main.css");
9 }
10 init();
...\ No newline at end of file ...\ No newline at end of file
1
2 var maps = {}
3
4
5 export {maps};
...\ No newline at end of file ...\ No newline at end of file
1 import {loadModules} from 'esri-loader'
2 import {maps} from '@/libs/map/mapUtils'
3 export default{
4 data(){
5 return{
6 //activeWidget:null,
7 areaActive:null,
8 distanceActive:null
9 }
10 },
11 methods: {
12 measure(viewId,type){
13 var view = maps[viewId];
14 var self = this;
15 loadModules([
16 "esri/widgets/DistanceMeasurement2D",
17 "esri/widgets/AreaMeasurement2D"
18 ]).then(([
19 DistanceMeasurement2D,
20 AreaMeasurement2D
21 ]) => {
22 switch (type) {
23 case "distance":
24 if(!self.distanceActive){
25 self.distanceActive = new DistanceMeasurement2D({
26 view: view
27 });
28 }
29 // skip the initial 'new measurement' button
30 self.distanceActive.viewModel.start();
31 break;
32 case "area":
33 if(!self.areaActive){
34 self.areaActive = new AreaMeasurement2D({
35 view: view
36 });
37 }
38
39
40 // skip the initial 'new measurement' button
41 self.areaActive.viewModel.start();
42 break;
43 case null:
44 if (self.distanceActive) {
45 self.distanceActive.viewModel.clear();
46 // self.distanceActive = null;
47 }
48 if (self.areaActive) {
49 self.areaActive.viewModel.clear();
50 // self.areaActive = null;
51 }
52 break;
53 }
54
55 }).catch(err => {
56 throw(err);
57 });
58
59 }
60
61 }
62 }
...\ No newline at end of file ...\ No newline at end of file
1
2 import {loadModules} from 'esri-loader'
3
4 export default{
5
6 methods: {
7 queryByWhere(url,queryWhere,geometry,returnGeometry,outFields ,outSpatialReference ,callBackFunction){
8 var self = this;
9 loadModules([
10 "esri/tasks/QueryTask",
11 "esri/tasks/support/Query"
12 ]).then(([
13 QueryTask,
14 Query
15 ]) => {
16 var queryTask = new QueryTask({
17 url: url
18 }),
19 query = new Query(),
20 where = "";
21 if (queryWhere){
22 var parames = self.parseObj2Arr(queryWhere);
23 //var isFrist = false;
24 for(var i = 0;i < parames.length; i++ ){
25 if(i == 0){
26
27 }else {
28 where += " and ";
29 }
30 if(Array.isArray(parames[i].value)){
31 where += parames[i].name + " in (" + parames[i].value.toString() + ")";
32 }else if(typeof parames[i].value == 'number'){
33 where += parames[i].name + " =" + parames[i].value ;
34 }else{
35 where += parames[i].name + " like " + "'%" + parames[i].value +"%'";
36 }
37 }
38 } else {
39 where = "1=1";
40 }
41
42 query.where = where;
43 if(geometry){
44 query.geometry = geometry;
45 }
46 query.outSpatialReference = outSpatialReference ? outSpatialReference : {wkid:3857}
47 query.returnGeometry = returnGeometry ? true : false;
48 query.outFields = outFields ? outFields : ["*"];
49 queryTask.execute(query).then(function(results){
50 if(callBackFunction && typeof callBackFunction == 'function'){
51 callBackFunction(results);
52 }
53 });
54 }).catch( err => {
55 throw(err);
56 })
57 },
58 parseObj2Arr(object){
59 var arr = [];
60 for(var key in object){
61 var obj = {};
62 obj.name = key;
63 obj.value = object[key];
64 arr.push(obj);
65 }
66 return arr;
67 }
68 },
69 }
1 import {open,openShp} from "shapefile"
2
3 export default{
4
5 methods: {
6
7 readShpByFile(file,callBackFunction){
8 var reader = new FileReader();
9 reader.readAsBinaryString(file);
10 reader.οnlοad=function(){
11 var fileData = this.result ; //fileData就是读取到的文件的二进制数据
12 openShp(fileData).then(source => source.read()
13 .then(function log(result) {
14 if (result.done) return;
15 if(callBackFunction && typeof callBackFunction == 'function'){
16 callBackFunction(result.value);
17 }
18 return source.read().then(log);
19 }))
20 .catch(error => console.error(error.stack));
21 }
22 },
23 readShpByUrl(url,callBackFunction){
24 open(url).then(source => source.read()
25 .then(function log(result) {
26 if (result.done) return;
27 if(callBackFunction && typeof callBackFunction == 'function'){
28 callBackFunction(result.value);
29 }
30 return source.read().then(log);
31 }))
32 .catch(error => console.error(error.stack));
33 }
34 },
35 readShpByZip(zipUrl,callBackFunction){
36
37 }
38
39 }
...\ No newline at end of file ...\ No newline at end of file
...@@ -24,18 +24,19 @@ const service = axios.create({ ...@@ -24,18 +24,19 @@ const service = axios.create({
24 // request interceptor 24 // request interceptor
25 service.interceptors.request.use( 25 service.interceptors.request.use(
26 config => { 26 config => {
27 if (config.showLoading) { 27 if (config.headers.showLoading !== false) {
28 startLoadingAddCount(config.loadingTarget); 28 startLoadingAddCount(config.headers.loadingTarget ? config.headers.loadingTarget : '正在加载中...',
29 config.headers.target ? config.headers.target : 'body');
29 } 30 }
30 config.headers.Authorization = 31 config.headers.Authorization =
31 // 'bearer AT-231-XqviE9StKRPLMwmnSoVBLP-YzTupyBI5'
32 'bearer AT-4-MxSrO29Coe7VTazx8uuixtqqgO-hvCB6' 32 'bearer AT-4-MxSrO29Coe7VTazx8uuixtqqgO-hvCB6'
33 config.headers.Accept = 'application/json' 33 config.headers.Accept = 'application/json'
34 return config 34 return config
35 }, 35 },
36 error => { 36 error => {
37 if (error.showLoading) { 37 if (error.headers.showLoading !== false) {
38 endLoadingSubCount(config.loadingTarget); 38 endLoadingSubCount(config.headers.loadingTarget ? config.headers.loadingTarget : '正在加载中...',
39 config.headers.target ? config.headers.target : 'body');
39 } 40 }
40 Message.error('请求超时!'); 41 Message.error('请求超时!');
41 return Promise.reject(error) 42 return Promise.reject(error)
...@@ -45,7 +46,7 @@ service.interceptors.request.use( ...@@ -45,7 +46,7 @@ service.interceptors.request.use(
45 // response interceptor 46 // response interceptor
46 service.interceptors.response.use( 47 service.interceptors.response.use(
47 response => { 48 response => {
48 if (response.config.showLoading) { 49 if (response.config.headers.showLoading !== false) {
49 endLoadingSubCount(); 50 endLoadingSubCount();
50 } 51 }
51 /** 52 /**
...@@ -67,7 +68,7 @@ service.interceptors.response.use( ...@@ -67,7 +68,7 @@ service.interceptors.response.use(
67 type: 'error', 68 type: 'error',
68 duration: 5 * 1000 69 duration: 5 * 1000
69 }) 70 })
70 if (error.config.showLoading) { 71 if (error.config.headers.showLoading !== false) {
71 endLoadingSubCount(); 72 endLoadingSubCount();
72 } 73 }
73 return Promise.reject(error); 74 return Promise.reject(error);
...@@ -103,6 +104,6 @@ function handleErrorData (errMes) { ...@@ -103,6 +104,6 @@ function handleErrorData (errMes) {
103 } 104 }
104 } 105 }
105 } 106 }
106
107 export default service 107 export default service
108 108
109
......
1 import { Loading } from 'element-ui' 1 // import { Loading } from 'element-ui'
2 import Loading from '@/components/loading/index.js';
2 // 定义 loading 3 // 定义 loading
3 let loading 4 let loading
4 5
5 // loading开始 方法 6 // loading开始 方法
6 function startLoading (LoadingText = '拼命加载中...') { 7 function startLoading (LoadingText = '正在加载中...', target = "body") {
7 // element-ui loading 服务调用方式
8 loading = Loading.service({ 8 loading = Loading.service({
9 text: LoadingText, 9 text: LoadingText,
10 spinner: 'el-icon-loading', // 自定义图标 10 spinner: 'el-icon-loading',
11 background: 'rgba(0, 0, 0, 0.8)' 11 background: 'rgba(255, 255, 255, 0.5)',
12 target: target
12 }) 13 })
13 } 14 }
14 15
...@@ -23,9 +24,9 @@ let loadingCount = 0 ...@@ -23,9 +24,9 @@ let loadingCount = 0
23 * 调用一次startLoadingAddCount() 方法 开启Loading 并 loadingCount + 1 24 * 调用一次startLoadingAddCount() 方法 开启Loading 并 loadingCount + 1
24 * 调用一次endLoadingSubCount() 方法 loadingCount - 1 直到为0 关闭loading 25 * 调用一次endLoadingSubCount() 方法 loadingCount - 1 直到为0 关闭loading
25 */ 26 */
26 export function startLoadingAddCount (LoadingText) { 27 export function startLoadingAddCount (LoadingText, target) {
27 if (loadingCount === 0) { 28 if (loadingCount === 0) {
28 startLoading(LoadingText) 29 startLoading(LoadingText, target)
29 } 30 }
30 loadingCount++ 31 loadingCount++
31 } 32 }
......
1 <template>
2 <div class="h content-form">
3 <el-form ref="form" :model="form" label-width="160px">
4 <table border="1" width="100%" cellspacing="0" cellpadding="0" class="hTable">
5 <tbody>
6 <tr height="30">
7 <td colspan="12" align="center">
8 <font size="4">层基本信息</font>
9 </td>
10 </tr>
11 <tr height="30">
12 <td colspan="2" align="center" class="tdright">层号</td>
13 <td colspan="4">
14 <el-input v-model="form.ch"></el-input>
15 </td>
16 <td colspan="2" align="center" class="tdright">自然幢号</td>
17 <td colspan="4">
18 <el-input v-model="form.zrzh"></el-input>
19 </td>
20 </tr>
21 <tr height="30">
22 <td colspan="2" align="center" class="tdright">实际层</td>
23 <td colspan="4">
24 <el-input v-model="form.sjc"></el-input>
25 </td>
26 <td colspan="2" align="center" class="tdright">名义层</td>
27 <td colspan="4">
28 <el-input v-model="form.myc"></el-input>
29 </td>
30 </tr>
31
32
33 <tr height="30">
34 <td colspan="2" align="center" class="tdright">层建筑面积(㎡)</td>
35 <td colspan="4">
36 <el-input v-model="form.cjzmj"></el-input>
37 </td>
38 <td colspan="2" align="center" class="tdright">层套内建筑面积(㎡)</td>
39 <td colspan="4">
40 <el-input v-model="form.ctnjzmj"></el-input>
41 </td>
42 </tr>
43
44 <tr height="30">
45 <td colspan="2" align="center" class="tdright">层阳台面积(㎡)</td>
46 <td colspan="4">
47 <el-input v-model="form.cytmj"></el-input>
48 </td>
49 <td colspan="2" align="center" class="tdright">层半墙面积(㎡)</td>
50 <td colspan="4">
51 <el-input v-model="form.cbqmj"></el-input>
52 </td>
53 </tr>
54
55 <tr height="30">
56 <td colspan="2" align="center" class="tdright">层共有建筑面积(㎡)</td>
57 <td colspan="4">
58 <el-input v-model="form.cgyjzmj"></el-input>
59 </td>
60 <td colspan="2" align="center" class="tdright">层分摊建筑面积(㎡)</td>
61 <td colspan="4">
62 <el-input v-model="form.cftjzmj"></el-input>
63 </td>
64 </tr>
65
66 <tr height="30">
67 <td colspan="2" align="center" class="tdright">层高</td>
68 <td colspan="4">
69 <el-input v-model="form.cg"></el-input>
70 </td>
71 <td colspan="2" align="center" class="tdright">水平投影面积</td>
72 <td colspan="4">
73 <el-input v-model="form.sptymj"></el-input>
74 </td>
75 </tr>
76 <tr height="30">
77 </tr>
78
79 </tbody>
80 </table>
81 </el-form>
82 </div>
83
84 </template>
85
86 <script>
87 // import { getQjCDetailById, updateQjC } from "@api/c";
88 export default {
89 name: 'c',
90 components: {},
91 props: {
92 cbsm: {
93 type: String,
94 default: '',
95 }
96 },
97 data () {
98 return {
99 form: {
100 zrzbsm: '',
101 ch: '', //层号
102 zrzh: '', //自然幢号
103 sjc: '', //实际层
104 myc: '', //名义层
105 cjzmj: '', //层建筑面积
106 ctnjzmj: '', //层套内建筑面积
107 cytmj: '', //层阳台面积
108 cbqmj: '', //层半墙面积
109 cgyjzmj: '', //层共有建筑面积
110 cftjzmj: '', //层分摊建筑面积
111 cg: '', //层高
112 sptymj: '', //水平投影面积
113 },
114 value: '',
115 }
116 },
117 methods: {
118 onSave () {
119 this.form.zrzbsm = this.$route.query.bsm;
120 //编辑层信息接口调用 TODO
121 // updateQjC(this.form).then((res) => {
122 // if (res.code === 200) {
123 // this.$message.success("保存成功")
124 // }
125 // })
126 },
127 getCinfo (bsm) {
128 this.reset();
129 //获取层信息接口调用 TODO
130 // getQjCDetailById(bsm).then((res) => {
131 // if (res.code === 200) {
132 // this.form = res.result;
133 // this.form.zrzh = this.$store.state.zrzh;
134 // }
135 // })
136 },
137 reset () {
138 this.form = {
139 zrzbsm: '',
140 ch: '', //层号
141 zrzh: '', //自然幢号
142 sjc: '', //实际层
143 myc: '', //名义层
144 cjzmj: '', //层建筑面积
145 ctnjzmj: '', //层套内建筑面积
146 cytmj: '', //层阳台面积
147 cbqmj: '', //层半墙面积
148 cgyjzmj: '', //层共有建筑面积
149 cftjzmj: '', //层分摊建筑面积
150 cg: '', //层高
151 sptymj: '', //水平投影面积
152 }
153 }
154 },
155 mounted () {
156 this.getCinfo(this.cbsm);
157 },
158 watch: {
159 cbsm: {
160 handler: function (item) {
161 console.log(item, "item")
162 console.log(this.$parent.$parent.menuType, "this.$parent.$parent.menuType")
163 if (item != '' && this.$parent.$parent.menuType == 'c') {
164 this.getCinfo(item)
165 }
166 },
167 immediate: true
168 },
169 }
170 }
171 </script>
172 <style rel="stylesheet/scss" lang="scss" scoped>
173 .h {
174 min-height: 200px;
175 width: 100%;
176 margin: 0 auto;
177
178 /deep/.el-input__inner {
179 width: 100%;
180 border: 0;
181 }
182
183 /deep/textarea {
184 width: 100%;
185 border: 0;
186 }
187
188
189 .el-form-item {
190 font-weight: bold;
191 font-size: xx-large
192 }
193
194 table {
195 background: #fff;
196 table-layout: fixed;
197 }
198
199 td {
200 //bgcolor:#F1F4FC;
201 bgcolor: #fff;
202 width: 8.33%
203 }
204
205 .el-select {
206 display: block;
207 }
208 }
209
210 table {
211 font-size: 14px;
212 }
213
214 .hTable {
215 margin-top: 10px;
216 }
217 </style>
...\ No newline at end of file ...\ No newline at end of file
1 <template>
2 <div class="addCh">
3 <el-table class="addChTable" :data="tableData" style="width: 100%" border>
4 <el-table-column prop="cz" width="60" align="center">
5 <template slot-scope="scope">
6 <span class="cp" @click="handleRowClick(scope.row, scope.$index)">
7 <i class="iconfont iconicon-test1" style="color:#FA6400;font-size:30px" @click="deleteYtInfo(index)"
8 v-if="scope.row.cz == '+'"></i>
9 <i class="iconfont iconicon-test" style="color:#FA6400;font-size:30px" @click="deleteYtInfo(index)"
10 v-if="scope.row.cz == '-'"></i>
11 </span>
12 </template>
13 </el-table-column>
14 <el-table-column prop="zrzmc" label="自然幢" align="center">
15 </el-table-column>
16 <el-table-column prop="ljzmc" label="逻辑幢" align="center">
17 </el-table-column>
18 <el-table-column prop="zdymc" label="幢单元" align="center">
19 </el-table-column>
20 <el-table-column prop="qsc" label="起始层" align="center">
21 <template slot-scope="scope">
22 <el-input v-model="scope.row.qsc" type="number"></el-input>
23 </template>
24 </el-table-column>
25 <el-table-column prop="jsc" label="结束层" align="center">
26 <template slot-scope="scope">
27 <el-input v-model="scope.row.jsc" type="number"></el-input>
28 </template>
29 </el-table-column>
30 <el-table-column prop="hs" label="每层户数" align="center">
31 <template slot-scope="scope">
32 <el-input v-model="scope.row.hs" type="number"></el-input>
33 </template>
34 </el-table-column>
35 </el-table>
36 </div>
37 </template>
38
39 <script>
40 // import { insertChInfo } from "@api/lpb";
41 export default {
42 name: "",
43 components: {},
44 props: {
45 treeData: {},
46 dialogVisible: {
47 type: Boolean,
48 default: false,
49 },
50 scyclx: {
51 type: String,
52 default: "1",
53 },
54 },
55 data () {
56 return {
57 ljzBsm: null,
58 zdyBsm: null,
59 zrzBsm: null,
60 tableData: [],
61 formData: {
62 cz: "+",
63 ljzbsm: "",
64 ljzmc: "",
65 zdymc: "",
66 zdybsm: "",
67 zrzbsm: "",
68 scyclx: "1",
69 qsc: "",
70 jsc: "",
71 hs: "",
72 },
73 };
74 },
75 created () { },
76 mounted () {
77 console.log(this.treeData, "treeData");
78 },
79 methods: {
80 //行操作
81 handleRowClick (row, index) {
82 if (row.cz == "+") {
83 let temp = JSON.parse(JSON.stringify(this.formData));
84 temp.qsc = '';
85 temp.jsc = '';
86 temp.hs = '';
87 temp.cz = "-";
88 this.tableData.push(temp);
89 } else {
90 this.tableData.splice(index, 1);
91 }
92 },
93 onSave (bsm) {
94 console.log(this.tableData)
95 let totalHs = 0;
96 for (let k = 0; k < this.tableData.length; k++) {
97 if (this.tableData[k].qsc === "" || this.tableData[k].jsc === "" || this.tableData[k].hs === "") {
98 this.$message.warning("表单不完整，请填写完整")
99 return false
100 }
101 if (this.tableData[k].qsc - this.tableData[k].jsc > 0) {
102 this.$message.warning("存在结束层大于起始层，请重写填写")
103 return false
104 }
105 totalHs = totalHs + (this.tableData[k].jsc - this.tableData[k].qsc + 1) * this.tableData[k].hs;
106 }
107 if (totalHs >= 5000) {
108 this.$message.warning("单次添加户数累积超过5000户，请分次添加！")
109 return false
110 }
111 // insertChInfo(this.tableData).then((res) => {
112 // if (res.code === 200) {
113 // this.$message.success("保存成功");
114 // //更新树结构数据
115 // console.log(this);
116 // this.$parent.$parent.getLpbMenuTree(bsm);
117 // this.$parent.$parent.getlpbData();
118 // //关闭弹框
119 // this.$parent.$parent.closeDaialog();
120 // } else {
121 // this.$message({
122 // message: res.message,
123 // type: "warning",
124 // })
125 // }
126 // });
127 },
128 //重置数据
129 reset () {
130 this.tableData[0].qsc = "";
131 this.tableData[0].jsc = "";
132 this.tableData[0].hs = "";
133 },
134 },
135 computed: {},
136 watch: {
137 treeData: {
138 handler (n) {
139 this.formData = {
140 cz: "+",
141 ljzbsm: "",
142 zdybsm: "",
143 zrzbsm: "",
144 scyclx: this.scyclx,
145 qsc: "",
146 jsc: "",
147 hs: "",
148 };
149 //给自然幢，逻辑幢，幢单元的bsm和mc赋值
150 switch (n.type) {
151 case "zrz":
152 this.formData.zrzbsm = n.bsm;
153 this.formData.zrzmc = n.mc;
154 break;
155 case "ljz":
156 this.formData.zrzbsm = n.zrzbsm;
157 this.formData.ljzbsm = n.bsm;
158 this.formData.zrzmc = n.zrzmc;
159 this.formData.ljzmc = n.mc;
160 break;
161 case "zdy":
162 this.formData.zrzbsm = n.zrzbsm;
163 this.formData.ljzbsm = n.ljzbsm;
164 this.formData.zdybsm = n.bsm;
165 this.formData.zrzmc = n.zrzmc;
166 this.formData.ljzmc = n.ljzmc;
167 this.formData.zdymc = n.mc;
168 break;
169 default:
170 break;
171 }
172 this.tableData = [];
173 this.tableData.push(this.formData);
174 },
175 //深度监听，第一次接收到父组件传值就触发事件
176 immediate: true,
177 deep: true,
178 },
179 scyclx: {
180 handler (n) {
181 this.$nextTick(() => {
182 this.formData.scyclx = this.scyclx;
183 })
184 }
185 }
186 },
187 };
188 </script>
189 <style lang="scss">
190 .addCh {
191 .addChTable {
192 .el-input__inner {
193 height: 20px;
194 margin: 0;
195 line-height: 20px;
196 outline: none;
197 border: none;
198 color: #606764;
199 overflow: visible;
200 cursor: text;
201 text-align: center;
202 }
203 }
204
205 .cp {
206 cursor: pointer;
207 position: relative;
208 top: 4px;
209 }
210
211 .el-table .cell {
212 line-height: 34px;
213 }
214
215 .el-table .cell,
216 .el-table--border td:first-child .cell,
217 .el-table--border th:first-child .cell {
218 padding-left: 5px;
219 }
220
221 .el-table td,
222 .el-table th {
223 padding: 4px 0;
224 }
225 }
226 </style>
1 <template>
2 <div class="h content-form" ref="mainBox" :class="$route.path == '/h' ? 'hpage' : ''"
3 :style="{'height': $route.path == '/h' ? '100%' : formHeight+'px'}">
4 <el-form ref="form" :model="form" label-width="160px" class="form">
5 <Qlr ref="qlrxxModule" :bsm='bsm' :qszt="form.qszt" :type="lx"></Qlr>
6 <table border="1" width="100%" cellspacing="0" cellpadding="0" class="hTable">
7 <tbody>
8 <tr height="30">
9 <th colspan="12" align="center">
10 <font size="4">户基本信息</font>
11 </th>
12 </tr>
13 <tr height="30">
14 <td colspan="2" align="center" class="tdright">宗地代码<i class="requisite">*</i></td>
15 <td colspan="4">
16 <el-input v-model="form.zddm" disabled></el-input>
17 </td>
18 <td colspan="2" align="center" class="tdright">自然幢号<i class="requisite">*</i></td>
19 <td colspan="4">
20 <el-input v-model="form.zrzh" disabled></el-input>
21 </td>
22 </tr>
23 <tr height="30">
24 <td colspan="2" align="center" class="tdright">不动产单元号<i class="requisite">*</i></td>
25 <!-- todo 此处暂时存放的是不动产单元号标识码，而不是不动产单元号-->
26 <td colspan="4" class="psr">
27 <el-input v-model="form.bdcdyh" class="percent80" :disabled="disableFlag" ref="bdcdyh">
28 </el-input>
29 <el-button @click.prevent="generatorCode" size="mini" class="createBtn" type="warning"
30 :disabled="disableFlag">生成</el-button>
31 </td>
32 <!-- <td colspan="2" align="center" >原不动产单元</td>-->
33 <!-- <td colspan="4" >-->
34 <!-- <el-input v-model="form.ydybsm" disabled></el-input>-->
35 <!-- </td>-->
36 <td colspan="2" align="center" class="tdright">逻辑幢号</td>
37 <td colspan="4">
38 <el-input v-model="form.ljzh" disabled></el-input>
39 </td>
40
41 </tr>
42
43 <tr height="30">
44 <td colspan="2" align="center" class="tdright">房屋性质<i class="requisite">*</i></td>
45 <td colspan="4">
46 <el-select v-model="form.fwxzbsm" placeholder="请选择" :disabled="disableFlag" ref="fwxzbsm">
47 <el-option v-for="item in $store.state.fwxzOptions" :key="item.bsm" :label="item.mc"
48 :value="item.bsm">
49 </el-option>
50 </el-select>
51 </td>
52
53 <td colspan="2" align="center" class="tdright">所在单元</td>
54 <td colspan="4">
55 <el-input v-model="form.zdymc" disabled></el-input>
56 </td>
57
58 </tr>
59
60 <tr height="30">
61 <td colspan="2" align="center" class="tdright">层号</td>
62 <td colspan="4">
63 <el-input v-model="form.ch" :disabled="disableFlag"></el-input>
64 </td>
65
66 <td colspan="2" align="center" class="tdright">实际层</td>
67 <td colspan="4">
68 <el-input v-model="form.sjc" disabled></el-input>
69 </td>
70
71 </tr>
72
73 <tr height="30">
74 <td colspan="2" align="center" class="tdright">房屋编号</td>
75 <td colspan="4">
76 <el-input v-model="form.fwbh" :disabled="disableFlag"></el-input>
77 </td>
78 <td colspan="2" align="center" class="tdright">实际层数</td>
79 <td colspan="4">
80 <el-input v-model="form.sjcs" disabled></el-input>
81 </td>
82
83 </tr>
84 <tr height="30">
85 <td colspan="2" align="center" class="tdright">室号</td>
86 <td colspan="4">
87 <el-input v-model="form.shbw" :disabled="disableFlag"></el-input>
88 </td>
89 <td colspan="2" align="center" class="tdright">户号</td>
90 <td colspan="4">
91 <el-input v-model="form.hh" disabled></el-input>
92 </td>
93
94 </tr>
95
96 <tr height="30">
97 <td colspan="2" align="center" class="tdright">房屋类型<i class="requisite">*</i></td>
98 <td colspan="4">
99 <el-select v-model="form.fwlxbsm" placeholder="请选择" :disabled="disableFlag" ref="fwlxbsm">
100 <el-option v-for="item in $store.state.fwlxList" :key="item.bsm" :label="item.mc"
101 :value="item.bsm">
102 </el-option>
103 </el-select>
104 </td>
105
106 <td colspan="2" align="center" class="tdright">名义层</td>
107 <td colspan="4">
108 <el-input v-model="form.myc" disabled></el-input>
109 </td>
110
111
112 </tr>
113
114
115 <tr height="30">
116 <td colspan="2" align="center" class="tdright">户型</td>
117 <td colspan="4">
118 <el-select v-model="form.hxbsm" placeholder="请选择" :disabled="disableFlag">
119 <el-option v-for="item in $store.state.hxList" :key="item.bsm" :label="item.mc"
120 :value="item.bsm">
121 </el-option>
122 </el-select>
123 </td>
124 <td colspan="2" align="center" class="tdright">户型结构</td>
125 <td colspan="4">
126 <el-select v-model="form.hxjgbsm" placeholder="请选择" :disabled="disableFlag">
127 <el-option v-for="item in $store.state.hxjgList" :key="item.bsm" :label="item.mc"
128 :value="item.bsm">
129 </el-option>
130 </el-select>
131 </td>
132 </tr>
133
134 <tr height="30">
135 <td colspan="2" align="center" class="tdright">产别<i class="requisite">*</i></td>
136 <td colspan="4">
137 <el-select v-model="form.fwcbbsm" placeholder="请选择" :disabled="disableFlag" ref="fwcbbsm">
138 <el-option v-for="item in $store.state.cbOptions" :key="item.bsm" :label="item.mc"
139 :value="item.bsm">
140 </el-option>
141 </el-select>
142 </td>
143 <td colspan="2" align="center" class="tdright">产权来源<i class="requisite">*</i></td>
144 <td colspan="4">
145 <el-select v-model="form.fwcqlybsm" placeholder="请选择" :disabled="disableFlag"
146 ref="fwcqlybsm">
147 <el-option v-for="item in $store.state.cqlyOptions" :key="item.bsm" :label="item.mc"
148 :value="item.bsm">
149 </el-option>
150 </el-select>
151 </td>
152 </tr>
153
154 <tr height="30">
155 <td colspan="2" rowspan="6" align="center" class="tdright">预测</td>
156 <td colspan="2" align="center" class="tdright">建筑面积(㎡)</td>
157 <td colspan="2" align="center">
158 <el-input v-model="form.ycjzmj" type="number"
159 :disabled="form.scyclx === '1' || disableFlag">
160 </el-input>
161 </td>
162 <td colspan="2" rowspan="6" align="center" class="tdright">实测</td>
163 <td colspan="2" align="center" class="tdright">建筑面积(㎡)</td>
164 <td colspan="2" align="center">
165 <el-input v-model="form.scjzmj" type="number"
166 :disabled="form.scyclx === '0' || disableFlag">
167 </el-input>
168 </td>
169 </tr>
170 <tr height="30">
171 <td colspan="2" align="center" class="tdright">套内建筑面积(㎡)</td>
172 <td colspan="2" align="center">
173 <el-input v-model="form.yctnjzmj" type="number"
174 :disabled="form.scyclx === '1' || disableFlag">
175 </el-input>
176 </td>
177 <td colspan="2" align="center" class="tdright">套内建筑面积(㎡)</td>
178 <td colspan="2" align="center">
179 <el-input v-model="form.sctnjzmj" type="number"
180 :disabled="form.scyclx === '0' || disableFlag">
181 </el-input>
182 </td>
183 </tr>
184 <tr height="30">
185 <td colspan="2" align="center" class="tdright">分摊建筑面积(㎡)</td>
186 <td colspan="2" align="center">
187 <el-input v-model="form.ycftjzmj" type="number"
188 :disabled="form.scyclx === '1' || disableFlag">
189 </el-input>
190 </td>
191 <td colspan="2" align="center" class="tdright">分摊建筑面积(㎡)</td>
192 <td colspan="2" align="center">
193 <el-input v-model="form.scftjzmj" type="number"
194 :disabled="form.scyclx === '0' || disableFlag">
195 </el-input>
196 </td>
197 </tr>
198 <tr height="30">
199 <td colspan="2" align="center" class="tdright">地下部分建筑面积(㎡)</td>
200 <td colspan="2" align="center">
201 <el-input v-model="form.ycdxbfjzmj" type="number"
202 :disabled="form.scyclx === '1' || disableFlag"></el-input>
203 </td>
204 <td colspan="2" align="center" class="tdright">地下部分建筑面积(㎡)</td>
205 <td colspan="2" align="center">
206 <el-input v-model="form.scdxbfjzmj" type="number"
207 :disabled="form.scyclx === '0' || disableFlag"></el-input>
208 </td>
209 </tr>
210 <tr height="30">
211 <td colspan="2" align="center" class="tdright">其它建筑面积(㎡)</td>
212 <td colspan="2" align="center">
213 <el-input v-model="form.ycqtjzmj" type="number"
214 :disabled="form.scyclx === '1' || disableFlag">
215 </el-input>
216 </td>
217 <td colspan="2" align="center" class="tdright">其它建筑面积(㎡)</td>
218 <td colspan="2" align="center">
219 <el-input v-model="form.scqtjzmj" type="number"
220 :disabled="form.scyclx === '0' || disableFlag">
221 </el-input>
222 </td>
223 </tr>
224 <tr height="30">
225 <td colspan="2" align="center" class="tdright">分摊系数</td>
226 <td colspan="2" align="center">
227 <input class="formInput" v-model="form.ycftxs" type="number"
228 :disabled="form.scyclx === '1' || disableFlag" @blur="inputFtxsBlur($event)"
229 ref="ycftxs" />
230 </td>
231 <td colspan="2" align="center" class="tdright">分摊系数</td>
232 <td colspan="2" align="center">
233 <input class="formInput" v-model="form.scftxs" type="number"
234 :disabled="form.scyclx === '0' || disableFlag" @blur="inputFtxsBlur($event)"
235 ref="scftxs" />
236 </td>
237 </tr>
238 <tr height="30">
239 <td colspan="2" align="center" class="tdright">共有土地面积(㎡)</td>
240 <td colspan="2">
241 <el-input v-model="form.gytdmj" type="number" :disabled="disableFlag"></el-input>
242 </td>
243 <td colspan="2" align="center" class="tdright">分摊土地面积(㎡)</td>
244 <td colspan="2">
245 <el-input v-model="form.fttdmj" type="number" :disabled="disableFlag"></el-input>
246 </td>
247 <td colspan="2" align="center" class="tdright">多幢独用土地面积(㎡)</td>
248 <td colspan="2">
249 <el-input v-model="form.dytdmj" type="number" :disabled="disableFlag"></el-input>
250 </td>
251 </tr>
252
253 <tr>
254 <td colspan="2" align="center" class="tdright">
255 <span>坐落<i class="requisite">*</i></span>
256 </td>
257 <td colspan="10">
258 <input class="formInput" v-model="form.zl" ref="zl" @blur="inputBlur($event)"
259 :disabled="disableFlag" />
260 </td>
261 </tr>
262
263 <tr height="30" v-for="(item1, index) in form.fwytList" :key="index">
264 <td v-if="index === 0" colspan="2" :rowspan="ytTitleRowspan" align="center" class="tdright"
265 id="ytTitle">
266 <el-button type="primary" style="margin-right: 10px" class="changeBtn addMinus inAdd"
267 @click="addYtInfo">+</el-button>
268 <span>房屋用途<i class="requisite">*</i></span>
269 </td>
270
271 <td width="30" colspan="2" align="center" class="tdright">
272 <el-button type="primary" class="changeBtn addMinus inMinus" @click="deleteYtInfo(index)">-
273 </el-button>
274 规划用途
275 </td>
276 <td width="30" colspan="2" align="center">
277 <el-select-tree ref="ghyt" v-if="show" :default-expand-all="defaultExpandAll"
278 @change="updateSjfyyt(item1)" :multiple="multiple" :placeholder="placeholder"
279 :disabled="disableFlag" :data="$store.state.fwytList" :props="treeProps"
280 :check-strictly="checkStrictly" :clearable="clearable" v-model="item1.fwytzdbsm">
281 </el-select-tree>
282 </td>
283 <td width="30" colspan="2" align="center" class="tdright">用途</td>
284 <td width="30" colspan="4" align="center">
285 <el-select-tree ref="yt" v-if="show" :default-expand-all="defaultExpandAll"
286 :multiple="multiple" :placeholder="placeholder" :disabled="disableFlag"
287 :data="$store.state.fwytList" :props="treeProps" :check-strictly="checkStrictly"
288 :clearable="clearable" v-model="item1.fwsjytbsm"></el-select-tree>
289 </td>
290 </tr>
291
292 <tr height="30" v-for="(item1, index) in form.fwjgList" :key="'jg' + index">
293 <td colspan="2" v-if="index === 0" :rowspan="fwjgTitleRowspan" align="center" class="tdright">
294 <!-- <el-button type="primary" size="mini" style="margin-right: 10px" @click="addFwjgInfo">添加</el-button> -->
295 <el-button type="primary" style="margin-right: 10px" class="changeBtn addMinus inAdd"
296 @click="addFwjgInfo">+</el-button>
297 <span>房屋结构<i class="requisite">*</i></span>
298 </td>
299 <td colspan="2" align="center" class="tdright">
300 <el-button type="primary" style="margin-right: 5px" class="changeBtn addMinus inMinus"
301 @click="deleteFwjgInfo(index)">-</el-button>
302 <span @click="deleteFwjgInfo(index)">房屋结构</span>
303 </td>
304 <td colspan="8">
305 <el-select v-model="item1.fwjgzdbsm" ref="fwjg" placeholder="请选择" :disabled="disableFlag">
306 <el-option v-for="item in $store.state.jgOptions" :key="item.bsm" :label="item.mc"
307 :value="item.bsm">
308 </el-option>
309 </el-select>
310 </td>
311 </tr>
312
313
314
315 <tr>
316 <td colspan="12" rowspan="4" align="center">
317 <Qlxz ref="qlxzModule" :hasSyqx='false' :formData="form"></Qlxz>
318 </td>
319 </tr>
320 <tr></tr>
321 <tr></tr>
322 <tr></tr>
323
324 <tr height="30">
325 <td colspan="2" align="center" class="tdright">东墙体归属</td>
326 <td colspan="4">
327 <el-input v-model="form.dqtgs" :disabled="disableFlag"></el-input>
328 </td>
329 <td colspan="2" align="center" class="tdright">南墙体归属</td>
330 <td colspan="4">
331 <el-input v-model="form.nqtgs" :disabled="disableFlag"></el-input>
332 </td>
333 </tr>
334
335 <tr height="30">
336 <td colspan="2" align="center" class="tdright">西墙体归属</td>
337 <td colspan="4">
338 <el-input v-model="form.xqtgs" :disabled="disableFlag"></el-input>
339 </td>
340 <td colspan="2" align="center" class="tdright">北墙体归属</td>
341 <td colspan="4">
342 <el-input v-model="form.bqtgs" :disabled="disableFlag"></el-input>
343 </td>
344 </tr>
345
346 <tr height="30">
347 <td colspan="2" rowspan="2" align="center" class="tdright">
348 <span>附加说明</span>
349 </td>
350 <td colspan="10" rowspan="2">
351 <el-input v-model="form.bz" type="textarea" :disabled="disableFlag"></el-input>
352 </td>
353 </tr>
354 <tr height="30">
355 </tr>
356
357 <tr height="30">
358 <td colspan="2" rowspan="2" align="center" class="tdright">
359 <span>调查意见</span>
360 </td>
361 <td colspan="10">
362 <el-input v-model="form.name" :disabled="disableFlag"></el-input>
363 </td>
364 </tr>
365
366 <tr height="30">
367 <td colspan="4" rowspan="2" align="right" class="tdright"
368 style="width:8.33%;padding-right:10px">
369 <span>审查员</span>
370 </td>
371 <td colspan="2">
372 <el-input v-model="form.name" :disabled="disableFlag"></el-input>
373 </td>
374 <td colspan="2" rowspan="2" align="right" class="tdright"
375 style="width:8.33%;padding-right:10px">
376 <span>审查日期</span>
377 </td>
378 <td colspan="2">
379 <el-date-picker v-model="form.date" type="date" placeholder="选择日期">
380 </el-date-picker>
381 </td>
382 </tr>
383 </tbody>
384 </table>
385 </el-form>
386 <div class="header-button" :style="{ width: mainBoxWidth + 'px' }">
387 <el-button type="primary" class="saveBtn" @click="onSave" :disabled="disableFlag">保存</el-button>
388 <el-button type="primary" @click="onSubmit" :disabled="disableFlag">提交</el-button>
389 <!-- <el-button type="primary" @click="registerCall">登记调用</el-button> -->
390 </div>
391 </div>
392
393 </template>
394
395 <script>
396 import Qlr from "@/components/formMenu/qlr";
397 import Qlxz from "@/components/formMenu/qlxz";
398 // import { getQjHDetailByBsm, updateQjH } from "@api/h";
399 // import { getBdcdyh } from "@api/zrz";
400 // import { submit, registerCall } from "@api/common"
401 export default {
402 name: 'zrz',
403 components: {
404 Qlr,
405 Qlxz,
406 },
407 inject: ['getTreeByBsm'],
408 props: {
409 bsm: String, //户标识码
410 scyclx: {
411 type: String,
412 default: "1",
413 }
414 },
415 data () {
416 return {
417 disableFlag: false,
418 //树型结构
419 show: true,
420 clearable: true,
421 defaultExpandAll: true,
422 multiple: false,
423 placeholder: '请选择',
424 disabled: false,
425 checkStrictly: true,
426 treeProps: {
427 value: 'bsm',
428 children: 'children',
429 label: 'mc'
430 },
431
432 lx: 'h',
433 hbsm: '',
434 form: {
435 bsm: '',//户标识码
436 zrzbsm: '', //自然幢标识码
437 ljzbsm: '', //逻辑幢标识码
438 ljzh: '', //逻辑幢号
439 zdybsm: '', //幢单元标识码
440 cbsm: '', //层标识码
441 ch: '', //层号
442 zdbsm: '', //宗地标识码
443 bdcdyh: '', //不动产单元号标识码
444 ydybsm: '', //原单元标识码
445 zrzh: '', //自然幢号
446 mjdwbsm: '', //面积单位编号
447 sjcs: '', //实际层数
448 hh: '', //户号
449 hxbsm: '', //户型标识码
450 hxjgbsm: '', //户型结构标识码
451 dltdmj: '', //独立使用土地面积
452 fttdmj: '', //分摊土地使用面积
453 gytdmj: '', //共有土地面积
454 fwlxbsm: '', //房屋类型标识码
455 fwxzbsm: '', //房屋性质标识码
456 sjc: '', //实际层
457 dqtgs: '', //东墙体归属
458 nqtgs: '', //南墙体归属
459 xqtgs: '', //西墙体归属
460 bqtgs: '', //北墙体归属
461 fwbh: '', //房屋编号
462 fjsm: '', //附加说明
463 fwcbbsm: '', //房屋产别标识码
464 sjhs: '', //实际户数
465 shbw: '', //室号部位
466 fwcqlybsm: '', //房屋产权来源标识码
467 myc: '', //名义层
468 qszt: '', //权属状态
469
470 //预测数据
471 ycjzmj: '', //建筑面积
472 yctnjzmj: '', //套内建筑面积
473 ycftjzmj: '', //分摊建筑面积
474 ycdxbfjzmj: '', //地下部分建筑面积
475 ycqtjzmj: '', //其它建筑面积
476 ycftxs: '', //分摊系数
477
478 //实测数据
479 scjzmj: '', //建筑面积
480 sctnjzmj: '', //套内建筑面积
481 scftjzmj: '', //分摊建筑面积
482 scdxbfjzmj: '', //地下部分建筑面积
483 scqtjzmj: '', //其它建筑面积
484 scftxs: '', //分摊系数
485
486 scyclx: '0', //实预测类型(0:预测，1:实测;),区别户是实测还是预测数据
487 scycglbsm: '', //实测预测关联标识码
488 bz: '', //备注
489 name: '',
490 date: '',
491 fwytList: [{
492 glbsm: '', //关联标识码
493 fwytzdbsm: '', //房屋用途字典标识码
494 sx: '', //顺序
495 fwsjytbsm: '', //房屋实际用途字典标识码
496 }],
497 fwjgList: [{
498 fwjgzdbsm: '', //房屋结构字典标识码
499 glbsm: '', //关联标识码
500 sx: '', //顺序
501 }],
502 qlxzList: [{
503 qlxzdm: '', //权利性质代码
504 glbsm: '', //宗地BSM、自然幢BSM、户BSM、多幢BSM、宗海BSM
505 qlxzzdbsm: '', //权利性质字典表标识码
506 qlxzmc: '', //权利名称名称
507 zhqlxzlx: '', //除宗海数据外，默认都是空；0:用海类型权利性质;2:海岛用途权利性质
508 addQjTdytRequestList: [{
509 }], //土地用途新增实体列表
510 }]
511 },
512 value: '',
513 ytTitleRowspan: 1, //用途的单元格垂直合并数量
514 fwjgTitleRowspan: 1, //房屋结构的单元格垂直合并数量
515 formHeight: 0,
516 mainBoxWidth: 0,
517
518 rules: [],
519 ftxsrules: [],
520 }
521 },
522 created () {
523 if (this.bsm) {
524 // this.getHInfo(this.bsm);
525 }
526 this.$nextTick(() => {
527 this.mainBoxWidth = this.$refs.mainBox.clientWidth;
528 this.formHeight = (document.documentElement.clientHeight || document.body.clientHeight) - 260
529 })
530 },
531 methods: {
532
533 inputFtxsBlur (e) {
534 if (e.target.value !== '' && +e.target.value > 0 && +e.target.value < 10) {
535 e.target.style.border = ""
536 } else {
537 e.target.style.border = "1px solid red";
538 e.target.style.boxSizing = 'border-box';
539 }
540 },
541
542 inputBlur (e) {
543 if (e.target.value != '') {
544 e.target.style.border = ""
545 } else {
546 e.target.style.border = "1px solid red";
547 e.target.style.boxSizing = 'border-box';
548 }
549 },
550
551 // registerCall () {
552 // let data = {
553 // type: 'h',
554 // bsm: this.bsm
555 // }
556 // registerCall(data).then(res => {
557 // if (res.success) {
558 // this.$message.success("登记成功")
559 // // if(this.lpbParent === 'isLpb'){
560 // lpbContent.loadingData(this.form.zrzbsm, this.form.scyclx);
561 // // }
562 // this.getTreeByBsm(this.$store.state.zdbsm, 'h', '0,1,2')
563 // }
564 // })
565 // },
566
567 updateSjfyyt (data) {
568 data.fwsjytbsm = data.fwytzdbsm;
569 },
570
571 addYtInfo () {
572 this.form.fwytList.push({
573 glbsm: '',
574 fwytzdbsm: '',
575 fwsjytbsm: '',
576 sx: '',
577 });
578 this.ytTitleRowspan = this.form.fwytList.length;
579 },
580 deleteYtInfo (index) {
581 if (this.form.fwytList.length <= 1) {
582 this.$message({
583 message: '不能删除，最少含有一条用途信息',
584 type: 'warning'
585 });
586 } else {
587 this.form.fwytList.splice(index, 1);
588 this.ytTitleRowspan = this.form.fwytList.length;
589 }
590 },
591 addFwjgInfo () {
592 this.form.fwjgList.push({
593 fwjgzdbsm: '', //房屋结构字典标识码
594 glbsm: '', //关联标识码
595 sx: '', //顺序
596 });
597 this.fwjgTitleRowspan = this.form.fwjgList.length;
598 },
599 deleteFwjgInfo (index) {
600 if (this.form.fwjgList.length <= 1) {
601 this.$message({
602 message: '不能删除，最少含有一条房屋结构信息',
603 type: 'warning'
604 });
605 } else {
606 this.form.fwjgList.splice(index, 1);
607 this.fwjgTitleRowspan = this.form.fwjgList.length;
608 }
609 },
610 //根据户bsm查询户信息
611 getHInfo (hbsm) {
612 //this.bsm = hbsm;
613 // getQjHDetailByBsm(hbsm).then((res) => {
614 // if (res.code === 200) {
615 // this.form = res.result;
616 // this.hbsm = res.result.bsm;
617 // if (res.result.gygyqlrqk != null) {
618 // this.$refs.qlrxxModule.changeGyfs(res.result.gygyqlrqk);
619 // }
620 // this.$refs.qlrxxModule.getQlrInfo(hbsm);
621 // if (this.form.bblx === 0 && this.form.qszt === '0' && this.form.bhqkbsm == null) {
622 // this.disableFlag = false
623 // } else {
624 // this.disableFlag = true
625 // }
626 // if (this.form.scyclx === '0') {
627 // this.$set(this.form, "ycjzmj", this.form.jzmj)
628 // this.$set(this.form, "yctnjzmj", this.form.tnjzmj)
629 // this.$set(this.form, "ycftjzmj", this.form.ftjzmj)
630 // this.$set(this.form, "ycdxbfjzmj", this.form.dxbfjzmj)
631 // this.$set(this.form, "ycqtjzmj", this.form.qtjzmj)
632 // this.$set(this.form, "ycftxs", this.form.ftxs)
633 // this.$set(this.form, "scjzmj", this.form.gljzmj)
634 // this.$set(this.form, "sctnjzmj", this.form.gltnjzmj)
635 // this.$set(this.form, "scftjzmj", this.form.glftjzmj)
636 // this.$set(this.form, "scdxbfjzmj", this.form.gldxbfjzmj)
637 // this.$set(this.form, "scqtjzmj", this.form.glqtjzmj)
638 // this.$set(this.form, "scftxs", this.form.glftxs)
639 // } else if (this.form.scyclx === '1') {
640 // this.$set(this.form, "scjzmj", this.form.jzmj)
641 // this.$set(this.form, "sctnjzmj", this.form.tnjzmj)
642 // this.$set(this.form, "scftjzmj", this.form.ftjzmj)
643 // this.$set(this.form, "scdxbfjzmj", this.form.dxbfjzmj)
644 // this.$set(this.form, "scqtjzmj", this.form.qtjzmj)
645 // this.$set(this.form, "scftxs", this.form.ftxs)
646 // this.$set(this.form, "ycjzmj", this.form.gljzmj)
647 // this.$set(this.form, "yctnjzmj", this.form.gltnjzmj)
648 // this.$set(this.form, "ycftjzmj", this.form.glftjzmj)
649 // this.$set(this.form, "ycdxbfjzmj", this.form.gldxbfjzmj)
650 // this.$set(this.form, "ycqtjzmj", this.form.glqtjzmj)
651 // this.$set(this.form, "ycftxs", this.form.glftxs)
652
653 // }
654 // if (res.result.fwytList.length === 0) {
655 // this.form.fwytList.push({
656 // glbsm: '', //关联标识码
657 // fwytzdbsm: '', //房屋用途字典标识码
658 // sx: '', //顺序
659 // fwsjytbsm: '', //房屋实际用途字典标识码
660 // })
661 // }
662 // if (res.result.fwjgList.length === 0) {
663 // this.form.fwjgList.push({
664 // fwjgzdbsm: '', //房屋结构字典标识码
665 // glbsm: '', //关联标识码
666 // sx: '', //顺序
667 // })
668 // }
669 // this.fwjgTitleRowspan = this.form.fwjgList.length;
670 // this.ytTitleRowspan = this.form.fwytList.length;
671 // if (res.result.qjQlxzListVOS.length > 0) {
672 // if (res.result.qjQlxzListVOS[0].list.length < 1) {
673 // res.result.qjQlxzListVOS[0].list.push({
674 // "pzdjbsm": "",
675 // "pzdjmc": "",
676 // "pzytdm": "",
677 // "pzytmc": "",
678 // "pzytmj": 0,
679 // "qlxzbsm": "",
680 // "sjdjbsm": "",
681 // "sjdjmc": "",
682 // "sjytdm": "",
683 // "sjytmc": "",
684 // "sjytmj": 0,
685 // "syqx": "",
686 // "tdsyjssj": "",
687 // "tdsyqssj": "",
688 // "tdzh": ""
689 // })
690 // }
691 // //权利性质数据传给子组件
692 // this.$refs.qlxzModule.countList = res.result.qjQlxzListVOS
693 // } else {
694 // this.$refs.qlxzModule.countList = [
695 // {
696 // id: Math.random(),
697 // isInside: false,
698 // hasNotBorder: false,
699 // "bsm": "",//权利性质标识码
700 // "glbsm": "",//宗地BSM、自然幢BSM、户BSM、多幢BSM、宗海BSM
701 // "qlxzdm": "",
702 // "zhqlxzlx": "", //除宗海数据外，默认都是空；0:用海类型权利性质;2:海岛用途权利性质
703 // list: [
704 // {
705 // "pzdjbsm": "",
706 // "pzdjmc": "",
707 // "pzytdm": "",
708 // "pzytmc": "",
709 // "pzytmj": 0,
710 // "qlxzbsm": "",
711 // "sjdjbsm": "",
712 // "sjdjmc": "",
713 // "sjytdm": "",
714 // "sjytmc": "",
715 // "sjytmj": 0,
716 // "syqx": "",
717 // "tdsyjssj": "",
718 // "tdsyqssj": "",
719 // "tdzh": ""
720 // }
721 // ]
722 // },
723 // ]
724 // }
725 // }
726 // })
727 },
728 //保存户信息
729 onSave () {
730
731 if (this.form.scyclx === '0') {
732 this.ftxsrules = [
733 {
734 data: this.form.ycftxs,
735 name: '不动产单元号',
736 dom: this.$refs.ycftxs,
737 rule: /^(?!0(\.0{1,2})?$)(\d(\.\d{1,2})?)$/, //大于0小于10的所有保留两位的数字
738 },
739 ]
740 } else {
741 this.ftxsrules = [
742 {
743 data: this.form.scftxs,
744 name: '不动产单元号',
745 dom: this.$refs.scftxs,
746 rule: /^(?!0(\.0{1,2})?$)(\d(\.\d{1,2})?)$/, //大于0小于10的所有保留两位的数字
747 },
748 ]
749 }
750
751
752 this.rules = [
753 {
754 data: this.form.bdcdyh,
755 name: '不动产单元号',
756 dom: this.$refs.bdcdyh,
757 rule: /^\s*$/g, //非空
758 },
759 {
760 data: this.form.fwlxbsm,
761 name: '房屋类型',
762 dom: this.$refs.fwlxbsm,
763 rule: /^\s*$/g, //非空
764 },
765 {
766 data: this.form.fwxzbsm,
767 name: '房屋性质',
768 dom: this.$refs.fwxzbsm,
769 rule: /^\s*$/g, //非空
770 },
771 {
772 data: this.form.fwcbbsm,
773 name: '产别',
774 dom: this.$refs.fwcbbsm,
775 rule: /^\s*$/g, //非空
776 },
777 {
778 data: this.form.fwcqlybsm,
779 name: '产权来源',
780 dom: this.$refs.fwcqlybsm,
781 rule: /^\s*$/g, //非空
782 },
783 {
784 data: this.form.zl,
785 name: '坐落',
786 dom: this.$refs.zl,
787 rule: /^\s*$/g, //非空
788 },
789 ]
790 this.form.fwytList.forEach((item, index) => {
791 this.rules.push(
792 {
793 data: item.fwytzdbsm,
794 name: '规划用途',
795 dom: this.$refs.ghyt[index],
796 rule: /^\s*$/g, //非空
797 },
798 {
799 data: item.fwytzdbsm,
800 name: '用途',
801 dom: this.$refs.yt[index],
802 rule: /^\s*$/g, //非空
803 },
804 )
805 })
806 this.form.fwjgList.forEach((item, index) => {
807 this.rules.push(
808 {
809 data: item.fwjgzdbsm,
810 name: '房屋结构',
811 dom: this.$refs.fwjg[index],
812 rule: /^\s*$/g, //非空
813 },
814 )
815 })
816 this.form.qlxzList = this.$refs.qlxzModule.getQlxzDataList();
817 this.$refs.qlxzModule.getRules();
818 let flag = true;
819
820 this.rules.forEach(item => {
821 if (item.rule.test(item.data) || item.data == null) {
822 if (item.dom.$el) {
823 item.dom.$el.style.border = '1px solid red';
824 item.dom.$el.style.boxSizing = 'border-box';
825 } else {
826 item.dom.style.border = '1px solid red';
827 item.dom.style.boxSizing = 'border-box';
828 }
829 flag = false;
830 return false
831 }
832 })
833 let ftxsflag = true;
834 this.ftxsrules.forEach(item => {
835 console.log(item.data + ":item.data")
836 console.log(item.data !== "" + ":item.data !==")
837 if (item.data !== "" && item.data !== null) {
838 if (!item.rule.test(+item.data) || item.data == null) {
839 if (item.dom.$el) {
840 item.dom.$el.style.border = '1px solid red';
841 item.dom.$el.style.boxSizing = 'border-box';
842 } else {
843 item.dom.style.border = '1px solid red';
844 item.dom.style.boxSizing = 'border-box';
845 }
846 ftxsflag = false;
847 return false
848 }
849 }
850 })
851
852 this.$nextTick(() => {
853 if (flag && ftxsflag && this.$refs.qlxzModule.getRulesResult()) {
854 if (this.form.scyclx === '0') {
855 this.form.jzmj = this.form.ycjzmj;
856 this.form.tnjzmj = this.form.yctnjzmj;
857 this.form.ftjzmj = this.form.ycftjzmj;
858 this.form.dxbfjzmj = this.form.ycdxbfjzmj;
859 this.form.qtjzmj = this.form.ycqtjzmj;
860 this.form.ftxs = this.form.ycftxs;
861 } else if (this.form.scyclx === '1') {
862 this.form.jzmj = this.form.scjzmj;
863 this.form.tnjzmj = this.form.sctnjzmj;
864 this.form.ftjzmj = this.form.scftjzmj;
865 this.form.dxbfjzmj = this.form.scdxbfjzmj;
866 this.form.qtjzmj = this.form.scqtjzmj;
867 this.form.ftxs = this.form.scftxs;
868 }
869 vm.loadingShow('请求发送中');
870 // updateQjH(this.form).then((res) => {
871 // vm.loadingHide();
872 // if (res.code === 200) {
873 // this.$message.success("保存成功！")
874 // console.log(this, "this")
875 // } else {
876 // this.$message.warning(res.message)
877 // }
878 // })
879 // .catch((error) => {
880 // vm.loadingHide();
881 // console.log(error);
882 // });
883 } else {
884 this.$message({
885 // message: item.name+'不能为空',
886 message: '表单数据有误',
887 type: "warning",
888 });
889 }
890 })
891
892 },
893 onSubmit () {
894 let data = {
895 glbsm: this.bsm,
896 status: 1,
897 type: "h"
898 }
899 // submit(data).then((res) => {
900 // if (res.code === 200) {
901 // this.$message.success("提交完成！");
902 // // if(this.lpbParent === 'isLpb'){
903 // lpbContent.loadingData(this.form.zrzbsm, this.form.scyclx);
904 // // }
905 // } else {
906 // this.$message.warning(res.message)
907 // }
908 // })
909 },
910 onReset () {
911 this.form.bdcdyh = '', //不动产单元号
912 this.form.mjdwbsm = '', //面积单位编号
913 this.form.hxbsm = '', //户型标识码
914 this.form.hxjgbsm = '', //户型结构标识码
915 this.form.dltdmj = '', //独立使用土地面积
916 this.form.fttdmj = '', //分摊土地使用面积
917 this.form.gytdmj = '', //共有土地面积
918 this.form.fwlxbsm = '', //房屋类型标识码
919 this.form.fwxzbsm = '', //房屋性质标识码
920 this.form.sjc = '', //实际层
921 this.form.dqtgs = '', //东墙体归属
922 this.form.nqtgs = '', //南墙体归属
923 this.form.xqtgs = '', //西墙体归属
924 this.form.bqtgs = '', //北墙体归属
925 this.form.fwbh = '', //房屋编号
926 this.form.fjsm = '', //附加说明
927 this.form.fwcbbsm = '', //房屋产别标识码
928 this.form.sjhs = '', //实际户数
929 this.form.shbw = '', //室号部位
930 this.form.fwcqlybsm = '', //房屋产权来源标识码
931 //预测数据
932 this.form.ycjzmj = '', //建筑面积
933 this.form.yctnjzmj = '', //套内建筑面积
934 this.form.ycftjzmj = '', //分摊建筑面积
935 this.form.ycdxbfjzmj = '', //地下部分建筑面积
936 this.form.ycqtjzmj = '', //其它建筑面积
937 this.form.ycftxs = '', //分摊系数
938 //实测数据
939 this.form.scjzmj = '', //建筑面积
940 this.form.sctnjzmj = '', //套内建筑面积
941 this.form.scftjzmj = '', //分摊建筑面积
942 this.form.scdxbfjzmj = '', //地下部分建筑面积
943 this.form.scqtjzmj = '', //其它建筑面积
944 this.form.scftxs = '', //分摊系数
945 this.form.scyclx = '0', //实预测类型(0:预测，1:实测;),区别户是实测还是预测数据
946 this.form.scycglbsm = '', //实测预测关联标识码
947 this.form.bz = '', //备注
948 this.form.name = '',
949 this.form.date = '',
950 this.form.fwytList = [{
951 glbsm: '', //关联标识码
952 fwytzdbsm: '', //房屋用途字典标识码
953 sx: '', //顺序
954 fwsjytbsm: '', //房屋实际用途字典标识码
955 }],
956 this.form.fwjgList = [{
957 fwjgzdbsm: '', //房屋结构字典标识码
958 glbsm: '', //关联标识码
959 sx: '', //顺序
960 }],
961 this.form.qlxzList = [{
962 qlxzdm: '', //权利性质代码
963 glbsm: '', //宗地BSM、自然幢BSM、户BSM、多幢BSM、宗海BSM
964 qlxzzdbsm: '', //权利性质字典表标识码
965 qlxzmc: '', //权利名称名称
966 zhqlxzlx: '', //除宗海数据外，默认都是空；0:用海类型权利性质;2:海岛用途权利性质
967 addQjTdytRequestList: [{
968 }], //土地用途新增实体列表
969 }]
970 console.log("----------------------------------")
971 console.log(this.form)
972 },
973
974 //不动产单元号再次生成提示框
975 open () {
976 this.$confirm('已经存在不动产单元号或者自然幢号, 是否继续?', '提示', {
977 confirmButtonText: '确定',
978 cancelButtonText: '取消',
979 type: 'warning'
980 }).then(() => {
981 // getBdcdyh(this.form.zrzh, "h")
982 // .then((res) => {
983 // this.form.zrzh = res.result.substring(0, 24);
984 // this.form.bdcdyh = res.result;
985 // })
986 this.$message({
987 type: 'success',
988 message: '生成成功!'
989 });
990 }).catch(() => {
991 this.$message({
992 type: 'info',
993 message: '已取消'
994 });
995 });
996 },
997
998 generatorCode () {
999 if (this.form.bdcdyh != null && this.form.bdcdyh !== '') {
1000 this.open();
1001 return;
1002 }
1003 // getBdcdyh(this.form.zrzh, "h")
1004 // .then((res) => {
1005 // this.form.zrzh = res.result.substring(0, 24);
1006 // this.form.bdcdyh = res.result;
1007 // })
1008 },
1009 },
1010 watch: {
1011 scyclx: {
1012 handler (n) {
1013 this.$nextTick(() => {
1014 this.form.scyclx = this.scyclx;
1015 })
1016 }
1017 },
1018
1019 "form.bdcdyh": function (val) {
1020 if (val != '') {
1021 this.$refs.bdcdyh.$el.style.border = '';
1022 }
1023 },
1024
1025 "form.fwlxbsm": {
1026 handler: function (val) {
1027 if (val != '') {
1028 this.$refs.fwlxbsm.$el.style.border = '';
1029 }
1030 },
1031 immediate: false
1032 },
1033
1034 "form.fwxzbsm": {
1035 handler: function (val) {
1036 if (val != '') {
1037 this.$refs.fwxzbsm.$el.style.border = '';
1038 }
1039 },
1040 immediate: false
1041 },
1042
1043 "form.fwcqlybsm": {
1044 handler: function (val) {
1045 if (val != '') {
1046 this.$refs.fwcqlybsm.$el.style.border = '';
1047 }
1048 },
1049 immediate: false
1050 },
1051
1052 "form.fwcbbsm": {
1053 handler: function (val) {
1054 if (val != '') {
1055 this.$refs.fwcbbsm.$el.style.border = '';
1056 }
1057 },
1058 immediate: false
1059 },
1060
1061 "form.fwytList": {
1062 handler: function (newVal, oldVal) {
1063 newVal.forEach((item, ind) => {
1064 if (item.fwytzdbsm != '') {
1065 this.$refs.ghyt[ind].$el.style.border = ""
1066 this.$refs.yt[ind].$el.style.border = ""
1067 }
1068 })
1069 },
1070 deep: true
1071 },
1072 "form.fwjgList": {
1073 handler: function (newVal, oldVal) {
1074 newVal.forEach((item, ind) => {
1075 if (item.fwjgzdbsm != '') {
1076 this.$refs.fwjg[ind].$el.style.border = ""
1077 }
1078 })
1079 },
1080 deep: true
1081 },
1082
1083 "$store.state.sxdrType": {
1084 handler (n) {
1085 this.$nextTick(() => {
1086 if (n === 'h') {
1087 this.getHInfo(this.$store.state.hbsm)
1088 }
1089 })
1090 },
1091 immediate: false,
1092 deep: true,
1093 }
1094 }
1095 }
1096 </script>
1097 <style rel="stylesheet/scss" lang="scss" scoped>
1098 .h {
1099 height: 100%;
1100 width: 100%;
1101 margin-top: 10px;
1102 overflow-y: scroll;
1103 overflow-x: hidden;
1104
1105 /deep/.el-input__inner {
1106 width: 100%;
1107 border: 0;
1108 }
1109
1110 /deep/textarea {
1111 width: 100%;
1112 border: 0;
1113 }
1114
1115
1116 .el-form-item {
1117 font-weight: bold;
1118 font-size: xx-large
1119 }
1120
1121 table {
1122 background: #fff;
1123 table-layout: fixed;
1124 }
1125
1126 td {
1127 //bgcolor:#F1F4FC;
1128 width: 8.33%;
1129 height: 36px;
1130 text-align: right;
1131 }
1132
1133 .el-select {
1134 display: block;
1135 }
1136
1137 .form {
1138 overflow-y: scroll;
1139 overflow-x: hidden;
1140 margin-bottom: 30px;
1141 }
1142 }
1143
1144 .hpage {
1145 box-sizing: border-box;
1146 padding: 8px 6px 18px 18px;
1147 }
1148
1149 table {
1150 font-size: 14px;
1151 }
1152
1153 .hTable {
1154 margin-top: 10px;
1155 }
1156
1157 /deep/.el-select-tree {
1158 width: 100%;
1159
1160 .el-input__inner {
1161 height: 30px !important;
1162 }
1163 }
1164
1165 .header-button {
1166 z-index: 3;
1167 height: 50px;
1168 position: absolute;
1169 bottom: 0;
1170 right: 6px;
1171 text-align: center;
1172 background-color: #ffffff;
1173
1174 .el-button {
1175 padding: 10px 30px;
1176 margin-top: 8px;
1177 }
1178
1179 .saveBtn {
1180 background-color: #00CACD;
1181 border-color: #00CACD;
1182 }
1183
1184 .saveBtn:hover {
1185 background-color: rgba(0, 202, 205, .8);
1186 border-color: rgba(0, 202, 205, .8);
1187 }
1188 }
1189 </style>
1 <template>
2 <el-tabs v-model="activeName" @tab-click="handleClick">
3 <el-tab-pane label="户基本信息表" name="hjbxx">
4 <hbj ref="hbj" :bsm="hbsm"></hbj>
5 </el-tab-pane>
6 <el-tab-pane label="登记簿" name="djb">
7 <!-- <djb v-if="djbVisible" :style="{ 'height': formHeight + 'px' }"></djb> -->
8 </el-tab-pane>
9 <el-tab-pane label="附件材料" name="fjcl">
10 <!-- <fjcl v-if="fjclVisible" ref="fjcl" :lpbParent="true" :style="{ 'height': formHeight + 'px' }"
11 :is-disabled="isDisabled"></fjcl> -->
12 </el-tab-pane>
13 </el-tabs>
14 </template>
15
16 <script>
17 import hbj from "../index"
18 // import djb from "../../../../../zd/djb/index";
19 // import fjcl from "../../../../../zd/fjcl/fjcl"
20 // import { queryStatus } from "@api/search"
21 export default {
22 name: "index",
23 components: {
24 hbj, djb, fjcl
25 },
26 props: {
27 bsm: String, //户标识码
28 },
29 data () {
30 return {
31 isDisabled: false,
32 hbsm: this.$store.state.hbsm,
33 activeName: "hjbxx",
34 djbVisible: false,
35 fjclVisible: false,
36 formHeight: 0,
37 }
38 },
39 mounted () {
40 this.formHeight = (document.documentElement.clientHeight || document.body.clientHeight) - 260
41 },
42 methods: {
43 loadingStatus () {
44 let bsm = this.$store.state.hbsm;
45 // queryStatus(bsm).then(res => {
46 // if (res.success) {
47 // let qszt = res.result.qszt;
48 // this.isDisabled = +qszt !== 0;
49 // }
50 // })
51 },
52 handleClick (tab, event) {
53 this.loadingStatus()
54 // console.log(tab, event);
55 switch (tab.name) {
56 case 'djb':
57 this.djbVisible = true;
58 break;
59 case 'fjcl':
60 this.fjclVisible = true;
61 break;
62 default:
63 break;
64 }
65 },
66 },
67 watch: {}
68 }
69 </script>
70
71 <style scoped lang="scss">
72 .el-tabs {
73 /deep/.el-tabs__nav-scroll {
74 margin-left: -35px;
75 }
76 }
77 </style>
1 <template>
2 <div class="edit">
3 <!-- <div class="tab-header">
4 <el-row class="searchContent">
5 <el-col :span="24" style="margin:0 0 10px 18px;">
6 <el-radio-group v-model="scyclx" @change="scyclxChange">
7 <el-radio-button label="0">预测</el-radio-button>
8 <el-radio-button label="1">实测</el-radio-button>
9 </el-radio-group>
10 <el-input maxlength="28" v-model="bdcdyh" :style="{ width: inputWidth + 'px' }" class="searchInput"
11 placeholder="输入不动产单元号或室号"><i slot="suffix" class="el-input__icon el-icon-search" @click="inputChange"></i>
12 </el-input>
13 </el-col>
14 </el-row>
15 <el-row class="searchContent">
16 <el-col :span="24">
17 <div class="fl">
18 <el-button class="radioBtn" label="1" border @click="create"><i
19 class="iconfont iconchuangjianloupan"></i>创建楼盘</el-button>
20 <el-button class="radioBtn" v-show='this.scyclx == "0"' label="2" border @click="plScYcChange"><i
21 class="iconfont iconshiyucezhuanhuan"></i>预测转实测</el-button>
22 <el-button class="radioBtn" v-show='this.scyclx == "1"' label="2" border @click="plScYcChange"><i
23 class="iconfont iconshiyucezhuanhuan"></i>实测转预测</el-button>
24 <el-button class="radioBtn" label="3" border @click="openPl('h')"><i class="iconfont iconpilianghu"></i> 批量户
25 </el-button>
26 <el-button class="radioBtn" label="4" border @click="openPlC"><i class="iconfont iconpiliangceng"></i>批量层
27 </el-button>
28 <el-button class="radioBtn" label="5" border @click="openPl('sh')"><i
29 class="iconfont iconpiliangshihao"></i>批量室号</el-button>
30 <el-button class="radioBtn" label="6" border @click="openPl('zl')"><i
31 class="iconfont iconpiliangzuola"></i>批量坐落</el-button>
32 <el-button class="radioBtn" label="7" border @click="addBdcdyh"><i
33 class="iconfont iconpiliangdanyuanhao"></i>批量单元号</el-button>
34 <el-button class="radioBtn" label="7" border @click="batchCommit"><i
35 class="iconfont iconhuzhongxinlazong"></i>批量提交</el-button>
36 <el-button class="radioBtn" label="7" border @click="batchDelete"><i class="iconfont iconshanchu"></i>批量删除
37 </el-button>
38 <el-button class="radioBtn" label="7" border @click="batchUpload"><i
39 class="iconfont iconshangchuan"></i>批量上传</el-button>
40 <el-button class="radioBtn" label="7" border @click="batchCancelChoosed"><i
41 class="iconfont iconquxiaoxuanze"></i>取消选中</el-button>
42 </div>
43 </el-col>
44 </el-row>
45 <div class="change">
46 <i class="iconfont iconloupanbiaoxinxi" v-show="bjztFlag" @click="bjztChange" title="详细信息"></i>
47 <i class="iconfont iconloupanbiaobianji" v-show="!bjztFlag" @click="bjztChange" title="编辑楼盘"></i>
48 </div>
49 </div> -->
50 <div class="tab-content" ref="tabContent" :style="{ height: lpbContentHight + 'px' }" v-loading="lpbloading"
51 v-show="bjztFlag">
52 <!-- 左侧树结构 -->
53 <!-- <div class="lp-tree" :class="createFlag ? 'w260' : 'w0'">
54 <LineTree :pd="pd" class="treeData" :islpb="islpb" @loading="loading"></LineTree>
55 <p @click="createFlag = false" style="width:20px;float:left;margin-top: 12px;margin-left:10px;cursor:pointer;">
56 X
57 </p>
58 </div> -->
59 <!-- 楼盘表主体 -->
60 <div class="lp-overview" :style="{ width: lpbContentwidth + 'px' }">
61 <lpbContent ref="lpbContent" :zrzbsm="$route.query.bsm" :key="time"></lpbContent>
62 </div>
63 <!-- 右侧图例 -->
64 <div class="lp-legend">
65 <div class="handleCol">
66 <div class="btn" @click="legendToggle">
67 <i v-show="!legendToggleFlag" class="el-icon-d-arrow-left"></i>
68 <i v-show="legendToggleFlag" class="el-icon-d-arrow-right"></i>
69 </div>
70 <div :class="selectedZt == 'dyzt' ? 'dyzt selectedZt' : 'dyzt'" @click="selectedZt = 'dyzt'">
71 <span>单元状态</span>
72 </div>
73 <div :class="selectedZt == 'fwxz' ? 'fwxz selectedZt' : 'fwxz'" @click="selectedZt = 'fwxz'">
74 <span>房屋性质</span>
75 </div>
76 <div :class="selectedZt == 'fwyt' ? 'fwyt selectedZt' : 'fwyt'" @click="selectedZt = 'fwyt'">
77 <span>房屋用途</span>
78 </div>
79 <div :class="selectedZt == 'qsx' ? 'qsx selectedZt' : 'qsx'" @click="selectedZt = 'qsx'">
80 <span>缺失项</span>
81 </div>
82
83 </div>
84 <div class="legendTable-wrap" :style="{ width: legendToggleFlag ? '204px' : '0' }">
85 <table class="legendTable" v-show="selectedZt == 'dyzt'" cellspacing="1" cellpadding="1" border="1">
86 <tr>
87 <th>状态</th>
88 <th>套数</th>
89 <th>面积</th>
90 </tr>
91 <tr v-for="(item, index) in dyztList" :key="index" class="cp"
92 @click="handleChoosedH(item.bsms, item.color)">
93 <td>
94 <i class="fa fa-circle" :style="{ color: item.color }"></i>{{ item.name }}
95 </td>
96 <td>{{ item.ts }}</td>
97 <td>{{ item.mj }}</td>
98 </tr>
99 </table>
100 <table class="legendTable" v-show="selectedZt == 'fwxz'" cellspacing="1" cellpadding="1" border="1">
101 <tr>
102 <th>性质</th>
103 <th>套数</th>
104 <th>面积</th>
105 </tr>
106 <tr v-for="(item, index) in fwxzList" :key="index" class="cp"
107 @click="handleChoosedH(item.bsms, item.color)">
108 <td>
109 <i class="fa fa-circle" :style="{ color: item.color }"></i>{{ item.name }}
110 </td>
111 <td>{{ item.ts }}</td>
112 <td>{{ item.mj }}</td>
113 </tr>
114 <tr v-show="fwxzList.length < 1">
115 <td colspan="3" class="tac">暂无数据</td>
116 </tr>
117 </table>
118
119 <table class="legendTable" v-show="selectedZt == 'fwyt'" cellspacing="1" cellpadding="1" border="1">
120 <tr>
121 <th>用途</th>
122 <th>套数</th>
123 <th>面积</th>
124 </tr>
125 <tr v-for="(item, index) in fwytList" :key="index" class="cp"
126 @click="handleChoosedH(item.bsms, item.color)">
127 <td>
128 <i class="fa fa-circle" :style="{ color: item.color }"></i>{{ item.name }}
129 </td>
130 <td>{{ item.ts }}</td>
131 <td>{{ item.mj }}</td>
132 </tr>
133 <tr v-show="fwytList.length < 1">
134 <td colspan="3" class="tac">暂无数据</td>
135 </tr>
136 </table>
137
138 <table class="legendTable" v-show="selectedZt == 'qsx'" cellspacing="1" cellpadding="1" border="1">
139 <tr>
140 <th>数据缺失项</th>
141 <th>套数</th>
142 <th>面积</th>
143 </tr>
144 <tr v-for="(item, index) in qsxList" :key="index" class="cp" @click="handleChoosedH(item.bsms, item.color)">
145 <td>
146 <i class="fa fa-circle" :style="{ color: item.color }"></i>{{ item.name }}
147 </td>
148 <td>{{ item.ts }}</td>
149 <td>0</td>
150 </tr>
151 <tr v-show="qsxList.length < 1">
152 <td colspan="3" class="tac">暂无数据</td>
153 </tr>
154 </table>
155 </div>
156 </div>
157 </div>
158 <!-- 详细信息 -->
159 <!-- <xxxx v-show="!bjztFlag"></xxxx> -->
160 <!-- 右键菜单弹出框 根据菜单类型（menuType）和右键点击的楼盘类型（treeData.type）来区分弹框内容 -->
161 <!-- <el-dialog v-dialogDrag :close-on-click-modal="false" :title="taskTitle" :visible.sync="dialogVisible" width="50%">
162 <div class="addCh" v-if="menuType == 'ljz'">
163 <addLjz ref="ljz" :ljzbsm="curBsm"></addLjz>
164 </div>
165 <div class="addCh" v-if="menuType == 'zdy'">
166 <addZdy ref="zdy" :zdybsm="curBsm"></addZdy>
167 </div>
168 <div class="addCh" v-if="menuType == 'c'">
169 <editCinfo ref="c" :cbsm="curBsm"></editCinfo>
170 </div>
171 <div class="addCh" v-if="menuType == 'ch'">
172 <addCh ref="ch" :scyclx="scyclx" :dialogVisible="dialogVisible" :treeData="treeData"></addCh>
173 </div>
174 <div class="btnGroup">
175 <el-button type="primary" @click="saveInfo">保存</el-button>
176 <el-button type="primary" @click="resetInfo" icon="el-icon-refresh">重置</el-button>
177 <el-button type="primary" @click="dialogVisible = false">取消</el-button>
178 </div>
179 </el-dialog>
180 批量操作弹出框
181 <pl-h :plh-visible="plhVisible" :bsms="bsms" @close="plhClose" @lodding="lodding"></pl-h>
182 <pl-zl :pl-zl-visible="plzlVisible" :bsms="bsms" @close="plZlClose" @lodding="lodding"></pl-zl>
183 <pl-c :plc-visible="plcVisible" :bsms="cbsmList" @close="plcClose" @lodding="lodding"></pl-c>
184 <pl-sh :plShVisible="plShVisible" :bsms="bsms" @close="plshClose" @lodding="lodding"></pl-sh>
185 <el-dialog v-dialogDrag :close-on-click-modal="false" title="批量上传" :visible.sync="uploadVisible" width="30%">
186 <div class="wrap">
187 <div class="main-button">
188 <el-upload class="upload-demo" action="/api/file/uploadListByGlbsm" :data="fileData"
189 :on-preview="handlePreview" :on-remove="handleRemove" :before-remove="beforeRemove"
190 :before-upload="uploadProgress" :on-success="uploadSuccess" :on-error="uploadError" :show-file-list="false"
191 multiple :limit="1" :on-exceed="handleExceed">
192 <el-button type="primary" icon="iconfont iconshangchuan">上传附件</el-button>
193 </el-upload>
194 </div>
195 <el-button type="primary" class="download" @click="uploadVisible = false">取消</el-button>
196
197 </div>
198 <span slot="footer" class="dialog-footer">
199 </span>
200 </el-dialog> -->
201 </div>
202 </template>
203
204 <script>
205 import { Message } from "element-ui"
206 import PlC from "@/components/plc/plC";
207 import PlSh from "@/components/plsh/plSh";
208 import PlH from "@/components/plh/plH";
209 import PlZl from "@/components/plzl/plZl";
210 // import LineTree from "@/components/lineTree/lineTree";
211 import addLjz from "./ljz/index";
212 import addZdy from "./zdy/index";
213 import addCh from "./ch/index";
214 import editCinfo from "./c/index";
215 import lpbContent from "./lpbContent/index";
216 // import { getLpbMenuTree, batchScYcChange, getLpbTj, batchGeneratorBdcdyh, getLpbFwytAndQlxz, batchCommit, batchDelete, getLpbQsxtj } from "@api/lpb";
217 // import xxxx from '../xxxx/index'
218
219 export default {
220 name: "",
221 components: {
222 // LineTree,
223 addLjz,
224 addZdy,
225 addCh,
226 lpbContent,
227 PlC,
228 PlSh,
229 PlH,
230 PlZl,
231 // xxxx,
232 editCinfo
233 },
234 data () {
235 return {
236 bsms: [],
237 dialogVisible: false,
238 plcVisible: false,
239 plhVisible: false,
240 plShVisible: false,
241 plzlVisible: false,
242 scyclx: "0", //1是实测 0是预测
243 radio1: "",
244 radio2: "",
245 createFlag: false,
246 bdcdyh: "",
247 islpb: true,
248 pd: [], //创建楼盘的树结构数据
249 menuType: "",
250 treeData: {},
251 inputWidth: 200,
252 selectedZt: "dyzt", //图例选中项，默认选中单元状态
253 dyztList: [
254 {
255 name: "未确权",
256 color: "#83AAFE",
257 ts: "12",
258 mj: "1633",
259 },
260 {
261 name: "已确权",
262 color: "#6EDEE1",
263 ts: "22",
264 mj: "3109",
265 },
266 {
267 name: "已备案",
268 color: "#8ADC88",
269 ts: "3",
270 mj: "409",
271 },
272 {
273 name: "预抵押",
274 color: "#F2AD67",
275 ts: "11",
276 mj: "1466",
277 },
278 {
279 name: "在建抵押",
280 color: "#F191C8",
281 ts: "13",
282 mj: "1792",
283 },
284 {
285 name: "抵押",
286 color: "#FF8282",
287 ts: "14",
288 mj: "13",
289 },
290 {
291 name: "查封",
292 color: "#D7CECF",
293 ts: "9",
294 mj: "1436",
295 },
296 {
297 name: "异议",
298 color: "#D4A3EB",
299 ts: "34",
300 mj: "4342",
301 },
302 {
303 name: "限制",
304 color: "#A5A3FB",
305 ts: "2",
306 mj: "285",
307 },
308 ],
309 fwxzList: [],
310 fwytList: [],
311 qsxList: [],
312 legendToggleFlag: false,
313 lpbContentHight: "",
314 lpbContentwidth: "",
315 time: "",
316 dyztBsmList: {}, //单元状态bsmList
317 cbsmList: [], // 层bsmlist
318 lpbloading: true,
319 bjztFlag: true,
320 taskTitle: '添加',
321 curBsm: '',
322 qsztList: [],
323 uploadVisible: false, //批量上传弹框
324 fileData: {
325 glbsmList: [],
326 dylx: 'h'
327 }
328 };
329 },
330 created () {
331 window.addEventListener("resize", this.getHeight);
332 // this.getHeight();
333 },
334 mounted () {
335 //获取楼盘表树结构
336 // this.getLpbMenuTree(this.$store.state.zrzbsm);
337 //获取各项单元状态的户bsm
338 // this.getDyztBsmList();
339 //获取房屋用途统计数据
340 // this.getLpbFwytAndQlxz();
341 // 楼盘表绘制区域宽度计算：楼盘表区域宽度-图例宽度34-滚动条宽度6
342 setTimeout(() => {
343 this.lpbContentwidth = this.$store.state.contentWidth - 34 - 6;
344 }, 100);
345 },
346 methods: {
347 //批量提交
348 batchCommit () {
349 if (this.bsms.length <= 0) {
350 Message.warning("请选择操作户")
351 return
352 } else {
353 if (this.qsztList.indexOf('1') > -1) {
354 Message.warning("已提交的户无法继续操作")
355 } else {
356 batchCommit(this.bsms).then(res => {
357 if (res.code === 200) {
358 Message.success("提交成功");
359 this.getlpbData();
360 } else {
361 this.$message.error(res.message);
362 }
363 })
364 }
365 }
366 },
367 //批量删除
368 batchDelete () {
369 if (this.bsms.length <= 0) {
370 Message.warning("请选择操作户")
371 return
372 } else {
373 if (this.qsztList.indexOf('1') > -1) {
374 Message.warning("已提交的户无法继续操作")
375 } else {
376 batchDelete(this.bsms).then(res => {
377 if (res.code === 200) {
378 Message.success("删除成功");
379 this.getlpbData();
380 } else {
381 this.$message.error(res.message);
382 }
383 })
384 }
385 }
386 },
387 //批量上传 start
388 batchUpload () {
389 if (this.bsms.length < 1) {
390 Message.warning("请选择操作户")
391 return
392 } else {
393 this.uploadVisible = true
394 }
395 },
396 //取消选中
397 batchCancelChoosed () {
398 this.cbsmList = [];
399 this.bsms = [];
400 this.qsztList = [];
401 this.$refs.lpbContent.hbsmList = [];
402 this.$refs.lpbContent.cbsmList = [];
403 this.$refs.lpbContent.choosedList = [];
404 this.$refs.lpbContent.$refs.hBsm.forEach((item) => {
405 item.style.border = '';
406 item.className = "";
407 });
408 this.$refs.lpbContent.$refs.cBsm.forEach((item) => {
409 item.style.border = '';
410 item.className = "";
411 });
412 },
413 uploadError (err, file, fileList) {
414 Message.error("上传文件失败")
415 console.log("上传文件失败", err)
416 },
417 uploadProgress () {
418 vm.loadingShow('正在上传中')
419 },
420 uploadSuccess (res, file, fileList) {
421 vm.loadingHide();
422 Message.success("上传成功")
423 this.uploadVisible = false;
424 },
425 handleRemove (file, fileList) {
426 console.log(file, fileList);
427 },
428 handlePreview (file) {
429 console.log(file);
430 },
431 handleExceed (files, fileList) {
432 console.log(fileList)
433 // this.$message.warning(`当前限制选择 3 个文件，本次选择了 ${files.length} 个文件，共选择了 ${files.length + fileList.length} 个文件`);
434 this.$message.warning("上传失败")
435 },
436 beforeRemove (file, fileList) {
437 return this.$confirm(`确定移除 ${file.name}？`);
438 },
439 //批量上传 end
440
441 loading () {
442 this.getLpbMenuTree(this.$store.state.zrzbsm);
443 },
444 openPlC () {
445 if (this.cbsmList.length <= 0) {
446 Message.warning("请选择层")
447 return
448 }
449 this.plcVisible = true
450 },
451 openPl (val) {
452 if (this.bsms.length <= 0) {
453 Message.warning("请选择操作户")
454 return
455 } else {
456 if (this.qsztList.indexOf('1') > -1) {
457 Message.warning("已提交的户无法继续操作")
458 } else {
459 switch (val) {
460 case 'h':
461 this.plhVisible = true;
462 break;
463 case 'zl':
464 this.plzlVisible = true;
465 break;
466 case 'sh':
467 this.plShVisible = true;
468 break;
469 default:
470 break;
471 }
472 }
473 }
474 },
475 lodding () {
476 this.getlpbData();
477 },
478 plZlClose () {
479 this.plzlVisible = false;
480 },
481 plcClose () {
482 this.plcVisible = false;
483 },
484 plhClose () {
485 this.plhVisible = false;
486 },
487 plshClose () {
488 this.plShVisible = false;
489 },
490 //改变编辑或详细信息状态
491 bjztChange () {
492 this.bjztFlag = !this.bjztFlag;
493 },
494 //改变实预测数据类型
495 scyclxChange (val) {
496 //清空已选中层户
497 this.cbsmList = [];
498 this.bsms = [];
499 this.qsztList = [];
500 this.$refs.lpbContent.hbsmList = [];
501 this.$nextTick(() => {
502 //户
503 if (this.$refs.lpbContent.$refs.hBsm) {
504 this.$refs.lpbContent.$refs.hBsm.forEach(item => {
505 item.style.borderColor = 'rgb(230, 230, 230)';
506 if (item.className == "tdSelect") {
507 item.className = "";
508 }
509 });
510 }
511 //层
512 if (this.$refs.lpbContent.$refs.cBsm) {
513 this.$refs.lpbContent.$refs.cBsm.forEach(item => {
514 console.log(item.className, 'item.className');
515 item.className = "floor";
516 });
517 }
518 })
519 //获取图例数据
520 this.getDyztBsmList();
521 this.getLpbFwytAndQlxz();
522 //重新渲染楼盘表
523 this.$refs.lpbContent.dataChange();
524 },
525 //获取高度计算lpb内容区高度
526 getHeight () {
527 this.lpbContentHight = window.innerHeight - 285;
528 },
529 //创建楼盘
530 create () {
531 this.createFlag = true;
532 },
533 //获取自然幢树结构数据
534 getLpbMenuTree (zrzbsm) {
535 getLpbMenuTree(zrzbsm)
536 .then((res) => {
537 this.pd = res.result;
538 })
539 .catch((error) => { });
540 },
541 //打开新建楼盘树结构右键菜单唤起的弹框
542 openLpbDialog (data, type) {
543 this.treeData = data;
544 this.menuType = type;
545 this.$nextTick(() => {
546 this.resetInfo();
547 });
548 this.dialogVisible = true;
549 this.taskTitle = '添加';
550 this.curBsm = '';
551 },
552 //弹框中的保存按钮，根据不同菜单点击类型调用不同子组件的保存方法
553 saveInfo () {
554 switch (this.menuType) {
555 case "ljz":
556 this.$refs.ljz.onSave(this.$refs.ljz.form, this.treeData.bsm);
557 break;
558 case "zdy":
559 this.$refs.zdy.submitForm("form", this.pd[0].bsm, this.treeData.bsm);
560 break;
561 case "ch":
562 this.$refs.ch.onSave(this.pd[0].bsm);
563 break;
564 case "c":
565 this.$refs.c.onSave(this.pd[0].bsm);
566 break;
567 default:
568 break;
569 }
570 },
571 //弹框中的重置按钮
572 resetInfo () {
573 switch (this.menuType) {
574 case "ljz":
575 this.$refs.ljz.reset();
576 break;
577 case "zdy":
578 this.$refs.zdy.reset();
579 break;
580 case "ch":
581 this.$refs.ch.reset();
582 break;
583 case "c":
584 this.$refs.c.reset();
585 break;
586
587 default:
588 break;
589 }
590 },
591 //关闭弹框
592 closeDaialog () {
593 this.dialogVisible = false;
594 },
595 //图例的展开收起
596 legendToggle () {
597 this.legendToggleFlag = !this.legendToggleFlag;
598 },
599 //获取选中户bsm
600 getHbsm (data, type) {
601 if (type) {
602 // 双击
603
604 } else {
605 //单击 TO DO
606 this.bsms = data;
607 }
608 },
609 //获取选中户信息
610 getQsztList (data, type) {
611 if (type) {
612 // 双击
613
614 } else {
615 //单击 TO DO
616 this.qsztList = data;
617 }
618 },
619 //获取选中层bsmlist
620 getCbsm (data) {
621 this.cbsmList = data;
622 },
623 inputChange () {
624 console.log(this.bdcdyh, 'this.bdcdyh');
625 if (this.bdcdyh != "") {
626 // console.log("查询" + this.bdcdyh);
627 this.$refs.lpbContent.lpbDataMap(this.bdcdyh);
628 } else {
629 this.$message({
630 message: "请输入内容后查询",
631 type: "warning",
632 });
633 }
634 },
635 //调用楼盘表信息查询和图例统计接口
636 getlpbData () {
637 this.$refs.lpbContent.loadingData(this.$store.state.zrzbsm, this.scyclx);
638 this.getDyztBsmList();
639 this.getLpbFwytAndQlxz();
640 //改变楼盘表子组件的key值，重新渲染
641 // this.time = new Date().getTime();
642 },
643 //实预测装换
644 plScYcChange () {
645 let data = {
646 zrzbsm: this.$store.state.zrzbsm,
647 scyclx: this.scyclx,
648 };
649 batchScYcChange(data).then((res) => {
650 if (res.code === 200) {
651 this.$message.success("实预测转换成功");
652 this.$refs.lpbContent.loadingData(this.$store.state.zrzbsm, '1');
653 this.$refs.lpbContent.loadingData(this.$store.state.zrzbsm, '0');
654 } else if (res.code === 500) {
655 this.$message.warning(res.message);
656 }
657 });
658 },
659 //切换房屋状态
660 handleChoosedH (bsms, color) {
661 //每次切换房屋状态，将之前高亮的户边框颜色重置为默认
662 this.$refs.lpbContent.choosedList = [];
663 this.$refs.lpbContent.$refs.hBsm.forEach((item) => {
664 item.style.border = '';
665 item.className = '';
666 });
667 this.bsms = bsms;
668 //清除选中户
669 this.$nextTick(() => {
670 //给hBsmList传值
671 // console.log(bsms,'bsms');
672 this.$refs.lpbContent.choosedList = bsms;
673 this.$refs.lpbContent.borderColor = color;
674 })
675 },
676 //批量添加不动产单元号
677 addBdcdyh () {
678 if (this.qsztList.indexOf('1') > -1) {
679 Message.warning("已提交的户无法继续操作")
680 } else {
681 batchGeneratorBdcdyh(this.$store.state.zrzh, this.pd[0].bsm, 0).then(
682 (res) => {
683 if (res.code === 200) {
684 this.$message.success("生成完成！");
685 } else if (res.code === 206) {
686 let hasGenerateCount = res.result.hasGenerateCount;
687 let unGenerateCount = res.result.unGenerateCount;
688 if (+unGenerateCount === 0) {
689 this.$message.warning("不存在未生成不动产单元号的户，无需生成不动产单元号！")
690 return
691 }
692 this.open(hasGenerateCount, unGenerateCount);
693 } else {
694 this.$message.warning(res.message)
695 }
696 }
697 );
698 }
699 },
700
701 open (hasGenerateCount, unGenerateCount) {
702
703 this.$confirm('未生成单元号有' + unGenerateCount + '户,已经生成单元号有' + hasGenerateCount + '户,是否覆盖全部重新生成？', '确认信息', {
704 distinguishCancelAndClose: true,
705 confirmButtonText: '覆盖全部生成',
706 cancelButtonText: '跳过已生成单元号户'
707 })
708 .then(() => {
709 batchGeneratorBdcdyh(this.$store.state.zrzh, this.pd[0].bsm, 2).then(
710 (res) => {
711 if (res.code === 200) {
712 this.$message.success("生成完成！");
713 }
714 });
715 })
716 .catch(action => {
717 if (action === 'cancel') {
718 batchGeneratorBdcdyh(this.$store.state.zrzh, this.pd[0].bsm, 1).then(
719 (res) => {
720 if (res.code === 200) {
721 this.$message.success("生成完成！");
722 }
723 });
724 }
725 });
726 },
727
728 //获取各项单元状态统计数据
729 getDyztBsmList () {
730 let data = {
731 zrzbsm: this.$store.state.zrzbsm,
732 scyclx: this.scyclx,
733 };
734 getLpbTj(data).then((res) => {
735 if (res.code === 200) {
736 this.dyztList = res.result;
737 this.dyztList.splice(1, 0, this.dyztList[8]);
738 this.dyztList.pop();
739 this.dyztList.forEach(item => {
740 item.ts = item.bsms.length;
741 switch (item.name) {
742 case 'Qqzt':
743 item.color = "#6EDEE1";
744 item.name = "已确权"
745 break;
746 case 'Wqqzt':
747 item.color = "#83AAFE";
748 item.name = "未确权"
749 break;
750 case 'Bazt':
751 item.color = "#8ADC88";
752 item.name = "已备案"
753 break;
754 case 'Ydyzt':
755 item.color = "#F2AD67";
756 item.name = "预抵押"
757 break;
758 case 'Zjgcdyzt':
759 item.color = "#F191C8";
760 item.name = "在建抵押"
761 break;
762 case 'Dyzt':
763 item.color = "#FF8282";
764 item.name = "抵押"
765 break;
766 case 'Cfzt':
767 item.color = "#D7CECF";
768 item.name = "查封"
769 break;
770 case 'Yyzt':
771 item.color = "#D4A3EB";
772 item.name = "异议"
773 break;
774 case 'Xzzt':
775 item.color = "#A5A3FB";
776 item.name = "限制"
777 break;
778 default:
779 break;
780 }
781 })
782 }
783 });
784 },
785 // 获取房屋用途和房屋性质及缺失项统计数据
786 getLpbFwytAndQlxz () {
787 let data = {
788 zrzbsm: this.$store.state.zrzbsm,
789 scyclx: this.scyclx,
790 };
791 getLpbFwytAndQlxz(data).then((res) => {
792 if (res.code === 200) {
793 // this.fwytList = res.result
794 this.fwytList = res.result.fwyt;
795 this.fwxzList = res.result.qlxz;
796 if (this.fwytList.length > 0) {
797 this.fwytList.forEach(item => {
798 item.color = "#2591FD";
799 item.ts = item.bsms.length
800 })
801 }
802 if (this.fwxzList.length > 0) {
803 this.fwxzList.forEach(item => {
804 item.color = "#2591FD";
805 item.ts = item.bsms.length
806 })
807 }
808 }
809 });
810 getLpbQsxtj(data).then((res) => {
811 if (res.code === 200) {
812 this.qsxList = [
813 {
814 name: '坐落',
815 bsms: res.result.zl.bsms,
816 color: '#2591FD',
817 ts: res.result.zl.bsms.length
818 },
819 {
820 name: '分层分户图',
821 bsms: res.result.fcfht.bsms,
822 color: '#2591FD',
823 ts: res.result.fcfht.bsms.length
824 },
825 {
826 name: '室号',
827 bsms: res.result.shbw.bsms,
828 color: '#2591FD',
829 ts: res.result.shbw.bsms.length
830 }
831 ]
832 }
833 });
834 }
835
836 },
837 computed: {},
838 destroyed () {
839 window.removeEventListener("resize", this.getHeight);
840 },
841 watch: {
842 //树结构和图例伸缩时修改楼盘表主要内容区宽度
843 legendToggleFlag (n) {
844 if (n) {
845 this.lpbContentwidth -= 204;
846 } else {
847 this.lpbContentwidth += 204;
848 }
849 },
850 createFlag (n) {
851 if (n) {
852 this.lpbContentwidth -= 260;
853 } else {
854 this.lpbContentwidth += 260;
855 }
856 },
857 selectedZt (n) {
858 this.legendToggleFlag = true;
859 },
860 bsms (n) {
861 this.fileData.glbsmList = n;
862 console.log(this.fileData, 'filedata');
863 }
864 },
865 };
866 </script>
867 <style scoped lang="scss">
868 .edit {
869 height: 100%;
870 background-color: #F4F9FF;
871
872 .tab-header {
873 border: 1px solid #dedede;
874 box-sizing: border-box;
875 padding: 20px 0;
876 background-color: #ffffff;
877 margin-bottom: 10px;
878 position: relative;
879
880 .searchContent {
881 margin-left: 62px;
882 box-sizing: border-box;
883 padding: 0 20px;
884
885 .searchInput {
886 transition: 0.5s;
887 margin-left: 20px;
888 display: inline-block;
889 }
890 }
891
892 .change {
893 position: absolute;
894 left: 0;
895 top: 0;
896 height: 100%;
897 width: 80px;
898 border-right: 1px solid #dedede;
899
900 i {
901 cursor: pointer;
902 color: #0090FF;
903 font-size: 36px;
904 display: inherit;
905 text-align: center;
906 line-height: 128px;
907 }
908 }
909
910 .radioBtn {
911 margin-left: 10px;
912 padding: 12px 10px;
913 border: 0;
914
915 i {
916 font-size: 13px;
917 padding-right: 4px;
918 }
919
920 /deep/.el-radio-button__inner {
921 border: 1px solid #dcdfe6;
922 border-radius: 4px;
923 box-shadow: 0 0 0 0 #409eff !important;
924 }
925 }
926 }
927
928 .tab-content {
929 border: 1px solid #dedede;
930 background-color: #ffffff;
931 display: flex;
932
933 .lp-tree {
934 height: 100%;
935 overflow: hidden;
936 transition: 0.5s;
937
938 .treeData {
939 margin-top: 20px;
940 margin-left: 26px;
941 float: left;
942 }
943 }
944
945 .w0 {
946 width: 0;
947 }
948
949 .w260 {
950 width: 260px;
951 }
952
953 .lp-overview {
954 transition: 0.5s;
955 flex: 1;
956 border: 1px solid rgb(236, 236, 236);
957 border-top: 0;
958 border-bottom: 0;
959 margin-right: 10px;
960 box-sizing: border-box;
961 }
962
963 .lp-legend {
964 transition: 0.5s;
965 height: 100%;
966 font-size: 14px;
967
968 .handleCol {
969 width: 34px;
970 float: right;
971 height: 100%;
972
973 .btn {
974 cursor: pointer;
975 height: 40px;
976 line-height: 40px;
977 text-align: center;
978 background-color: #0091ff;
979 color: #fff;
980 border-bottom: 1px solid #e6e6e6;
981 }
982
983 .dyzt,
984 .fwxz,
985 .fwyt,
986 .qsx {
987 height: 122px;
988 }
989
990 .dyzt,
991 .fwxz,
992 .fwyt,
993 .qsx {
994 cursor: pointer;
995 border-bottom: 1px solid #e6e6e6;
996 border-left: 1px solid #e6e6e6;
997
998 span {
999 text-align: center;
1000 height: 100%;
1001 -webkit-writing-mode: vertical-rl;
1002 writing-mode: vertical-rl;
1003 line-height: 34px;
1004 letter-spacing: 2px;
1005 }
1006 }
1007
1008 .selectedZt {
1009 background-color: #0091ff;
1010 color: #fff;
1011 }
1012 }
1013
1014 .legendTable-wrap {
1015 transition: 0.5s;
1016 float: right;
1017 overflow: hidden;
1018
1019 .legendTable {
1020 margin-top: -1px;
1021
1022 tr {
1023 height: 40px;
1024 line-height: 40px;
1025
1026 th:first-child {
1027 width: 80px;
1028 }
1029
1030 th {
1031 width: 60px;
1032 height: 40px;
1033 white-space: nowrap;
1034 }
1035
1036 td {
1037 height: 40px;
1038 text-align: center;
1039 white-space: nowrap;
1040 }
1041
1042 td:first-child {
1043 text-align: left;
1044 text-indent: 2px;
1045 }
1046 }
1047 }
1048 }
1049 }
1050 }
1051
1052 .tab-content::-webkit-scrollbar {
1053 width: 1px;
1054 }
1055
1056 .btnGroup {
1057 margin: 20px auto 0;
1058 width: 260px;
1059 }
1060
1061 .hbjDialog {
1062 /deep/ .el-dialog {
1063 margin-top: 10vh !important;
1064 }
1065 }
1066
1067 .fa {
1068 padding-right: 4px;
1069 }
1070
1071 .wrap {
1072 width: 100%;
1073 height: 30px;
1074 position: relative;
1075
1076 .main-button {
1077 display: -webkit-flex;
1078 display: flex;
1079 flex-direction: column-reverse;
1080 flex-wrap: nowrap;
1081 position: absolute;
1082 left: 165px;
1083 top: 18px;
1084 }
1085
1086 .download {
1087 position: absolute;
1088 left: 312px;
1089 top: 19px;
1090 }
1091 }
1092 }
1093 </style>
1 <template>
2 <div class="h content-form">
3 <el-form ref="form" :model="form" label-width="160px">
4 <table border="1" width="100%" cellspacing="0" cellpadding="0" class="hTable">
5 <tbody>
6 <tr height="30">
7 <td colspan="12" align="center">
8 <font size="4">逻辑幢基本信息</font>
9 </td>
10 </tr>
11 <tr height="30">
12 <td colspan="2" align="center" class="tdright"><i class="requisite">*</i>逻辑幢号</td>
13 <td colspan="4">
14 <input class="formInput" ref="ljzh" @blur="inputBlur($event)" v-model="form.ljzh" />
15 </td>
16 <td colspan="2" align="center" class="tdright">自然幢号</td>
17 <td colspan="4">
18 <el-input v-model="form.zrzh" maxlength="24" disabled></el-input>
19 </td>
20 </tr>
21 <tr height="30">
22 <td colspan="2" align="center" class="tdright"><i class="requisite">*</i>逻辑幢名称</td>
23 <td colspan="4">
24 <input class="formInput" ref="ljzmc" @blur="inputBlur($event)" v-model="form.ljzmc" />
25 </td>
26 <td colspan="2" align="center" class="tdright">建筑物状态</td>
27 <td colspan="4">
28 <el-input v-model="form.jzwzt"></el-input>
29 </td>
30 </tr>
31
32 <tr height="30">
33 <td colspan="2" align="center" class="tdright">门牌号</td>
34 <td colspan="4">
35 <el-input v-model="form.mph"></el-input>
36 </td>
37 <td colspan="2" align="center" class="tdright">竣工日期</td>
38 <td colspan="4">
39 <el-date-picker v-model="form.jgrq" type="date" value-format="yyyy-MM-dd" placeholder="选择日期">
40 </el-date-picker>
41 </td>
42 </tr>
43
44 <tr height="30">
45 <td colspan="2" align="center" class="tdright">预测建筑面积(㎡)</td>
46 <td colspan="4">
47 <el-input v-model="form.ycjzmj" oninput="value = (value.match(/^\d{0,9}(\.?\d{0,3})/g)[0]) || null">
48 </el-input>
49 </td>
50 <td colspan="2" align="center" class="tdright">实测建筑面积(㎡)</td>
51 <td colspan="4">
52 <el-input v-model="form.scjzmj" oninput="value = (value.match(/^\d{0,9}(\.?\d{0,3})/g)[0]) || null">
53 </el-input>
54 </td>
55 </tr>
56
57 <tr height="30">
58 <td colspan="2" align="center" class="tdright">预测地下面积(㎡)</td>
59 <td colspan="4">
60 <el-input v-model="form.ycdxmj" oninput="value = (value.match(/^\d{0,9}(\.?\d{0,3})/g)[0]) || null">
61 </el-input>
62 </td>
63 <td colspan="2" align="center" class="tdright">实测地下面积(㎡)</td>
64 <td colspan="4">
65 <el-input v-model="form.scdxmj" oninput="value = (value.match(/^\d{0,9}(\.?\d{0,3})/g)[0]) || null">
66 </el-input>
67 </td>
68 </tr>
69
70 <tr height="30">
71 <td colspan="2" align="center" class="tdright">预测其他面积(㎡)</td>
72 <td colspan="4">
73 <el-input v-model="form.ycqtmj" oninput="value = (value.match(/^\d{0,9}(\.?\d{0,3})/g)[0]) || null">
74 </el-input>
75 </td>
76 <td colspan="2" align="center" class="tdright">实测其他面积(㎡)</td>
77 <td colspan="4">
78 <el-input v-model="form.scqymj" oninput="value = (value.match(/^\d{0,9}(\.?\d{0,3})/g)[0]) || null">
79 </el-input>
80 </td>
81 </tr>
82
83 <tr height="30" v-for="(item1, index) in form.ytList" :key="'yt' + index">
84 <td colspan="2" v-if="index === 0" :rowspan="ytTitleRowspan" align="center" class="tdright">
85 <i class="iconfont iconicon-test1" style="margin-right: 8px;color:#66b1ff;font-size:30px"
86 @click="addYtInfo"></i>
87 <span style="position:relative;top:-6px"><i class="requisite">*</i>房屋用途</span>
88 </td>
89 <td colspan="1" align="center">
90 <i class="iconfont iconicon-test" style="color:#FA6400;font-size:30px" @click="deleteYtInfo(index)"></i>
91 </td>
92 <td colspan="9">
93 <el-select-tree style="width:100%" ref="yt" v-if="show" :default-expand-all="defaultExpandAll"
94 :multiple="multiple" :placeholder="placeholder" :data="$store.state.fwytList" :props="treeProps"
95 :check-strictly="checkStrictly" :clearable="clearable" v-model="item1.fwytzdbsm"></el-select-tree>
96 </td>
97 </tr>
98
99 <tr height="30" v-for="(item1, index) in form.fwjgList" :key="'jg' + index">
100 <td colspan="2" v-if="index === 0" :rowspan="fwjgTitleRowspan" align="center" class="tdright">
101 <i class="iconfont iconicon-test1" style="margin-right: 8px;color:#66b1ff;font-size:30px"
102 @click="addFwjgInfo"></i>
103 <span style="position:relative;top:-6px"><i class="requisite">*</i>房屋结构</span>
104 </td>
105 <td colspan="1" align="center">
106 <i class="iconfont iconicon-test" style="color:#FA6400;font-size:30px" @click="deleteFwjgInfo(index)"></i>
107 </td>
108 <td colspan="9">
109 <el-select-tree style="width:100%" ref="fwjg" v-if="show" :default-expand-all="defaultExpandAll"
110 :multiple="multiple" :placeholder="placeholder" :data="$store.state.jgOptions" :props="treeProps"
111 :check-strictly="checkStrictly" :clearable="clearable" v-model="item1.fwjgzdbsm"></el-select-tree>
112 </td>
113 </tr>
114
115 <tr height="30">
116 <td colspan="2" align="center" class="tdright">地下层数</td>
117 <td colspan="4">
118 <el-input v-model="form.dxcs"></el-input>
119 </td>
120 <td colspan="2" align="center" class="tdright">地上层数</td>
121 <td colspan="4">
122 <el-input v-model="form.dscs"></el-input>
123 </td>
124 </tr>
125
126 <tr height="30">
127 <td colspan="2" align="center" class="tdright">总层数</td>
128 <td colspan="10">
129 <el-input v-model="form.zcs"></el-input>
130 </td>
131 </tr>
132
133 <tr height="30">
134 <td colspan="2" rowspan="2" class="tdright">
135 <span>备注</span>
136 </td>
137 <td colspan="10" rowspan="2">
138 <el-input v-model="form.bz" type="textarea"></el-input>
139 </td>
140 </tr>
141 <tr height="30"></tr>
142 </tbody>
143 </table>
144 </el-form>
145 </div>
146 </template>
147
148 <script>
149 // import { insertLjzInfo } from "@api/lpb";
150 // import { getQjLjzDetailById, updateQjLjz } from "@api/ljz";
151 // import { formdate } from "@libs/function";
152 export default {
153 name: "ljz",
154 components: {},
155 props: {
156 ljzbsm: {
157 type: String,
158 default: '',
159 }
160 },
161 data () {
162 return {
163 //树型结构
164 show: true,
165 clearable: true,
166 defaultExpandAll: true,
167 multiple: false,
168 placeholder: '请选择',
169 disabled: false,
170 checkStrictly: true,
171 treeProps: {
172 value: 'bsm',
173 children: 'children',
174 label: 'mc'
175 },
176
177 rules: [],
178
179 form: {
180 zrzbsm: "",
181 ljzh: "", //逻辑幢号
182 zrzh: "", //自然幢号
183 ljzmc: "", //逻辑幢顺序号
184 bdcdyh: "", //不动产单元号
185 mph: "", //门牌号
186 jgrq: "", //竣工日期
187 ycjzmj: "", //预测建筑面积
188 scjzmj: "", //实测建筑面积
189 ycdxmj: "", //预测地下面积
190 scdxmj: "", //实测地下面积
191 ycqtmj: "", //预测其他面积
192 scqymj: "", //实测其他面积
193 ytList: [
194 {
195 glbsm: "", //关联标识码
196 fwytzdbsm: "", //房屋用途字典标识码
197 sx: "", //顺序
198 },
199 ],
200 fwjgList: [
201 {
202 fwjgzdbsm: "", //房屋结构字典标识码
203 glbsm: "", //关联标识码
204 sx: "", //顺序
205 },
206 ],
207 dxcs: "", //地下层数
208 dscs: "", //地上层数
209 zcs: "", //总层数
210 jzwzt: "", //建筑物状态
211 },
212 value: "",
213 ytTitleRowspan: 1, //用途的单元格垂直合并数量
214 fwjgTitleRowspan: 1, //房屋结构的单元格垂直合并数量
215 };
216 },
217 methods: {
218 inputBlur (e) {
219 if (e.target.value != '') {
220 e.target.style.border = ""
221 } else {
222 e.target.style.border = "1px solid red";
223 e.target.style.boxSizing = 'border-box';
224 }
225 },
226
227 addYtInfo () {
228 this.form.ytList.push({
229 glbsm: "",
230 fwytzdbsm: "",
231 sx: "",
232 });
233 this.ytTitleRowspan = this.form.ytList.length;
234 },
235 deleteYtInfo (index) {
236 if (this.form.ytList.length <= 1) {
237 this.$message({
238 message: "不能删除，最少含有一条房屋用途信息",
239 type: "warning",
240 });
241 } else {
242 this.form.ytList.splice(index, 1);
243 this.ytTitleRowspan = this.form.ytList.length;
244 }
245 },
246 addFwjgInfo () {
247 this.form.fwjgList.push({
248 fwjgzdbsm: "", //房屋结构字典标识码
249 glbsm: "", //关联标识码
250 sx: "", //顺序
251 });
252 this.fwjgTitleRowspan = this.form.fwjgList.length;
253 },
254 //重置数据
255 reset () {
256 this.form = {
257 // zrzbsm: "",
258 ljzh: "", //逻辑幢号
259 zrzh: this.$store.state.zrzh, //自然幢号
260 ljzmc: "", //逻辑幢顺序号
261 bdcdyh: "", //不动产单元号
262 mph: "", //门牌号
263 jgrq: "", //竣工日期
264 ycjzmj: "", //预测建筑面积
265 scjzmj: "", //实测建筑面积
266 ycdxmj: "", //预测地下面积
267 scdxmj: "", //实测地下面积
268 ycqtmj: "", //预测其他面积
269 scqymj: "", //实测其他面积
270 ytList: [
271 {
272 glbsm: "", //关联标识码
273 fwytzdbsm: "", //房屋用途字典标识码
274 sx: "", //顺序
275 },
276 ],
277 fwjgList: [
278 {
279 fwjgzdbsm: "", //房屋结构字典标识码
280 glbsm: "", //关联标识码
281 sx: "", //顺序
282 },
283 ],
284 dxcs: "", //地下层数
285 dscs: "", //地上层数
286 zcs: "", //总层数
287 jzwzt: "", //建筑物状态
288 };
289 this.ytTitleRowspan = 1; //用途的单元格垂直合并数量
290 this.fwjgTitleRowspan = 1; //用途的单元格垂直合并数量
291 },
292 deleteFwjgInfo (index) {
293 if (this.form.fwjgList.length <= 1) {
294 this.$message({
295 message: "不能删除，最少含有一条房屋结构信息",
296 type: "warning",
297 });
298 } else {
299 this.form.fwjgList.splice(index, 1);
300 this.fwjgTitleRowspan = this.form.fwjgList.length;
301 }
302 },
303 onSave (data, bsm) {
304 this.rules = [
305 {
306 data: this.form.ljzh,
307 name: '自然幢号',
308 dom: this.$refs.ljzh,
309 rule: /^\s*$/g, //非空
310 },
311 {
312 data: this.form.ljzmc,
313 name: '不动产单元号',
314 dom: this.$refs.ljzmc,
315 rule: /^\s*$/g, //非空
316 },
317 ];
318 this.form.ytList.forEach((item, index) => {
319 this.rules.push(
320 {
321 data: item.fwytzdbsm,
322 name: '用途',
323 dom: this.$refs.yt[index],
324 rule: /^\s*$/g, //非空
325 },
326 )
327 });
328 this.form.fwjgList.forEach((item, index) => {
329 this.rules.push(
330 {
331 data: item.fwjgzdbsm,
332 name: '房屋结构',
333 dom: this.$refs.fwjg[index],
334 rule: /^\s*$/g, //非空
335 },
336 )
337 });
338
339 //自然幢标识码
340 this.form.zrzbsm = bsm;
341 let flag = true;
342 this.rules.forEach(item => {
343 if (item.rule.test(item.data) || item.data == null) {
344 if (item.dom.$el) {
345 item.dom.$el.style.border = '1px solid red';
346 item.dom.$el.style.boxSizing = 'border-box';
347 } else {
348 item.dom.style.border = '1px solid red';
349 item.dom.style.boxSizing = 'border-box';
350 }
351 flag = false;
352 return false
353 }
354 })
355 this.$nextTick(() => {
356 if (flag) {
357 if (this.ljzbsm == '') {
358 // insertLjzInfo(this.form).then((res) => {
359 // if (res.code === 200) {
360 // this.$message.success("保存成功");
361 // //更新树结构数据
362 // console.log(this);
363 // this.$parent.$parent.getLpbMenuTree(bsm);
364 // //关闭弹框
365 // this.$parent.$parent.closeDaialog();
366 // } else {
367 // this.$message.error(res.message);
368 // }
369 // });
370 } else {
371 //逻辑幢更新接口调用 TODO
372 console.log('保存');
373 updateQjLjz(this.form).then((res) => {
374 if (res.code === 200) {
375 this.$message.success("修改成功")
376 }
377 })
378 }
379 }
380 })
381
382 },
383 onSubmit () {
384 // console.log(this.form);
385 },
386 //根据逻辑幢bsm查询逻辑幢信息
387 getLjzInfo (bsm) {
388 //逻辑幢信息查询接口调用 bsm为逻辑幢bsm
389 getQjLjzDetailById(bsm).then((res) => {
390 if (res.code === 200) {
391 this.form = res.result;
392 this.form.zrzh = this.$store.state.zrzh;
393 this.form.fwjgList = [
394 {
395 fwjgzdbsm: "", //房屋结构字典标识码
396 glbsm: "", //关联标识码
397 sx: "", //顺序
398 },
399 ];
400 this.form.ytList = [
401 {
402 glbsm: "", //关联标识码
403 fwytzdbsm: "", //房屋用途字典标识码
404 sx: "", //顺序
405 },
406 ];
407 if (this.form.qjfwjg.length > 0) {
408 this.form.fwjgList = [];
409 for (let i = 0; i < this.form.qjfwjg.length; i++) {
410 this.form.fwjgList.push({
411 fwjgzdbsm: this.form.qjfwjg[i].fwjgzdbsm, //房屋结构字典标识码
412 glbsm: this.form.qjfwjg[i].glbsm, //关联标识码
413 sx: this.form.qjfwjg[i].sx, //顺序
414 })
415 }
416 }
417 if (this.form.qjfwyt.length > 0) {
418 this.form.ytList = [];
419 for (let i = 0; i < this.form.qjfwyt.length; i++) {
420 this.form.ytList.push({
421 fwytzdbsm: this.form.qjfwyt[i].fwytzdbsm, //房屋结构字典标识码
422 glbsm: this.form.qjfwyt[i].glbsm, //关联标识码
423 sx: this.form.qjfwyt[i].sx, //顺序
424 })
425 }
426 }
427 console.log(JSON.stringify(this.form) + ":this.form")
428 }
429 })
430 this.$forceUpdate();
431 }
432 },
433 created () {
434 },
435 mounted () {
436 this.form.zrzh = this.$store.state.zrzh;
437 },
438 watch: {
439
440 "form.ljzh": function (val) {
441 if (val != '') {
442 this.$refs.ljzh.style.border = '';
443 }
444 },
445
446 "form.ljzmc": function (val) {
447 if (val != '') {
448 this.$refs.ljzmc.style.border = '';
449 }
450 },
451
452 "form.ytList": {
453 handler: function (newVal, oldVal) {
454 newVal.forEach((item, ind) => {
455 if (item.fwytzdbsm != '') {
456 this.$refs.yt[ind].$el.style.border = ""
457 }
458 })
459 },
460 deep: true
461 },
462 "form.fwjgList": {
463 handler: function (newVal, oldVal) {
464 newVal.forEach((item, ind) => {
465 if (item.fwjgzdbsm != '') {
466 this.$refs.fwjg[ind].$el.style.border = ""
467 }
468 })
469 },
470 deep: true
471 },
472
473 ljzbsm: {
474 handler: function (item) {
475 console.log(item, 'item');
476 if (item != '' && this.$parent.$parent.menuType == 'ljz') {
477 this.getLjzInfo(this.ljzbsm)
478 }
479 },
480 immediate: true
481 },
482 }
483 };
484 </script>
485 <style rel="stylesheet/scss" lang="scss" scoped>
486 .h {
487 min-height: 200px;
488 width: 100%;
489 margin: 0 auto;
490
491 /deep/.el-input__inner {
492 width: 100%;
493 border: 0;
494 }
495
496 /deep/textarea {
497 width: 100%;
498 border: 0;
499 }
500
501 .el-form-item {
502 font-weight: bold;
503 font-size: xx-large;
504 }
505
506 table {
507 background: #fff;
508 table-layout: fixed;
509 }
510
511 td {
512 //bgcolor:#F1F4FC;
513 background-color: #fff;
514 width: 8.33%;
515 height: 36px
516 }
517
518 .el-select {
519 display: block;
520 }
521 }
522
523 table {
524 font-size: 14px;
525 }
526
527 .hTable {
528 margin-top: 10px;
529 }
530 </style>
1 <template>
2 <div class="lpbContent-wrap" ref="lpbContentWrap">
3 <div class="lpbContent" ref="lpbContent">
4 <div :class="
5 lpbData.cs.length == 0 && lpbData.zdys.length == 0
6 ? 'bottom40 ljz-wrap'
7 : 'ljz-wrap'
8 " :style="{ 'width': ljzWidth + 'px' }" v-show="lpbData.ljzs.length > 0">
9 <!-- 循环逻辑幢数据 -->
10 <div class="ljz" ref="ljz" v-for="(ljzs, ljzIndex) in lpbData.ljzs" :key="ljzIndex"
11 :class="[{ 'mt30': ljzIndex == 0 }, { 'mt60': ljzIndex == 1 || lpbData.ljzs.length == 1 }]">
12 <!-- :style="{'marginTop':ljzs.zdys.length>0?'0':'30px'}" -->
13 <!-- 循环逻辑幢下的幢单元 -->
14 <div class="ljz-zdy-wrap">
15 <div class="ljz-zdy column-reverse"
16 :style="{ 'min-height': ljzzdyHeight + 'px', 'marginRight': zdyIndex < (ljzs.zdys.length - 1) || ljzs.cs.length > 1 ? '20px' : '0' }"
17 ref="ljzzdy" v-show="ljzs.zdys.length > 0" v-for="(zdys, zdyIndex) in ljzs.zdys" :key="zdyIndex">
18 <!-- 幢单元名称 -->
19 <div class="zdy-name name">
20 <p class="cp" @dblclick="openZxx(zdys.bsm, 'zdy')">
21 <!-- {{ zdys.zdymc }} -->
22 <el-checkbox @change='zdySelectAll($event, zdys.cs)'>{{ zdys.zdymc }}</el-checkbox>
23 </p>
24 </div>
25
26 <!-- 循环幢单元下的层户 -->
27 <!-- <div class="chTable-wrap"> -->
28 <table class="chTable psr" border="1" cellspacing="0" cellpadding="0" v-show="zdys.cs.length > 0">
29 <tr v-for="(cs, csIndex) in zdys.cs" :key="csIndex">
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 <!-- </div> -->
98
99 <!-- 逻辑幢名称 -->
100 <div class="ljz-name name">
101 <p class="cp" @dblclick="openZxx(ljzs.bsm, 'ljz')">
102 {{ ljzs.ljzmc }}
103 </p>
104 </div>
105 </div>
106 </div>
107 <div class="zdy-wrap"
108 :style="{ width: zdyWidth + 'px', marginTop: (lpbData.zdys.length > 0 || lpbData.cs.length > 0) ? '30px' : '0' }">
109 <!-- 循环自然幢下的幢单元 -->
110 <div class="zdy column-reverse" ref="zdy" v-for="(zdys, zdyIndex) in lpbData.zdys" :key="zdyIndex"
111 :style="{ 'min-height': zdyHeight + 'px' }">
112 <!-- 幢单元名称 -->
113 <div class="zdy-name name">
114 <p class="cp" @dblclick="openZxx(zdys.bsm, 'zdy')">
115 <el-checkbox @change='zdySelectAll($event, zdys.cs)'>{{ zdys.zdymc }}</el-checkbox>
116 </p>
117 </div>
118 <!-- 循环幢单元下的层户 -->
119 <table class="chTable" border="1" cellspacing="0" cellpadding="0" v-show="zdys.cs.length > 0">
120 <tr v-for="(cs, csIndex) in zdys.cs" :key="csIndex">
121 <!-- 显示层数 -->
122 <td class="floor" ref="cBsm" @contextmenu.prevent="openMenu($event, cs, 'c')"
123 @click="handleClickC($event, cs)" @dblclick="openZxx(cs.bsm, 'c')">
124 {{ cs.sjc }}层
125 </td>
126 <!-- 显示户 -->
127 <td v-for="(hs, hsIndex) in cs.hs" :rowspan="hs.sjcs" :colspan="hs.sjhs" :data-bsm="hs.bsm"
128 :data-qszt="hs.qszt" ref="hBsm" :key="hsIndex"
129 :class="searchNum == hs.shbw || searchNum == hs.bdcdyh ? 'tdSelect' : ''"
130 @click="handleTdClick($event.target, hs.bsm, hs)" @dblclick="dbclick(hs.bsm)"
131 @contextmenu.prevent="openMenu($event, hs, 'h')">
132 {{ hs.shbw }}
133 <span @click.stop="dyztIconClick" class="hqszt lin" v-show="hs.qszt == '0'">临</span>
134 <span @click.stop="dyztIconClick" class="hqszt zheng" v-show="hs.qszt == '1'">正</span>
135 <span @click.stop="dyztIconClick" class="hqszt xian" v-show="hs.qszt == '2'">现</span>
136 <ul class="dyzt" @click.stop="hDyztClick($event, hs.bsm, hs)">
137 <li style="background-color:#6EDEE1" v-show="hs.qqzt == '1'" @click.stop="dyztIconClick">确</li>
138 <li style="background-color:#8ADC88" v-show="hs.bazt == '1'" @click.stop="dyztIconClick">备</li>
139 <li style="background-color:#FF8282" v-show="hs.dyzt == '1'" @click.stop="dyztIconClick">抵</li>
140 <li style="background-color:#D7CECF" v-show="hs.cfzt == '1'" @click.stop="dyztIconClick">查</li>
141 <li style="background-color:#D4A3EB" v-show="hs.yyzt == '1'" @click.stop="dyztIconClick">异</li>
142 <li style="background-color:#A5A3FB" v-show="hs.xzzt == '1'" @click.stop="dyztIconClick">限</li>
143 </ul>
144 </td>
145 </tr>
146 </table>
147 </div>
148 <!-- 循环自然幢下的独立层户 -->
149 <!-- <template > -->
150 <div class="zdy column-reverse" ref="zrzDlch" :style="{ 'min-height': cHeight + 'px' }">
151 <table class="chTable" ref="ch" border="1" cellspacing="0" cellpadding="0"
152 v-show="lpbData.cs != null && lpbData.cs.length > 0">
153 <tr v-for="(cs, csIndex) in lpbData.cs" :key="csIndex">
154 <!-- 显示层数 -->
155 <td class="floor" ref="cBsm" @contextmenu.prevent="openMenu($event, cs, 'c')"
156 @click="handleClickC($event, cs)" @dblclick="openZxx(cs.bsm, 'c')">
157 {{ cs.sjc }}层
158 </td>
159 <!-- 显示户 -->
160 <td v-for="(hs, hsIndex) in cs.hs" :rowspan="hs.sjcs" :colspan="hs.sjhs" :data-bsm="hs.bsm"
161 :data-qszt="hs.qszt" ref="hBsm" :key="hsIndex"
162 :class="searchNum == hs.shbw || searchNum == hs.bdcdyh ? 'tdSelect' : ''"
163 @click="handleTdClick($event.target, hs.bsm, hs)" @dblclick="dbclick(hs.bsm)"
164 @contextmenu.prevent="openMenu($event, hs, 'h')">
165 {{ hs.shbw }}
166 <span @click.stop="dyztIconClick" class="hqszt lin" v-show="hs.qszt == '0'">临</span>
167 <span @click.stop="dyztIconClick" class="hqszt zheng" v-show="hs.qszt == '1'">正</span>
168 <span @click.stop="dyztIconClick" class="hqszt xian" v-show="hs.qszt == '2'">现</span>
169 <ul class="dyzt" @click.stop="hDyztClick($event, hs.bsm, hs)">
170 <li style="background-color:#6EDEE1" v-show="hs.qqzt == '1'" @click.stop="dyztIconClick">确</li>
171 <li style="background-color:#8ADC88" v-show="hs.bazt == '1'" @click.stop="dyztIconClick">备</li>
172 <li style="background-color:#FF8282" v-show="hs.dyzt == '1'" @click.stop="dyztIconClick">抵</li>
173 <li style="background-color:#D7CECF" v-show="hs.cfzt == '1'" @click.stop="dyztIconClick">查</li>
174 <li style="background-color:#D4A3EB" v-show="hs.yyzt == '1'" @click.stop="dyztIconClick">异</li>
175 <li style="background-color:#A5A3FB" v-show="hs.xzzt == '1'" @click.stop="dyztIconClick">限</li>
176 </ul>
177 </td>
178 </tr>
179 </table>
180 </div>
181 <!-- </template> -->
182 </div>
183 <!-- <div class="ch-wrap">层户</div> -->
184 <div class="zrz" :style="{ width: lpbContentWidth + 'px' }">
185 <el-checkbox v-model="zrzChecked" @change='lpbSelectAll'>{{ lpbData.xmmc }}</el-checkbox>
186 </div>
187 </div>
188 <ul v-show="lpbChVisible" :style="{ left: lpbChLeft + 'px', top: lpbChTop + 'px' }" class="contextmenu">
189 <li v-show="rightClickFlag == 'h'" @click="handleAddH">添加</li>
190 <li v-show="rightClickFlag == 'h'" @click="handleMoveH">移动</li>
191 <!-- <li v-show="rightClickFlag == 'h'" @click="handleDeleteH">删除</li> -->
192 <li v-show="rightClickFlag == 'h'" @click="handleSyczh">实预测转换</li>
193 <li v-show="rightClickFlag == 'c'" @click="handleAddC('up')">
194 向上添加层
195 </li>
196 <li v-show="rightClickFlag == 'c'" @click="handleAddC('down')">
197 向下添加层
198 </li>
199 <li v-show="rightClickFlag == 'c'" @click="handleDeleteC">删除层</li>
200 <!-- 合并 -->
201 <li v-show="rightClickFlag == 'hb'" :class="canHb != 'zyhb' ? 'cantHb' : ''" @click="handleHb('zyhb')">左右合并</li>
202 <li v-show="rightClickFlag == 'hb'" :class="canHb != 'sxhb' ? 'cantHb' : ''" @click="handleHb('sxhb')">上下合并</li>
203 <!-- 分割 -->
204 <li v-show="rightClickFlag == 'fg'" @click="handleFg">户分割</li>
205 <!-- 范围属性变更 -->
206 <li v-show="rightClickFlag == 'fwsxbg'" @click="handleFwsxbg">变更信息</li>
207 <!-- 重新落宗 -->
208 <li v-show="rightClickFlag == 'cxlz'" @click="handleCxlz">重新落宗</li>
209
210
211 </ul>
212 <!-- 层操作弹框 -->
213 <el-dialog v-dialogDrag :close-on-click-modal="false" :title="addCData.title" :visible.sync="addCVisible"
214 width="50%">
215 <el-form :model="addCData">
216 <el-form-item label="层号" :label-width="formLabelWidth">
217 <el-input disabled v-model="addCData.sjc" autocomplete="off"></el-input>
218 </el-form-item>
219 <el-form-item label="实际层" :label-width="formLabelWidth">
220 <el-input disabled v-model="addCData.sjc" autocomplete="off"></el-input>
221 </el-form-item>
222 <el-form-item label="添加的户数" :label-width="formLabelWidth">
223 <el-input v-model="addCData.hcount" autocomplete="off"></el-input>
224 </el-form-item>
225 </el-form>
226 <div class="btnGroup">
227 <el-button type="primary" @click="saveAddC">保存</el-button>
228 <el-button type="primary" @click="addCVisible = false">取消</el-button>
229 </div>
230 </el-dialog>
231 <!-- 户分割弹框 -->
232 <el-dialog v-dialogDrag :close-on-click-modal="false" title="户分割" :visible.sync="hfgDialogVisible" width="800px">
233 <el-form :model="fgData">
234 <el-form-item label="分割户数" required="" :label-width="formLabelWidth">
235 <el-input :disabled="fgData.fgfx != 0" v-model="fgData.fghs" autocomplete="off"></el-input>
236 </el-form-item>
237 </el-form>
238 <div class="btnGroup">
239 <el-button type="primary" @click="savefgData">保存</el-button>
240 <el-button type="primary" @click="hfgDialogVisible = false">取消</el-button>
241 </div>
242 </el-dialog>
243 <move-h :hbsm="chData.bsm" @close="moveHClose" :move-hvisible="moveHvisible" :type="scyclx"
244 @loading="loadingData($store.state.zrzbsm, $parent.scyclx)"></move-h>
245 <!-- 双击户的弹出框 -->
246 <el-dialog v-dialogDrag :close-on-click-modal="false" title="户编辑" class="hbjDialog" :visible.sync="hbjVisible"
247 width="80%">
248 <hbj ref="hbj" :bsm="hbsm" :scyclx="scyclx" :lpbParent="lpbParent"></hbj>
249 </el-dialog>
250 <!-- 户重新落宗 -->
251 <h-cxlz :h-cxlz-visble="hcxlzVisible" :bsms="hbsmList" @close="hcxlzVisible = false"></h-cxlz>
252 </div>
253 </template>
254 <script>
255 import moveH from "@/components/moveH/moveH";
256 import HCxlz from "@/components/hCxlz/hCxlz";
257 // import { getLpb, insertUpDownC, deleteCByBsm } from "@api/lpb";
258 // import { hhb, hfg } from "@api/h";
259 import { Message } from 'element-ui';
260 // import { fwsxbgbl } from "@api/common";
261 import hbj from "../hbj/lpb-hbj/index";
262 export default {
263 name: "",
264 components: { moveH, hbj, HCxlz, },
265 props: {
266 zrzbsm: {
267 type: String,
268 default: ''
269 },
270 lpbParent: {
271 type: String,
272 default: 'isLpb'
273 },
274 isHb: {
275 type: Boolean,
276 default: true
277 },
278 },
279 data () {
280 return {
281 moveHvisible: false,
282 lpbData: {
283 ljzs: [],
284 cs: [],
285 zdys: [],
286 },
287 hbjVisible: false,
288 hcxlzVisible: false,
289 lpbContentWidth: 0,
290 ljzWidth: 10000,
291 zdyWidth: 1000,
292 cHeight: 0, //独立层户的div高度
293 zdyHeight: 0, //独立幢单元的div高度
294 ljzcHeight: 0, //逻辑幢下层户的div高度
295 ljzzdyHeight: 0, //逻辑幢下幢单元的div高度
296 loading: true,
297 hbsm: '',
298 hbsmList: [],
299 hqsztList: [],
300 cbsmList: [],
301 time: null, //区分单双击事件的定时器
302 searchNum: Math.random(),
303 //接收父组件传入的根据单元状态/房屋性质/房屋用途筛选的户bsmList
304 choosedList: [],
305 borderColor: "#E6E6E6",
306 lpbChVisible: false, //层户右键菜单显隐
307 lpbChLeft: 100,
308 lpbChTop: 100,
309 //右键层户数据
310 chData: "",
311 rightClickFlag: "",
312 //层操作数据
313 addCVisible: false,
314 addCData: {
315 title: "",
316 cbsm: "", //层标识码
317 hcount: "", //添加户数
318 scyclx: "", //实测预测类型
319 sjc: "", //当前的层的SJC +1
320 },
321 formLabelWidth: "120px",
322 yclpbData: {},
323 sclpbData: {},
324 fghbChoosedList: [],
325 canHb: '',//判断合并类型
326 hfgDialogVisible: false, //户分割弹框
327 fgData: {
328 fghs: "",
329 oldbsm: '',
330 fgfx: 0
331 },
332 zrzChecked: false, //自然幢全选
333 };
334 },
335 created () { },
336 mounted () {
337 // this.getLpb(this.zrzbsm, "0");
338 // this.getLpb(this.zrzbsm, "1");
339 setTimeout(() => {
340 //让滚动条滚动至最下面 -6是横向滚动条的高度
341 this.$refs.lpbContent.scrollTop =
342 this.$refs.lpbContent.scrollHeight -
343 this.$refs.lpbContent.clientHeight -
344 6;
345 }, 200);
346 window.lpbContent = this;
347 },
348 methods: {
349 loadingData (zrzbsm, scyclx) {
350 this.getLpb(zrzbsm, scyclx, true);
351 },
352 //获取楼盘表数据
353 getLpb (zrzbsm, scyclx, actual) {
354 getLpb(zrzbsm, scyclx).then((res) => {
355 if (res.code == 200) {
356 this.$parent.lpbloading = false;
357 res.result.ljzs = res.result.ljzs
358 .sort(this.compare("place"))
359 .reverse();
360 // this.lpbData = res.result == null ? this.lpbData : res.result;
361 //给实预测楼盘表对象赋值，默认加载预测楼盘表数据
362 if (scyclx == 0) {
363 this.yclpbData = res.result == null ? this.yclpbData : res.result;
364 this.lpbData = this.yclpbData;
365 } else {
366 this.sclpbData = res.result == null ? this.sclpbData : res.result;
367 }
368 if (actual) {
369 this.lpbData = res.result == null ? this.yclpbData : res.result;
370 }
371 if (this.lpbParent == 'isFwsxbg') {
372 this.lpbData = this.$parent.scyclx == '0' ? this.yclpbData : this.sclpbData;
373 }
374 this.$nextTick(() => {
375 //渲染楼盘表
376 this.dataChange();
377 });
378 } else {
379 this.$message({
380 message: res.message,
381 type: "warning",
382 });
383 }
384 });
385 },
386 compare (property) {
387 return function (a, b) {
388 var value1 = a[property];
389 var value2 = b[property];
390 return value1 - value2;
391 };
392 },
393 //按照bdcdyh或shbw筛选户
394 lpbDataMap (sh) {
395 this.searchNum = sh;
396 if (this.hbsmList.length > 0) {
397 //清除之前选中户
398 this.clearChoosedH();
399 }
400 // console.log("查询searchNum" + searchNum);
401 },
402 //接收范围属性变更传入的hbsm
403 getFwsxbgHbsm (bsm) {
404 this.hbsmList.push(bsm);
405 },
406 //自然幢下元素高度宽度计算
407 dataChange () {
408 //计算逻辑幢宽度 20为marginRight值
409 this.ljzWidth = 0;
410 if (this.$refs.ljzzdy != undefined) {
411 this.$refs.ljzzdy.forEach((item) => {
412 this.ljzWidth += item.offsetWidth + 20;
413 });
414 if (this.$refs.ljzDlch != undefined) {
415 this.$refs.ljzDlch.forEach((item) => {
416 this.ljzWidth += item.offsetWidth;
417 });
418 }
419 } else {
420 if (this.$refs.ljzDlch != undefined) {
421 this.$refs.ljzDlch.forEach((item) => {
422 this.ljzWidth += item.offsetWidth + 20;
423 });
424 }
425 }
426 //计算独立幢单元和独立层户宽度
427 //考虑this.$refs.zdy的length为0的情况，即自然幢下没有独立幢单元
428 if (this.$refs.zdy != undefined && this.$refs.zdy.length > 0) {
429 //判断自然幢下有没有比层户高的幢单元
430 let higher = true;
431 //记录最高的幢单元高度 默认为第一个幢单元高度
432 let highest = this.$refs.zdy[0].offsetHeight;
433 this.zdyWidth = 20;
434 this.$refs.zdy.forEach((item) => {
435 this.zdyWidth += item.offsetWidth + 21;
436 this.cHeight =
437 item.offsetHeight > this.cHeight ? item.offsetHeight : this.cHeight;
438 highest = highest > item.offsetHeight ? highest : item.offsetHeight;
439 });
440 //判断有无独立层户
441 if (this.$refs.ch != undefined) {
442 //计算自然幢下的幢单元高度，如果有比层户高的幢单元，则幢单元高度设为最高的幢单元高度，如果没有，则设为层户高度
443 higher = highest > this.$refs.ch.offsetHeight ? true : false;
444 this.zdyHeight = higher ? highest : this.$refs.ch.offsetHeight;
445 highest = 0;
446 this.zdyWidth += this.$refs.ch.offsetWidth;
447 } else {
448 this.zdyHeight = highest;
449 highest = 0;
450 }
451 } else {
452 //有且仅有独立层户
453 if (this.$refs.zrzDlch != undefined) {
454 this.zdyWidth = this.$refs.zrzDlch.offsetWidth + 20;
455 }
456 }
457 //计算逻辑幢下的幢单元和层户的高度
458 this.ljzzdyHeight = 0;
459 if (this.$refs.ljzzdy != undefined && this.$refs.ljzzdy.length > 0) {
460 //判断自然幢下有没有比层户高的幢单元
461 let higher = true;
462 let zrzhighest = 0;
463 //记录最高的幢单元高度 默认为第一个幢单元高度
464 zrzhighest = this.$refs.ljzzdy[0].offsetHeight;
465 this.$refs.ljzzdy.forEach((item) => {
466 this.ljzcHeight = item.offsetHeight > this.ljzcHeight ? item.offsetHeight : this.ljzcHeight;
467 zrzhighest = zrzhighest > item.offsetHeight ? zrzhighest : item.offsetHeight;
468 });
469 //判断有无独立层户
470 if (this.$refs.ljzch != undefined) {
471 //计算自然幢下的幢单元高度，如果有比层户高的幢单元，则幢单元高度设为最高的幢单元高度，如果没有，则设为层户高度
472 higher = zrzhighest > this.$refs.ljzch.offsetHeight ? true : false;
473 this.$nextTick(() => {
474 this.ljzzdyHeight = higher ? zrzhighest : this.$refs.ljzch.offsetHeight;
475 zrzhighest = 0;
476 });
477 } else {
478 this.$nextTick(() => {
479 this.ljzzdyHeight = zrzhighest;
480 zrzhighest = 0;
481 });
482 }
483 } else {
484
485 }
486 this.$nextTick(() => {
487 this.lpbContentWidth = this.zdyWidth > this.ljzWidth ? this.zdyWidth - 20 : this.ljzWidth - 20;
488 if (this.lpbContentWidth == 0) {
489 //his.lpbContentWidth = this.$refs.lpbContent.offsetWidth
490 }
491 })
492 },
493 //户单击事件
494 handleTdClick (e, bsm, hs) {
495 let self = this;
496 // 开启延时器，200ms的间隔区分单击和双击，解决双击时执行两次单击事件
497 clearTimeout(self.time);
498 self.time = setTimeout(() => {
499 this.closeMenu()
500 //判断点击的户是否选中
501 if (e.className.indexOf("tdSelect") == -1) {
502 //未选中→选中
503 e.className = "tdSelect"; //加边框
504 this.hbsmList.push(bsm); // 将户bsm放进hbsmList
505 this.hqsztList.push(hs.qszt); // 将户qszt放进hqsztList
506 switch (this.lpbParent) {
507 case 'isHbfg':
508 self.fghbChoosedList.push(hs);
509 break;
510 case 'isFwsxbg':
511
512 break;
513 case 'isCxlz':
514
515 break;
516 case 'isLpb':
517 this.$parent.getHbsm(this.hbsmList, false);
518 this.$parent.getQsztList(this.hqsztList, false);
519 break;
520
521 default:
522 break;
523 }
524 } else {
525 //选中→未选中
526 e.className = "";
527 this.hbsmList = this.hbsmList.filter(i => i != bsm);
528 this.hqsztList = this.hqsztList.filter(i => i != hs.qszt);
529 switch (this.lpbParent) {
530 case 'isHbfg':
531 self.fghbChoosedList = self.fghbChoosedList.filter(i => i != hs)
532 break;
533 case 'isFwsxbg':
534
535 break;
536 case 'isCxlz':
537
538 break;
539 case 'isLpb':
540 this.hbsmList = this.hbsmList.filter(i => i != bsm);
541 this.hqsztList = this.hqsztList.filter(i => i != hs.qszt);
542 this.$parent.getHbsm(this.hbsmList, false);
543 this.$parent.getQsztList(this.hqsztList, false);
544 break;
545
546 default:
547 break;
548 }
549 }
550 }, 200);
551 },
552 //户双击事件
553 dbclick (bsm) {
554 clearTimeout(this.time);
555 this.hbsm = bsm;
556 this.$store.state.hbsm = bsm;
557 this.hbjVisible = true;
558 this.$nextTick(function () {
559 this.$refs.hbj.$refs.hbj.getHInfo(this.hbsm);
560 });
561 // if (this.isHbfg) {
562
563 // }else{
564 // this.hbsmList.push(bsm); // 将户bsm放进hbsmList
565 // this.$parent.getHbsm(bsm, true);
566 // }
567 },
568 //删除多重数组中的某一项
569 deleteArrOption (arr, item) {
570 for (var i = arr.length; i > 0; i--) {
571 if (arr[i - 1] == item) {
572 arr.splice(i - 1, 1);
573 }
574 }
575 },
576 //清除选中户
577 clearChoosedH () {
578 // this.$nextTick(() => {
579 //将每个选中的户的选中状态清除
580 this.$refs.hBsm.forEach((item) => {
581 if (item.className == "tdSelect") {
582 item.className = "";
583 }
584 });
585 // 清空hbsmList
586 this.hbsmList = [];
587 this.hqsztList = [];
588 // });
589 },
590 //户右键点击事件
591 openMenu (e, item, type) {
592 this.lpbChLeft = e.pageX;
593 this.lpbChTop = e.pageY;
594 this.chData = item;
595 switch (this.lpbParent) {
596 case 'isHbfg':
597 this.rightClickFlag = this.isHb ? 'hb' : 'fg';
598 if (this.fghbChoosedList.length > 1) {
599 //合并
600 this.lpbChVisible = this.hbsmList.indexOf(this.chData.bsm) > -1 ? true : false;
601 //判断选中户可以执行的合并类型
602 let chIsSame = this.fghbChoosedList.every((item) => {
603 return item.ch == this.fghbChoosedList[0].ch;
604 });
605 let hhIsSame = this.fghbChoosedList.every((item) => {
606 return item.hh == this.fghbChoosedList[0].hh;
607 });
608 this.$nextTick(() => {
609 if (chIsSame) {
610 this.canHb = 'zyhb'
611 } else if (hhIsSame) {
612 this.canHb = 'sxhb'
613 } else {
614 this.canHb = ''
615 }
616 })
617 } else {
618 //分割
619 this.lpbChVisible = this.hbsmList.indexOf(this.chData.bsm) > -1 ? true : false;
620 this.fgData.oldbsm = item.bsm;
621 console.log(item, 'item');
622 //判断户的实际sjcs为1，只能水平分割
623 this.fgData.fgfx = item.sjcs == 1 ? 0 : 1;
624 if (item.sjcs == 1) {
625 //判断户的实际sjcs为1，只能水平分割
626 this.fgData.fgfx = 0;
627 this.fgData.fghs = '';
628 } else {
629 this.fgData.fgfx = 1;
630 //判断户的实际sjhs不为1，分割户数为sjhs的值
631 this.fgData.fghs = item.sjcs;
632 }
633 }
634 break;
635 case 'isFwsxbg':
636 if (this.hbsmList[0] == item.bsm) {
637 this.rightClickFlag = 'fwsxbg';
638 this.lpbChVisible = true;
639 } else {
640 this.lpbChVisible = false;
641 }
642 break;
643 case 'isCxlz':
644 this.rightClickFlag = 'cxlz';
645 this.lpbChVisible = this.hbsmList.indexOf(this.chData.bsm) > -1 ? true : false;
646 break;
647 case 'isLpb':
648 this.rightClickFlag = type;
649 this.lpbChVisible = true;
650 break;
651
652 default:
653 break;
654 }
655 },
656 // 户单元状态点击事件
657 hDyztClick (e, bsm, hs) {
658 this.handleTdClick(e.target.parentNode, bsm, hs);
659 },
660 dyztIconClick () {
661
662 },
663 // 层选中事件
664 handleClickC (e, item) {
665 if (this.lpbParent == 'isLpb') {
666 //判断点击的层是否选中
667 if (e.target.className.indexOf("tdSelect") == -1) {
668 //未选中→选中
669 e.target.className += " tdSelect"; //加边框
670 this.cbsmList.push(item.bsm);
671 } else {
672 //选中→未选中
673 e.target.className = "floor";
674 this.deleteArrOption(this.cbsmList, item.bsm);
675 }
676 this.$parent.getCbsm(this.cbsmList);
677 } else {
678
679 }
680 },
681 //关闭右键菜单
682 closeMenu () {
683 this.lpbChVisible = false;
684 },
685 //户右键菜单 start
686 handleAddH () { },
687 handleMoveH () {
688 // 移动户
689 console.log(this.chData, "chData");
690 console.log(this.$parent.scyclx, "实预测类型");
691 this.moveHvisible = true;
692 },
693 moveHClose () {
694 this.moveHvisible = false;
695 },
696 handleDeleteH () { },
697 handleSyczh () { },
698 //end
699 // 层右键菜单 start
700 //添加
701 handleAddC (type) {
702 this.addCData.title = type == "up" ? "向上添加层" : "向下添加层";
703 this.addCVisible = true;
704 this.addCData.sjc =
705 type == "up"
706 ? Number(this.chData.sjc) + 1
707 : Number(this.chData.sjc) - 1;
708 this.addCData.cbsm = this.chData.bsm;
709 this.addCData.scyclx = this.$parent.scyclx;
710 },
711 //删除
712 handleDeleteC () {
713 let params = {
714 cbsm: this.chData.bsm,
715 scyclx: this.$parent.scyclx,
716 };
717 this.$confirm("是否确认删除该层?", "提示", {
718 confirmButtonText: "确定",
719 cancelButtonText: "取消",
720 type: "warning",
721 })
722 .then(() => {
723 deleteCByBsm(params).then((res) => {
724 if (res.code == 200) {
725 this.$message({
726 message: "删除成功",
727 type: "success",
728 });
729 this.getLpb(this.$store.state.zrzbsm, this.$parent.scyclx);
730 } else {
731 this.$message({
732 message: res.message,
733 type: "warning",
734 });
735 }
736 });
737 })
738 .catch(() => { });
739 },
740 //确认添加
741 saveAddC () {
742 insertUpDownC(this.addCData).then((res) => {
743 if (res.code == 200) {
744 this.$message({
745 message: "添加成功",
746 type: "success",
747 });
748 this.getLpb(this.$store.state.zrzbsm, this.$parent.scyclx);
749 this.addCVisible = false;
750 } else {
751 this.$message({
752 message: res.message,
753 type: "warning",
754 });
755 }
756 });
757 },
758 //户合并
759 handleHb (type) {
760 let olbBsms = '';
761 console.log(this.fghbChoosedList, 'fghbChoosedList');
762 this.hbsmList.forEach((item, index) => {
763 olbBsms += index < this.hbsmList.length - 1 ? item + ',' : item
764 })
765 if (type == this.canHb) {
766 this.$confirm("是否确认合并选中户?", "提示", {
767 confirmButtonText: "确定",
768 cancelButtonText: "取消",
769 type: "warning",
770 })
771 .then(() => {
772 //确定合并 调用合并接口 this.hbsmList为选中户bsm数组 TO DO
773 let params = {
774 "newuserbsm": "",
775 "oldBsms": olbBsms,
776 "scyclx": this.$parent.scyclx,
777 "ljzbsm": this.fghbChoosedList[0].ljzbsm,
778 "zdybsm": this.fghbChoosedList[0].zdybsm,
779 "zrzbsm": this.fghbChoosedList[0].zrzbsm
780 }
781 vm.loadingShow('请求发送中');
782 // hhb(params).then((res) => {
783 // vm.loadingHide();
784 // if (res.code == 200) {
785 // Message.success('合并成功');
786 // // 清除选中户
787 // this.clearChoosedH();
788 // this.fghbChoosedList = [];
789 // // 更新楼盘表
790 // this.getLpb(this.zrzbsm, this.$parent.scyclx);
791 // } else {
792 // Message.error(res.message);
793 // }
794 // })
795 // .catch((error) => {
796 // vm.loadingHide();
797 // console.log(error);
798 // });
799 })
800 .catch(() => { });
801 } else {
802
803 }
804 },
805 //户分割
806 handleFg () {
807 this.hfgDialogVisible = true;
808 },
809 //户分割保存
810 savefgData () {
811 vm.loadingShow('请求发送中');
812 // hfg(this.fgData).then((res) => {
813 // vm.loadingHide();
814 // if (res.code == 200) {
815 // Message.success('分割成功');
816 // // 清除选中户
817 // this.hfgDialogVisible = false
818 // this.clearChoosedH();
819 // this.fghbChoosedList = [];
820 // // 更新楼盘表
821 // this.getLpb(this.zrzbsm, this.$parent.scyclx);
822 // } else {
823 // Message.error(res.message);
824 // }
825 // })
826 // .catch((error) => {
827 // vm.loadingHide();
828 // console.log(error);
829 // });
830 },
831 //范围属性变更
832 handleFwsxbg () {
833 let params = { bsm: this.chData.bsm, type: 'h' };
834 this.$confirm('是否确定范围属性变更?', '提示', {
835 confirmButtonText: '确定',
836 cancelButtonText: '取消',
837 type: 'warning'
838 }).then(() => {
839 // fwsxbgbl(params)
840 // .then((res) => {
841 // if (res.code == 200) {
842 // this.$message({
843 // message: '变更成功',
844 // type: "success",
845 // });
846 // this.getLpb(this.zrzbsm, this.scyclx);
847 // } else {
848 // this.$message({
849 // message: res.message,
850 // type: "warning",
851 // })
852 // }
853 // }).catch((error) => {
854
855 // });
856 }).catch(() => {
857
858 });
859 },
860 //户重新落宗
861 handleCxlz () {
862 if (this.hbsmList.indexOf(this.chData.bsm) == -1) {
863 this.hbsmList.push(this.chData.bsm);
864 }
865 this.hcxlzVisible = true
866 },
867 //楼盘表户全选
868 lpbSelectAll (val) {
869 if (val) {
870 this.$refs.hBsm.forEach((item) => {
871 item.className = "tdSelect";
872 this.hbsmList.push(item.dataset.bsm); // 将户bsm放进hbsmList
873 this.hqsztList.push(item.dataset.qszt)
874 });
875 } else {
876 this.$refs.hBsm.forEach((item) => {
877 item.className = "";
878 this.hbsmList = [];
879 this.hqsztList = [];
880 });
881 }
882 this.$nextTick(() => {
883 this.$parent.getHbsm(this.hbsmList, false);
884 this.$parent.getQsztList(this.hqsztList, false);
885 })
886 },
887 //幢单元全选
888 zdySelectAll (val, cs) {
889 let zdyHbsmList = [];
890 let zdyHqsztList = [];
891 cs.forEach(i => {
892 i.hs.forEach(j => {
893 zdyHbsmList.push(j.bsm)
894 zdyHqsztList.push(j.qszt)
895 })
896 });
897 if (val) {
898 this.$nextTick(() => {
899 this.$refs.hBsm.forEach((item) => {
900 if (zdyHbsmList.indexOf(item.dataset.bsm) > -1) {
901 item.className = "tdSelect";
902 }
903 });
904 this.hbsmList = this.hbsmList.concat(zdyHbsmList);
905 this.hqsztList = this.hqsztList.concat(zdyHqsztList);
906 })
907 } else {
908 this.$refs.hBsm.forEach((item) => {
909 console.log(item.dataset.bsm);
910 if (zdyHbsmList.indexOf(item.dataset.bsm) > -1) {
911 item.className = "";
912 }
913 zdyHbsmList.forEach(j => {
914 if (item.dataset.bsm == j) {
915 this.hbsmList = this.hbsmList.filter(i => i != j)
916 }
917 })
918 zdyHqsztList.forEach(j => {
919 if (item.dataset.qszt == j) {
920 this.hqsztList = this.hqsztList.filter(i => i != j)
921 }
922 })
923 });
924 }
925 this.$nextTick(() => {
926 this.$parent.getHbsm(this.hbsmList, false);
927 this.$parent.getQsztList(this.hqsztList, false);
928 })
929 },
930 //逻辑幢、幢单元、层双击
931 openZxx (bsm, type) {
932 if (this.lpbParent == 'isLpb') {
933 this.$parent.taskTitle = '编辑';
934 this.$parent.dialogVisible = true;
935 this.$parent.curBsm = bsm;
936 this.$parent.menuType = type;
937 }
938 }
939 },
940 computed: {
941 createFlagChange () {
942 return this.$parent.createFlag;
943 },
944 legendToggleFlagChange () {
945 return this.$parent.legendToggleFlag;
946 },
947 scyclx () {
948 return this.$parent.scyclx;
949 },
950 },
951 watch: {
952 scyclx (n) {
953 this.hqsztList = [];
954 // this.getLpb(this.$store.state.zrzbsm, n);
955 if (n == '0') {
956 this.lpbData = this.yclpbData;
957 } else {
958 this.lpbData = this.sclpbData;
959 }
960 },
961 //监听有无通过输入框查询选择到的户,如果有，将其bsm放入hbsmList
962 searchNum (n) {
963 // 渲染查询到的户
964 this.$nextTick(() => {
965 this.$refs.hBsm.forEach((item) => {
966 if (item.className == "tdSelect") {
967 // console.log(item.offsetLeft,'offsetLeft');
968 // console.log(item.offsetTop,'offsetHeight');
969 //定位到最后一个户所在位置
970 this.$refs.lpbContent.scrollTop = item.offsetTop;
971 this.$refs.lpbContent.scrollLeft = item.offsetLeft;
972 console.log(item.dataset.bsm, "item.dataset.bsm");
973 // 判断hbsmList中是否已经存在
974 if (this.hbsmList.indexOf(item.dataset.bsm) == -1) {
975 this.hbsmList.push(item.dataset.bsm);
976 this.hqsztList.push(item.dataset.qszt);
977 }
978 }
979 });
980 });
981 },
982 //父组件中选择单元状态改变选中户的边框颜色
983 choosedList (n) {
984 if (n.length > 0) {
985 this.$refs.hBsm.forEach((item) => {
986 this.choosedList.forEach((i, ind) => {
987 if (item.dataset.bsm == i) {
988 if (ind == 0) {
989 //定位到第一个户所在位置
990 this.$refs.lpbContent.scrollTop = item.offsetTop;
991 this.$refs.lpbContent.scrollLeft = item.offsetLeft;
992 }
993 item.style.border = '1px solid ' + this.borderColor;
994 item.className = "tdSelect"
995 }
996 });
997 });
998 }
999 },
1000 lpbChVisible (value) {
1001 if (value) {
1002 document.body.addEventListener("click", this.closeMenu);
1003 } else {
1004 document.body.removeEventListener("click", this.closeMenu);
1005 }
1006 },
1007 },
1008 };
1009 </script>
1010 <style scoped lang="scss">
1011 .lpbContent-wrap {
1012 width: 100%;
1013 height: 100%;
1014 overflow: hidden;
1015
1016 .lpbContent {
1017 width: 100%;
1018 height: 100%;
1019 position: relative;
1020 overflow: scroll;
1021 -webkit-user-select: none;
1022 -moz-user-select: none;
1023 -ms-user-select: none;
1024 user-select: none;
1025
1026 .ljz-wrap {
1027 height: auto;
1028 overflow: hidden;
1029
1030 .ljz {
1031 // margin-bottom: 20px;
1032 display: table;
1033 margin-top: 30px;
1034
1035 // position: relative;
1036 .ljz-zdy-wrap {
1037 width: auto;
1038 display: table;
1039 float: left;
1040
1041 .ljz-zdy {
1042 height: auto;
1043 float: left;
1044 position: relative;
1045
1046 table {
1047 bottom: 40px;
1048 }
1049
1050 .zdy-name {
1051 width: 100%;
1052 bottom: 0;
1053 position: absolute;
1054 height: 40px;
1055 // background-color: rosybrown;
1056 // border:1px solid #E6E6E6
1057 }
1058
1059 // .chTable-wrap{
1060 // position: absolute;
1061 // bottom: 40px;
1062 // }
1063 }
1064 }
1065
1066 div:last-child {
1067 margin-right: 0;
1068 }
1069
1070 .ljz-ch {
1071 float: left;
1072 }
1073
1074 .ljz-zdy:last-child {
1075 margin-right: 0;
1076 }
1077
1078 .column-reverse {
1079 display: flex;
1080 flex-direction: column-reverse;
1081 }
1082
1083 // }
1084 .ljz-name {
1085 width: calc(100% - 32px);
1086 height: 40px;
1087 // background-color: darkorange;
1088
1089 }
1090 }
1091
1092 .mt30 {
1093 margin-top: 30px;
1094 }
1095
1096 .mt60 {
1097 margin-top: 60px;
1098 }
1099
1100 div:last-child {
1101 margin-right: 0;
1102 }
1103 }
1104
1105 .zdy-wrap {
1106 height: auto;
1107 overflow: hidden;
1108
1109 // margin-top: 30px;
1110 .zdy {
1111 float: left;
1112 margin-right: 20px;
1113
1114 .zdy-zdy-wrap {
1115 .zdy-zdy {
1116 height: auto;
1117 margin-right: 20px;
1118 display: inline-table;
1119
1120 .zdy-name {
1121 bottom: 0;
1122 // background-color: blanchedalmond;
1123 // border:1px solid #E6E6E6
1124 }
1125 }
1126
1127 .zdy-zdy:last-child {
1128 margin-right: 0;
1129 }
1130 }
1131
1132 .zdy-name {
1133 width: calc;
1134 height: 40px;
1135 // background-color: rosybrown;
1136 border: 1px solid #E6E6E6
1137 }
1138 }
1139
1140 .column-reverse {
1141 display: flex;
1142 flex-direction: column-reverse;
1143 }
1144 }
1145
1146 // 公共部分样式 start
1147 .chTable {
1148
1149 // position: relative;
1150 tr {
1151 .floor {
1152 background-color: #fff;
1153 }
1154
1155 td {
1156 min-width: 138px;
1157 height: 72px;
1158 line-height: 72px;
1159 text-align: center;
1160 cursor: pointer;
1161 position: relative;
1162
1163 .hqszt {
1164 display: inline-block;
1165 width: 16px;
1166 height: 16px;
1167 font-size: 12px;
1168 line-height: 16px;
1169 position: absolute;
1170 left: 6px;
1171 top: 6px;
1172 border: 1px solid;
1173 border-radius: 8px;
1174 }
1175
1176 .lin {
1177 color: #F7B500;
1178 border-color: #F7B500;
1179 }
1180
1181 .zheng {
1182 color: #1AD6E1;
1183 border-color: #1AD6E1;
1184 }
1185
1186 .xian {
1187 color: #45AEFD;
1188 border-color: #45AEFD;
1189 }
1190
1191 .dyzt {
1192 user-select: none;
1193 width: 138px;
1194 height: 18px;
1195 position: absolute;
1196 // background: orange;
1197 bottom: 32px;
1198 box-sizing: border-box;
1199 padding: 0 6px;
1200
1201 li {
1202 display: inline-block;
1203 width: 18px;
1204 height: 18px;
1205 font-size: 12px;
1206 line-height: 18px;
1207 color: #ffffff;
1208 border: 1px solid;
1209 border-radius: 9px;
1210 }
1211 }
1212 }
1213
1214 .tdSelect {
1215 border: 1px solid #006cff !important;
1216 background-image: url("./images/tdSelect.png");
1217 background-repeat: no-repeat;
1218 background-position: right top;
1219 background-size: 30px;
1220 }
1221
1222 .hasBorder {
1223 border-width: 1px;
1224 border-style: solid;
1225 }
1226 }
1227 }
1228
1229 .name {
1230 line-height: 40px;
1231 text-align: center;
1232 display: table-footer-group;
1233
1234 p {
1235 width: calc(100% - 2px);
1236 height: 100%;
1237 border: 1px solid #E6E6E6;
1238 }
1239 }
1240
1241 // end
1242 }
1243
1244 .column-reverse {
1245 display: flex;
1246 flex-direction: column-reverse;
1247 }
1248
1249 .zrz {
1250 height: 60px;
1251 line-height: 60px;
1252 background-color: #ffffff;
1253 border: 1px solid #E6E6E6;
1254 // position: relative;
1255 // bottom: 66px;
1256 text-align: center;
1257 transition: 0.5s;
1258 }
1259
1260 .cantHb {
1261 opacity: .5;
1262 cursor: not-allowed;
1263 }
1264
1265 .btnGroup {
1266 margin: 20px auto 0;
1267 width: 150px;
1268 }
1269
1270 .el-checkbox {
1271 font-size: 16px;
1272
1273 /deep/.el-checkbox__label {
1274 font-size: 16px;
1275 }
1276
1277 /deep/ .el-checkbox__inner {
1278 width: 16px;
1279 height: 16px;
1280 }
1281
1282 /deep/ .el-checkbox__inner::after {
1283 height: 9px;
1284 left: 4px;
1285 top: 0px;
1286 width: 5px;
1287 }
1288
1289 /deep/ .el-checkbox__input {
1290 top: 1px;
1291 }
1292 }
1293
1294 .hbjDialog {
1295 /deep/.el-dialog {
1296 margin-top: 10vh !important;
1297 }
1298 }
1299 }
1300 </style>
1 <template>
2 <div class="zdy-content">
3 <el-form :model="form" :rules="rules" ref="form" label-width="110px" size="small">
4
5 <table border="1" width="100%" cellspacing="0" cellpadding="0" class="hTable">
6 <tbody>
7 <tr height="30">
8 <td colspan="12" align="center">
9 <font size="4">幢单元基本信息</font>
10 </td>
11 </tr>
12 <tr height="30">
13 <td colspan="2" align="center" class="tdright">幢单元号</td>
14 <td colspan="4">
15 <el-input v-model="form.zdyh"></el-input>
16 </td>
17 <td colspan="2" align="center" class="tdright"><i class="requisite">*</i>幢单元名称</td>
18 <td colspan="4">
19 <el-input v-model="form.zdymc" ref="zdymc"></el-input>
20 </td>
21 </tr>
22 <tr height="30">
23 <td colspan="2" align="center" class="tdright">地上层数</td>
24 <td colspan="4">
25 <el-input v-model="form.dscs"></el-input>
26 </td>
27 <td colspan="2" align="center" class="tdright">地下层数</td>
28 <td colspan="4">
29 <el-input v-model="form.dxcs"></el-input>
30 </td>
31 </tr>
32 <tr height="30">
33 <td colspan="2" align="center" class="tdright">总层数</td>
34 <td colspan="4">
35 <el-input v-model="form.zcs"></el-input>
36 </td>
37 <td colspan="2" align="center" class="tdright">备注</td>
38 <td colspan="4">
39 <el-input v-model="form.bz"></el-input>
40 </td>
41 </tr>
42 </tbody>
43 </table>
44 </el-form>
45 </div>
46 </template>
47
48 <script>
49
50 // import { insertZdyInfo } from "@api/lpb"
51 // import { getQjZdyDetailById, updateQjZdy } from "@api/zdy"
52 export default {
53 name: "index",
54 components: {},
55 props: {
56 zdybsm: {
57 type: String,
58 default: '',
59 }
60 },
61 data () {
62 return {
63 form: {
64 zdyh: '',
65 zdymc: '',
66 dscs: '',
67 dxcs: '',
68 zcs: '',
69 bz: '',
70 },
71 rules: {
72 zdyh: [
73 { required: true, message: '幢单元号不能为空', trigger: 'blur' },
74 { min: 5, max: 50, message: '长度最少 5 个字符', trigger: 'blur' }
75 ],
76 zdymc: [
77 { required: true, message: '名称不能为空', trigger: 'change' }
78 ],
79 dscs: [
80 { required: true, message: '地上层数不能为空', trigger: 'blur' },
81 { type: 'number', message: '必须是数字', trigger: 'blur' }
82 ],
83 dxcs: [
84 { required: true, message: '地下层数不能为空', trigger: 'blur' },
85 { type: 'number', message: '必须是数字' }
86 ],
87 zcs: [
88 { required: true, message: '名称不能为空', trigger: 'change' }
89 ]
90 }
91 }
92 },
93 methods: {
94 //在自然幢节点上添加幢单元只需传zrzbsm，ljzbsm为'';在逻辑幢上添加幢单元时需要同时传入zrzbsm和ljzbsm
95 submitForm (formName, zrzbsm, ljzbsm) {
96 this.form.zrzbsm = zrzbsm;
97 this.form.ljzbsm = zrzbsm == ljzbsm ? '' : ljzbsm;
98 if (this.form.zdymc == '') {
99 this.$message.warning("请完善表单后再继续操作");
100 this.$refs.zdymc.$el.style.border = '1px solid red';
101 } else {
102 //判断zdybsm是否为空，不为空的时候是编辑，为空的时候是新增
103 if (this.zdybsm == '') {
104 this.$refs[formName].validate((valid) => {
105 if (valid) {
106 // insertZdyInfo(this.form).then((res) => {
107 // if (res.code === 200) {
108 // this.$message.success("保存成功!")
109 // //更新树结构数据
110 // this.$parent.$parent.getLpbMenuTree(zrzbsm);
111 // //关闭弹框
112 // this.$parent.$parent.closeDaialog()
113 // }
114 // return true;
115 // })
116 } else {
117 console.log('error submit!!');
118 return false;
119 }
120 });
121 } else {
122 //编辑幢单元接口
123 updateQjZdy(this.form).then((res) => {
124 if (res.code === 200) {
125 this.$message.success("保存成功")
126 }
127 })
128 }
129 }
130 },
131 getZdyInfo (bsm) {
132 //查询幢单元信息接口
133 getQjZdyDetailById(bsm).then((res) => {
134 if (res.code === 200) {
135 this.form = res.result;
136 }
137 })
138
139 },
140 reset () {
141 this.form = {
142 zdyh: '',
143 zdymc: '',
144 dscs: '',
145 dxcs: '',
146 zcs: '',
147 bz: '',
148 }
149 }
150 },
151 watch: {
152 zdybsm: {
153 handler: function (item) {
154 if (item != '' && this.$parent.$parent.menuType == 'zdy') {
155 this.getZdyInfo(item)
156 }
157 },
158 immediate: true
159 },
160 "form.zdymc": {
161 handler: function (item) {
162 if (item != '') {
163 this.$refs.zdymc.$el.style.border = '';
164 }
165 },
166 immediate: true
167 },
168 }
169 }
170 </script>
171
172 <style scoped lang="scss">
173 /deep/.el-input__inner {
174 width: 100%;
175 border: 0;
176 }
177
178 table {
179 background: #fff;
180 table-layout: fixed;
181 }
182 </style>
...\ No newline at end of file ...\ No newline at end of file
...@@ -116,7 +116,7 @@ export default { ...@@ -116,7 +116,7 @@ export default {
116 processZoomOut (zoomStep = 0.1) { 116 processZoomOut (zoomStep = 0.1) {
117 const newZoom = Math.floor(this.defaultZoom * 100 - zoomStep * 100) / 100 117 const newZoom = Math.floor(this.defaultZoom * 100 - zoomStep * 100) / 100
118 if (newZoom < 0.2) { 118 if (newZoom < 0.2) {
119 throw new Error('[Process Designer Warn ]: The zoom ratio cannot be less than 0.2') 119 throw new Error('[Process Designer Warn ]: The zoom ratio cannot be scss than 0.2')
120 } 120 }
121 this.defaultZoom = newZoom 121 this.defaultZoom = newZoom
122 this.bpmnViewer.get('canvas').zoom(this.defaultZoom) 122 this.bpmnViewer.get('canvas').zoom(this.defaultZoom)
......
...@@ -21,7 +21,7 @@ ...@@ -21,7 +21,7 @@
21 <div class="containerFrame"> 21 <div class="containerFrame">
22 <!-- 左侧菜单栏 --> 22 <!-- 左侧菜单栏 -->
23 <div class="leftmenu" :class="{ 'animation-map-drawer': isShowdrawer }"> 23 <div class="leftmenu" :class="{ 'animation-map-drawer': isShowdrawer }">
24 <div class="title" @click="unitClick(-1)" v-if="showBatch">{{batchButtonName}}</div> 24 <div class="title" @click="unitClick(-1)" v-if="showBatch">{{ batchButtonName }}</div>
25 <div v-if="this.isShowdrawer"> 25 <div v-if="this.isShowdrawer">
26 <div class="title"> 26 <div class="title">
27 申请单元列表({{ unitData.length }}) 27 申请单元列表({{ unitData.length }})
...@@ -162,7 +162,7 @@ export default { ...@@ -162,7 +162,7 @@ export default {
162 .then(() => { 162 .then(() => {
163 var formdata = new FormData(); 163 var formdata = new FormData();
164 formdata.append("bsmSldyList", item.bsmSldy.split(",")); 164 formdata.append("bsmSldyList", item.bsmSldy.split(","));
165 formdata.append("bsmSlsq",this.bsmSlsq); 165 formdata.append("bsmSlsq", this.bsmSlsq);
166 deleteFlow(formdata).then((res) => { 166 deleteFlow(formdata).then((res) => {
167 if (res.code == 200) { 167 if (res.code == 200) {
168 this.$message.success("删除成功"); 168 this.$message.success("删除成功");
...@@ -226,7 +226,7 @@ export default { ...@@ -226,7 +226,7 @@ export default {
226 operation (index, item) { 226 operation (index, item) {
227 //按钮 B0:选择不动产单元 B1:流程图 B2:材料分屏 B3:材料导入 B4:登记簿 B5:证书预览 B6：打印申请书 B7:证书领取 B8:楼盘表 B9:登簿 227 //按钮 B0:选择不动产单元 B1:流程图 B2:材料分屏 B3:材料导入 B4:登记簿 B5:证书预览 B6：打印申请书 B7:证书领取 B8:楼盘表 B9:登簿
228 //操作按钮 登簿：record 转件：transfer 退回：back 退出：signout 228 //操作按钮 登簿：record 转件：transfer 退回：back 退出：signout
229 let that = this; 229 let that = this;
230 switch (item.value) { 230 switch (item.value) {
231 case "B0": 231 case "B0":
232 // let type = queueDjywmc(this.$route.query.sqywbm) 232 // let type = queueDjywmc(this.$route.query.sqywbm)
...@@ -235,10 +235,7 @@ export default { ...@@ -235,10 +235,7 @@ export default {
235 case "B1": 235 case "B1":
236 getWorkFlowImage(this.bsmSlsq, this.$route.query.bestepid).then(res => { 236 getWorkFlowImage(this.bsmSlsq, this.$route.query.bestepid).then(res => {
237 let { result } = res 237 let { result } = res
238 this.$popup({ 238 this.$popup("流程图", "workflow/components/processViewer", {
239 title: "流程图",
240 height: '500px',
241 editItem: "workflow/components/processViewer",
242 formData: { 239 formData: {
243 xml: result.xml, 240 xml: result.xml,
244 finishedInfo: { 241 finishedInfo: {
...@@ -383,16 +380,16 @@ export default { ...@@ -383,16 +380,16 @@ export default {
383 type: "warning", //提示类型 success/info/warning/error 380 type: "warning", //提示类型 success/info/warning/error
384 }).then(function () { 381 }).then(function () {
385 record(formdata).then((res) => { 382 record(formdata).then((res) => {
386 if (res.code === 200) { 383 if (res.code === 200) {
387 if(res.result.length===1){ 384 if (res.result.length === 1) {
388 res.result[0].state? that.$alert("登簿成功！"): that.$alert(res.result[0].msg);; 385 res.result[0].state ? that.$alert("登簿成功！") : that.$alert(res.result[0].msg);;
389 } 386 }
390 else{ 387 else {
391 that.$alert('<div>'+res.result[0].ywh+','+res.result[0].msg+'</div>', '登簿明细', { 388 that.$alert('<div>' + res.result[0].ywh + ',' + res.result[0].msg + '</div>', '登簿明细', {
392 dangerouslyUseHTMLString: true 389 dangerouslyUseHTMLString: true
393 }); 390 });
394 } 391 }
395 }else{ 392 } else {
396 that.$alert(res.message); 393 that.$alert(res.message);
397 } 394 }
398 }); 395 });
...@@ -407,14 +404,14 @@ export default { ...@@ -407,14 +404,14 @@ export default {
407 formdata.append("bestepid", this.bestepid); 404 formdata.append("bestepid", this.bestepid);
408 leftMenu(formdata).then((res) => { 405 leftMenu(formdata).then((res) => {
409 if (res.code === 200) { 406 if (res.code === 200) {
410 if(res.result){ 407 if (res.result) {
411 this.unitData = res.result; 408 this.unitData = res.result;
412 this.currentSelectProps = res.result[0]; 409 this.currentSelectProps = res.result[0];
413 this.judgeBatchShow(); 410 this.judgeBatchShow();
414 if(this.showBatch){ 411 if (this.showBatch) {
415 //满足批量查封/批量抵押按钮出现 即先展示批量表单 412 //满足批量查封/批量抵押按钮出现 即先展示批量表单
416 this.unitClick(-1); 413 this.unitClick(-1);
417 }else{ 414 } else {
418 //默认选择单元列表第一个 415 //默认选择单元列表第一个
419 this.unitClick(0); 416 this.unitClick(0);
420 } 417 }
...@@ -424,16 +421,16 @@ export default { ...@@ -424,16 +421,16 @@ export default {
424 }, 421 },
425 //申请单元点击事件 422 //申请单元点击事件
426 unitClick (index) { 423 unitClick (index) {
427 424
428 if(index >= 0){ 425 if (index >= 0) {
429 this.currentSelectProps = this.unitData[index]; 426 this.currentSelectProps = this.unitData[index];
430 this.currentSelectProps.batchOperation = false; 427 this.currentSelectProps.batchOperation = false;
431 }else{ 428 } else {
432 this.currentSelectProps.batchOperation = true; 429 this.currentSelectProps.batchOperation = true;
433 } 430 }
434 getStepFormInfo(this.currentSelectProps).then((res) => { 431 getStepFormInfo(this.currentSelectProps).then((res) => {
435 if (res.code === 200) { 432 if (res.code === 200) {
436 this.fresh += 1; 433 this.fresh += 1;
437 //获取单元对应的所有表单信息 434 //获取单元对应的所有表单信息
438 this.tabList = res.result; 435 this.tabList = res.result;
439 //默认加载第一个表单信息 436 //默认加载第一个表单信息
...@@ -455,11 +452,11 @@ export default { ...@@ -455,11 +452,11 @@ export default {
455 // } 452 // }
456 }, 453 },
457 //批量按钮判断 454 //批量按钮判断
458 judgeBatchShow() { 455 judgeBatchShow () {
459 this.showBatch = false; 456 this.showBatch = false;
460 let qllx = this.$route.query.sqywbm.substring(0,3); 457 let qllx = this.$route.query.sqywbm.substring(0, 3);
461 if(this.unitData.length > 1){ 458 if (this.unitData.length > 1) {
462 switch(qllx){ 459 switch (qllx) {
463 case 'B39': 460 case 'B39':
464 this.showBatch = true; 461 this.showBatch = true;
465 this.batchButtonName = '批量查封'; 462 this.batchButtonName = '批量查封';
...@@ -467,7 +464,7 @@ export default { ...@@ -467,7 +464,7 @@ export default {
467 case 'A37': 464 case 'A37':
468 this.showBatch = true; 465 this.showBatch = true;
469 this.batchButtonName = '批量抵押'; 466 this.batchButtonName = '批量抵押';
470 break; 467 break;
471 } 468 }
472 } 469 }
473 }, 470 },
...@@ -516,7 +513,7 @@ export default { ...@@ -516,7 +513,7 @@ export default {
516 window.close(); 513 window.close();
517 this.$emit("input", false); 514 this.$emit("input", false);
518 }, 1000); 515 }, 1000);
519 }else{ 516 } else {
520 instance.confirmButtonLoading = false; 517 instance.confirmButtonLoading = false;
521 instance.confirmButtonText = "确定"; 518 instance.confirmButtonText = "确定";
522 this.$message.error(res.message); 519 this.$message.error(res.message);
......
...@@ -6,8 +6,7 @@ ...@@ -6,8 +6,7 @@
6 <el-row> 6 <el-row>
7 <el-col :span="5"> 7 <el-col :span="5">
8 <el-form-item label="业务来源"> 8 <el-form-item label="业务来源">
9 <el-select v-model="queryForm.ywly" class="width100" @change="queryClick()" filterable clearable 9 <el-select v-model="queryForm.ywly" class="width100" filterable clearable placeholder="请选择业务来源">
10 placeholder="请选择业务来源">
11 <el-option v-for="item in dictData['ywly']" :key="item.dcode" :label="item.dname" :value="item.dcode"> 10 <el-option v-for="item in dictData['ywly']" :key="item.dcode" :label="item.dname" :value="item.dcode">
12 </el-option> 11 </el-option>
13 </el-select> 12 </el-select>
...@@ -15,8 +14,7 @@ ...@@ -15,8 +14,7 @@
15 </el-col> 14 </el-col>
16 <el-col :span="5"> 15 <el-col :span="5">
17 <el-form-item label="权利类型"> 16 <el-form-item label="权利类型">
18 <el-select v-model="queryForm.qllx" class="width100" @change="queryClick()" filterable clearable 17 <el-select v-model="queryForm.qllx" class="width100" filterable clearable placeholder="请选择权利类型">
19 placeholder="请选择权利类型">
20 <el-option v-for="item in dictData['A8']" :key="item.dcode" :label="item.dname" :value="item.dcode"> 18 <el-option v-for="item in dictData['A8']" :key="item.dcode" :label="item.dname" :value="item.dcode">
21 </el-option> 19 </el-option>
22 </el-select> 20 </el-select>
...@@ -24,8 +22,7 @@ ...@@ -24,8 +22,7 @@
24 </el-col> 22 </el-col>
25 <el-col :span="5"> 23 <el-col :span="5">
26 <el-form-item label="登记类型"> 24 <el-form-item label="登记类型">
27 <el-select v-model="queryForm.djlx" class="width100" @change="queryClick()" filterable clearable 25 <el-select v-model="queryForm.djlx" class="width100" filterable clearable placeholder="请选择登记类型">
28 placeholder="请选择登记类型">
29 <el-option v-for="item in dictData['A21']" :key="item.dcode" :label="item.dname" :value="item.dcode"> 26 <el-option v-for="item in dictData['A21']" :key="item.dcode" :label="item.dname" :value="item.dcode">
30 </el-option> 27 </el-option>
31 </el-select> 28 </el-select>
...@@ -33,15 +30,15 @@ ...@@ -33,15 +30,15 @@
33 </el-col> 30 </el-col>
34 <el-col :span="5"> 31 <el-col :span="5">
35 <el-form-item label="业务号"> 32 <el-form-item label="业务号">
36 <el-input placeholder="请输入业务号" v-model="queryForm.ywh" @clear="queryClick()" clearable class="width100"> 33 <el-input placeholder="请输入业务号" v-model="queryForm.ywh" @clear="queryClick" clearable class="width100">
37 </el-input> 34 </el-input>
38 </el-form-item> 35 </el-form-item>
39 </el-col> 36 </el-col>
40 37
41 <el-col :span="4" class="btnColRight"> 38 <el-col :span="4" class="btnColRight">
42 <el-form-item> 39 <el-form-item>
43 <el-button type="primary" native-type="submit" @click="queryClick()">查询</el-button> 40 <el-button type="primary" native-type="submit" @click="queryClick">查询</el-button>
44 <el-button @click="moreQueryClick()">高级查询</el-button> 41 <el-button @click="moreQueryClick">高级查询</el-button>
45 </el-form-item> 42 </el-form-item>
46 </el-col> 43 </el-col>
47 </el-row> 44 </el-row>
...@@ -58,7 +55,7 @@ ...@@ -58,7 +55,7 @@
58 </el-row> 55 </el-row>
59 </el-form> 56 </el-form>
60 </div> 57 </div>
61 <div class="from-clues-content"> 58 <div class="from-clues-content" id="dbx">
62 <lb-table :page-size="pageData.size" border @sort-change="handleSort" :current-page.sync="pageData.currentPage" 59 <lb-table :page-size="pageData.size" border @sort-change="handleSort" :current-page.sync="pageData.currentPage"
63 :heightNum="300" :total="tableData.total" @size-change="handleSizeChange" 60 :heightNum="300" :total="tableData.total" @size-change="handleSizeChange"
64 @p-current-change="handleCurrentChange" :column="tableData.columns" :data="tableData.data"> 61 @p-current-change="handleCurrentChange" :column="tableData.columns" :data="tableData.data">
...@@ -117,7 +114,7 @@ export default { ...@@ -117,7 +114,7 @@ export default {
117 }, 114 },
118 // 列表渲染接口 115 // 列表渲染接口
119 fetchData () { 116 fetchData () {
120 searchTaskToDo({ ...this.queryForm, ...this.pageData }).then(res => { 117 searchTaskToDo({ ...this.queryForm, ...this.pageData }, { 'target': '#dbx' }).then(res => {
121 if (res.code === 200) { 118 if (res.code === 200) {
122 let { total, records } = res.result 119 let { total, records } = res.result
123 records.forEach(item => { 120 records.forEach(item => {
...@@ -136,7 +133,6 @@ export default { ...@@ -136,7 +133,6 @@ export default {
136 queryClick () { 133 queryClick () {
137 this.fetchData() 134 this.fetchData()
138 }, 135 },
139
140 handelItem (index) { 136 handelItem (index) {
141 console.log(index); 137 console.log(index);
142 this.searchList.splice(index, 1) 138 this.searchList.splice(index, 1)
......
1 <template> 1 <template>
2 <div class="from-clues"> 2 <div class="from-clues" id="bdcql">
3 <!-- 表单部分 --> 3 <!-- 表单部分 -->
4 <div class="from-clues-header"> 4 <div class="from-clues-header">
5 <el-form :model="queryForm" ref="queryForm" label-width="100px"> 5 <el-form :model="queryForm" ref="queryForm" label-width="100px">
...@@ -87,7 +87,7 @@ export default { ...@@ -87,7 +87,7 @@ export default {
87 }, 87 },
88 fetchData () { 88 fetchData () {
89 this.queryForm.sqywbm = this.djywbm; 89 this.queryForm.sqywbm = this.djywbm;
90 selectQlxx({ ...this.queryForm, ...this.pageData }) 90 selectQlxx({ ...this.queryForm, ...this.pageData }, { 'target': '#bdcql' })
91 .then((res) => { 91 .then((res) => {
92 if (res.code === 200) { 92 if (res.code === 200) {
93 let { total, records } = res.result; 93 let { total, records } = res.result;
......
1 <template> 1 <template>
2 <div class="ywsq"> 2 <div class="ywsq" id="ywsq">
3 <div class="ywsq-left"> 3 <div class="ywsq-left">
4 <p v-for="(item, index) in leftList" @click="handleleftTitle(index)" :key="index" 4 <p v-for="(item, index) in leftList" @click="handleleftTitle(index)" :key="index"
5 :class="{ 'active': n == index }">{{ item }}</p> 5 :class="{ 'active': n == index }">{{ item }}</p>
...@@ -98,7 +98,7 @@ export default { ...@@ -98,7 +98,7 @@ export default {
98 }, 98 },
99 methods: { 99 methods: {
100 getDataList () { 100 getDataList () {
101 getCollectBiz().then(res => { 101 getCollectBiz({ 'target': '#ywsq' }).then(res => {
102 let { result } = res 102 let { result } = res
103 this.ywList = result 103 this.ywList = result
104 this.ywList.forEach(item => { 104 this.ywList.forEach(item => {
...@@ -145,7 +145,7 @@ export default { ...@@ -145,7 +145,7 @@ export default {
145 }, 145 },
146 // 获取下个节点类型 146 // 获取下个节点类型
147 getNextNode (bsmSqyw, type) { 147 getNextNode (bsmSqyw, type) {
148 getNextNode(bsmSqyw).then(res => { 148 getNextNode(bsmSqyw, { 'target': '#ywsq' }).then(res => {
149 if (res.result.djqx) this.djqxList = res.result.djqx 149 if (res.result.djqx) this.djqxList = res.result.djqx
150 if (res.result.djlx) this.djlxList = res.result.djlx 150 if (res.result.djlx) this.djlxList = res.result.djlx
151 if (type) { 151 if (type) {
......
...@@ -82,7 +82,7 @@ module.exports = { ...@@ -82,7 +82,7 @@ module.exports = {
82 } 82 }
83 ]) 83 ])
84 84
85 // when there are many pages, it will cause too many meaningless requests 85 // when there are many pages, it will cause too many meaningscss requests
86 config.plugins.delete('prefetch') 86 config.plugins.delete('prefetch')
87 config.module 87 config.module
88 .rule('svg') 88 .rule('svg')
......