Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
6f2390be by 田浩浩
Options

修改登记簿功能

1 parent 553c3e7e
Inline Side-by-side
Showing 9 changed files with 936 additions and 171 deletions
...@@ -24,10 +24,11 @@ export function getDjbfm(qlbsm) { ...@@ -24,10 +24,11 @@ export function getDjbfm(qlbsm) {
24 } 24 }
25 25
26 // 获取登记目录 26 // 获取登记目录
27 export function getDjml(qlbsm) { 27 export function getBdcqldjmlByBdcdyid(data) {
28 return request({ 28 return request({
29 url: '/zhcx/djbcx/djml/' + qlbsm, 29 url: '/zhcx/djbcx/getBdcqldjmlByBdcdyid',
30 method: 'get' 30 method: 'get',
31 params: data
31 }) 32 })
32 } 33 }
33 34
...@@ -40,9 +41,9 @@ export function getZdjbxx(qlbsm) { ...@@ -40,9 +41,9 @@ export function getZdjbxx(qlbsm) {
40 } 41 }
41 42
42 // 获取宗地信息 43 // 获取宗地信息
43 export function getZdjjxxBySLdy(data) { 44 export function getZdjjxxBybdcdyid(data) {
44 return request({ 45 return request({
45 url: '/zhcx/djbcx/getZdjjxxBySLdy', 46 url: '/zhcx/djbcx/getZdjjxxBybdcdyid',
46 method: 'get', 47 method: 'get',
47 params: data 48 params: data
48 }) 49 })
......
1 <template>
2 <div class="bdcqldjml">
3 <table class="mlTable">
4 <tr>
5 <th colspan="5" class="title">不动产权利登记目录</th>
6 </tr>
7 <tr>
8 <td>序号</td>
9 <td>不动产单元号</td>
10 <td>不动产类型</td>
11 <td>所在本数</td>
12 <td>备注</td>
13 </tr>
14 <tr v-for="(item, index) in bdcqlml" :key="index">
15 <td>{{ index + 1 }}</td>
16 <td>{{ item.bdcdyh }}</td>
17 <td>{{ item.bdclx }}</td>
18 <td>{{ item.szbs }}</td>
19 <td>{{ item.bz }}</td>
20 </tr>
21 </table>
22 </div>
23 </template>
24
25 <script>
26 import { getBdcqldjmlByBdcdyid } from "@/api/zhcx.js";
27 export default {
28 data() {
29 return {
30 bdcqlml: [],
31 propsParam: this.$attrs,
32 };
33 },
34 mounted() {
35 getBdcqldjmlByBdcdyid({ bdcdyid: this.propsParam.bdcdyid }).then((res) => {
36 if (res.code === 200) {
37 this.bdcqlml = res.result;
38 }
39 });
40 },
41 };
42 </script>
43
44 <style lang="scss" scoped>
45 .bdcqldjml {
46 width: 100%;
47 height: 100%;
48 background: #fff;
49 overflow-y: scroll;
50 .mlTable {
51 width: 90%;
52 margin: 0 auto;
53 color: #333;
54 border-spacing: 1px;
55 background-color: #333;
56
57 .title {
58 font-size: 20px;
59 line-height: 60px;
60 font-family: serif;
61 position: relative;
62 }
63
64 td,
65 th {
66 background-color: white;
67 line-height: 30px;
68 padding: 0 4px;
69 text-align: center;
70 }
71 }
72 }
73 </style>
1 <template>
2 <div class="content">
3 <div class="left">
4 <el-tree
5 ref="tree"
6 :data="treedata"
7 :props="defaultProps"
8 @node-click="handleNodeClick"
9 :default-expand-all="true"
10 :expand-on-click-node="false"
11 node-key="id"
12 :default-checked-keys="[showTab]"
13 >
14 </el-tree>
15 </div>
16 <div class="right">
17 <component :is="componentTag" v-bind="currentSelectProps" />
18 </div>
19 </div>
20 </template>
21 <script>
22 export default {
23 data() {
24 return {
25 //接收参数
26 // propsParam: this.$attrs,
27 //左侧目录
28 catalog: {},
29 //选择加载哪一个组件
30 componentTag: "JSYDSYQ",
31 //子组件接收参数
32 currentSelectProps: {},
33 //左侧树形结构数据
34 treedata: [
35 {
36 id: "djbfm",
37 form: "djbfm.vue",
38 label: "登记簿封面",
39 children: [
40 {
41 id: "zdjbxx",
42 form: "zdjbxx.vue",
43 label: "宗地基本信息",
44 },
45 {
46 id: "bdcqldjml",
47 form: "bdcqldjml.vue",
48 label: "不动产权利登记目录",
49 children: [
50 {
51 id: "bdcqljqtsx",
52 form: "bdcqljqtsx.vue",
53 label: "不动产权利及其他事项",
54 children: [],
55 },
56 ],
57 },
58 ],
59 },
60 ],
61 defaultProps: {
62 children: "children",
63 label: "label",
64 },
65 showTab: "djxxTable", // 选中状态,根据表格中权利类型判断
66 };
67 },
68 props: ["formData"],
69 mounted() {
70 this.loadData();
71 },
72 methods: {
73 loadData() {
74 this.treedata[0].children[1].children[0].children.push({
75 id: "jsydsyq",
76 form: "jsydsyq.vue",
77 label: "国有建设用地使用权(临:0，现:0，历:0)",
78 });
79 this.treedata[0].children[1].children[0].children.push({
80 id: "diyaq",
81 form: "dyaq.vue",
82 label: "抵押权(临:0，现:0，历:0)",
83 });
84 this.treedata[0].children[1].children[0].children.push({
85 id: "diyiq",
86 form: "diyiq.vue",
87 label: "地役权(临:0，现:0，历:0)",
88 });
89 this.treedata[0].children[1].children[0].children.push({
90 id: "ygdj",
91 form: "ygdj.vue",
92 label: "预告登记(临:0，现:0，历:0)",
93 });
94 this.treedata[0].children[1].children[0].children.push({
95 id: "yydj",
96 form: "yydj.vue",
97 label: "异议登记(临:0，现:0，历:0)",
98 });
99 this.treedata[0].children[1].children[0].children.push({
100 id: "cfdj",
101 form: "cfdj.vue",
102 label: "查封登记(临:0，现:0，历:0)",
103 });
104 //alert(this.formData.bdcdyid);
105 this.currentSelectProps = {
106 bdcdyid: this.formData.bdcdyid,
107 qllx: this.formData.qllx,
108 bsmQlxx: this.formData.bsmQlxx,
109 };
110
111 this.componentTag = (r) =>
112 require.ensure([], () =>
113 r(require("@/views/registerBook/jsydsyq.vue"))
114 );
115 },
116 handleNodeClick(data, node, elem) {
117 this.componentTag = (r) =>
118 require.ensure([], () =>
119 r(require("@/views/registerBook/" + data.form))
120 );
121 },
122 },
123 };
124 </script>
125 <style scoped lang="scss">
126 .content {
127 width: 100%;
128 height: 100%;
129 display: flex;
130
131 .left {
132 width: 256px;
133 height: 704px;
134 background-color: #f5f5f5;
135 color: #333;
136 border: 1px solid rgb(228, 228, 228);
137 }
138
139 .right {
140 width: calc(100% - 256px);
141 height: 704px;
142 // overflow-y: scroll;
143 overflow: auto;
144 background-color: #f5f5f5;
145 border: 1px solid rgb(228, 228, 228);
146 }
147 }
148
149 /deep/ .expanded.el-tree-node__expand-icon,
150 /deep/ .el-tree-node__expand-icon {
151 visibility: hidden;
152 }
153
154 /deep/ .el-tree-node__content {
155 border: 1px solid rgb(228, 228, 228);
156 height: 45px;
157 }
158
159 /deep/ .el-tree-node:focus > .el-tree-node__content {
160 background-color: #f5f5f5;
161 color: #0079fe;
162 border-right: 4px solid #0079fe;
163 }
164
165 /deep/.el-tree-node {
166 white-space: pre-wrap;
167 }
168
169 /deep/ .is-current > .el-tree-node__content {
170 background-color: #f5f5f5;
171 color: #0079fe;
172 border-right: 4px solid #0079fe;
173 }
174 </style>
1 <template>
2 <div class="djbfm">
3 <br /><br />
4 <p>
5 <font>{{ info.sheng }}</font>
6 省 (区、市)
7 <font>{{ info.shi }}</font>
8 市 (区)
9 <font>{{ info.xian }}</font>
10 区 (县、市)
11 </p>
12 <p>
13 <font>{{ info.zhen }}</font>
14 街道 (乡、镇)
15 <font>{{ info.cun }}</font>
16 街坊 (村)
17 <font>{{ info.zu }}</font>
18 组
19 </p>
20 <div class="title">不动产登记簿</div>
21 <br />
22 <p>
23 宗地/宗海号:
24 <font>{{ info.zddm }}</font>
25 </p>
26 <div class="bottom">
27 <p>
28 登记机构:
29 <font>{{ info.djjg }}</font>
30 </p>
31 </div>
32 </div>
33 </template>
34
35 <script>
36 import { getDjbfm } from "@/api/zhcx.js";
37
38 export default {
39 data() {
40 return {
41 //传递参数
42 propsParam: this.$attrs,
43 info: {},
44 };
45 },
46 mounted() {
47 this.loadData();
48 },
49 methods: {
50 loadData() {
51 getDjbfm(
52 this.propsParam.bsmQlxx
53 ).then((res) => {
54 if (res.code === 200) {
55 this.info = res.result;
56 }
57 });
58 },
59 },
60 };
61 </script>
62
63 <style lang="scss" scoped>
64 .djbfm {
65 width: 100%;
66 height: 100%;
67 background: #fff;
68 border-right: 1px solid #ccc;
69 line-height: 45px;
70 text-align: center;
71 font-size: 18px;
72 font-family: serif;
73 position: relative;
74 font {
75 border-bottom: 1px solid #000;
76 display: inline-block;
77 padding: 0 15px;
78 line-height: 16px;
79 }
80 .title {
81 height: 40%;
82 display: flex;
83 font-size: 38px;
84 color: #000;
85 justify-content: center;
86 align-items: center;
87 }
88 .bottom {
89 position: absolute;
90 bottom: 0px;
91 text-align: center;
92 width: 100%;
93 left: 0;
94 height: 100px;
95 line-height: 100px;
96 p {
97 font-size: 28px;
98 }
99 font {
100 font-size: 24px;
101 line-height: 24px;
102 }
103 }
104 }
105 </style>
1 import filter from '@/utils/filter.js'
2
3 class data extends filter {
4 constructor() {
5 super()
6 }
7 columns () {
8 return [
9 {
10 prop: "qszt",
11 label: "权属状态",
12 },
13 {
14 prop: "qllxmc",
15 label: "权利类型",
16 },
17 {
18 prop: "djlxmc",
19 label: "登记类型",
20 },
21 {
22 prop: "ssywh",
23 label: "上手业务号",
24 },
25 {
26 prop: "dah",
27 label: "档案号",
28 },
29 {
30 prop: "ywh",
31 label: "业务号",
32 },
33 {
34 prop: "bdcdyh",
35 label: "不动产单元号",
36 },
37 {
38 prop: "zl",
39 label: "坐落",
40 },
41 {
42 prop: "qlrlx",
43 label: "权利人类型",
44 },
45 {
46 prop: "qlrmc",
47 label: "权利人",
48 },
49 {
50 prop: "qlrzjzl",
51 label: "证件种类",
52 },
53 {
54 prop: "qlrzjhm",
55 label: "证件号",
56 },
57 {
58 prop: "gyfs",
59 label: "共有情况",
60 },
61 {
62 prop: "mj",
63 label: "使用权面积(m²)",
64 },
65 {
66 prop: "qlxz",
67 label: "权利性质",
68 },
69 {
70 prop: "ytmc",
71 label: "土地用途",
72 },
73 {
74 prop: "syqqzsj",
75 label: "使用权起止时间",
76 },
77 {
78 prop: "tdsyqx",
79 label: "土地使用期限",
80 },
81 {
82 prop: "qdjg",
83 label: "取得价格(万元)",
84 },
85 {
86 prop: "djyy",
87 label: "登记原因",
88 },
89 {
90 prop: "bdcqzh",
91 label: "不动产权证号",
92 },
93 {
94 prop: "djsj",
95 label: "登记时间",
96 },
97 {
98 prop: "dbr",
99 label: "登簿人",
100 },
101 {
102 prop: "fj",
103 label: "附记",
104 },
105 ]
106 }
107 }
108
109 let datas = new data()
110
111 export {
112 datas
113 }
...\ No newline at end of file ...\ No newline at end of file
...@@ -5,7 +5,12 @@ ...@@ -5,7 +5,12 @@
5 {{ title }} 5 {{ title }}
6 <div class="checkbox"> 6 <div class="checkbox">
7 <el-checkbox-group v-model="checkList" @change="checkChange"> 7 <el-checkbox-group v-model="checkList" @change="checkChange">
8 <el-checkbox v-for="item in qsztList" :key="item.value" :label="item.value">{{ item.label }}</el-checkbox> 8 <el-checkbox
9 v-for="item in qsztList"
10 :key="item.value"
11 :label="item.value"
12 >{{ item.label }}</el-checkbox
13 >
9 </el-checkbox-group> 14 </el-checkbox-group>
10 </div> 15 </div>
11 </div> 16 </div>
...@@ -15,11 +20,15 @@ ...@@ -15,11 +20,15 @@
15 <td> 20 <td>
16 {{ item.label }} 21 {{ item.label }}
17 </td> 22 </td>
18 <td v-for="(row, index) in tableData" :key="index" :class="[ 23 <td
24 v-for="(row, index) in tableData"
25 :key="index"
26 :class="[
19 row.qszt == '2' ? 'lishi' : '', 27 row.qszt == '2' ? 'lishi' : '',
20 row.qszt == '0' ? 'linshi' : '', 28 row.qszt == '0' ? 'linshi' : '',
21 item.prop == 'qszt' && row.qszt == '0' ? 'linshiIcon' : '', 29 item.prop == 'qszt' && row.qszt == '0' ? 'linshiIcon' : '',
22 ]"> 30 ]"
31 >
23 <div class="icon" v-if="item.prop == 'qszt' && row.qszt == '0'"> 32 <div class="icon" v-if="item.prop == 'qszt' && row.qszt == '0'">
24 正在办理 33 正在办理
25 </div> 34 </div>
...@@ -38,10 +47,9 @@ ...@@ -38,10 +47,9 @@
38 </template> 47 </template>
39 48
40 <script> 49 <script>
41 import { datas } from "./jsydsyq.js";
42 import { getJsydsyqList } from "@/api/zhcx.js"; 50 import { getJsydsyqList } from "@/api/zhcx.js";
43 export default { 51 export default {
44 data () { 52 data() {
45 return { 53 return {
46 qsztList: [ 54 qsztList: [
47 { 55 {
...@@ -59,26 +67,118 @@ export default { ...@@ -59,26 +67,118 @@ export default {
59 ], 67 ],
60 checkList: ["0", "1", "2"], 68 checkList: ["0", "1", "2"],
61 //传递参数 69 //传递参数
62 propsParam: {}, 70 propsParam: this.$attrs,
63 //列表数据 71 //列表数据
64 tableData: [], 72 tableData: [],
65 //空列值个数 73 //空列值个数
66 emptycolNum: 0, 74 emptycolNum: 0,
67 //列名称对象 75 //列名称对象
68 columns: [], 76 columns: [
77 {
78 prop: "qszt",
79 label: "权属状态",
80 },
81 {
82 prop: "qllxmc",
83 label: "权利类型",
84 },
85 {
86 prop: "djlxmc",
87 label: "登记类型",
88 },
89 {
90 prop: "ssywh",
91 label: "上手业务号",
92 },
93 {
94 prop: "dah",
95 label: "档案号",
96 },
97 {
98 prop: "ywh",
99 label: "业务号",
100 },
101 {
102 prop: "bdcdyh",
103 label: "不动产单元号",
104 },
105 {
106 prop: "zl",
107 label: "坐落",
108 },
109 {
110 prop: "qlrlx",
111 label: "权利人类型",
112 },
113 {
114 prop: "qlrmc",
115 label: "权利人",
116 },
117 {
118 prop: "qlrzjzl",
119 label: "证件种类",
120 },
121 {
122 prop: "qlrzjhm",
123 label: "证件号",
124 },
125 {
126 prop: "gyfs",
127 label: "共有情况",
128 },
129 {
130 prop: "mj",
131 label: "使用权面积(m²)",
132 },
133 {
134 prop: "qlxz",
135 label: "权利性质",
136 },
137 {
138 prop: "ytmc",
139 label: "土地用途",
140 },
141 {
142 prop: "syqqzsj",
143 label: "使用权起止时间",
144 },
145 {
146 prop: "tdsyqx",
147 label: "土地使用期限",
148 },
149 {
150 prop: "qdjg",
151 label: "取得价格(万元)",
152 },
153 {
154 prop: "djyy",
155 label: "登记原因",
156 },
157 {
158 prop: "bdcqzh",
159 label: "不动产权证号",
160 },
161 {
162 prop: "djsj",
163 label: "登记时间",
164 },
165 {
166 prop: "dbr",
167 label: "登簿人",
168 },
169 {
170 prop: "fj",
171 label: "附记",
172 },
173 ],
69 title: "建设用地使用权、宅基地使用权登记信息", 174 title: "建设用地使用权、宅基地使用权登记信息",
70 }; 175 };
71 }, 176 },
72 created () { 177 created() {
73 this.propsParam = this.$attrs;
74 console.log(this.$attrs, 'this.$attrs;');
75 this.columns = datas.columns();
76 this.loadData(); 178 this.loadData();
77 // this.$alert(datas.columns());
78 }, 179 },
79 methods: { 180 methods: {
80 loadData () { 181 loadData() {
81 //this.$alert(this.propsParam.bdcdyh);
82 getJsydsyqList({ 182 getJsydsyqList({
83 bdcdyid: this.propsParam.bdcdyid, 183 bdcdyid: this.propsParam.bdcdyid,
84 qllx: this.propsParam.qllx, 184 qllx: this.propsParam.qllx,
...@@ -90,10 +190,10 @@ export default { ...@@ -90,10 +190,10 @@ export default {
90 } 190 }
91 }); 191 });
92 }, 192 },
93 checkChange () { 193 checkChange() {
94 this.loadData(); 194 this.loadData();
95 }, 195 },
96 getQsztName (code) { 196 getQsztName(code) {
97 let name = ""; 197 let name = "";
98 for (let item of this.qsztList) { 198 for (let item of this.qsztList) {
99 if (item.value == code) { 199 if (item.value == code) {
...@@ -108,5 +208,5 @@ export default { ...@@ -108,5 +208,5 @@ export default {
108 </script> 208 </script>
109 209
110 <style lang="scss" scoped> 210 <style lang="scss" scoped>
111 // @import "./qlxxCommon.scss"; 211 @import "./qlxxCommon.scss";
112 </style> 212 </style>
......
1 .djxxTable {
2 width: 100%;
3 height: 100%;
4 background: #fff;
5 overflow-y: scroll;
6 color: #333;
7
8 .tableBox {
9 margin: 0 auto;
10 display: flex;
11 flex-wrap: wrap;
12
13 .title {
14 width: 100%;
15 font-weight: 700;
16 font-size: 16px;
17 text-align: center;
18 background: #e9e9e9;
19 height: 62px;
20 line-height: 62px;
21 position: relative;
22 margin: 1px 0;
23
24 .checkbox {
25 position: absolute;
26 right: 20px;
27 bottom: -16px;
28 height: 62px;
29 }
30 }
31
32 .xxTableBox {
33 overflow-x: scroll;
34 width: 100%;
35 padding-bottom: 35px;
36 }
37
38 .xxTable>tr:first-child th {
39 width: 140px;
40 }
41
42 .xxTable {
43 border-spacing: 1px;
44 width: 100%;
45
46 tr>th {
47 border: 1px solid #ccc;
48 background: #F2F2F2;
49 color: #333333;
50 font-size: 16px;
51 height: 40px;
52 }
53
54 th.linshi,
55 th.xianshi {
56 background: #464c5b;
57 }
58
59 th.lishi {
60 background: rgba(70, 76, 91, 0.8);
61 }
62
63 .one th {
64 height: 25px;
65 font-size: 14px;
66 }
67
68 th.linshi {
69 color: #fe9400;
70 }
71
72 .two th {
73 height: 45px;
74
75 p:nth-child(2) {
76 font-size: 14px;
77 }
78 }
79
80 .linshiIcon {
81 position: relative;
82 }
83
84 .linshiIcon::after {
85 content: "";
86 display: block;
87 width: 0;
88 height: 0;
89 border-width: 0px 0px 55px 55px;
90 border-style: none solid solid;
91 border-color: transparent transparent #fe9400;
92 position: absolute;
93 top: 0;
94 right: 0;
95 transform: rotate(-90deg);
96 }
97
98 .icon {
99 position: absolute;
100 top: 13px;
101 right: -4px;
102 transform: rotate(45deg);
103 color: #fff;
104 font-size: 12px;
105 z-index: 10;
106 }
107
108 tr td {
109 border: 1px solid #ccc;
110 text-align: center;
111 height: 40px;
112 padding: 4px;
113 font-size: 13px;
114 width: 140px;
115 }
116
117 >tr:nth-child(odd) td {
118 background: #f2f2f2;
119 }
120
121 >tr:nth-child(even) td {
122 background: #f9f9f9;
123 }
124
125 td.linshi {
126 color: #fe9400;
127 }
128
129 tr>td.lishi {
130 color: #7f7f7f;
131 }
132 }
133 }
134 }
...\ No newline at end of file ...\ No newline at end of file
1 <template>
2 <div class="zdxx">
3 <div class="tablebox">
4 <table cellpadding="0" cellspacing="0" class="zdxxTable">
5 <col width="80" />
6 <col width="60" />
7 <col width="90" />
8 <col width="235" />
9 <col width="150" />
10 <tr>
11 <td colspan="6" class="title">宗地基本信息</td>
12 </tr>
13 <tr>
14 <td colspan="6" class="unit" v-if="zdjbxx.mjdw == '1'">
15 单位：■平方米 □公顷（□亩）、万元
16 </td>
17 <td colspan="6" class="unit" v-else>
18 单位：□平方米 ■公顷（■亩）、万元
19 </td>
20 </tr>
21 <tr>
22 <td colspan="2">不动产类型</td>
23 <td colspan="4">■土地 ■房屋建筑 □构筑物 □森林、林地 □其他</td>
24 </tr>
25 <tr>
26 <td colspan="2">坐落</td>
27 <td colspan="4">{{ zdjbxx.zl }}</td>
28 </tr>
29 <tr>
30 <td rowspan="8" class="title2">土地状况</td>
31 </tr>
32 <tr>
33 <td colspan="2">宗地面积</td>
34 <td>{{ zdjbxx.zdmj }}</td>
35 <td>用途</td>
36 <td>{{ zdjbxx.ghytmc }}</td>
37 </tr>
38 <tr>
39 <td colspan="2">等级</td>
40 <td>{{ zdjbxx.dj }}</td>
41 <td>价格</td>
42 <td>{{ zdjbxx.jg }}</td>
43 </tr>
44 <tr>
45 <td colspan="2">权利类型</td>
46 <td>{{ zdjbxx.qllx }}</td>
47 <td>权利性质</td>
48 <td>{{ zdjbxx.qlxz }}</td>
49 </tr>
50 <tr>
51 <td colspan="2">权利设定方式</td>
52 <td>{{ zdjbxx.qlsdfs }}</td>
53 <td>容积率</td>
54 <td>{{ zdjbxx.rjl }}</td>
55 </tr>
56 <tr>
57 <td colspan="2">建筑密度</td>
58 <td>{{ zdjbxx.jzmd }}</td>
59 <td>建筑限高</td>
60 <td>{{ zdjbxx.jzxg }}</td>
61 </tr>
62 <tr>
63 <td colspan="2">图幅号</td>
64 <td>{{ zdjbxx.tfh }}</td>
65 <td>地籍号</td>
66 <td>{{ zdjbxx.djh }}</td>
67 </tr>
68 <tr>
69 <td colspan="2">档案号</td>
70 <td>{{ zdjbxx.dah }}</td>
71 <td>地块代码</td>
72 <td>{{ zdjbxx.dkdm }}</td>
73 </tr>
74 <tr>
75 <td colspan="2">宗地四至-东</td>
76 <td colspan="4">{{ zdjbxx.zdszd }}</td>
77 </tr>
78 <tr>
79 <td colspan="2">宗地四至-南</td>
80 <td colspan="4">{{ zdjbxx.zdszn }}</td>
81 </tr>
82 <tr>
83 <td colspan="2">宗地四至-西</td>
84 <td colspan="4">{{ zdjbxx.zdszx }}</td>
85 </tr>
86 <tr>
87 <td colspan="2">宗地四至-北</td>
88 <td colspan="4">{{ zdjbxx.zdszb }}</td>
89 </tr>
90 <tr>
91 <td class="title2" height="96">备注</td>
92 <td colspan="5">{{ zdjbxx.bz }}</td>
93 </tr>
94 <tr>
95 <td class="title2" height="96">附记</td>
96 <td colspan="5">{{ zdjbxx.fj }}</td>
97 </tr>
98 <tr>
99 <td colspan="2">状态</td>
100 <td colspan="2">{{ zdjbxx.zt }}</td>
101 <td>区县代码</td>
102 <td>{{ zdjbxx.qxdm }}</td>
103 </tr>
104 <tr v-show="showGroup">
105 <td class="title2">变化情况</td>
106 <td colspan="5" class="bhqk">
107 <div class="box">
108 <table cellspacing="0" cellpadding="0" :width="bhqkTableWidth">
109 <tr v-for="(item, index) in bhqkColumns" :key="index">
110 <td class="bhqkTh">{{ item.label }}</td>
111 <!-- <td v-for="(item2, index2) in zdbhqks" :key="index2">
112 {{ item2[item.prop] }}
113 </td> -->
114 </tr>
115 </table>
116 </div>
117 </td>
118 </tr>
119 </table>
120 </div>
121 </div>
122 </template>
123
124 <script>
125 import { mapGetters } from "vuex";
126 import { getZdjjxxBybdcdyid } from "@/api/zhcx.js";
127
128 export default {
129 data () {
130 return {
131 bhqkColumns: [
132 {
133 prop: "ssywh",
134 label: "上手业务号",
135 },
136 {
137 prop: "zddm",
138 label: "宗地代码",
139 },
140 {
141 prop: "bhqzddm",
142 label: "变化前宗地代码",
143 },
144 {
145 prop: "bhnr",
146 label: "变化内容",
147 },
148 {
149 prop: "bhyy",
150 label: "变化原因",
151 },
152 {
153 prop: "djsj",
154 label: "登记时间",
155 },
156 {
157 prop: "dbr",
158 label: "登簿人",
159 },
160 {
161 prop: "fj",
162 label: "附记",
163 },
164 ],
165 bhqkTableWidth: 745,
166 zdjbxx: {},
167 zdbhqks: [],
168 propsParam:this.$attrs,
169 showGroup: false,
170 };
171 },
172 // computed: {
173 // ...mapGetters(["djbxx"]),
174 // },
175 created () {
176 //this.propsParam = this.$attrs;
177 // this.$nextTick(() => {
178
179 // });
180 this.loadData();
181 //this.$alert(this.param.bdcdyh);
182 // this.info = this.djbxx.zdjbxx;
183 // this.djzd = this.djbxx.zdjbxx.djzd;
184 // this.zdbhqks = this.djbxx.zdjbxx.zdbhqks;
185
186 // let widths = (this.zdbhqks.length + 1) * 180 + 110;
187 // this.bhqkTableWidth = widths > 745 ? widths : 745;
188 },
189 methods: {
190 loadData () {
191 getZdjjxxBybdcdyid({bdcdyid:this.propsParam.bdcdyid}).then((res) => {
192 if (res.code === 200) {
193 this.zdjbxx = res.result.zdjbxx;
194 this.zdbhqks = res.result.zdbhqkList;
195 //this.$alert(this.zdjbxx);
196 if (this.zdbhqks != null && this.zdbhqks.length > 0) {
197 this.showGroup = true;
198 }
199 }
200 });
201 },
202 },
203 };
204 </script>
205
206 <style lang="scss" scoped>
207 .zdxx {
208 width: 100%;
209 height: calc(100% - 42px);
210 background-color: #f5f5f5;
211 padding: 5px;
212
213
214 }
215 .tablebox {
216 overflow-x: auto;
217 width: 100%;
218 height: 100%;
219 background: #fff;
220 border: 1px solid rgb(228, 228, 228);
221 text-align: center;
222 padding: 4px;
223 overflow-y: scroll;
224
225 .zdxxTable {
226 width: 100%;
227 min-width: 900px;
228 color: #333;
229
230 td {
231 border: 1px solid rgb(228, 228, 228);
232 line-height: 30px;
233 padding: 0 4px;
234 }
235
236 .title {
237 line-height: 68px;
238 font-size: 20px;
239 }
240
241 .unit {
242 text-align: right;
243 }
244
245 .title2 {
246 writing-mode: vertical-lr;
247 letter-spacing: 6px;
248 }
249
250 .bhqk {
251 padding: 0;
252
253 .box {
254 width: 745px;
255 overflow: auto;
256 }
257
258 .test {}
259
260 table {
261 .bhqkTh {
262 width: 110px;
263 line-height: 40px;
264 background-color: #f5f5f5;
265 border: 1px solid rgb(228, 228, 228);
266 font-weight: bold;
267 }
268
269 td {
270 width: 180px;
271 }
272 }
273 }
274 }
275 }
276 </style>
...@@ -123,43 +123,58 @@ export default { ...@@ -123,43 +123,58 @@ export default {
123 // 高级查询 123 // 高级查询
124 moreQueryClick () { }, 124 moreQueryClick () { },
125 openDialog (scroll) { 125 openDialog (scroll) {
126 //debugger; 126 this.$popup({
127 let _this = this; 127 titleStyle:"left",
128 let bsm = scroll.bsmQlxx; 128 title: '提示', // 弹窗标题
129 axios 129 editItem: 'registerBook/djbFrame', // 弹窗内容
130 .all([ 130 formData: scroll,
131 getDjbfm(bsm), 131 width:"1220px",
132 getDjml(bsm), 132 height:"800px",
133 getZdjbxx(bsm), 133 // cancelText: '取消摆烂', // 右边按钮文本
134 getQlname(bsm), 134 // confirmText: '确定点击', //左边按钮文本
135 getDetail(bsm), 135 cancel: () => {
136 ]) 136 console.log('取消回调')
137 .then(([djbfm, djml, zdjbxx, qlname, detail]) => { 137 },
138 let obj = { 138 confirm: () => {
139 djbfm: djbfm.result, 139 console.log('确认回调')
140 djml: djml.result,
141 zdjbxx: zdjbxx.result,
142 qlname: qlname.result,
143 detail: detail.result,
144 };
145 this.$store.dispatch("djbxx/setDjbxx", obj);
146 _this.isDialog = true;
147
148 // 弹窗打开,自动切换到对应的登记类型
149 if (scroll.qllxmc == "国有建设用地使用权") {
150 this.$refs.djbxxDialog.showType = "JSYDSYQ";
151 } else if (scroll.qllxmc == "抵押权") {
152 this.$refs.djbxxDialog.showType = "DYAQ";
153 } else if (scroll.qllxmc == "地役权") {
154 this.$refs.djbxxDialog.showType = "DYIQ";
155 } else if (scroll.qllxmc == "预告登记") {
156 this.$refs.djbxxDialog.showType = "YGDJ";
157 } else if (scroll.qllxmc == "异议登记") {
158 this.$refs.djbxxDialog.showType = "YYDJ";
159 } else if (scroll.qllxmc == "查封登记") {
160 this.$refs.djbxxDialog.showType = "CFDJ";
161 } 140 }
162 }); 141 })
142 // let _this = this;
143 // let bsm = scroll.bsmQlxx;
144 // axios
145 // .all([
146 // getDjbfm(bsm),
147 // getDjml(bsm),
148 // getZdjbxx(bsm),
149 // getQlname(bsm),
150 // getDetail(bsm),
151 // ])
152 // .then(([djbfm, djml, zdjbxx, qlname, detail]) => {
153 // let obj = {
154 // djbfm: djbfm.result,
155 // djml: djml.result,
156 // zdjbxx: zdjbxx.result,
157 // qlname: qlname.result,
158 // detail: detail.result,
159 // };
160 // this.$store.dispatch("djbxx/setDjbxx", obj);
161 // _this.isDialog = true;
162
163 // // 弹窗打开,自动切换到对应的登记类型
164 // if (scroll.qllxmc == "国有建设用地使用权") {
165 // this.$refs.djbxxDialog.showType = "JSYDSYQ";
166 // } else if (scroll.qllxmc == "抵押权") {
167 // this.$refs.djbxxDialog.showType = "DYAQ";
168 // } else if (scroll.qllxmc == "地役权") {
169 // this.$refs.djbxxDialog.showType = "DYIQ";
170 // } else if (scroll.qllxmc == "预告登记") {
171 // this.$refs.djbxxDialog.showType = "YGDJ";
172 // } else if (scroll.qllxmc == "异议登记") {
173 // this.$refs.djbxxDialog.showType = "YYDJ";
174 // } else if (scroll.qllxmc == "查封登记") {
175 // this.$refs.djbxxDialog.showType = "CFDJ";
176 // }
177 // });
163 }, 178 },
164 }, 179 },
165 }; 180 };
......