样式调整
Showing
3 changed files
with
137 additions
and
109 deletions
src/views/registerBook/tablestyle.scss
0 → 100644
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,9 +23,9 @@ | ... | @@ -23,9 +23,9 @@ |
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: { |
... | @@ -326,12 +326,12 @@ export default { | ... | @@ -326,12 +326,12 @@ export default { |
326 | this.keyList = id | 326 | this.keyList = id |
327 | } | 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 | ... | ... |
-
Please register or sign in to post a comment