8d05034a by 任超

style:权利信息

1 parent d9ee3a4a
import filter from '@/utils/filter.js'
class data extends filter {
constructor() {
super()
}
columns () {
return {
title: "建设用地使用权、宅基地使用权登记信息",
columns: [
{
prop: "ssywh",
label: "上手业务号"
},
{
prop: "dah",
label: "档案号",
},
{
prop: "ywh",
label: "业务号",
},
{
prop: "bdcdyh",
label: "不动产单元号",
},
{
prop: "zl",
label: "坐落",
},
{
prop: "qlrlx",
label: "权利人类型",
},
{
prop: "qlrmc",
label: "权利人",
},
{
prop: "qlrzjzl",
label: "证件种类",
},
{
prop: "qlrzjhm",
label: "证件号",
},
{
prop: "gyfs",
label: "共有情况",
},
{
prop: "mj",
label: "使用权面积(m²)",
},
{
prop: "qlxz",
label: "权利性质",
},
{
prop: "ytmc",
label: "土地用途",
},
{
prop: "syqqzsj",
label: "使用权起止时间",
},
{
prop: "tdsyqx",
label: "土地使用期限",
},
{
prop: "qdjg",
label: "取得价格(万元)",
},
{
prop: "djyy",
label: "登记原因",
},
{
prop: "bdcqzh",
label: "不动产权证号",
},
{
prop: "djsj",
label: "登记时间",
},
{
prop: "dbr",
label: "登簿人",
},
{
prop: "fj",
label: "附记",
},
]
}
return [
{
prop: "ssywh",
label: "上手业务号",
width: "120"
},
{
prop: "dah",
label: "档案号",
},
{
prop: "ywh",
label: "业务号",
},
{
prop: "bdcdyh",
label: "不动产单元号",
},
{
prop: "zl",
label: "坐落",
},
{
prop: "qlrlx",
label: "权利人类型",
},
{
prop: "qlrmc",
label: "权利人",
},
{
prop: "qlrzjzl",
label: "证件种类",
},
{
prop: "qlrzjhm",
label: "证件号",
},
{
prop: "gyfs",
label: "共有情况",
},
{
prop: "mj",
label: "使用权面积(m²)",
},
{
prop: "qlxz",
label: "权利性质",
},
{
prop: "ytmc",
label: "土地用途",
},
{
prop: "syqqzsj",
label: "使用权起止时间",
},
{
prop: "tdsyqx",
label: "土地使用期限",
},
{
prop: "qdjg",
label: "取得价格(万元)",
},
{
prop: "djyy",
label: "登记原因",
},
{
prop: "bdcqzh",
label: "不动产权证号",
},
{
prop: "djsj",
label: "登记时间",
},
{
prop: "dbr",
label: "登簿人",
},
{
prop: "fj",
label: "附记",
},
]
}
}
......
......@@ -12,12 +12,12 @@
</div>
</div>
<div class="xxTableBox">
<table class="xxTable" :width="tableWidth">
<table class="xxTable">
<tr>
<th rowspan="3">业务类型</th>
</tr>
<!-- 第一行表头 -->
<tr class="one" id="">
<tr class="one">
<th v-for="(item, index) in ths" :key="index" :class="[item.class, item.type == '临时' ? 'linshiIcon' : '']">
<div class="icon" v-if="item.type == '临时'">{{ item.type }}</div>
{{ item.type }}
......@@ -49,95 +49,145 @@
</template>
<script>
import { mapGetters } from "vuex";
import { datas } from "./jsydsyq";
import { getJsydsyqList } from "@/api/zhcx.js";
export default {
name: "djxxTable",
props: {
showType: "",
},
name: "jsydsyq",
data () {
return {
checkList: ["临时", "现势", "历史"],
tableWidth: 810,
type: datas.columns(),
tableData: [],
showTableData: [],
ths: [],
showThs: [],
columns: [],
title: "",
title: "建设用地使用权、宅基地使用权登记信息",
list: [
{
ssywh: '',
dah: '',
ywh: '',
bdcdyh: "",
zl: "",
qlrlx: '',
qlrmc: "",
qlrzjzl: "",
qlrzjhm: "",
gyfs: "",
mj: null,
qlxz: '',
ytmc: "",
syqqzsj: null,
tdsyqx: null,
qdjg: null,
djyy: '',
bdcqzh: null,
djsj: '',
dbr: '',
fj: "",
qllxmc: "国有建设用地使用权",
djlxmc: '转移登记',
qszt: "0",
},
{
ssywh: '',
dah: '',
ywh: '',
bdcdyh: "",
zl: "",
qlrlx: '',
qlrmc: "",
qlrzjzl: "",
qlrzjhm: "",
gyfs: "",
mj: null,
qlxz: '',
ytmc: "",
syqqzsj: null,
tdsyqx: null,
qdjg: null,
djyy: '',
bdcqzh: null,
djsj: '',
dbr: '',
fj: "",
qllxmc: "国有建设用地使用权",
djlxmc: '转移登记',
qszt: "1"
},
{
ssywh: '',
dah: '',
ywh: '',
bdcdyh: "",
zl: "",
qlrlx: '',
qlrmc: "",
qlrzjzl: "",
qlrzjhm: "",
gyfs: "",
mj: null,
qlxz: '',
ytmc: "",
syqqzsj: null,
tdsyqx: null,
qdjg: null,
djyy: '',
bdcqzh: null,
djsj: '',
dbr: '',
fj: "",
qllxmc: "国有建设用地使用权",
djlxmc: '转移登记',
qszt: "2"
}
]
};
},
computed: {
...mapGetters(["djbxx"]),
},
watch: {
showType: {
handler (newVlue) {
// 清空值
this.tableData = [];
this.ths = [];
this.columns = this.type[newVlue].columns;
this.title = this.type[newVlue].title;
this.checkList = ["临时", "现势", "历史"];
this.tableWidth = 810;
let detail;
if (newVlue === "JSYDSYQ") {
getJsydsyqList({
bdcdyid: "2b33851f4edfd468ceef4d68c370bd41",
qllx: "A03",
qszt: ["1"]
}).then((res) => {
if (res.code === 200) {
detail = res.result;
}
});
} else {
detail = this.djbxx.detail.qlxxs[newVlue];
}
detail.forEach((item) => {
this.tableData.push(item);
if (item.qszt == "0") {
this.ths.push({
type: "临时",
qllxmc: item.qllxmc,
djlxmc: item.djlxmc,
prop: "linshi",
class: "linshi",
});
} else if (item.qszt == "1") {
this.ths.push({
type: "现势",
qllxmc: item.qllxmc,
djlxmc: item.djlxmc,
prop: "xianshi",
class: "xianshi",
});
} else if (item.qszt == "2") {
this.ths.push({
type: "历史",
qllxmc: item.qllxmc,
djlxmc: item.djlxmc,
prop: "lishi",
class: "lishi",
});
}
async created () {
// 清空值
this.tableData = [];
this.ths = [];
this.columns = datas.columns();
// let res = await getJsydsyqList({
// bdcdyid: "2b33851f4edfd468ceef4d68c370bd41",
// qllx: "A03",
// qszt: ["1"]
// })
let detail = this.list
detail.length > 0 && detail.forEach((item) => {
this.tableData.push(item);
if (item.qszt == "0") {
this.ths.push({
type: "临时",
qllxmc: item.qllxmc,
djlxmc: item.djlxmc,
prop: "linshi",
class: "linshi",
});
this.showTableData = this.tableData;
this.showThs = this.ths;
let width = (this.tableData.length - 3) * 223 + this.tableWidth;
this.tableWidth = this.tableData.length > 3 ? width : 810;
},
immediate: true,
},
} else if (item.qszt == "1") {
this.ths.push({
type: "现势",
qllxmc: item.qllxmc,
djlxmc: item.djlxmc,
prop: "xianshi",
class: "xianshi",
});
} else if (item.qszt == "2") {
this.ths.push({
type: "历史",
qllxmc: item.qllxmc,
djlxmc: item.djlxmc,
prop: "lishi",
class: "lishi",
});
}
});
this.showTableData = this.tableData;
},
methods: {
checkChange () {
var checkKey = [];
this.ths = [];
this.tableWidth = 810;
this.checkList.forEach((item) => {
if (item == "临时") {
checkKey.push("0");
......@@ -179,8 +229,6 @@ export default {
});
}
});
let width = (this.showTableData.length - 3) * 223 + this.tableWidth;
this.tableWidth = this.showTableData.length > 3 ? width : 810;
},
},
};
......@@ -195,7 +243,6 @@ export default {
color: #333;
.tableBox {
width: 810px;
margin: 0 auto;
display: flex;
flex-wrap: wrap;
......@@ -221,8 +268,8 @@ export default {
}
.xxTableBox {
width: 810px;
overflow-x: scroll;
width: 100%;
}
.xxTable>tr:first-child th {
......@@ -231,11 +278,13 @@ export default {
.xxTable {
border-spacing: 1px;
width: 100%;
tr>th {
background: #464c5b;
color: #fff;
font-size: 16px;
height: 60px;
}
th.linshi,
......@@ -297,6 +346,7 @@ export default {
height: 40px;
padding: 4px;
font-size: 13px;
width: 140px;
}
>tr:nth-child(odd) td {
......
......@@ -40,15 +40,16 @@
<p class="splitScreen tabsList-title">材料信息</p>
<div class="splitScreen"></div>
</div>
<el-tabs v-model="activeName" @tab-click='activeClick'>
<el-tab-pane :label="item.name" :name="item.value" v-for="(item, index) in tabList" :key="index">
<div class="splitScreen-con">
<component ref='slxx' v-if='index == 0' :is="editItem" :flag="flag" :key="key" />
<component ref='clxx' :is="editItem" v-else-if="index == 1" :key="key" />
<component :is="editItem" v-else :key="key" />
</div>
</el-tab-pane>
</el-tabs>
<div style="width:100%">
<el-tabs v-model="activeName" @tab-click='activeClick'>
<el-tab-pane :label="item.name" :name="item.value" v-for="(item, index) in tabList" :key="index">
</el-tab-pane>
</el-tabs>
<div class="splitScreen-con">
<component ref='slxx' v-if="activeName == 'slsq'" :is="editItem" :flag="flag" :key="key" />
<component :is="editItem" :key="key" />
</div>
</div>
</div>
</div>
<zc ref="zcDialogRef" v-model="zcDialog" :queryForm='queryForm' />
......@@ -92,7 +93,11 @@ export default {
watch: {
activeName: {
handler (newName, oldName) {
this.editItem = this.loadView(newName)
if (newName === 'qlxx') {
this.editItem = this.loadViewSlsq()
} else {
this.editItem = this.loadView(newName)
}
},
immediate: true
}
......@@ -116,9 +121,9 @@ export default {
if (res.code === 200) {
this.unitData = res.result ? res.result : []
setTimeout(() => {
that.$refs?.slxx[0].list(that.unitData && that.unitData[0].bsmSldy)
this.taskId = that.unitData[0].taskId
this.bsmBusiness = that.unitData[0].bsmBusiness
that.$refs.slxx?.[0].list(that.unitData?.[0]?.bsmSldy)
this.taskId = that.unitData?.[0]?.taskId
this.bsmBusiness = that.unitData?.[0]?.bsmBusiness
}, 300);
}
})
......@@ -180,6 +185,9 @@ export default {
loadView (view) {
return r => require.ensure([], () => r(require(`./components/${view}.vue`)))
},
loadViewSlsq () {
return r => require.ensure([], () => r(require('../../components/jsydsyq/jsydsyq.vue')))
},
},
}
</script>
......@@ -204,13 +212,10 @@ export default {
font-size: 12px;
}
/deep/.el-tabs__content {
height: calc(100vh - 135px) !important;
}
.splitScreen-con {
padding: 0 15px;
box-sizing: border-box;
height: calc(100% - 350px);
}
.fqsq {
......@@ -303,7 +308,6 @@ export default {
.tabsList-left {
border-right: 1px solid #EBEEF5;
position: relative;
width: 250px;
box-sizing: border-box;
ul {
......@@ -354,6 +358,7 @@ export default {
/deep/.el-tabs {
width: 100%;
height: 60px;
}
}
</style>
\ No newline at end of file
......