Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
c4e6187f by xiaomiao
Options

样式调整

1 parent 79cbd3d9
Expand all
Inline Side-by-side
Showing 3 changed files with 130 additions and 102 deletions
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>
......