Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
3b98d722 by jiaozeping@pashanhoo.com
Options

样式修改

1 parent defbf4de
Inline Side-by-side
Showing 4 changed files with 215 additions and 274 deletions
.tableDivCss {
width: 100%;
height: 100%;
background-color: #f5f5f5;
padding: 5px;
}
.tableCss {
overflow-x: auto;
overflow-y: scroll;
width: 100%;
// height: 95%;
background: #fff;
text-align: center;
// padding: 4px;
border-collapse: collapse;
color: #333;
th {
border: 1px solid #e8e8e8;
line-height: 42px;
padding: 0 4px;
font-size: 14px;
}
td {
border: 1px solid #e8e8e8;
line-height: 42px;
padding: 0 4px;
font-size: 14px;
}
.title {
line-height: 68px;
font-size: 22px !important;
}
}
\ No newline at end of file
.zdxx {
width: 100%;
height: 100%;
background-color: #f5f5f5;
padding: 5px;
}
.tablebox {
overflow-x: auto;
width: 100%;
height: 95%;
background: #fff;
text-align: center;
padding: 4px;
overflow-y: scroll;
padding-top: 20px;
padding: 20px 40px;
.Table {
border-collapse: collapse;
width: 100%;
color: #333;
tr {
td:nth-child(1) {
width: 140px;
text-align: right;
padding-right: 15px;
background-color: #f8f8fa;
color: #6b6b6b;
}
td:nth-child(3) {
width: 140px;
padding-right: 15px;
text-align: right;
background-color: #f8f8fa;
color: #6b6b6b;
}
td:nth-child(2) {
text-align: left;
padding-left: 15px;
color: #4a4a4a;
}
td:nth-child(4) {
text-align: left;
padding-left: 15px;
color: #4a4a4a;
}
}
td {
border: 1px solid #e8e8e8;
line-height: 42px;
padding: 0 4px;
font-size: 14px;
}
.title {
line-height: 68px;
font-size: 22px !important;
color: #4a4a4a !important;
background-color: #eceef2 !important;
text-align: center !important;
}
.unit {
text-align: right;
}
.title3 {
width: 140px !important;
}
.bhqk {
width: 140px;
padding: 0 !important;
.box {
width: 745px;
overflow: auto;
}
.test {
}
table {
.bhqkTh {
width: 110px;
line-height: 38px;
background-color: #f8f8fa;
border: 1px solid #e8e8e8;
font-weight: bold;
text-align: left;
}
td {
width: 180px;
}
}
}
}
}
<template>
<div class="zdxx">
<div class="tablebox">
<table cellpadding="0" cellspacing="0" class="Table">
<col width="80" />
<col width="60" />
<col width="90" />
<col width="235" />
<col width="150" />
<tr>
<td colspan="12" class="title">宗地基本信息</td>
</tr>
<tr>
<td colspan="2">不动产类型</td>
<td colspan="3">{{ bdclxList[zdjbxx.bdclx] }}</td>
<td>单位</td>
<td colspan="4">{{ zdjbxx.mjdw }}</td>
</tr>
<tr>
<td colspan="2">坐落</td>
<td colspan="10">{{ zdjbxx.zl }}</td>
</tr>
<tr>
<td rowspan="8" colspan="2" class="title2">土地状况</td>
</tr>
<tr>
<td>宗地面积</td>
<td colspan="4">{{ zdjbxx.zdmj }}</td>
<td>用途</td>
<td>{{ zdjbxx.ghytmc }}</td>
</tr>
<tr>
<td>等级</td>
<td colspan="4">{{ zdjbxx.djmc }}</td>
<td>价格</td>
<td colspan="3">{{ zdjbxx.jg }}</td>
</tr>
<tr>
<td>权利类型</td>
<td colspan="4">{{ zdjbxx.qllxmc }}</td>
<td>权利性质</td>
<td>{{ zdjbxx.qlxzmc }}</td>
</tr>
<tr>
<td>权利设定方式</td>
<td colspan="4">{{ zdjbxx.qlsdfs }}</td>
<td>容积率</td>
<td>{{ zdjbxx.rjl }}</td>
</tr>
<tr>
<td>建筑密度</td>
<td colspan="4">{{ zdjbxx.jzmd }}</td>
<td>建筑限高</td>
<td>{{ zdjbxx.jzxg }}</td>
</tr>
<tr>
<td>图幅号</td>
<td colspan="4">{{ zdjbxx.tfh }}</td>
<td>地籍号</td>
<td colspan="3">{{ zdjbxx.djh }}</td>
</tr>
<tr>
<td>档案号</td>
<td colspan="4">{{ zdjbxx.dah }}</td>
<td>地块代码</td>
<td colspan="3">{{ zdjbxx.dkdm }}</td>
</tr>
<tr>
<td colspan="2">宗地四至-东</td>
<td colspan="8">{{ zdjbxx.zdszd }}</td>
</tr>
<tr>
<td colspan="2">宗地四至-南</td>
<td colspan="8">{{ zdjbxx.zdszn }}</td>
</tr>
<tr>
<td colspan="2">宗地四至-西</td>
<td colspan="8">{{ zdjbxx.zdszx }}</td>
</tr>
<tr>
<td colspan="2">宗地四至-北</td>
<td colspan="8">{{ zdjbxx.zdszb }}</td>
</tr>
<tr>
<td class="title2" colspan="2" height="50">备注</td>
<td colspan="8">{{ zdjbxx.bz }}</td>
</tr>
<tr>
<td class="title2" colspan="2" height="50">附记</td>
<td colspan="8">{{ zdjbxx.fj }}</td>
</tr>
<tr>
<td colspan="2">状态</td>
<td colspan="2">{{ zdjbxx.zt }}</td>
<td>区县代码</td>
<td colspan="4">{{ zdjbxx.qxdm }}</td>
</tr>
<tr v-if="showGroup">
<td colspan="2" class="title3">变化情况</td>
<td colspan="4" class="bhqk">
<div class="box">
<table cellspacing="0" cellpadding="0" :width="bhqkTableWidth">
<tr v-for="(item, index) in bhqkColumns" :key="index">
<td class="bhqkTh">{{ item.label }}</td>
</tr>
</table>
</div>
</td>
</tr>
</table>
</div>
<div class="tableDivCss">
<table cellpadding="0" cellspacing="0" class="tableCss">
<tr>
<th colspan="12" class="title">宗地基本信息</th>
</tr>
<tr>
<td>单位</td>
<td colspan="4">{{ zdjbxx.mjdw }}</td>
</tr>
<tr>
<td>不动产类型</td>
<td colspan="4">{{ bdclxList[zdjbxx.bdclx] }}</td>
</tr>
<tr>
<td>坐落</td>
<td colspan="4">{{ zdjbxx.zl }}</td>
</tr>
<tr>
<td style="width:10%" rowspan="8">土地状况</td>
</tr>
<tr>
<td style="width:15%">宗地面积</td>
<td style="width:30%">{{ zdjbxx.zdmj }}</td>
<td style="width:15%">用途</td>
<td style="width:30%">{{ zdjbxx.ghytmc }}</td>
</tr>
<tr>
<td>等级</td>
<td>{{ zdjbxx.djmc }}</td>
<td>价格</td>
<td>{{ zdjbxx.jg }}</td>
</tr>
<tr>
<td>权利类型</td>
<td>{{ zdjbxx.qllxmc }}</td>
<td>权利性质</td>
<td>{{ zdjbxx.qlxzmc }}</td>
</tr>
<tr>
<td>权利设定方式</td>
<td>{{ zdjbxx.qlsdfs }}</td>
<td>容积率</td>
<td>{{ zdjbxx.rjl }}</td>
</tr>
<tr>
<td>建筑密度</td>
<td>{{ zdjbxx.jzmd }}</td>
<td>建筑限高</td>
<td>{{ zdjbxx.jzxg }}</td>
</tr>
<tr>
<td>图幅号</td>
<td>{{ zdjbxx.tfh }}</td>
<td>地籍号</td>
<td>{{ zdjbxx.djh }}</td>
</tr>
<tr>
<td>档案号</td>
<td>{{ zdjbxx.dah }}</td>
<td>地块代码</td>
<td>{{ zdjbxx.dkdm }}</td>
</tr>
<tr>
<td rowspan="5">宗地四至</td>
</tr>
<tr>
<td>东</td>
<td colspan="3">{{ zdjbxx.zdszd }}</td>
</tr>
<tr>
<td>南</td>
<td colspan="3">{{ zdjbxx.zdszn }}</td>
</tr>
<tr>
<td>西</td>
<td colspan="3">{{ zdjbxx.zdszx }}</td>
</tr>
<tr>
<td>北</td>
<td colspan="3">{{ zdjbxx.zdszb }}</td>
</tr>
<tr>
<td>登记时间</td>
<td colspan="2">{{ zdjbxx.bz }}</td>
<td>登簿人</td>
<td>{{ zdjbxx.bz }}</td>
</tr>
<tr>
<td>附记</td>
<td colspan="8">{{ zdjbxx.fj }}</td>
</tr>
<!-- <tr>
<td>状态</td>
<td colspan="2">{{ zdjbxx.zt }}</td>
<td>区县代码</td>
<td>{{ zdjbxx.qxdm }}</td>
</tr> -->
<tr v-if="showGroup">
<td>变化情况</td>
<td colspan="4">
<table cellspacing="0" cellpadding="0" :width="bhqkTableWidth">
<tr v-for="(item, index) in bhqkColumns" :key="index">
<td class="bhqkTh">{{ item.label }}</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</template>
<script>
import { getZdjjxxBybdcdyid } from "@/api/registerBook.js";
import { getZdjjxxBybdcdyid } from "@/api/registerBook.js";
export default {
data () {
return {
bhqkColumns: [
{
prop: "ssywh",
label: "上手业务号",
},
{
prop: "zddm",
label: "宗地代码",
},
{
prop: "bhqzddm",
label: "变化前宗地代码",
},
{
prop: "bhnr",
label: "变化内容",
},
{
prop: "bhyy",
label: "变化原因",
},
{
prop: "djsj",
label: "登记时间",
},
{
prop: "dbr",
label: "登簿人",
},
{
prop: "fj",
label: "附记",
},
],
bhqkTableWidth: 745,
zdjbxx: {},
zdbhqks: [],
propsParam: this.$attrs,
showGroup: false,
bdclxList: ['', '宗地', '宗海', '自然幢', '多幢', '构筑物', '林权', '户']
};
},
created () {
this.loadData();
},
methods: {
loadData () {
getZdjjxxBybdcdyid({ bdcdyid: this.propsParam.bdcdyid }).then((res) => {
if (res.code === 200) {
this.zdjbxx = res.result.zdjbxx;
this.zdbhqks = res.result.zdbhqkList;
if (this.zdbhqks != null && this.zdbhqks.length > 0) {
this.showGroup = true;
}
export default {
data() {
return {
bhqkColumns: [
{
prop: "ssywh",
label: "上手业务号",
},
{
prop: "zddm",
label: "宗地代码",
},
{
prop: "bhqzddm",
label: "变化前宗地代码",
},
{
prop: "bhnr",
label: "变化内容",
},
{
prop: "bhyy",
label: "变化原因",
},
{
prop: "djsj",
label: "登记时间",
},
{
prop: "dbr",
label: "登簿人",
},
{
prop: "fj",
label: "附记",
},
],
bhqkTableWidth: 745,
zdjbxx: {},
zdbhqks: [],
propsParam: this.$attrs,
showGroup: false,
bdclxList: ["", "宗地", "宗海", "自然幢", "多幢", "构筑物", "林权", "户"],
};
},
created() {
this.loadData();
},
methods: {
loadData() {
getZdjjxxBybdcdyid({ bdcdyid: this.propsParam.bdcdyid }).then((res) => {
if (res.code === 200) {
this.zdjbxx = res.result.zdjbxx;
this.zdbhqks = res.result.zdbhqkList;
if (this.zdbhqks != null && this.zdbhqks.length > 0) {
this.showGroup = true;
}
});
},
}
});
},
};
},
};
</script>
<style lang="scss" scoped>
@import "./tablestyle.scss";
@import "~@/styles/bdctable.scss";
</style>
......
......@@ -122,13 +122,13 @@
</el-form-item>
</el-col>
</el-row>
<!-- <div class="slxx_title title-block">
<div class="slxx_title title-block">
权利人信息
<div class="triangle"></div>
</div> -->
<el-divider content-position="left"><i
</div>
<!-- <el-divider content-position="left"><i
style="background-color:#3498db;font-size:16px;color:#fff !important;border-radius: 5px 5px 5px 0px;margin-bottom:10px;"
class="el-icon-edit-outline">权利人信息</i></el-divider>
class="el-icon-edit-outline">权利人信息</i></el-divider> -->
<el-row :gutter="10">
<el-col :span="14">
<el-form-item label="共有方式：">
......