c4e6187f by xiaomiao

样式调整

1 parent 79cbd3d9
1 .tablebox {
2 overflow-x: auto;
3 width: 100%;
4 height: 95%;
5 background: #fff;
6 text-align: center;
7 padding: 4px;
8 overflow-y: scroll;
9 padding-top: 20px;
10 padding: 20px 40px;
11
12 .Table {
13 width: 100%;
14 color: #333;
15 tr {
16 td:nth-child(1) {
17 width: 140px;
18 text-align: right;
19 padding-right: 15px;
20 background-color: #f8f8fa;
21 color: #6b6b6b;
22 }
23 td:nth-child(3) {
24 width: 140px;
25 padding-right: 15px;
26 text-align: right;
27 background-color: #f8f8fa;
28 color: #6b6b6b;
29 }
30 td:nth-child(2) {
31 text-align: left;
32 padding-left: 15px;
33 color: #4a4a4a;
34 }
35 td:nth-child(4) {
36 text-align: left;
37 padding-left: 15px;
38 color: #4a4a4a;
39 }
40 }
41
42 td {
43 border: 1px solid #e8e8e8;
44 line-height: 42px;
45 padding: 0 4px;
46 font-size: 14px;
47 }
48
49 .title {
50 line-height: 68px;
51 font-size: 22px !important;
52 color: #4a4a4a !important;
53 background-color: #eceef2 !important;
54 text-align: center !important;
55 }
56
57 .unit {
58 text-align: right;
59 }
60 .title3 {
61 width: 140px !important;
62 }
63 .bhqk {
64 width: 140px;
65 padding: 0 !important;
66
67 .box {
68 width: 745px;
69 overflow: auto;
70 }
71
72 .test {
73 }
74
75 table {
76 .bhqkTh {
77 width: 110px;
78 line-height: 38px;
79 background-color: #f8f8fa;
80 border: 1px solid #e8e8e8;
81 font-weight: bold;
82 text-align: left;
83 }
84
85 td {
86 width: 180px;
87 }
88 }
89 }
90 }
91 }
1 <template> 1 <template>
2 <div class="zdxx"> 2 <div class="zdxx">
3 <div class="tablebox"> 3 <div class="tablebox">
4 <table cellpadding="0" cellspacing="0" class="zdxxTable"> 4 <table cellpadding="0" cellspacing="0" class="Table">
5 <col width="80" /> 5 <col width="80" />
6 <col width="60" /> 6 <col width="60" />
7 <col width="90" /> 7 <col width="90" />
8 <col width="235" /> 8 <col width="235" />
9 <col width="150" /> 9 <col width="150" />
10 <tr> 10 <tr>
11 <td colspan="6" class="title">宗地基本信息</td> 11 <td colspan="12" class="title">宗地基本信息</td>
12 </tr> 12 </tr>
13 <tr> 13 <tr>
14 <td colspan="2">不动产类型</td> 14 <td colspan="2">不动产类型</td>
15 <td colspan="2">{{ bdclxList[zdjbxx.bdclx] }}</td> 15 <td colspan="3">{{ bdclxList[zdjbxx.bdclx] }}</td>
16 <td>单位</td> 16 <td>单位</td>
17 <td>{{ zdjbxx.mjdw }}</td> 17 <td colspan="4">{{ zdjbxx.mjdw }}</td>
18 </tr> 18 </tr>
19 <tr> 19 <tr>
20 <td colspan="2">坐落</td> 20 <td colspan="2">坐落</td>
21 <td colspan="4">{{ zdjbxx.zl }}</td> 21 <td colspan="10">{{ zdjbxx.zl }}</td>
22 </tr> 22 </tr>
23 <tr> 23 <tr>
24 <td rowspan="8" class="title2">土地状况</td> 24 <td rowspan="8" colspan="2" class="title2">土地状况</td>
25 </tr> 25 </tr>
26 <tr> 26 <tr>
27 <td colspan="2">宗地面积</td> 27 <td>宗地面积</td>
28 <td>{{ zdjbxx.zdmj }}</td> 28 <td colspan="4">{{ zdjbxx.zdmj }}</td>
29 <td>用途</td> 29 <td>用途</td>
30 <td>{{ zdjbxx.ghytmc }}</td> 30 <td>{{ zdjbxx.ghytmc }}</td>
31 </tr> 31 </tr>
32 <tr> 32 <tr>
33 <td colspan="2">等级</td> 33 <td>等级</td>
34 <td>{{ zdjbxx.djmc }}</td> 34 <td colspan="4">{{ zdjbxx.djmc }}</td>
35 <td>价格</td> 35 <td>价格</td>
36 <td>{{ zdjbxx.jg }}</td> 36 <td colspan="3">{{ zdjbxx.jg }}</td>
37 </tr> 37 </tr>
38 <tr> 38 <tr>
39 <td colspan="2">权利类型</td> 39 <td>权利类型</td>
40 <td>{{ zdjbxx.qllxmc }}</td> 40 <td colspan="4">{{ zdjbxx.qllxmc }}</td>
41 <td>权利性质</td> 41 <td>权利性质</td>
42 <td>{{ zdjbxx.qlxzmc }}</td> 42 <td>{{ zdjbxx.qlxzmc }}</td>
43 </tr> 43 </tr>
44 <tr> 44 <tr>
45 <td colspan="2">权利设定方式</td> 45 <td>权利设定方式</td>
46 <td>{{ zdjbxx.qlsdfs }}</td> 46 <td colspan="4">{{ zdjbxx.qlsdfs }}</td>
47 <td>容积率</td> 47 <td>容积率</td>
48 <td>{{ zdjbxx.rjl }}</td> 48 <td>{{ zdjbxx.rjl }}</td>
49 </tr> 49 </tr>
50 <tr> 50 <tr>
51 <td colspan="2">建筑密度</td> 51 <td>建筑密度</td>
52 <td>{{ zdjbxx.jzmd }}</td> 52 <td colspan="4">{{ zdjbxx.jzmd }}</td>
53 <td>建筑限高</td> 53 <td>建筑限高</td>
54 <td>{{ zdjbxx.jzxg }}</td> 54 <td>{{ zdjbxx.jzxg }}</td>
55 </tr> 55 </tr>
56 <tr> 56 <tr>
57 <td colspan="2">图幅号</td> 57 <td>图幅号</td>
58 <td>{{ zdjbxx.tfh }}</td> 58 <td colspan="4">{{ zdjbxx.tfh }}</td>
59 <td>地籍号</td> 59 <td>地籍号</td>
60 <td>{{ zdjbxx.djh }}</td> 60 <td colspan="3">{{ zdjbxx.djh }}</td>
61 </tr> 61 </tr>
62 <tr> 62 <tr>
63 <td colspan="2">档案号</td> 63 <td>档案号</td>
64 <td>{{ zdjbxx.dah }}</td> 64 <td colspan="4">{{ zdjbxx.dah }}</td>
65 <td>地块代码</td> 65 <td>地块代码</td>
66 <td>{{ zdjbxx.dkdm }}</td> 66 <td colspan="3">{{ zdjbxx.dkdm }}</td>
67 </tr> 67 </tr>
68 <tr> 68 <tr>
69 <td colspan="2">宗地四至-东</td> 69 <td colspan="2">宗地四至-东</td>
70 <td colspan="4">{{ zdjbxx.zdszd }}</td> 70 <td colspan="8">{{ zdjbxx.zdszd }}</td>
71 </tr> 71 </tr>
72 <tr> 72 <tr>
73 <td colspan="2">宗地四至-南</td> 73 <td colspan="2">宗地四至-南</td>
74 <td colspan="4">{{ zdjbxx.zdszn }}</td> 74 <td colspan="8">{{ zdjbxx.zdszn }}</td>
75 </tr> 75 </tr>
76 <tr> 76 <tr>
77 <td colspan="2">宗地四至-西</td> 77 <td colspan="2">宗地四至-西</td>
78 <td colspan="4">{{ zdjbxx.zdszx }}</td> 78 <td colspan="8">{{ zdjbxx.zdszx }}</td>
79 </tr> 79 </tr>
80 <tr> 80 <tr>
81 <td colspan="2">宗地四至-北</td> 81 <td colspan="2">宗地四至-北</td>
82 <td colspan="4">{{ zdjbxx.zdszb }}</td> 82 <td colspan="8">{{ zdjbxx.zdszb }}</td>
83 </tr> 83 </tr>
84 <tr> 84 <tr>
85 <td class="title2" height="96">备注</td> 85 <td class="title2" colspan="2" height="50">备注</td>
86 <td colspan="5">{{ zdjbxx.bz }}</td> 86 <td colspan="8">{{ zdjbxx.bz }}</td>
87 </tr> 87 </tr>
88 <tr> 88 <tr>
89 <td class="title2" height="96">附记</td> 89 <td class="title2" colspan="2" height="50">附记</td>
90 <td colspan="5">{{ zdjbxx.fj }}</td> 90 <td colspan="8">{{ zdjbxx.fj }}</td>
91 </tr> 91 </tr>
92 <tr> 92 <tr>
93 <td colspan="2">状态</td> 93 <td colspan="2">状态</td>
94 <td colspan="2">{{ zdjbxx.zt }}</td> 94 <td colspan="2">{{ zdjbxx.zt }}</td>
95 <td>区县代码</td> 95 <td>区县代码</td>
96 <td>{{ zdjbxx.qxdm }}</td> 96 <td colspan="4">{{ zdjbxx.qxdm }}</td>
97 </tr> 97 </tr>
98 <tr v-show="showGroup"> 98 <tr v-if="showGroup">
99 <td class="title2">变化情况</td> 99 <td colspan="2" class="title3">变化情况</td>
100 <td colspan="5" class="bhqk"> 100 <td colspan="4" class="bhqk">
101 <div class="box"> 101 <div class="box">
102 <table cellspacing="0" cellpadding="0" :width="bhqkTableWidth"> 102 <table cellspacing="0" cellpadding="0" :width="bhqkTableWidth">
103 <tr v-for="(item, index) in bhqkColumns" :key="index"> 103 <tr v-for="(item, index) in bhqkColumns" :key="index">
104 <td class="bhqkTh">{{ item.label }}</td> 104 <td class="bhqkTh">{{ item.label }}</td>
105 <!-- <td v-for="(item2, index2) in zdbhqks" :key="index2">
106 {{ item2[item.prop] }}
107 </td> -->
108 </tr> 105 </tr>
109 </table> 106 </table>
110 </div> 107 </div>
...@@ -159,7 +156,7 @@ ...@@ -159,7 +156,7 @@
159 zdjbxx: {}, 156 zdjbxx: {},
160 zdbhqks: [], 157 zdbhqks: [],
161 propsParam: this.$attrs, 158 propsParam: this.$attrs,
162 showGroup: false, 159 showGroup: true,
163 bdclxList: ['', '宗地', '宗海', '自然幢', '多幢', '构筑物', '林权', '户'] 160 bdclxList: ['', '宗地', '宗海', '自然幢', '多幢', '构筑物', '林权', '户']
164 }; 161 };
165 }, 162 },
...@@ -183,71 +180,11 @@ ...@@ -183,71 +180,11 @@
183 </script> 180 </script>
184 181
185 <style lang="scss" scoped> 182 <style lang="scss" scoped>
183 @import "./tablestyle.scss";
186 .zdxx { 184 .zdxx {
187 width: 100%; 185 width: 100%;
188 height: 100%; 186 height: 100%;
189 background-color: #f5f5f5; 187 background-color: #f5f5f5;
190 padding: 5px; 188 padding: 5px;
191 } 189 }
192 .tablebox {
193 overflow-x: auto;
194 width: 100%;
195 height: 100%;
196 background: #fff;
197 border: 1px solid rgb(228, 228, 228);
198 text-align: center;
199 padding: 4px;
200 overflow-y: scroll;
201
202 .zdxxTable {
203 width: 100%;
204 color: #333;
205
206 td {
207 border: 1px solid rgb(228, 228, 228);
208 line-height: 30px;
209 padding: 0 4px;
210 }
211
212 .title {
213 line-height: 68px;
214 font-size: 20px;
215 }
216
217 .unit {
218 text-align: right;
219 }
220
221 .title2 {
222 writing-mode: vertical-lr;
223 letter-spacing: 6px;
224 }
225
226 .bhqk {
227 padding: 0;
228
229 .box {
230 width: 745px;
231 overflow: auto;
232 }
233
234 .test {
235 }
236
237 table {
238 .bhqkTh {
239 width: 110px;
240 line-height: 40px;
241 background-color: #f5f5f5;
242 border: 1px solid rgb(228, 228, 228);
243 font-weight: bold;
244 }
245
246 td {
247 width: 180px;
248 }
249 }
250 }
251 }
252 }
253 </style> 190 </style>
......
...@@ -23,315 +23,315 @@ ...@@ -23,315 +23,315 @@
23 </template> 23 </template>
24 24
25 <script> 25 <script>
26 import { getUuid, judgeSort, realMove, findParents, removeTreeListItem } from '@/utils/operation' 26 import { getUuid, judgeSort, realMove, findParents, removeTreeListItem } from '@/utils/operation'
27 import { editDictNode, getChildDictList } from '@/api/user' 27 import { editDictNode, getChildDictList } from '@/api/user'
28 export default { 28 export default {
29 props: { 29 props: {
30 value: { type: Boolean, default: false }, 30 value: { type: Boolean, default: false },
31 details: { 31 details: {
32 type: Object, 32 type: Object,
33 default: {} 33 default: {}
34 } 34 }
35 }, 35 },
36 data () { 36 data () {
37 return { 37 return {
38 key: 0, 38 key: 0,
39 myValue: this.value, 39 myValue: this.value,
40 keyList: [], 40 keyList: [],
41 ruleForm: { 41 ruleForm: {
42 dcode: '', 42 dcode: '',
43 dname: '' 43 dname: ''
44 },
45 column: [],
46 columns: [
47 {
48 width: '70',
49 renderHeader: (h, scope) => {
50 return (<div>
51 {
52 this.details.isenable === '0' ?
53 <span>序号</span> :
54 <i class="el-icon-plus" onClick={() => { this.handleAdd() }} style="cursor:pointer;color:#409EFF"></i>
55 }
56 </div>)
57 },
58 render: (h, scope) => {
59 return (
60 <span>{scope.row.index}</span>
61 )
62 }
63 }, 44 },
64 { 45 column: [],
65 prop: 'dcode', 46 columns: [
66 width: '100', 47 {
67 label: '字典项编码', 48 width: '70',
68 render: (h, scope) => { 49 renderHeader: (h, scope) => {
69 return ( 50 return (<div>
70 <div> 51 {
71 <el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={scope.row.codeShow} v-fo value={scope.row[scope.column.property]} 52 this.details.isenable === '0' ?
72 onFocus={() => { this.itemShowFalse(); scope.row.codeShow = true; }} 53 <span>序号</span> :
73 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input> 54 <i class="el-icon-plus" onClick={() => { this.handleAdd() }} style="cursor:pointer;color:#409EFF"></i>
55 }
56 </div>)
57 },
58 render: (h, scope) => {
59 return (
60 <span>{scope.row.index}</span>
61 )
62 }
63 },
64 {
65 prop: 'dcode',
66 width: '100',
67 label: '字典项编码',
68 render: (h, scope) => {
69 return (
70 <div>
71 <el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={scope.row.codeShow} v-fo value={scope.row[scope.column.property]}
72 onFocus={() => { this.itemShowFalse(); scope.row.codeShow = true; }}
73 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
74 74
75 75
76 <el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={!scope.row.codeShow} value={scope.row[scope.column.property]} 76 <el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={!scope.row.codeShow} value={scope.row[scope.column.property]}
77 onFocus={() => { this.itemShowFalse(); scope.row.codeShow = true; }} 77 onFocus={() => { this.itemShowFalse(); scope.row.codeShow = true; }}
78 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input> 78 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
79 </div> 79 </div>
80 ) 80 )
81 } 81 }
82 }, 82 },
83 { 83 {
84 prop: 'dname', 84 prop: 'dname',
85 label: '字典项名称', 85 label: '字典项名称',
86 render: (h, scope) => { 86 render: (h, scope) => {
87 return ( 87 return (
88 <div> 88 <div>
89 <el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={scope.row.nameShow} v-fo value={scope.row[scope.column.property]} 89 <el-input placeholder="字典项编码" disabled={this.details.isenable == 2} v-show={scope.row.nameShow} v-fo value={scope.row[scope.column.property]}
90 onFocus={() => { this.itemShowFalse(); scope.row.nameShow = true; }} 90 onFocus={() => { this.itemShowFalse(); scope.row.nameShow = true; }}
91 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input> 91 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input>
92 92
93 <el-input placeholder="字典项名称" disabled={this.details.isenable == 2} v-show={!scope.row.nameShow} value={scope.row[scope.column.property]} 93 <el-input placeholder="字典项名称" disabled={this.details.isenable == 2} v-show={!scope.row.nameShow} value={scope.row[scope.column.property]}
94 onFocus={() => { this.itemShowFalse(); scope.row.nameShow = true; }} 94 onFocus={() => { this.itemShowFalse(); scope.row.nameShow = true; }}
95 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input> 95 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input>
96 </div> 96 </div>
97 ) 97 )
98 } 98 }
99 }, 99 },
100 { 100 {
101 prop: 'normcode', 101 prop: 'normcode',
102 label: '部标编码', 102 label: '部标编码',
103 width: '100', 103 width: '100',
104 render: (h, scope) => { 104 render: (h, scope) => {
105 return ( 105 return (
106 <div> 106 <div>
107 <el-input placeholder="部标编码" disabled={this.details.isenable == 2} v-show={scope.row.normcodeShow} v-fo value={scope.row[scope.column.property]} 107 <el-input placeholder="部标编码" disabled={this.details.isenable == 2} v-show={scope.row.normcodeShow} v-fo value={scope.row[scope.column.property]}
108 onFocus={() => { this.itemShowFalse(); scope.row.normcodeShow = true; }} 108 onFocus={() => { this.itemShowFalse(); scope.row.normcodeShow = true; }}
109 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input> 109 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
110 110
111 <el-input placeholder="部标编码" disabled={this.details.isenable == 2} v-show={!scope.row.normcodeShow} value={scope.row[scope.column.property]} 111 <el-input placeholder="部标编码" disabled={this.details.isenable == 2} v-show={!scope.row.normcodeShow} value={scope.row[scope.column.property]}
112 onFocus={() => { this.itemShowFalse(); scope.row.normcodeShow = true; }} 112 onFocus={() => { this.itemShowFalse(); scope.row.normcodeShow = true; }}
113 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input> 113 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }} maxlength='8'></el-input>
114 </div> 114 </div>
115 ) 115 )
116 } 116 }
117 }, 117 },
118 { 118 {
119 prop: 'normname', 119 prop: 'normname',
120 label: '部标名称', 120 label: '部标名称',
121 render: (h, scope) => { 121 render: (h, scope) => {
122 return ( 122 return (
123 <div> 123 <div>
124 <el-input placeholder="部标名称" disabled={this.details.isenable == 2} v-show={scope.row.normnameShow} v-fo value={scope.row[scope.column.property]} 124 <el-input placeholder="部标名称" disabled={this.details.isenable == 2} v-show={scope.row.normnameShow} v-fo value={scope.row[scope.column.property]}
125 onFocus={() => { this.itemShowFalse(); scope.row.normnameShow = true; }} 125 onFocus={() => { this.itemShowFalse(); scope.row.normnameShow = true; }}
126 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input> 126 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input>
127 127
128 <el-input placeholder="部标名称" disabled={this.details.isenable == 2} v-show={!scope.row.normnameShow} value={scope.row[scope.column.property]} 128 <el-input placeholder="部标名称" disabled={this.details.isenable == 2} v-show={!scope.row.normnameShow} value={scope.row[scope.column.property]}
129 onFocus={() => { this.itemShowFalse(); scope.row.normnameShow = true; }} 129 onFocus={() => { this.itemShowFalse(); scope.row.normnameShow = true; }}
130 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input> 130 onInput={(val) => { scope.row[scope.column.property] = val; this.itemShowFalse(); scope.row.codeShow = true; }}></el-input>
131 </div> 131 </div>
132 ) 132 )
133 } 133 }
134 }, 134 },
135 { 135 {
136 prop: 'isenable', 136 prop: 'isenable',
137 width: '160', 137 width: '160',
138 label: '是否禁用', 138 label: '是否禁用',
139 render: (h, scope) => { 139 render: (h, scope) => {
140 return ( 140 return (
141 <el-radio-group disabled={this.details.isenable == 2} v-model={scope.row.isenable}> 141 <el-radio-group disabled={this.details.isenable == 2} v-model={scope.row.isenable}>
142 <el-radio label="1">启用</el-radio> 142 <el-radio label="1">启用</el-radio>
143 <el-radio label="0">禁用</el-radio> 143 <el-radio label="0">禁用</el-radio>
144 </el-radio-group> 144 </el-radio-group>
145 ) 145 )
146 }
147 },
148 {
149 width: '130',
150 label: '移动',
151 render: (h, scope) => {
152 return (
153 <div>
154 <el-button type='text' disabled={scope.row.isTop} onClick={() => { this.moveUpward(scope.$index, scope.row) }}>上移</el-button>
155 <el-button type='text' disabled={scope.row.isBottom} onClick={() => { this.moveDown(scope.$index, scope.row) }}>下移</el-button >
156 </div >
157 )
158 }
159 },
160 {
161 width: '150',
162 label: '操作',
163 render: (h, scope) => {
164 return (
165 <div>
166 <el-button type="text" style="margin-right:10px" onClick={() => { this.handleAddSubordinate(scope.row) }}>增加下级</el-button>
167 <el-button type="text" style="margin-left:0" onClick={() => { this.handleMinus(scope.$index, scope.row) }}>删除</el-button>
168 </div>
169 )
170 }
146 } 171 }
172 ],
173 tableData: []
174 }
175 },
176 watch: {
177 value (val) {
178 this.myValue = val
179 },
180 'details.bsmDict': {
181 handler: function (newValue) {
182 if (!this.value) return
183 this.$startLoading();
184 getChildDictList(newValue).then(res => {
185 this.$endLoading();
186 let { result } = res
187 this.tableData = result ? result : []
188 this.tableData.forEach((item, index) => {
189 item.index = index + 1
190 })
191 })
147 }, 192 },
148 { 193 immediate: true
149 width: '130', 194 },
150 label: '移动', 195 details: {
151 render: (h, scope) => { 196 handler: function (newValue) {
152 return ( 197 if (newValue.isenable == 2) {
153 <div> 198 this.column = this.columns.slice(0, 6)
154 <el-button type='text' disabled={scope.row.isTop} onClick={() => { this.moveUpward(scope.$index, scope.row) }}>上移</el-button> 199 } else {
155 <el-button type='text' disabled={scope.row.isBottom} onClick={() => { this.moveDown(scope.$index, scope.row) }}>下移</el-button > 200 this.column = this.columns
156 </div >
157 )
158 } 201 }
202 this.ruleForm = newValue.rowData
203 this.addIndexes()
204 this.key++
159 }, 205 },
160 { 206 deep: true
161 width: '150', 207 }
162 label: '操作',
163 render: (h, scope) => {
164 return (
165 <div>
166 <el-button type="text" style="margin-right:10px" onClick={() => { this.handleAddSubordinate(scope.row) }}>增加下级</el-button>
167 <el-button type="text" style="margin-left:0" onClick={() => { this.handleMinus(scope.$index, scope.row) }}>删除</el-button>
168 </div>
169 )
170 }
171 }
172 ],
173 tableData: []
174 }
175 },
176 watch: {
177 value (val) {
178 this.myValue = val
179 }, 208 },
180 'details.bsmDict': { 209 methods: {
181 handler: function (newValue) { 210 // 添加索引
182 if (!this.value) return 211 addIndexes (data = this.tableData, isAdd = true) {
183 this.$startLoading(); 212 data.forEach((item, index) => {
184 getChildDictList(newValue).then(res => { 213 if (index == 0) {
185 this.$endLoading(); 214 item.codeShow = true
186 let { result } = res 215 item.nameShow = false
187 this.tableData = result ? result : [] 216 item.normcodeShow = false
188 this.tableData.forEach((item, index) => { 217 item.normnameShow = false
218 } else {
219 item.codeShow = false
220 item.nameShow = false
221 item.normcodeShow = false
222 item.normnameShow = false
223 }
224 if (isAdd) {
189 item.index = index + 1 225 item.index = index + 1
190 }) 226 }
227 if (item.children) {
228 this.addIndexes(item.children, false)
229 }
191 }) 230 })
192 }, 231 },
193 immediate: true 232 itemShowFalse () {
194 }, 233 this.tableData.forEach((item, index) => {
195 details: {
196 handler: function (newValue) {
197 if (newValue.isenable == 2) {
198 this.column = this.columns.slice(0, 6)
199 } else {
200 this.column = this.columns
201 }
202 this.ruleForm = newValue.rowData
203 this.addIndexes()
204 this.key++
205 },
206 deep: true
207 }
208 },
209 methods: {
210 // 添加索引
211 addIndexes (data = this.tableData, isAdd = true) {
212 data.forEach((item, index) => {
213 if (index == 0) {
214 item.codeShow = true
215 item.nameShow = false
216 item.normcodeShow = false
217 item.normnameShow = false
218 } else {
219 item.codeShow = false 234 item.codeShow = false
220 item.nameShow = false 235 item.nameShow = false
221 item.normcodeShow = false 236 item.normcodeShow = false
222 item.normnameShow = false 237 item.normnameShow = false
223 }
224 if (isAdd) {
225 item.index = index + 1
226 }
227 if (item.children) {
228 this.addIndexes(item.children, false)
229 }
230 })
231 },
232 itemShowFalse () {
233 this.tableData.forEach((item, index) => {
234 item.codeShow = false
235 item.nameShow = false
236 item.normcodeShow = false
237 item.normnameShow = false
238 })
239 },
240 handleMinus (index, row) {
241 this.$confirm('此操作将永久删除, 是否继续?', '提示', {
242 confirmButtonText: '确定',
243 cancelButtonText: '取消',
244 type: 'warning'
245 }).then(() => {
246 removeTreeListItem(this.tableData, row.bsmDict)
247 this.$message({
248 type: 'success',
249 message: '删除成功!'
250 })
251 }).catch(() => {
252 this.$message({
253 type: 'info',
254 message: '已取消删除'
255 }) 238 })
256 }) 239 },
257 }, 240 handleMinus (index, row) {
258 handleSubmit () { 241 this.$confirm('此操作将永久删除, 是否继续?', '提示', {
259 editDictNode({ 242 confirmButtonText: '确定',
260 bsmDict: this.details.rowData.bsmDict, 243 cancelButtonText: '取消',
261 typeid: this.details.rowData.typeid, 244 type: 'warning'
262 children: this.tableData 245 }).then(() => {
263 }).then(res => { 246 removeTreeListItem(this.tableData, row.bsmDict)
264 if (res.code === 200) {
265 this.$message({ 247 this.$message({
266 message: '修改成功', 248 type: 'success',
267 type: 'success' 249 message: '删除成功!'
268 }) 250 })
269 this.$emit('input', false) 251 }).catch(() => {
252 this.$message({
253 type: 'info',
254 message: '已取消删除'
255 })
256 })
257 },
258 handleSubmit () {
259 editDictNode({
260 bsmDict: this.details.rowData.bsmDict,
261 typeid: this.details.rowData.typeid,
262 children: this.tableData
263 }).then(res => {
264 if (res.code === 200) {
265 this.$message({
266 message: '修改成功',
267 type: 'success'
268 })
269 this.$emit('input', false)
270 }
271 })
272 },
273 closeDialog () {
274 this.$emit('input', false)
275 },
276 // 增加下级
277 handleAddSubordinate (row) {
278 if (!row.children) {
279 row.children = []
270 } 280 }
271 }) 281 row.children.push(
272 }, 282 {
273 closeDialog () { 283 dcode: '',
274 this.$emit('input', false) 284 dname: '',
275 }, 285 isenable: '1',
276 // 增加下级 286 normcode: '',
277 handleAddSubordinate (row) { 287 normname: '',
278 if (!row.children) { 288 bsmDict: getUuid(32),
279 row.children = [] 289 typeid: row.typeid,
290 }
291 )
292 this.keyList = [];
293 this.keyList.push(row.bsmDict)
294 },
295 // 增加
296 handleAdd () {
297 this.$nextTick(() => {
298 let container = this.$el.querySelector('.el-table__body-wrapper');
299 container.scrollTop = container.scrollHeight;
300 })
301 this.tableData.push(
302 {
303 dcode: '',
304 dname: '',
305 isenable: '1',
306 normcode: '',
307 normname: '',
308 bsmDict: getUuid(32),
309 typeid: this.ruleForm.typeid,
310 }
311 )
312 this.addIndexes()
313 this.key++
314 },
315 // 上移下移
316 moveUpward (index, row) {
317 realMove(row.bsmDict, 'UP', this.tableData)
318 this.key++
319 let id = findParents(this.tableData, row.bsmDict)
320 this.keyList = id
321 },
322 moveDown (index, row) {
323 realMove(row.bsmDict, 'DOWN', this.tableData)
324 this.key++
325 let id = findParents(this.tableData, row.bsmDict)
326 this.keyList = id
280 } 327 }
281 row.children.push(
282 {
283 dcode: '',
284 dname: '',
285 isenable: '1',
286 normcode: '',
287 normname: '',
288 bsmDict: getUuid(32),
289 typeid: row.typeid,
290 }
291 )
292 this.keyList = [];
293 this.keyList.push(row.bsmDict)
294 },
295 // 增加
296 handleAdd () {
297 this.$nextTick(() => {
298 let container = this.$el.querySelector('.el-table__body-wrapper');
299 container.scrollTop = container.scrollHeight;
300 })
301 this.tableData.push(
302 {
303 dcode: '',
304 dname: '',
305 isenable: '1',
306 normcode: '',
307 normname: '',
308 bsmDict: getUuid(32),
309 typeid: this.ruleForm.typeid,
310 }
311 )
312 this.addIndexes()
313 this.key++
314 },
315 // 上移下移
316 moveUpward (index, row) {
317 realMove(row.bsmDict, 'UP', this.tableData)
318 this.key++
319 let id = findParents(this.tableData, row.bsmDict)
320 this.keyList = id
321 },
322 moveDown (index, row) {
323 realMove(row.bsmDict, 'DOWN', this.tableData)
324 this.key++
325 let id = findParents(this.tableData, row.bsmDict)
326 this.keyList = id
327 } 328 }
328 } 329 }
329 }
330 </script> 330 </script>
331 <style rel="stylesheet/scss" lang="scss" scoped> 331 <style rel="stylesheet/scss" lang="scss" scoped>
332 @import "~@/styles/dialogBoxheader.scss"; 332 @import "~@/styles/dialogBoxheader.scss";
333 /deep/.el-radio { 333 /deep/.el-radio {
334 margin-right: 5px !important; 334 margin-right: 5px !important;
335 } 335 }
336 </style> 336 </style>
337 337
......