Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
5483a37f by 吴蕾
Options

style:登记簿信息样式编写

1 parent 1843d138
Inline Side-by-side
Showing 8 changed files with 1952 additions and 20 deletions
1 <template> 1 <template>
2 <div>查封登记</div> 2 <div class="cfdj">
3 <div class="tableBox">
4 <div class="title">
5 查封登记信息
6 <div class="checkbox">
7 <el-checkbox-group v-model="checkList">
8 <el-checkbox label="临时"></el-checkbox>
9 <el-checkbox label="现势"></el-checkbox>
10 <el-checkbox label="历史"></el-checkbox>
11 </el-checkbox-group>
12 </div>
13 </div>
14 <table class="xxTable">
15 <tr>
16 <th rowspan="3" width="140">业务类型</th>
17 </tr>
18 <tr class="one">
19 <th class="linshiIcon">
20 <div class="icon">临时</div>
21 临时
22 </th>
23 <th>现势</th>
24 <th>历史</th>
25 </tr>
26 <tr class="two">
27 <th>查封登记</th>
28 <th>查封登记</th>
29 <th>查封登记</th>
30 </tr>
31
32 <tr v-for="(item, index) in columns" :key="index">
33 <td>
34 {{ item.label }}
35 </td>
36 <td>{{ tableData.linshi[item.prop] }}</td>
37 <td>{{ tableData.xianshi[item.prop] }}</td>
38 <td>{{ tableData.lishi[item.prop] }}</td>
39 </tr>
40 </table>
41 </div>
42 </div>
3 </template> 43 </template>
4 44
5 <script> 45 <script>
6 export default { 46 export default {
7 name: "cfdj", 47 name: "cfdj",
8 data() { 48 data() {
9 return {}; 49 return {
50 checkList: ["临时", "现势", "历史"],
51 columns: [
52 {
53 prop: "ssywh",
54 label: "上手业务号",
55 },
56 {
57 prop: "dah",
58 label: "档案号",
59 },
60 {
61 prop: "ywh",
62 label: "业务号",
63 },
64 {
65 prop: "bdcdyh",
66 label: "不动产单元号",
67 },
68 {
69 prop: "zl",
70 label: "坐落",
71 },
72 {
73 prop: "bdcqlr",
74 label: "不动产权利人",
75 },
76 {
77 prop: "zjzl",
78 label: "证件种类",
79 },
80 {
81 prop: "zjh",
82 label: "证件号",
83 },
84 {
85 prop: "cflx",
86 label: "查封类型",
87 },
88 {
89 prop: "cfjg",
90 label: "查封机关",
91 },
92 {
93 prop: "cfwh",
94 label: "查封文号",
95 },
96 {
97 prop: "cfwj",
98 label: "查封文件",
99 },
100 {
101 prop: "cfqssj",
102 label: "查封起始时间",
103 },
104 {
105 prop: "cfjssj",
106 label: "查封结束时间",
107 },
108 {
109 prop: "cfqx",
110 label: "查封期限",
111 },
112 {
113 prop: "cffw",
114 label: "查封范围",
115 },
116 {
117 prop: "djjg",
118 label: "登记机构",
119 },
120 {
121 prop: "dbr",
122 label: "登簿人",
123 },
124 {
125 prop: "djsj",
126 label: "登记时间",
127 },
128 {
129 prop: "jfywh",
130 label: "解封业务号",
131 },
132 {
133 prop: "jfjg",
134 label: "解封机关",
135 },
136 {
137 prop: "jfwh",
138 label: "解封文号",
139 },
140 {
141 prop: "jfwj",
142 label: "解封文件",
143 },
144 {
145 prop: "jfdjsj",
146 label: "解封登记时间",
147 },
148 {
149 prop: "jfdbr",
150 label: "解封登簿人",
151 },
152 ],
153 tableData: {
154 linshi: {
155 ssywh: "",
156 dah: "",
157 ywh: "200825012285",
158 bdcdyh: "370205004005GB10030 F00160111",
159 zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
160 bdcqlr: "李四",
161 zjzj: "身份证号",
162 zjh: "*******",
163 cflx: "查封",
164 cfjg: "西安法院",
165 cfwh: "200825012286",
166 cfwj: "",
167 cfqssj: "2008年3月11日",
168 cfjssj: "2012年3月11日",
169 cfqx: "4年",
170 cffw: "",
171 djjg: "",
172 dbr: "",
173 djsj: "",
174 jfywh: "",
175 jfjg: "",
176 jfwh: "",
177 jfwj: "",
178 jfdjsj: "",
179 jfdbr: "",
180 },
181 xianshi: {
182 ssywh: "",
183 dah: "",
184 ywh: "200825012285",
185 bdcdyh: "370205004005GB10030 F00160111",
186 zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
187 bdcqlr: "李四",
188 zjzj: "身份证号",
189 zjh: "*******",
190 cflx: "查封",
191 cfjg: "西安法院",
192 cfwh: "200825012286",
193 cfwj: "",
194 cfqssj: "2008年3月11日",
195 cfjssj: "2012年3月11日",
196 cfqx: "4年",
197 cffw: "",
198 djjg: "",
199 dbr: "",
200 djsj: "",
201 jfywh: "200825012285",
202 jfjg: "西安法院",
203 jfwh: "123",
204 jfwj: "",
205 jfdjsj: "2012年3月11日",
206 jfdbr: "",
207 },
208 lishi: {
209 ssywh: "",
210 dah: "",
211 ywh: "200825012285",
212 bdcdyh: "370205004005GB10030 F00160111",
213 zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
214 bdcqlr: "李四",
215 zjzj: "身份证号",
216 zjh: "*******",
217 cflx: "查封",
218 cfjg: "西安法院",
219 cfwh: "200825012286",
220 cfwj: "",
221 cfqssj: "2008年3月11日",
222 cfjssj: "2012年3月11日",
223 cfqx: "4年",
224 cffw: "",
225 djjg: "",
226 dbr: "",
227 djsj: "",
228 jfywh: "",
229 jfjg: "",
230 jfwh: "",
231 jfwj: "",
232 jfdjsj: "",
233 jfdbr: "",
234 },
235 },
236 };
10 }, 237 },
11 }; 238 };
12 </script> 239 </script>
13 240
14 <style lang="scss" scoped> 241 <style lang="scss" scoped>
242 .cfdj {
243 width: 100%;
244 height: 100%;
245 background: #fff;
246 overflow-y: scroll;
247 color: #333;
248
249 .tableBox {
250 width: 810px;
251 margin: 0 auto;
252
253 .title {
254 font-family: "Arial Negreta", "Arial Normal", "Arial", sans-serif;
255 font-weight: 700;
256 font-size: 16px;
257 text-align: center;
258 background: #e9e9e9;
259 height: 62px;
260 line-height: 62px;
261 position: relative;
262 margin: 1px 0;
263 .checkbox {
264 position: absolute;
265 right: 20px;
266 bottom: -16px;
267 height: 62px;
268 }
269 }
270
271 .xxTable {
272 width: 810px;
273 border-spacing: 1px;
274 tr > th {
275 background: #464c5b;
276 color: #fff;
277 font-size: 16px;
278 }
279 tr > th:nth-child(1),
280 tr > th:nth-child(2) {
281 background: #464c5b;
282 }
283 tr > th:nth-child(3) {
284 background: rgba(70, 76, 91, 0.8);
285 }
286 .one th {
287 height: 25px;
288 font-size: 14px;
289 }
290 .one > th:nth-child(1) {
291 color: #fe9400;
292 }
293 .two th {
294 height: 45px;
295
296 p:nth-child(2) {
297 font-size: 14px;
298 }
299 }
300 .two > th:nth-child(1) {
301 color: #fe9400;
302 }
303 .linshiIcon {
304 position: relative;
305 }
306 .linshiIcon::after {
307 content: "";
308 display: block;
309 width: 0;
310 height: 0;
311 border-width: 0px 0px 45px 45px;
312 border-style: none solid solid;
313 border-color: transparent transparent #fe9400;
314 position: absolute;
315 top: 0px;
316 right: 3px;
317 transform: rotate(-90deg);
318 }
319 .icon {
320 position: absolute;
321 top: 8px;
322 right: 6px;
323 transform: rotate(45deg);
324 color: #fff;
325 font-size: 12px;
326 z-index: 10;
327 }
328
329 tr td {
330 text-align: center;
331 height: 40px;
332 padding: 4px;
333 font-size: 13px;
334 }
335 > tr:nth-child(odd) td {
336 background: #f2f2f2;
337 }
338 > tr:nth-child(even) td {
339 background: #f9f9f9;
340 }
341 tr > td:nth-child(2) {
342 color: #fe9400;
343 }
344 tr > td:nth-child(4) {
345 color: #7f7f7f;
346 }
347 }
348 }
349 }
15 </style> 350 </style>
......
...@@ -108,7 +108,7 @@ export default { ...@@ -108,7 +108,7 @@ export default {
108 children: "children", 108 children: "children",
109 label: "label", 109 label: "label",
110 }, 110 },
111 showTab: "bdcqljqtsx", // 选中状态,根据表格中权利类型判断 111 showTab: "djbfm", // 选中状态,根据表格中权利类型判断
112 }; 112 };
113 }, 113 },
114 114
......
1 <template> 1 <template>
2 <div>抵押权</div> 2 <div class="dyaq">
3 <div class="tableBox">
4 <div class="title">
5 抵押权登记信息
6 <div class="checkbox">
7 <el-checkbox-group v-model="checkList">
8 <el-checkbox label="临时"></el-checkbox>
9 <el-checkbox label="现势"></el-checkbox>
10 <el-checkbox label="历史"></el-checkbox>
11 </el-checkbox-group>
12 </div>
13 </div>
14 <table class="xxTable">
15 <tr>
16 <th rowspan="3" width="140">业务类型</th>
17 </tr>
18 <tr class="one">
19 <th class="linshiIcon">
20 <div class="icon">临时</div>
21 临时
22 </th>
23 <th>现势</th>
24 <th>历史</th>
25 </tr>
26 <tr class="two">
27 <th>
28 <p>抵押权</p>
29 <p>首次登记</p>
30 </th>
31 <th>
32 <p>抵押权</p>
33 <p>转移登记</p>
34 </th>
35 <th>
36 <p>抵押权</p>
37 <p>转移登记</p>
38 </th>
39 </tr>
40
41 <tr v-for="(item, index) in columns" :key="index">
42 <td>
43 {{ item.label }}
44 </td>
45 <td>{{ tableData.linshi[item.prop] }}</td>
46 <td>{{ tableData.xianshi[item.prop] }}</td>
47 <td>{{ tableData.lishi[item.prop] }}</td>
48 </tr>
49 </table>
50 </div>
51 </div>
3 </template> 52 </template>
4 53
5 <script> 54 <script>
6 export default { 55 export default {
7 name: "dyaq", 56 name: "dyaq",
8 data() { 57 data() {
9 return {}; 58 return {
59 checkList: ["临时", "现势", "历史"],
60 columns: [
61 {
62 prop: "ssywh",
63 label: "上手业务号",
64 },
65 {
66 prop: "dah",
67 label: "档案号",
68 },
69 {
70 prop: "ywh",
71 label: "业务号",
72 },
73 {
74 prop: "bdcdyh",
75 label: "不动产单元号",
76 },
77 {
78 prop: "zjjzwzl",
79 label: "在建建筑物坐落",
80 },
81 {
82 prop: "dybdclx",
83 label: "抵押不动产类型",
84 },
85 {
86 prop: "dyqr",
87 label: "抵押权人",
88 },
89 {
90 prop: "zjzl",
91 label: "证件种类",
92 },
93 {
94 prop: "zjh",
95 label: "证件号",
96 },
97 {
98 prop: "dyr",
99 label: "抵押人",
100 },
101 {
102 prop: "dyfs",
103 label: "抵押方式",
104 },
105 {
106 prop: "sfygdj",
107 label: "是否预告登记",
108 },
109 {
110 prop: "zjjzwdyfw",
111 label: "在建建筑物抵押范围",
112 },
113 {
114 prop: "dymj",
115 label: "抵押面积",
116 },
117 {
118 prop: "bdbzzqse",
119 label: "被担保主债权数额(万元)",
120 },
121 {
122 prop: "dbfw",
123 label: "担保范围",
124 },
125 {
126 prop: "zwlxqssj",
127 label: "债务履行起始时间",
128 },
129 {
130 prop: "zwlxjssj",
131 label: "债务履行结束时间",
132 },
133 {
134 prop: "zwlxqx",
135 label: "债务履行期限(债务确定期间)",
136 },
137 {
138 prop: "zgzqqdsshse",
139 label: "最高债权确定事实和数额",
140 },
141 {
142 prop: "sfczyd",
143 label: "是否存在禁止或限制转让抵押不动产的约定",
144 },
145 {
146 prop: "djyy",
147 label: "登记原因",
148 },
149 {
150 prop: "bdcdjzmh",
151 label: "不动产登记证明号",
152 },
153 {
154 prop: "djsj",
155 label: "登记时间",
156 },
157 {
158 prop: "dbr",
159 label: "登簿人",
160 },
161 {
162 prop: "djjg",
163 label: "登记机构",
164 },
165 {
166 prop: "fj",
167 label: "附记",
168 },
169 {
170 prop: "qlqtzk",
171 label: "权利其他状况",
172 },
173 {
174 prop: "zxdyywh",
175 label: "注销抵押业务号",
176 },
177 {
178 prop: "zxdyyy",
179 label: "注销抵押原因",
180 },
181 ],
182 tableData: {
183 linshi: {
184 ssywh: "",
185 dah: "",
186 ywh: "200825012285",
187 bdcdyh: "370205004005GB10030 W00000000",
188 zjjzwzl:
189 "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
190 dybdclx: "土地",
191 dyqr: "中国银行股份有限公司C区支行",
192 zjzj: "营业执照",
193 zjh: "*******",
194 dyr: "联城有限公司",
195 dyfs: "一般抵押",
196 sfygdj: "否",
197 zjjzwdyfw: "",
198 dymj: "22384.1700",
199 bdbzzqse: "22000",
200 dbfw: "城镇住宅用地",
201 zwlxqssj: "2007年12月25日",
202 zwlxjssj: "2077年12月24日",
203 zwlxqx: "1年",
204 zgzqqdsshse: "11223",
205 sfczyd: "否",
206 djyy: "合同设立",
207 bdcdjzmh: "A（2011）B市不动产证明第0000060号",
208 djsj: "2009年04月21日",
209 dbr: "路**",
210 djjg: "",
211 fj: "",
212 qlqtzk: "",
213 zxdyywh: "201025126854",
214 zxdyyy: "贷款还清",
215 },
216 xianshi: {
217 ssywh: "",
218 dah: "",
219 ywh: "200825012285",
220 bdcdyh: "370205004005GB10030 W00000000",
221 zjjzwzl:
222 "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
223 dybdclx: "土地",
224 dyqr: "中国银行股份有限公司C区支行",
225 zjzj: "营业执照",
226 zjh: "*******",
227 dyr: "联城有限公司",
228 dyfs: "一般抵押",
229 sfygdj: "否",
230 zjjzwdyfw: "",
231 dymj: "22384.1700",
232 bdbzzqse: "22000",
233 dbfw: "城镇住宅用地",
234 zwlxqssj: "2007年12月25日",
235 zwlxjssj: "2077年12月24日",
236 zwlxqx: "1年",
237 zgzqqdsshse: "11223",
238 sfczyd: "否",
239 djyy: "合同设立",
240 bdcdjzmh: "A（2011）B市不动产证明第0000060号",
241 djsj: "2009年04月21日",
242 dbr: "路**",
243 djjg: "",
244 fj: "",
245 qlqtzk: "",
246 zxdyywh: "201025126854",
247 zxdyyy: "贷款还清",
248 },
249 lishi: {
250 ssywh: "",
251 dah: "",
252 ywh: "200825012285",
253 bdcdyh: "370205004005GB10030 W00000000",
254 zjjzwzl:
255 "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
256 dybdclx: "土地",
257 dyqr: "中国银行股份有限公司C区支行",
258 zjzj: "营业执照",
259 zjh: "*******",
260 dyr: "联城有限公司",
261 dyfs: "一般抵押",
262 sfygdj: "否",
263 zjjzwdyfw: "",
264 dymj: "22384.1700",
265 bdbzzqse: "22000",
266 dbfw: "城镇住宅用地",
267 zwlxqssj: "2007年12月25日",
268 zwlxjssj: "2077年12月24日",
269 zwlxqx: "1年",
270 zgzqqdsshse: "11223",
271 sfczyd: "否",
272 djyy: "合同设立",
273 bdcdjzmh: "A（2011）B市不动产证明第0000060号",
274 djsj: "2009年04月21日",
275 dbr: "路**",
276 djjg: "",
277 fj: "",
278 qlqtzk: "",
279 zxdyywh: "201025126854",
280 zxdyyy: "贷款还清",
281 },
282 },
283 };
10 }, 284 },
11 }; 285 };
12 </script> 286 </script>
13 287
14 <style lang="scss" scoped> 288 <style lang="scss" scoped>
289 .dyaq {
290 width: 100%;
291 height: 100%;
292 background: #fff;
293 overflow-y: scroll;
294 color: #333;
295
296 .tableBox {
297 width: 810px;
298 margin: 0 auto;
299
300 .title {
301 font-family: "Arial Negreta", "Arial Normal", "Arial", sans-serif;
302 font-weight: 700;
303 font-size: 16px;
304 text-align: center;
305 background: #e9e9e9;
306 height: 62px;
307 line-height: 62px;
308 position: relative;
309 margin: 1px 0;
310 .checkbox {
311 position: absolute;
312 right: 20px;
313 bottom: -16px;
314 height: 62px;
315 }
316 }
317
318 .xxTable {
319 width: 810px;
320 border-spacing: 1px;
321 tr > th {
322 background: #464c5b;
323 color: #fff;
324 font-size: 16px;
325 }
326 tr > th:nth-child(1),
327 tr > th:nth-child(2) {
328 background: #464c5b;
329 }
330 tr > th:nth-child(3) {
331 background: rgba(70, 76, 91, 0.8);
332 }
333 .one th {
334 height: 25px;
335 font-size: 14px;
336 }
337 .one > th:nth-child(1) {
338 color: #fe9400;
339 }
340 .two th {
341 height: 45px;
342
343 p:nth-child(2) {
344 font-size: 14px;
345 }
346 }
347 .two > th:nth-child(1) {
348 color: #fe9400;
349 }
350 .linshiIcon {
351 position: relative;
352 }
353 .linshiIcon::after {
354 content: "";
355 display: block;
356 width: 0;
357 height: 0;
358 border-width: 0px 0px 45px 45px;
359 border-style: none solid solid;
360 border-color: transparent transparent #fe9400;
361 position: absolute;
362 top: 0px;
363 right: 3px;
364 transform: rotate(-90deg);
365 }
366 .icon {
367 position: absolute;
368 top: 8px;
369 right: 6px;
370 transform: rotate(45deg);
371 color: #fff;
372 font-size: 12px;
373 z-index: 10;
374 }
375
376 tr td {
377 text-align: center;
378 height: 40px;
379 padding: 4px;
380 font-size: 13px;
381 }
382 > tr:nth-child(odd) td {
383 background: #f2f2f2;
384 }
385 > tr:nth-child(even) td {
386 background: #f9f9f9;
387 }
388 tr > td:nth-child(2) {
389 color: #fe9400;
390 }
391 tr > td:nth-child(4) {
392 color: #7f7f7f;
393 }
394 }
395 }
396 }
15 </style> 397 </style>
......
1 <template> 1 <template>
2 <div>地役权</div> 2 <div class="dyiq">
3 <div class="tableBox">
4 <div class="title">
5 地役权登记信息
6 <div class="checkbox">
7 <el-checkbox-group v-model="checkList">
8 <el-checkbox label="临时"></el-checkbox>
9 <el-checkbox label="现势"></el-checkbox>
10 <el-checkbox label="历史"></el-checkbox>
11 </el-checkbox-group>
12 </div>
13 </div>
14 <table class="xxTable">
15 <tr>
16 <th rowspan="3" width="140">业务类型</th>
17 </tr>
18 <tr class="one">
19 <th class="linshiIcon">
20 <div class="icon">临时</div>
21 临时
22 </th>
23 <th>现势</th>
24 <th>历史</th>
25 </tr>
26 <tr class="two">
27 <th>
28 <p>地役权</p>
29 <p>首次登记</p>
30 </th>
31 <th>
32 <p>地役权</p>
33 <p>转移登记</p>
34 </th>
35 <th>
36 <p>地役权</p>
37 <p>转移登记</p>
38 </th>
39 </tr>
40
41 <tr v-for="(item, index) in columns" :key="index">
42 <td>
43 {{ item.label }}
44 </td>
45 <td>{{ tableData.linshi[item.prop] }}</td>
46 <td>{{ tableData.xianshi[item.prop] }}</td>
47 <td>{{ tableData.lishi[item.prop] }}</td>
48 </tr>
49 </table>
50 </div>
51 </div>
3 </template> 52 </template>
4 53
5 <script> 54 <script>
6 export default { 55 export default {
7 name: "dyiq", 56 name: "dyiq",
8 data() { 57 data() {
9 return {}; 58 return {
59 checkList: ["临时", "现势", "历史"],
60 columns: [
61 {
62 prop: "ssywh",
63 label: "上手业务号",
64 },
65 {
66 prop: "dah",
67 label: "档案号",
68 },
69 {
70 prop: "ywh",
71 label: "业务号",
72 },
73 {
74 prop: "gydbdcdyh",
75 label: "供役地不动产单元号",
76 },
77 {
78 prop: "gydqlr",
79 label: "供役地权利人",
80 },
81 {
82 prop: "gydqlrzjzl",
83 label: "供役地权利人证件种类",
84 },
85 {
86 prop: "xydbdcdyh",
87 label: "需役地不动产单元号",
88 },
89 {
90 prop: "xydzl",
91 label: "需役地坐落",
92 },
93 {
94 prop: "xydqlr",
95 label: "需役地权利人",
96 },
97 {
98 prop: "xydqlrzjzl",
99 label: "需役地权利人证件种类",
100 },
101 {
102 prop: "xydzjh",
103 label: "需役地证件号",
104 },
105 {
106 prop: "djyy",
107 label: "登记原因",
108 },
109 {
110 prop: "dyqnr",
111 label: "地役权内容",
112 },
113 {
114 prop: "qlqssj",
115 label: "权利起始时间",
116 },
117 {
118 prop: "qljssj",
119 label: "权利结束时间",
120 },
121 {
122 prop: "bdcdjzmh",
123 label: "不动产登记证明号",
124 },
125 {
126 prop: "qxdm",
127 label: "区县代码",
128 },
129 {
130 prop: "djjg",
131 label: "登记机构",
132 },
133 {
134 prop: "dbr",
135 label: "登簿人",
136 },
137 {
138 prop: "djsj",
139 label: "登记时间",
140 },
141 ],
142 tableData: {
143 linshi: {},
144 xianshi: {},
145 lishi: {},
146 },
147 };
10 }, 148 },
11 }; 149 };
12 </script> 150 </script>
13 151
14 <style lang="scss" scoped> 152 <style lang="scss" scoped>
153 .dyiq {
154 width: 100%;
155 height: 100%;
156 background: #fff;
157 overflow-y: scroll;
158 color: #333;
159
160 .tableBox {
161 width: 810px;
162 margin: 0 auto;
163
164 .title {
165 font-family: "Arial Negreta", "Arial Normal", "Arial", sans-serif;
166 font-weight: 700;
167 font-size: 16px;
168 text-align: center;
169 background: #e9e9e9;
170 height: 62px;
171 line-height: 62px;
172 position: relative;
173 margin: 1px 0;
174 .checkbox {
175 position: absolute;
176 right: 20px;
177 bottom: -16px;
178 height: 62px;
179 }
180 }
181
182 .xxTable {
183 width: 810px;
184 border-spacing: 1px;
185 tr > th {
186 background: #464c5b;
187 color: #fff;
188 font-size: 16px;
189 }
190 tr > th:nth-child(1),
191 tr > th:nth-child(2) {
192 background: #464c5b;
193 }
194 tr > th:nth-child(3) {
195 background: rgba(70, 76, 91, 0.8);
196 }
197 .one th {
198 height: 25px;
199 font-size: 14px;
200 }
201 .one > th:nth-child(1) {
202 color: #fe9400;
203 }
204 .two th {
205 height: 45px;
206
207 p:nth-child(2) {
208 font-size: 14px;
209 }
210 }
211 .two > th:nth-child(1) {
212 color: #fe9400;
213 }
214 .linshiIcon {
215 position: relative;
216 }
217 .linshiIcon::after {
218 content: "";
219 display: block;
220 width: 0;
221 height: 0;
222 border-width: 0px 0px 45px 45px;
223 border-style: none solid solid;
224 border-color: transparent transparent #fe9400;
225 position: absolute;
226 top: 0px;
227 right: 3px;
228 transform: rotate(-90deg);
229 }
230 .icon {
231 position: absolute;
232 top: 8px;
233 right: 6px;
234 transform: rotate(45deg);
235 color: #fff;
236 font-size: 12px;
237 z-index: 10;
238 }
239
240 tr td {
241 text-align: center;
242 height: 40px;
243 padding: 4px;
244 font-size: 13px;
245 }
246 > tr:nth-child(odd) td {
247 background: #f2f2f2;
248 }
249 > tr:nth-child(even) td {
250 background: #f9f9f9;
251 }
252 tr > td:nth-child(2) {
253 color: #fe9400;
254 }
255 tr > td:nth-child(4) {
256 color: #7f7f7f;
257 }
258 }
259 }
260 }
15 </style> 261 </style>
......
1 <template> 1 <template>
2 <div>国有建设用地使用权</div> 2 <div class="gyjsydsyq">
3 <div class="tableBox">
4 <div class="title">
5 建设用地使用权、宅基地使用权登记信息
6 <div class="checkbox">
7 <el-checkbox-group v-model="checkList">
8 <el-checkbox label="临时"></el-checkbox>
9 <el-checkbox label="现势"></el-checkbox>
10 <el-checkbox label="历史"></el-checkbox>
11 </el-checkbox-group>
12 </div>
13 </div>
14 <table class="xxTable">
15 <tr>
16 <th rowspan="3" width="140">业务类型</th>
17 </tr>
18 <tr class="one">
19 <th class="linshiIcon">
20 <div class="icon">临时</div>
21 临时
22 </th>
23 <th>现势</th>
24 <th>历史</th>
25 </tr>
26 <tr class="two">
27 <th>
28 <p>建设用地使用权</p>
29 <p>首次登记</p>
30 </th>
31 <th>
32 <p>建设用地使用权</p>
33 <p>转移登记</p>
34 </th>
35 <th>
36 <p>建设用地使用权</p>
37 <p>转移登记</p>
38 </th>
39 </tr>
40
41 <tr v-for="(item, index) in columns" :key="index">
42 <td>
43 {{ item.label }}
44 </td>
45 <td>{{ tableData.linshi[item.prop] }}</td>
46 <td>{{ tableData.xianshi[item.prop] }}</td>
47 <td>{{ tableData.lishi[item.prop] }}</td>
48 </tr>
49 </table>
50 </div>
51 </div>
3 </template> 52 </template>
4 53
5 <script> 54 <script>
6 export default { 55 export default {
7 name: "gyjsydsyq", 56 name: "gyjsydsyq",
8 data() { 57 data() {
9 return {}; 58 return {
59 checkList: ["临时", "现势", "历史"],
60 columns: [
61 {
62 prop: "ssywh",
63 label: "上手业务号",
64 },
65 {
66 prop: "dah",
67 label: "档案号",
68 },
69 {
70 prop: "ywh",
71 label: "业务号",
72 },
73 {
74 prop: "bdcdyh",
75 label: "不动产单元号",
76 },
77 {
78 prop: "zl",
79 label: "坐落",
80 },
81 {
82 prop: "qlrlx",
83 label: "权利人类型",
84 },
85 {
86 prop: "qlr",
87 label: "权利人",
88 },
89 {
90 prop: "zjzl",
91 label: "证件种类",
92 },
93 {
94 prop: "zjh",
95 label: "证件号",
96 },
97 {
98 prop: "gyqk",
99 label: "共有情况",
100 },
101 {
102 prop: "syqmj",
103 label: "使用权面积(m²)",
104 },
105 {
106 prop: "qlxz",
107 label: "权利性质",
108 },
109 {
110 prop: "tdyt",
111 label: "土地用途",
112 },
113 {
114 prop: "syqqssj",
115 label: "使用权起始时间",
116 },
117 {
118 prop: "syqjssj",
119 label: "使用权结束时间",
120 },
121 {
122 prop: "tdsyqx",
123 label: "土地使用期限",
124 },
125 {
126 prop: "qdjg",
127 label: "取得价格(万元)",
128 },
129 {
130 prop: "djyy",
131 label: "登记原因",
132 },
133 {
134 prop: "bdcqzh",
135 label: "不动产权证号",
136 },
137 {
138 prop: "djsj",
139 label: "登记时间",
140 },
141 {
142 prop: "dbr",
143 label: "登簿人",
144 },
145 {
146 prop: "fj",
147 label: "附记",
148 },
149 ],
150 tableData: {
151 linshi: {
152 ssywh: "",
153 dah: "",
154 ywh: "200825012285",
155 bdcdyh: "370205004005GB10030 W00000000",
156 zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
157 qlrlx: "企业",
158 qlr: "联城有限公司",
159 zjzj: "组织机构代码证",
160 zjh: "*******",
161 gyqk: "单独所有",
162 syqmj: "22384.1700",
163 qlxz: "出让",
164 tdyt: "城镇住宅用地",
165 syqqssj: "2007年12月25日",
166 syqjssj: "2077年12月24日",
167 tdsyqx: "70年",
168 qdjg: "75793.75",
169 djyy: "出让取得",
170 bdcqzh: "陕2018汉台区不动产权第0003782号",
171 djsj: "2008年3月11日",
172 dbr: "路**",
173 fj: "2014年10月21日办理房屋首次登记",
174 },
175 xianshi: {
176 ssywh: "",
177 dah: "",
178 ywh: "200825012285",
179 bdcdyh: "370205004005GB10030 W00000000",
180 zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
181 qlrlx: "企业",
182 qlr: "联城有限公司",
183 zjzj: "组织机构代码证",
184 zjh: "*******",
185 gyqk: "单独所有",
186 syqmj: "22384.1700",
187 qlxz: "出让",
188 tdyt: "城镇住宅用地",
189 syqqssj: "2007年12月25日",
190 syqjssj: "2077年12月24日",
191 tdsyqx: "70年",
192 qdjg: "75793.75",
193 djyy: "出让取得",
194 bdcqzh: "陕2018汉台区不动产权第0003782号",
195 djsj: "2008年3月11日",
196 dbr: "路**",
197 fj: "2014年10月21日办理房屋首次登记",
198 },
199 lishi: {
200 ssywh: "",
201 dah: "",
202 ywh: "200825012285",
203 bdcdyh: "370205004005GB10030 W00000000",
204 zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
205 qlrlx: "企业",
206 qlr: "联城有限公司",
207 zjzj: "组织机构代码证",
208 zjh: "*******",
209 gyqk: "单独所有",
210 syqmj: "22384.1700",
211 qlxz: "出让",
212 tdyt: "城镇住宅用地",
213 syqqssj: "2007年12月25日",
214 syqjssj: "2077年12月24日",
215 tdsyqx: "70年",
216 qdjg: "75793.75",
217 djyy: "出让取得",
218 bdcqzh: "陕2018汉台区不动产权第0003782号",
219 djsj: "2008年3月11日",
220 dbr: "路**",
221 fj: "2014年10月21日办理房屋首次登记",
222 },
223 },
224 };
10 }, 225 },
11 }; 226 };
12 </script> 227 </script>
13 228
14 <style lang="scss" scoped> 229 <style lang="scss" scoped>
230 .gyjsydsyq {
231 width: 100%;
232 height: 100%;
233 background: #fff;
234 overflow-y: scroll;
235 color: #333;
236
237 .tableBox {
238 width: 810px;
239 margin: 0 auto;
240
241 .title {
242 font-family: "Arial Negreta", "Arial Normal", "Arial", sans-serif;
243 font-weight: 700;
244 font-size: 16px;
245 text-align: center;
246 background: #e9e9e9;
247 height: 62px;
248 line-height: 62px;
249 position: relative;
250 margin: 1px 0;
251 .checkbox {
252 position: absolute;
253 right: 20px;
254 bottom: -16px;
255 height: 62px;
256 }
257 }
258
259 .xxTable {
260 width: 810px;
261 border-spacing: 1px;
262 tr > th {
263 background: #464c5b;
264 color: #fff;
265 font-size: 16px;
266 }
267 tr > th:nth-child(1),
268 tr > th:nth-child(2) {
269 background: #464c5b;
270 }
271 tr > th:nth-child(3) {
272 background: rgba(70, 76, 91, 0.8);
273 }
274 .one th {
275 height: 25px;
276 font-size: 14px;
277 }
278 .one > th:nth-child(1) {
279 color: #fe9400;
280 }
281 .two th {
282 height: 45px;
283
284 p:nth-child(2) {
285 font-size: 14px;
286 }
287 }
288 .two > th:nth-child(1) {
289 color: #fe9400;
290 }
291 .linshiIcon {
292 position: relative;
293 }
294 .linshiIcon::after {
295 content: "";
296 display: block;
297 width: 0;
298 height: 0;
299 border-width: 0px 0px 45px 45px;
300 border-style: none solid solid;
301 border-color: transparent transparent #fe9400;
302 position: absolute;
303 top: 0px;
304 right: 3px;
305 transform: rotate(-90deg);
306 }
307 .icon {
308 position: absolute;
309 top: 8px;
310 right: 6px;
311 transform: rotate(45deg);
312 color: #fff;
313 font-size: 12px;
314 z-index: 10;
315 }
316
317 tr td {
318 text-align: center;
319 height: 40px;
320 padding: 4px;
321 font-size: 13px;
322 }
323 > tr:nth-child(odd) td {
324 background: #f2f2f2;
325 }
326 > tr:nth-child(even) td {
327 background: #f9f9f9;
328 }
329 tr > td:nth-child(2) {
330 color: #fe9400;
331 }
332 tr > td:nth-child(4) {
333 color: #7f7f7f;
334 }
335 }
336 }
337 }
15 </style> 338 </style>
......
1 <template> 1 <template>
2 <div>预告登记</div> 2 <div class="ygdj">
3 <div class="tableBox">
4 <div class="title">
5 预告登记信息
6 <div class="checkbox">
7 <el-checkbox-group v-model="checkList">
8 <el-checkbox label="临时"></el-checkbox>
9 <el-checkbox label="现势"></el-checkbox>
10 <el-checkbox label="历史"></el-checkbox>
11 </el-checkbox-group>
12 </div>
13 </div>
14 <table class="xxTable">
15 <tr>
16 <th rowspan="3" width="140">业务类型</th>
17 </tr>
18 <tr class="one">
19 <th class="linshiIcon">
20 <div class="icon">临时</div>
21 临时
22 </th>
23 <th>现势</th>
24 <th>历史</th>
25 </tr>
26 <tr class="two">
27 <th>
28 <p>预售商品房买卖预告登记</p>
29 <p>首次登记</p>
30 </th>
31 <th>
32 <p>预售商品房抵押权预告登记</p>
33 <p>转移登记</p>
34 </th>
35 <th>
36 <p>预售商品房买卖预告登记</p>
37 <p>变更登记</p>
38 </th>
39 </tr>
40
41 <tr v-for="(item, index) in columns" :key="index">
42 <td>
43 {{ item.label }}
44 </td>
45 <td>{{ tableData.linshi[item.prop] }}</td>
46 <td>{{ tableData.xianshi[item.prop] }}</td>
47 <td>{{ tableData.lishi[item.prop] }}</td>
48 </tr>
49 </table>
50 </div>
51 </div>
3 </template> 52 </template>
4 53
5 <script> 54 <script>
6 export default { 55 export default {
7 name: "ygdj", 56 name: "ygdj",
8 data() { 57 data() {
9 return {}; 58 return {
59 checkList: ["临时", "现势", "历史"],
60 columns: [
61 {
62 prop: "ssywh",
63 label: "上手业务号",
64 },
65 {
66 prop: "dah",
67 label: "档案号",
68 },
69 {
70 prop: "ywh",
71 label: "业务号",
72 },
73 {
74 prop: "bdcdyh",
75 label: "不动产单元号",
76 },
77 {
78 prop: "zl",
79 label: "坐落",
80 },
81 {
82 prop: "qlr",
83 label: "权利人",
84 },
85 {
86 prop: "qlrzjzl",
87 label: "证件种类",
88 },
89 {
90 prop: "qlrzjh",
91 label: "证件号",
92 },
93 {
94 prop: "ywr",
95 label: "义务人",
96 },
97 {
98 prop: "ywrzjzl",
99 label: "证件种类",
100 },
101 {
102 prop: "ywrzjh",
103 label: "证件号",
104 },
105 {
106 prop: "fwxz",
107 label: "房屋性质",
108 },
109 {
110 prop: "ghyt",
111 label: "规划用途",
112 },
113 {
114 prop: "fwzcs",
115 label: "房屋总层数",
116 },
117 {
118 prop: "fwszc",
119 label: "房屋所在层",
120 },
121 {
122 prop: "jzmj",
123 label: "建筑面积",
124 },
125 {
126 prop: "djyy",
127 label: "登记原因",
128 },
129 {
130 prop: "bdbzzqse",
131 label: "取得价格/被担保主债权数额",
132 },
133 {
134 prop: "jedw",
135 label: "金额单位",
136 },
137 {
138 prop: "dbfw",
139 label: "担保范围",
140 },
141 {
142 prop: "sfczyd",
143 label: "是否存在禁止或限制转让抵押不动产的约定",
144 },
145 {
146 prop: "djsj",
147 label: "登记时间",
148 },
149 {
150 prop: "bdcdjzmh",
151 label: "不动产登记证明号",
152 },
153 {
154 prop: "dbr",
155 label: "登簿人",
156 },
157 {
158 prop: "zxygywh",
159 label: "注销预告业务号",
160 },
161 {
162 prop: "zxygyy",
163 label: "注销预告原因",
164 },
165 {
166 prop: "zxsj",
167 label: "注销时间",
168 },
169 {
170 prop: "qszt",
171 label: "权属状态",
172 },
173 ],
174 tableData: {
175 linshi: {
176 ssywh: "",
177 dah: "",
178 ywh: "200825012285",
179 bdcdyh: "370205004005GB10030 F00160111",
180 zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
181 qlr: "企业",
182 qlrzjzj: "组织机构代码证",
183 qlrzjh: "*******",
184 ywr: "企业",
185 ywrzjzl: "组织机构代码证",
186 ywrzjh: "*******",
187 tdsyqr: "绿地开发有限公司",
188 fwxz: "商品房",
189 ghyt: "住宅",
190 fwzcs: "10",
191 fwszc: "6",
192 jzmj: "111.5",
193 djyy: "",
194 bdbzzqse: "80.000",
195 jedw: "万元",
196 dbfw: "****",
197 sfczyd: "",
198 djsj: "2008年3月11日",
199 bdcdjzmh: "A（2011）B市不动产证明第0000060号",
200 dbr: "路**",
201 zxygywh: "",
202 zxygyy: "",
203 zxsj: "",
204 qszt: "",
205 },
206 xianshi: {
207 ssywh: "",
208 dah: "",
209 ywh: "200825012285",
210 bdcdyh: "370205004005GB10030 F00160111",
211 zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
212 qlr: "企业",
213 qlrzjzj: "组织机构代码证",
214 qlrzjh: "*******",
215 ywr: "企业",
216 ywrzjzl: "组织机构代码证",
217 ywrzjh: "*******",
218 tdsyqr: "绿地开发有限公司",
219 fwxz: "商品房",
220 ghyt: "住宅",
221 fwzcs: "10",
222 fwszc: "6",
223 jzmj: "111.5",
224 djyy: "",
225 bdbzzqse: "60.000",
226 jedw: "",
227 dbfw: "",
228 sfczyd: "是",
229 djsj: "2008年3月11日",
230 bdcdjzmh: "A（2011）B市不动产证明第0000060号",
231 dbr: "路**",
232 zxygywh: "",
233 zxygyy: "",
234 zxsj: "",
235 qszt: "",
236 },
237 lishi: {
238 ssywh: "",
239 dah: "",
240 ywh: "200825012285",
241 bdcdyh: "370205004005GB10030 F00160111",
242 zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
243 qlr: "企业",
244 qlrzjzj: "组织机构代码证",
245 qlrzjh: "*******",
246 ywr: "企业",
247 ywrzjzl: "组织机构代码证",
248 ywrzjh: "*******",
249 tdsyqr: "绿地开发有限公司",
250 fwxz: "商品房",
251 ghyt: "住宅",
252 fwzcs: "10",
253 fwszc: "6",
254 jzmj: "111.5",
255 djyy: "",
256 bdbzzqse: "",
257 jedw: "",
258 dbfw: "",
259 sfczyd: "",
260 djsj: "2008年3月11日",
261 bdcdjzmh: "A（2011）B市不动产证明第0000060号",
262 dbr: "路**",
263 zxygywh: "200825012286",
264 zxygyy: "个人原因",
265 zxsj: "2008年3月11日",
266 qszt: "",
267 },
268 },
269 };
10 }, 270 },
11 }; 271 };
12 </script> 272 </script>
13 273
14 <style lang="scss" scoped> 274 <style lang="scss" scoped>
275 .ygdj {
276 width: 100%;
277 height: 100%;
278 background: #fff;
279 overflow-y: scroll;
280 color: #333;
281
282 .tableBox {
283 width: 810px;
284 margin: 0 auto;
285
286 .title {
287 font-family: "Arial Negreta", "Arial Normal", "Arial", sans-serif;
288 font-weight: 700;
289 font-size: 16px;
290 text-align: center;
291 background: #e9e9e9;
292 height: 62px;
293 line-height: 62px;
294 position: relative;
295 margin: 1px 0;
296 .checkbox {
297 position: absolute;
298 right: 20px;
299 bottom: -16px;
300 height: 62px;
301 }
302 }
303
304 .xxTable {
305 width: 810px;
306 border-spacing: 1px;
307 tr > th {
308 background: #464c5b;
309 color: #fff;
310 font-size: 16px;
311 }
312 tr > th:nth-child(1),
313 tr > th:nth-child(2) {
314 background: #464c5b;
315 }
316 tr > th:nth-child(3) {
317 background: rgba(70, 76, 91, 0.8);
318 }
319 .one th {
320 height: 25px;
321 font-size: 14px;
322 }
323 .one > th:nth-child(1) {
324 color: #fe9400;
325 }
326 .two th {
327 height: 45px;
328
329 p:nth-child(2) {
330 font-size: 14px;
331 }
332 }
333 .two > th:nth-child(1) {
334 color: #fe9400;
335 }
336 .linshiIcon {
337 position: relative;
338 }
339 .linshiIcon::after {
340 content: "";
341 display: block;
342 width: 0;
343 height: 0;
344 border-width: 0px 0px 45px 45px;
345 border-style: none solid solid;
346 border-color: transparent transparent #fe9400;
347 position: absolute;
348 top: 0px;
349 right: 3px;
350 transform: rotate(-90deg);
351 }
352 .icon {
353 position: absolute;
354 top: 8px;
355 right: 6px;
356 transform: rotate(45deg);
357 color: #fff;
358 font-size: 12px;
359 z-index: 10;
360 }
361
362 tr td {
363 text-align: center;
364 height: 40px;
365 padding: 4px;
366 font-size: 13px;
367 }
368 > tr:nth-child(odd) td {
369 background: #f2f2f2;
370 }
371 > tr:nth-child(even) td {
372 background: #f9f9f9;
373 }
374 tr > td:nth-child(2) {
375 color: #fe9400;
376 }
377 tr > td:nth-child(4) {
378 color: #7f7f7f;
379 }
380 }
381 }
382 }
15 </style> 383 </style>
......
1 <template> 1 <template>
2 <div>异议登记</div> 2 <div class="yydj">
3 <div class="tableBox">
4 <div class="title">
5 异议登记信息
6 <div class="checkbox">
7 <el-checkbox-group v-model="checkList">
8 <el-checkbox label="临时"></el-checkbox>
9 <el-checkbox label="现势"></el-checkbox>
10 <el-checkbox label="历史"></el-checkbox>
11 </el-checkbox-group>
12 </div>
13 </div>
14 <table class="xxTable">
15 <tr>
16 <th rowspan="3" width="140">业务类型</th>
17 </tr>
18 <tr class="one">
19 <th class="linshiIcon">
20 <div class="icon">临时</div>
21 临时
22 </th>
23 <th>现势</th>
24 <th>历史</th>
25 </tr>
26 <tr class="two">
27 <th>异议登记</th>
28 <th>异议登记</th>
29 <th>异议登记</th>
30 </tr>
31
32 <tr v-for="(item, index) in columns" :key="index">
33 <td>
34 {{ item.label }}
35 </td>
36 <td>{{ tableData.linshi[item.prop] }}</td>
37 <td>{{ tableData.xianshi[item.prop] }}</td>
38 <td>{{ tableData.lishi[item.prop] }}</td>
39 </tr>
40 </table>
41 </div>
42 </div>
3 </template> 43 </template>
4 44
5 <script> 45 <script>
6 export default { 46 export default {
7 name: "yydj", 47 name: "yydj",
8 data() { 48 data() {
9 return {}; 49 return {
50 checkList: ["临时", "现势", "历史"],
51 columns: [
52 {
53 prop: "ssywh",
54 label: "上手业务号",
55 },
56 {
57 prop: "dah",
58 label: "档案号",
59 },
60 {
61 prop: "ywh",
62 label: "业务号",
63 },
64 {
65 prop: "bdcdyh",
66 label: "不动产单元号",
67 },
68 {
69 prop: "zl",
70 label: "坐落",
71 },
72 {
73 prop: "yyr",
74 label: "异议人",
75 },
76 {
77 prop: "zjzl",
78 label: "证件种类",
79 },
80 {
81 prop: "zjh",
82 label: "证件号",
83 },
84 {
85 prop: "yysx",
86 label: "异议事项",
87 },
88 {
89 prop: "bdcdjzmh",
90 label: "不动产登记证明号",
91 },
92 {
93 prop: "djjg",
94 label: "登记机构",
95 },
96 {
97 prop: "dbr",
98 label: "登簿人",
99 },
100 {
101 prop: "djsj",
102 label: "登记时间",
103 },
104 {
105 prop: "zxyyywh",
106 label: "注销异议业务号",
107 },
108 {
109 prop: "zxyyyy",
110 label: "注销异议原因",
111 },
112 {
113 prop: "zxyydbr",
114 label: "注销异议登簿人",
115 },
116 {
117 prop: "zxyydjsj",
118 label: "注销异议登记时间",
119 },
120 ],
121 tableData: {
122 linshi: {
123 ssywh: "",
124 dah: "",
125 ywh: "200825012285",
126 bdcdyh: "370205004005GB10030 F00160111",
127 zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
128 yyr: "李四",
129 zjzj: "身份证号",
130 zjh: "*******",
131 yysx: "",
132 djjg: "",
133 bdcdjzmh: "200825012286",
134 dbr: "",
135 djsj: "2008年3月11日",
136 zxyyywh: "",
137 zxyyyy: "",
138 zxyydbr: "",
139 zxyydjsj: "",
140 },
141 xianshi: {
142 ssywh: "",
143 dah: "",
144 ywh: "200825012285",
145 bdcdyh: "370205004005GB10030 F00160111",
146 zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
147 yyr: "李四",
148 zjzj: "身份证号",
149 zjh: "*******",
150 yysx: "",
151 djjg: "",
152 bdcdjzmh: "200825012286",
153 dbr: "",
154 djsj: "2008年3月11日",
155 zxyyywh: "200825012286",
156 zxyyyy: "时间到期",
157 zxyydbr: "李四",
158 zxyydjsj: "2008年3月11日",
159 },
160 lishi: {
161 ssywh: "",
162 dah: "",
163 ywh: "200825012285",
164 bdcdyh: "370205004005GB10030 F00160111",
165 zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
166 yyr: "李四",
167 zjzj: "身份证号",
168 zjh: "*******",
169 yysx: "",
170 djjg: "",
171 bdcdjzmh: "200825012286",
172 dbr: "",
173 djsj: "2008年3月11日",
174 zxyyywh: "200825012286",
175 zxyyyy: "时间到期",
176 zxyydbr: "李四",
177 zxyydjsj: "2008年3月11日",
178 },
179 },
180 };
10 }, 181 },
11 }; 182 };
12 </script> 183 </script>
13 184
14 <style lang="scss" scoped> 185 <style lang="scss" scoped>
186 .yydj {
187 width: 100%;
188 height: 100%;
189 background: #fff;
190 overflow-y: scroll;
191 color: #333;
192
193 .tableBox {
194 width: 810px;
195 margin: 0 auto;
196
197 .title {
198 font-family: "Arial Negreta", "Arial Normal", "Arial", sans-serif;
199 font-weight: 700;
200 font-size: 16px;
201 text-align: center;
202 background: #e9e9e9;
203 height: 62px;
204 line-height: 62px;
205 position: relative;
206 margin: 1px 0;
207 .checkbox {
208 position: absolute;
209 right: 20px;
210 bottom: -16px;
211 height: 62px;
212 }
213 }
214
215 .xxTable {
216 width: 810px;
217 border-spacing: 1px;
218 tr > th {
219 background: #464c5b;
220 color: #fff;
221 font-size: 16px;
222 }
223 tr > th:nth-child(1),
224 tr > th:nth-child(2) {
225 background: #464c5b;
226 }
227 tr > th:nth-child(3) {
228 background: rgba(70, 76, 91, 0.8);
229 }
230 .one th {
231 height: 25px;
232 font-size: 14px;
233 }
234 .one > th:nth-child(1) {
235 color: #fe9400;
236 }
237 .two th {
238 height: 45px;
239
240 p:nth-child(2) {
241 font-size: 14px;
242 }
243 }
244 .two > th:nth-child(1) {
245 color: #fe9400;
246 }
247 .linshiIcon {
248 position: relative;
249 }
250 .linshiIcon::after {
251 content: "";
252 display: block;
253 width: 0;
254 height: 0;
255 border-width: 0px 0px 45px 45px;
256 border-style: none solid solid;
257 border-color: transparent transparent #fe9400;
258 position: absolute;
259 top: 0px;
260 right: 3px;
261 transform: rotate(-90deg);
262 }
263 .icon {
264 position: absolute;
265 top: 8px;
266 right: 6px;
267 transform: rotate(45deg);
268 color: #fff;
269 font-size: 12px;
270 z-index: 10;
271 }
272
273 tr td {
274 text-align: center;
275 height: 40px;
276 padding: 4px;
277 font-size: 13px;
278 }
279 > tr:nth-child(odd) td {
280 background: #f2f2f2;
281 }
282 > tr:nth-child(even) td {
283 background: #f9f9f9;
284 }
285 tr > td:nth-child(2) {
286 color: #fe9400;
287 }
288 tr > td:nth-child(4) {
289 color: #7f7f7f;
290 }
291 }
292 }
293 }
15 </style> 294 </style>
......
...@@ -107,7 +107,7 @@ export default { ...@@ -107,7 +107,7 @@ export default {
107 pageData: { 107 pageData: {
108 current: 1, 108 current: 1,
109 size: 10, 109 size: 10,
110 total: 2, 110 total: 0,
111 }, 111 },
112 ywlys: datas.ywlys(), 112 ywlys: datas.ywlys(),
113 tableData: { 113 tableData: {
...@@ -146,12 +146,11 @@ export default { ...@@ -146,12 +146,11 @@ export default {
146 moreQueryClick(){}, 146 moreQueryClick(){},
147 openDialog(scope) { 147 openDialog(scope) {
148 this.isDialog = true; 148 this.isDialog = true;
149 // if(scope.row.qllx == '预告买卖登记'){ 149 if (scope.row.qllx == "预告买卖登记") {
150 // this.$refs.djbxxDialog.showTab = 'ygdj' 150 this.$refs.djbxxDialog.showTab = "ygdj";
151 // } 151 } else if (scope.row.qllx == "查封登记") {
152 // else if(scope.row.qllx == '查封登记'){ 152 this.$refs.djbxxDialog.showTab = "cfdj";
153 // this.$refs.djbxxDialog.showTab = 'cfdj' 153 }
154 // }
155 }, 154 },
156 }, 155 },
157 }; 156 };
......