Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
53c3c37c by 任超
Options

Merge branch 'master' of http://yun.pashanhoo.com:9090/bdc/bdcdj-web

2 parents 6dfabc15 b008e312
Inline Side-by-side
Showing 17 changed files with 2296 additions and 58 deletions
import request from '@/utils/request'
/*
登记簿查询
*/
// 根据条件进行列表查询
export function getDjbBysearch(data) {
return request({
url: '/zhcx/qlxx/getDjbBysearch',
method: 'post',
data: data
})
}
// 获取登记封面
export function getDjbfm(qlbsm) {
return request({
url: '/zhcx/djbcx/djbfm/' + qlbsm,
method: 'get'
})
}
// 获取登记目录
export function getDjml(qlbsm) {
return request({
url: '/zhcx/djbcx/djml/' + qlbsm,
method: 'get'
})
}
// 获取宗地信息
export function getZdxx(qlbsm) {
return request({
url: '/zhcx/djbcx/zdjbxx/' + qlbsm,
method: 'get'
})
}
// 获取封面权利名称
export function getQlmc(qlbsm) {
return request({
url: '/zhcx/djbcx/qlname/' + qlbsm,
method: 'get'
})
}
......@@ -9,6 +9,7 @@ const getters = {
permission_routes: state => state.permission.routes,
addRoutes: state => state.permission.addRoutes,
addDict: state => state.dict.addDict,
dictData: state => state.dict.dictData
dictData: state => state.dict.dictData,
djbxx: state => state.djbxx.djbxx
}
export default getters
......
const state = {
djbxx: {}
}
const mutations = {
SET_DJXX: (state, data) => {
state.djbxx = data;
}
}
const actions = {
setDjbxx({ commit }, data) {
commit('SET_DJXX', data)
}
}
export default {
namespaced: true,
state,
mutations,
actions
}
......@@ -9,6 +9,7 @@ const service = axios.create({
// withCredentials: true, // send cookies when cross-domain requests
headers: {
"content-type": CONTENT_TYPE,
'Authorization':'bearer AT-16-oqkOHiUSsDdFA-eAZ49k2rJQDTzQpClO'
},
timeout: 50000 // request timeout
})
......
<template>
<div>
</div>
</template>
<script>
export default {
/**注册组件*/
components: {},
data () {
return {
};
},
}
</script>
<style scoped lang='scss'>
</style>
\ No newline at end of file
......@@ -4,23 +4,193 @@
<div class="slxx_title">受理信息</div>
<el-row>
<el-col :span="8">
<el-form-item label="业务号" prop="ywh">
<el-form-item label="业务号：" prop="ywh">
<el-input v-model="ruleForm.ywh"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="受理人员：" prop="slry">
<el-input v-model="ruleForm.slry"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="受理时间：" prop="slsj">
<el-input v-model="ruleForm.slsj"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="权利类型：" prop="qllx">
<el-select v-model="ruleForm.qllx" filterable clearable placeholder="请选择权利类型">
<el-option v-for="item in qllxOption" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="登记类型：" prop="djlx">
<el-select v-model="ruleForm.djlx" filterable clearable placeholder="请选择登记类型">
<el-option v-for="item in djlxOption" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="登记情形：" prop="djqx">
<el-select v-model="ruleForm.djqx" filterable clearable placeholder="请选择登记情形">
<el-option v-for="item in djqxOption" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<div class="slxx_title">不动产单元情况</div>
<el-row>
<el-col :span="8">
<el-form-item label="宗地代码：" prop="zddm">
<el-input v-model="ruleForm.zddm"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="不动产单元号：" prop="bdcdyh">
<el-input v-model="ruleForm.bdcdyh"></el-input>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="权利性质：" prop="qlxz">
<el-select v-model="ruleForm.qlxz" filterable clearable placeholder="请选择登记情形">
<el-option v-for="item in qlxzOption" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="宗地面积：" prop="zdmj">
<el-input v-model="ruleForm.zdmj"></el-input>
</el-form-item>
</el-col>
<el-col :span="16">
<el-form-item label="坐落：" prop="zl">
<el-input v-model="ruleForm.zl"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="土地用途：" prop="tdyt">
<el-select v-model="ruleForm.tdyt" filterable clearable placeholder="请选择登记情形">
<el-option v-for="item in tdytOption" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="权利设定方式：" prop="qlsdfs">
<el-select v-model="ruleForm.qlsdfs" filterable clearable placeholder="请选择登记情形">
<el-option v-for="item in qlsdfsOption" :key="item.value" :label="item.label" :value="item.value">
</el-option>
</el-select>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="取得价格：" prop="qdjg">
<el-input v-model="ruleForm.qdjg"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col :span="8">
<el-form-item label="使用权起始时间：" prop="syqqssj">
<el-date-picker v-model="ruleForm.syqqssj" type="datetime" placeholder="选择起始时间"
value-format="yyyy-MM-dd" >
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="使用权结束时间：" prop="syqjssj">
<el-date-picker v-model="ruleForm.syqjssj" type="datetime" placeholder="选择结束时间"
value-format="yyyy-MM-dd" >
</el-date-picker>
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="使用期限：" prop="syqx">
<el-date-picker v-model="ruleForm.syqx" type="datetime" placeholder="选择使用期限"
value-format="yyyy-MM-dd" >
</el-date-picker>
</el-form-item>
</el-col>
</el-row>
<el-row>
<el-col>
<el-form-item label="附记：" prop="fj">
<el-input type="textarea" v-model="ruleForm.fj"></el-input>
</el-form-item>
</el-col>
</el-row>
<div class="slxx_title">权利人信息</div>
<el-row>
<el-col>
<el-form-item label="共有方式：">
<el-radio-group v-model="ruleForm.gyfs">
<el-radio label="单独所有"></el-radio>
<el-radio label="共同共有"></el-radio>
<el-radio label="按份所有"></el-radio>
</el-radio-group>
</el-form-item>
</el-col>
<el-col>
<InformationTable />
</el-col>
</el-row>
<div class="slxx_title">登记原因</div>
<el-row>
<el-col>
<el-form-item label="登记原因：" prop="djyy">
<el-input type="textarea" v-model="ruleForm.djyy"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
</div>
</template>
<script>
import InformationTable from './InformationTable'
export default {
/**注册组件*/
components: {},
data () {
return {
qllxOption:[],
djlxOption:[],
djqxOption:[],
qlxzOption:[],
tdytOption:[],
qlsdfsOption:[],
ruleForm: {
ywh: ''
ywh: '',
slry:"",
slsj:"",
qllx:"",
djlx:"",
djqx:"",
zddm:"",
bdcdyh:"",
qlxz:"",
zdmj:"",
zl:"",
tdyt:"",
qlsdfs:"",
qdjg:"",
syqqssj:"",
syqjssj:"",
syqx:"",
fj:"",
djyy:"",
gyfs:"",
},
rules: {
ywh: [
......@@ -29,6 +199,9 @@ export default {
}
};
},
components:{
InformationTable
},
methods: {
},
......
......@@ -45,6 +45,7 @@
<div class="from-clues-content">
<lb-table :page-size="pageData.pageSize" heightNumSetting :current-page.sync="pageData.currentPage"
:total="pageData.total" @size-change="handleSizeChange" @p-current-change="handleCurrentChange"
@selection-change="handleSelectionChange"
:column="tableData.columns" :data="tableData.data">
</lb-table>
</div>
......@@ -114,6 +115,9 @@ export default {
handleCurrentChange (val) {
this.list({ pageSize: this.pageData.pageSize, currentPage: val });
},
handleSelectionChange(val){
},
}
}
</script>
......
<template>
<div>查封登记</div>
<div class="cfdj">
<div class="tableBox">
<div class="title">
查封登记信息
<div class="checkbox">
<el-checkbox-group v-model="checkList">
<el-checkbox label="临时"></el-checkbox>
<el-checkbox label="现势"></el-checkbox>
<el-checkbox label="历史"></el-checkbox>
</el-checkbox-group>
</div>
</div>
<table class="xxTable">
<tr>
<th rowspan="3" width="140">业务类型</th>
</tr>
<tr class="one">
<th class="linshiIcon">
<div class="icon">临时</div>
临时
</th>
<th>现势</th>
<th>历史</th>
</tr>
<tr class="two">
<th>查封登记</th>
<th>查封登记</th>
<th>查封登记</th>
</tr>
<tr v-for="(item, index) in columns" :key="index">
<td>
{{ item.label }}
</td>
<td>{{ tableData.linshi[item.prop] }}</td>
<td>{{ tableData.xianshi[item.prop] }}</td>
<td>{{ tableData.lishi[item.prop] }}</td>
</tr>
</table>
</div>
</div>
</template>
<script>
export default {
name: "cfdj",
data() {
return {};
return {
checkList: ["临时", "现势", "历史"],
columns: [
{
prop: "ssywh",
label: "上手业务号",
},
{
prop: "dah",
label: "档案号",
},
{
prop: "ywh",
label: "业务号",
},
{
prop: "bdcdyh",
label: "不动产单元号",
},
{
prop: "zl",
label: "坐落",
},
{
prop: "bdcqlr",
label: "不动产权利人",
},
{
prop: "zjzl",
label: "证件种类",
},
{
prop: "zjh",
label: "证件号",
},
{
prop: "cflx",
label: "查封类型",
},
{
prop: "cfjg",
label: "查封机关",
},
{
prop: "cfwh",
label: "查封文号",
},
{
prop: "cfwj",
label: "查封文件",
},
{
prop: "cfqssj",
label: "查封起始时间",
},
{
prop: "cfjssj",
label: "查封结束时间",
},
{
prop: "cfqx",
label: "查封期限",
},
{
prop: "cffw",
label: "查封范围",
},
{
prop: "djjg",
label: "登记机构",
},
{
prop: "dbr",
label: "登簿人",
},
{
prop: "djsj",
label: "登记时间",
},
{
prop: "jfywh",
label: "解封业务号",
},
{
prop: "jfjg",
label: "解封机关",
},
{
prop: "jfwh",
label: "解封文号",
},
{
prop: "jfwj",
label: "解封文件",
},
{
prop: "jfdjsj",
label: "解封登记时间",
},
{
prop: "jfdbr",
label: "解封登簿人",
},
],
tableData: {
linshi: {
ssywh: "",
dah: "",
ywh: "200825012285",
bdcdyh: "370205004005GB10030 F00160111",
zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
bdcqlr: "李四",
zjzj: "身份证号",
zjh: "*******",
cflx: "查封",
cfjg: "西安法院",
cfwh: "200825012286",
cfwj: "",
cfqssj: "2008年3月11日",
cfjssj: "2012年3月11日",
cfqx: "4年",
cffw: "",
djjg: "",
dbr: "",
djsj: "",
jfywh: "",
jfjg: "",
jfwh: "",
jfwj: "",
jfdjsj: "",
jfdbr: "",
},
xianshi: {
ssywh: "",
dah: "",
ywh: "200825012285",
bdcdyh: "370205004005GB10030 F00160111",
zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
bdcqlr: "李四",
zjzj: "身份证号",
zjh: "*******",
cflx: "查封",
cfjg: "西安法院",
cfwh: "200825012286",
cfwj: "",
cfqssj: "2008年3月11日",
cfjssj: "2012年3月11日",
cfqx: "4年",
cffw: "",
djjg: "",
dbr: "",
djsj: "",
jfywh: "200825012285",
jfjg: "西安法院",
jfwh: "123",
jfwj: "",
jfdjsj: "2012年3月11日",
jfdbr: "",
},
lishi: {
ssywh: "",
dah: "",
ywh: "200825012285",
bdcdyh: "370205004005GB10030 F00160111",
zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
bdcqlr: "李四",
zjzj: "身份证号",
zjh: "*******",
cflx: "查封",
cfjg: "西安法院",
cfwh: "200825012286",
cfwj: "",
cfqssj: "2008年3月11日",
cfjssj: "2012年3月11日",
cfqx: "4年",
cffw: "",
djjg: "",
dbr: "",
djsj: "",
jfywh: "",
jfjg: "",
jfwh: "",
jfwj: "",
jfdjsj: "",
jfdbr: "",
},
},
};
},
};
</script>
<style lang="scss" scoped>
.cfdj {
width: 100%;
height: 100%;
background: #fff;
overflow-y: scroll;
color: #333;
.tableBox {
width: 810px;
margin: 0 auto;
.title {
font-family: "Arial Negreta", "Arial Normal", "Arial", sans-serif;
font-weight: 700;
font-size: 16px;
text-align: center;
background: #e9e9e9;
height: 62px;
line-height: 62px;
position: relative;
margin: 1px 0;
.checkbox {
position: absolute;
right: 20px;
bottom: -16px;
height: 62px;
}
}
.xxTable {
width: 810px;
border-spacing: 1px;
tr > th {
background: #464c5b;
color: #fff;
font-size: 16px;
}
tr > th:nth-child(1),
tr > th:nth-child(2) {
background: #464c5b;
}
tr > th:nth-child(3) {
background: rgba(70, 76, 91, 0.8);
}
.one th {
height: 25px;
font-size: 14px;
}
.one > th:nth-child(1) {
color: #fe9400;
}
.two th {
height: 45px;
p:nth-child(2) {
font-size: 14px;
}
}
.two > th:nth-child(1) {
color: #fe9400;
}
.linshiIcon {
position: relative;
}
.linshiIcon::after {
content: "";
display: block;
width: 0;
height: 0;
border-width: 0px 0px 45px 45px;
border-style: none solid solid;
border-color: transparent transparent #fe9400;
position: absolute;
top: 0px;
right: 3px;
transform: rotate(-90deg);
}
.icon {
position: absolute;
top: 8px;
right: 6px;
transform: rotate(45deg);
color: #fff;
font-size: 12px;
z-index: 10;
}
tr td {
text-align: center;
height: 40px;
padding: 4px;
font-size: 13px;
}
> tr:nth-child(odd) td {
background: #f2f2f2;
}
> tr:nth-child(even) td {
background: #f9f9f9;
}
tr > td:nth-child(2) {
color: #fe9400;
}
tr > td:nth-child(4) {
color: #7f7f7f;
}
}
}
}
</style>
......
......@@ -18,7 +18,7 @@
组
</p>
<div class="title">不动产登记簿</div>
<br>
<br />
<p>
宗地/宗海号:
<font>{{ data.zdzhh }}</font>
......@@ -35,6 +35,9 @@
<script>
export default {
name: "djbfm",
props: {
djbxxData: {},
},
data() {
return {
data: {
......
......@@ -108,10 +108,11 @@ export default {
children: "children",
label: "label",
},
showTab: "bdcqljqtsx", // 选中状态,根据表格中权利类型判断
showTab: "djbfm", // 选中状态,根据表格中权利类型判断
};
},
mounted() {
},
methods: {
submitForm() {
this.$emit("input", false);
......@@ -120,7 +121,6 @@ export default {
this.$emit("input", false);
},
handleNodeClick(data) {
console.log("1111111111", data);
this.showTab = data.id;
},
},
......
<template>
<div>抵押权</div>
<div class="dyaq">
<div class="tableBox">
<div class="title">
抵押权登记信息
<div class="checkbox">
<el-checkbox-group v-model="checkList">
<el-checkbox label="临时"></el-checkbox>
<el-checkbox label="现势"></el-checkbox>
<el-checkbox label="历史"></el-checkbox>
</el-checkbox-group>
</div>
</div>
<table class="xxTable">
<tr>
<th rowspan="3" width="140">业务类型</th>
</tr>
<tr class="one">
<th class="linshiIcon">
<div class="icon">临时</div>
临时
</th>
<th>现势</th>
<th>历史</th>
</tr>
<tr class="two">
<th>
<p>抵押权</p>
<p>首次登记</p>
</th>
<th>
<p>抵押权</p>
<p>转移登记</p>
</th>
<th>
<p>抵押权</p>
<p>转移登记</p>
</th>
</tr>
<tr v-for="(item, index) in columns" :key="index">
<td>
{{ item.label }}
</td>
<td>{{ tableData.linshi[item.prop] }}</td>
<td>{{ tableData.xianshi[item.prop] }}</td>
<td>{{ tableData.lishi[item.prop] }}</td>
</tr>
</table>
</div>
</div>
</template>
<script>
export default {
name: "dyaq",
data() {
return {};
return {
checkList: ["临时", "现势", "历史"],
columns: [
{
prop: "ssywh",
label: "上手业务号",
},
{
prop: "dah",
label: "档案号",
},
{
prop: "ywh",
label: "业务号",
},
{
prop: "bdcdyh",
label: "不动产单元号",
},
{
prop: "zjjzwzl",
label: "在建建筑物坐落",
},
{
prop: "dybdclx",
label: "抵押不动产类型",
},
{
prop: "dyqr",
label: "抵押权人",
},
{
prop: "zjzl",
label: "证件种类",
},
{
prop: "zjh",
label: "证件号",
},
{
prop: "dyr",
label: "抵押人",
},
{
prop: "dyfs",
label: "抵押方式",
},
{
prop: "sfygdj",
label: "是否预告登记",
},
{
prop: "zjjzwdyfw",
label: "在建建筑物抵押范围",
},
{
prop: "dymj",
label: "抵押面积",
},
{
prop: "bdbzzqse",
label: "被担保主债权数额(万元)",
},
{
prop: "dbfw",
label: "担保范围",
},
{
prop: "zwlxqssj",
label: "债务履行起始时间",
},
{
prop: "zwlxjssj",
label: "债务履行结束时间",
},
{
prop: "zwlxqx",
label: "债务履行期限(债务确定期间)",
},
{
prop: "zgzqqdsshse",
label: "最高债权确定事实和数额",
},
{
prop: "sfczyd",
label: "是否存在禁止或限制转让抵押不动产的约定",
},
{
prop: "djyy",
label: "登记原因",
},
{
prop: "bdcdjzmh",
label: "不动产登记证明号",
},
{
prop: "djsj",
label: "登记时间",
},
{
prop: "dbr",
label: "登簿人",
},
{
prop: "djjg",
label: "登记机构",
},
{
prop: "fj",
label: "附记",
},
{
prop: "qlqtzk",
label: "权利其他状况",
},
{
prop: "zxdyywh",
label: "注销抵押业务号",
},
{
prop: "zxdyyy",
label: "注销抵押原因",
},
],
tableData: {
linshi: {
ssywh: "",
dah: "",
ywh: "200825012285",
bdcdyh: "370205004005GB10030 W00000000",
zjjzwzl:
"汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
dybdclx: "土地",
dyqr: "中国银行股份有限公司C区支行",
zjzj: "营业执照",
zjh: "*******",
dyr: "联城有限公司",
dyfs: "一般抵押",
sfygdj: "否",
zjjzwdyfw: "",
dymj: "22384.1700",
bdbzzqse: "22000",
dbfw: "城镇住宅用地",
zwlxqssj: "2007年12月25日",
zwlxjssj: "2077年12月24日",
zwlxqx: "1年",
zgzqqdsshse: "11223",
sfczyd: "否",
djyy: "合同设立",
bdcdjzmh: "A（2011）B市不动产证明第0000060号",
djsj: "2009年04月21日",
dbr: "路**",
djjg: "",
fj: "",
qlqtzk: "",
zxdyywh: "201025126854",
zxdyyy: "贷款还清",
},
xianshi: {
ssywh: "",
dah: "",
ywh: "200825012285",
bdcdyh: "370205004005GB10030 W00000000",
zjjzwzl:
"汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
dybdclx: "土地",
dyqr: "中国银行股份有限公司C区支行",
zjzj: "营业执照",
zjh: "*******",
dyr: "联城有限公司",
dyfs: "一般抵押",
sfygdj: "否",
zjjzwdyfw: "",
dymj: "22384.1700",
bdbzzqse: "22000",
dbfw: "城镇住宅用地",
zwlxqssj: "2007年12月25日",
zwlxjssj: "2077年12月24日",
zwlxqx: "1年",
zgzqqdsshse: "11223",
sfczyd: "否",
djyy: "合同设立",
bdcdjzmh: "A（2011）B市不动产证明第0000060号",
djsj: "2009年04月21日",
dbr: "路**",
djjg: "",
fj: "",
qlqtzk: "",
zxdyywh: "201025126854",
zxdyyy: "贷款还清",
},
lishi: {
ssywh: "",
dah: "",
ywh: "200825012285",
bdcdyh: "370205004005GB10030 W00000000",
zjjzwzl:
"汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
dybdclx: "土地",
dyqr: "中国银行股份有限公司C区支行",
zjzj: "营业执照",
zjh: "*******",
dyr: "联城有限公司",
dyfs: "一般抵押",
sfygdj: "否",
zjjzwdyfw: "",
dymj: "22384.1700",
bdbzzqse: "22000",
dbfw: "城镇住宅用地",
zwlxqssj: "2007年12月25日",
zwlxjssj: "2077年12月24日",
zwlxqx: "1年",
zgzqqdsshse: "11223",
sfczyd: "否",
djyy: "合同设立",
bdcdjzmh: "A（2011）B市不动产证明第0000060号",
djsj: "2009年04月21日",
dbr: "路**",
djjg: "",
fj: "",
qlqtzk: "",
zxdyywh: "201025126854",
zxdyyy: "贷款还清",
},
},
};
},
};
</script>
<style lang="scss" scoped>
.dyaq {
width: 100%;
height: 100%;
background: #fff;
overflow-y: scroll;
color: #333;
.tableBox {
width: 810px;
margin: 0 auto;
.title {
font-family: "Arial Negreta", "Arial Normal", "Arial", sans-serif;
font-weight: 700;
font-size: 16px;
text-align: center;
background: #e9e9e9;
height: 62px;
line-height: 62px;
position: relative;
margin: 1px 0;
.checkbox {
position: absolute;
right: 20px;
bottom: -16px;
height: 62px;
}
}
.xxTable {
width: 810px;
border-spacing: 1px;
tr > th {
background: #464c5b;
color: #fff;
font-size: 16px;
}
tr > th:nth-child(1),
tr > th:nth-child(2) {
background: #464c5b;
}
tr > th:nth-child(3) {
background: rgba(70, 76, 91, 0.8);
}
.one th {
height: 25px;
font-size: 14px;
}
.one > th:nth-child(1) {
color: #fe9400;
}
.two th {
height: 45px;
p:nth-child(2) {
font-size: 14px;
}
}
.two > th:nth-child(1) {
color: #fe9400;
}
.linshiIcon {
position: relative;
}
.linshiIcon::after {
content: "";
display: block;
width: 0;
height: 0;
border-width: 0px 0px 45px 45px;
border-style: none solid solid;
border-color: transparent transparent #fe9400;
position: absolute;
top: 0px;
right: 3px;
transform: rotate(-90deg);
}
.icon {
position: absolute;
top: 8px;
right: 6px;
transform: rotate(45deg);
color: #fff;
font-size: 12px;
z-index: 10;
}
tr td {
text-align: center;
height: 40px;
padding: 4px;
font-size: 13px;
}
> tr:nth-child(odd) td {
background: #f2f2f2;
}
> tr:nth-child(even) td {
background: #f9f9f9;
}
tr > td:nth-child(2) {
color: #fe9400;
}
tr > td:nth-child(4) {
color: #7f7f7f;
}
}
}
}
</style>
......
<template>
<div>地役权</div>
<div class="dyiq">
<div class="tableBox">
<div class="title">
地役权登记信息
<div class="checkbox">
<el-checkbox-group v-model="checkList">
<el-checkbox label="临时"></el-checkbox>
<el-checkbox label="现势"></el-checkbox>
<el-checkbox label="历史"></el-checkbox>
</el-checkbox-group>
</div>
</div>
<table class="xxTable">
<tr>
<th rowspan="3" width="140">业务类型</th>
</tr>
<tr class="one">
<th class="linshiIcon">
<div class="icon">临时</div>
临时
</th>
<th>现势</th>
<th>历史</th>
</tr>
<tr class="two">
<th>
<p>地役权</p>
<p>首次登记</p>
</th>
<th>
<p>地役权</p>
<p>转移登记</p>
</th>
<th>
<p>地役权</p>
<p>转移登记</p>
</th>
</tr>
<tr v-for="(item, index) in columns" :key="index">
<td>
{{ item.label }}
</td>
<td>{{ tableData.linshi[item.prop] }}</td>
<td>{{ tableData.xianshi[item.prop] }}</td>
<td>{{ tableData.lishi[item.prop] }}</td>
</tr>
</table>
</div>
</div>
</template>
<script>
export default {
name: "dyiq",
data() {
return {};
return {
checkList: ["临时", "现势", "历史"],
columns: [
{
prop: "ssywh",
label: "上手业务号",
},
{
prop: "dah",
label: "档案号",
},
{
prop: "ywh",
label: "业务号",
},
{
prop: "gydbdcdyh",
label: "供役地不动产单元号",
},
{
prop: "gydqlr",
label: "供役地权利人",
},
{
prop: "gydqlrzjzl",
label: "供役地权利人证件种类",
},
{
prop: "xydbdcdyh",
label: "需役地不动产单元号",
},
{
prop: "xydzl",
label: "需役地坐落",
},
{
prop: "xydqlr",
label: "需役地权利人",
},
{
prop: "xydqlrzjzl",
label: "需役地权利人证件种类",
},
{
prop: "xydzjh",
label: "需役地证件号",
},
{
prop: "djyy",
label: "登记原因",
},
{
prop: "dyqnr",
label: "地役权内容",
},
{
prop: "qlqssj",
label: "权利起始时间",
},
{
prop: "qljssj",
label: "权利结束时间",
},
{
prop: "bdcdjzmh",
label: "不动产登记证明号",
},
{
prop: "qxdm",
label: "区县代码",
},
{
prop: "djjg",
label: "登记机构",
},
{
prop: "dbr",
label: "登簿人",
},
{
prop: "djsj",
label: "登记时间",
},
],
tableData: {
linshi: {},
xianshi: {},
lishi: {},
},
};
},
};
</script>
<style lang="scss" scoped>
.dyiq {
width: 100%;
height: 100%;
background: #fff;
overflow-y: scroll;
color: #333;
.tableBox {
width: 810px;
margin: 0 auto;
.title {
font-family: "Arial Negreta", "Arial Normal", "Arial", sans-serif;
font-weight: 700;
font-size: 16px;
text-align: center;
background: #e9e9e9;
height: 62px;
line-height: 62px;
position: relative;
margin: 1px 0;
.checkbox {
position: absolute;
right: 20px;
bottom: -16px;
height: 62px;
}
}
.xxTable {
width: 810px;
border-spacing: 1px;
tr > th {
background: #464c5b;
color: #fff;
font-size: 16px;
}
tr > th:nth-child(1),
tr > th:nth-child(2) {
background: #464c5b;
}
tr > th:nth-child(3) {
background: rgba(70, 76, 91, 0.8);
}
.one th {
height: 25px;
font-size: 14px;
}
.one > th:nth-child(1) {
color: #fe9400;
}
.two th {
height: 45px;
p:nth-child(2) {
font-size: 14px;
}
}
.two > th:nth-child(1) {
color: #fe9400;
}
.linshiIcon {
position: relative;
}
.linshiIcon::after {
content: "";
display: block;
width: 0;
height: 0;
border-width: 0px 0px 45px 45px;
border-style: none solid solid;
border-color: transparent transparent #fe9400;
position: absolute;
top: 0px;
right: 3px;
transform: rotate(-90deg);
}
.icon {
position: absolute;
top: 8px;
right: 6px;
transform: rotate(45deg);
color: #fff;
font-size: 12px;
z-index: 10;
}
tr td {
text-align: center;
height: 40px;
padding: 4px;
font-size: 13px;
}
> tr:nth-child(odd) td {
background: #f2f2f2;
}
> tr:nth-child(even) td {
background: #f9f9f9;
}
tr > td:nth-child(2) {
color: #fe9400;
}
tr > td:nth-child(4) {
color: #7f7f7f;
}
}
}
}
</style>
......
<template>
<div>国有建设用地使用权</div>
<div class="gyjsydsyq">
<div class="tableBox">
<div class="title">
建设用地使用权、宅基地使用权登记信息
<div class="checkbox">
<el-checkbox-group v-model="checkList">
<el-checkbox label="临时"></el-checkbox>
<el-checkbox label="现势"></el-checkbox>
<el-checkbox label="历史"></el-checkbox>
</el-checkbox-group>
</div>
</div>
<table class="xxTable">
<tr>
<th rowspan="3" width="140">业务类型</th>
</tr>
<tr class="one">
<th class="linshiIcon">
<div class="icon">临时</div>
临时
</th>
<th>现势</th>
<th>历史</th>
</tr>
<tr class="two">
<th>
<p>建设用地使用权</p>
<p>首次登记</p>
</th>
<th>
<p>建设用地使用权</p>
<p>转移登记</p>
</th>
<th>
<p>建设用地使用权</p>
<p>转移登记</p>
</th>
</tr>
<tr v-for="(item, index) in columns" :key="index">
<td>
{{ item.label }}
</td>
<td>{{ tableData.linshi[item.prop] }}</td>
<td>{{ tableData.xianshi[item.prop] }}</td>
<td>{{ tableData.lishi[item.prop] }}</td>
</tr>
</table>
</div>
</div>
</template>
<script>
export default {
name: "gyjsydsyq",
data() {
return {};
return {
checkList: ["临时", "现势", "历史"],
columns: [
{
prop: "ssywh",
label: "上手业务号",
},
{
prop: "dah",
label: "档案号",
},
{
prop: "ywh",
label: "业务号",
},
{
prop: "bdcdyh",
label: "不动产单元号",
},
{
prop: "zl",
label: "坐落",
},
{
prop: "qlrlx",
label: "权利人类型",
},
{
prop: "qlr",
label: "权利人",
},
{
prop: "zjzl",
label: "证件种类",
},
{
prop: "zjh",
label: "证件号",
},
{
prop: "gyqk",
label: "共有情况",
},
{
prop: "syqmj",
label: "使用权面积(m²)",
},
{
prop: "qlxz",
label: "权利性质",
},
{
prop: "tdyt",
label: "土地用途",
},
{
prop: "syqqssj",
label: "使用权起始时间",
},
{
prop: "syqjssj",
label: "使用权结束时间",
},
{
prop: "tdsyqx",
label: "土地使用期限",
},
{
prop: "qdjg",
label: "取得价格(万元)",
},
{
prop: "djyy",
label: "登记原因",
},
{
prop: "bdcqzh",
label: "不动产权证号",
},
{
prop: "djsj",
label: "登记时间",
},
{
prop: "dbr",
label: "登簿人",
},
{
prop: "fj",
label: "附记",
},
],
tableData: {
linshi: {
ssywh: "",
dah: "",
ywh: "200825012285",
bdcdyh: "370205004005GB10030 W00000000",
zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
qlrlx: "企业",
qlr: "联城有限公司",
zjzj: "组织机构代码证",
zjh: "*******",
gyqk: "单独所有",
syqmj: "22384.1700",
qlxz: "出让",
tdyt: "城镇住宅用地",
syqqssj: "2007年12月25日",
syqjssj: "2077年12月24日",
tdsyqx: "70年",
qdjg: "75793.75",
djyy: "出让取得",
bdcqzh: "陕2018汉台区不动产权第0003782号",
djsj: "2008年3月11日",
dbr: "路**",
fj: "2014年10月21日办理房屋首次登记",
},
xianshi: {
ssywh: "",
dah: "",
ywh: "200825012285",
bdcdyh: "370205004005GB10030 W00000000",
zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
qlrlx: "企业",
qlr: "联城有限公司",
zjzj: "组织机构代码证",
zjh: "*******",
gyqk: "单独所有",
syqmj: "22384.1700",
qlxz: "出让",
tdyt: "城镇住宅用地",
syqqssj: "2007年12月25日",
syqjssj: "2077年12月24日",
tdsyqx: "70年",
qdjg: "75793.75",
djyy: "出让取得",
bdcqzh: "陕2018汉台区不动产权第0003782号",
djsj: "2008年3月11日",
dbr: "路**",
fj: "2014年10月21日办理房屋首次登记",
},
lishi: {
ssywh: "",
dah: "",
ywh: "200825012285",
bdcdyh: "370205004005GB10030 W00000000",
zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
qlrlx: "企业",
qlr: "联城有限公司",
zjzj: "组织机构代码证",
zjh: "*******",
gyqk: "单独所有",
syqmj: "22384.1700",
qlxz: "出让",
tdyt: "城镇住宅用地",
syqqssj: "2007年12月25日",
syqjssj: "2077年12月24日",
tdsyqx: "70年",
qdjg: "75793.75",
djyy: "出让取得",
bdcqzh: "陕2018汉台区不动产权第0003782号",
djsj: "2008年3月11日",
dbr: "路**",
fj: "2014年10月21日办理房屋首次登记",
},
},
};
},
};
</script>
<style lang="scss" scoped>
.gyjsydsyq {
width: 100%;
height: 100%;
background: #fff;
overflow-y: scroll;
color: #333;
.tableBox {
width: 810px;
margin: 0 auto;
.title {
font-family: "Arial Negreta", "Arial Normal", "Arial", sans-serif;
font-weight: 700;
font-size: 16px;
text-align: center;
background: #e9e9e9;
height: 62px;
line-height: 62px;
position: relative;
margin: 1px 0;
.checkbox {
position: absolute;
right: 20px;
bottom: -16px;
height: 62px;
}
}
.xxTable {
width: 810px;
border-spacing: 1px;
tr > th {
background: #464c5b;
color: #fff;
font-size: 16px;
}
tr > th:nth-child(1),
tr > th:nth-child(2) {
background: #464c5b;
}
tr > th:nth-child(3) {
background: rgba(70, 76, 91, 0.8);
}
.one th {
height: 25px;
font-size: 14px;
}
.one > th:nth-child(1) {
color: #fe9400;
}
.two th {
height: 45px;
p:nth-child(2) {
font-size: 14px;
}
}
.two > th:nth-child(1) {
color: #fe9400;
}
.linshiIcon {
position: relative;
}
.linshiIcon::after {
content: "";
display: block;
width: 0;
height: 0;
border-width: 0px 0px 45px 45px;
border-style: none solid solid;
border-color: transparent transparent #fe9400;
position: absolute;
top: 0px;
right: 3px;
transform: rotate(-90deg);
}
.icon {
position: absolute;
top: 8px;
right: 6px;
transform: rotate(45deg);
color: #fff;
font-size: 12px;
z-index: 10;
}
tr td {
text-align: center;
height: 40px;
padding: 4px;
font-size: 13px;
}
> tr:nth-child(odd) td {
background: #f2f2f2;
}
> tr:nth-child(even) td {
background: #f9f9f9;
}
tr > td:nth-child(2) {
color: #fe9400;
}
tr > td:nth-child(4) {
color: #7f7f7f;
}
}
}
}
</style>
......
<template>
<div>预告登记</div>
<div class="ygdj">
<div class="tableBox">
<div class="title">
预告登记信息
<div class="checkbox">
<el-checkbox-group v-model="checkList">
<el-checkbox label="临时"></el-checkbox>
<el-checkbox label="现势"></el-checkbox>
<el-checkbox label="历史"></el-checkbox>
</el-checkbox-group>
</div>
</div>
<table class="xxTable">
<tr>
<th rowspan="3" width="140">业务类型</th>
</tr>
<tr class="one">
<th class="linshiIcon">
<div class="icon">临时</div>
临时
</th>
<th>现势</th>
<th>历史</th>
</tr>
<tr class="two">
<th>
<p>预售商品房买卖预告登记</p>
<p>首次登记</p>
</th>
<th>
<p>预售商品房抵押权预告登记</p>
<p>转移登记</p>
</th>
<th>
<p>预售商品房买卖预告登记</p>
<p>变更登记</p>
</th>
</tr>
<tr v-for="(item, index) in columns" :key="index">
<td>
{{ item.label }}
</td>
<td>{{ tableData.linshi[item.prop] }}</td>
<td>{{ tableData.xianshi[item.prop] }}</td>
<td>{{ tableData.lishi[item.prop] }}</td>
</tr>
</table>
</div>
</div>
</template>
<script>
export default {
name: "ygdj",
data() {
return {};
return {
checkList: ["临时", "现势", "历史"],
columns: [
{
prop: "ssywh",
label: "上手业务号",
},
{
prop: "dah",
label: "档案号",
},
{
prop: "ywh",
label: "业务号",
},
{
prop: "bdcdyh",
label: "不动产单元号",
},
{
prop: "zl",
label: "坐落",
},
{
prop: "qlr",
label: "权利人",
},
{
prop: "qlrzjzl",
label: "证件种类",
},
{
prop: "qlrzjh",
label: "证件号",
},
{
prop: "ywr",
label: "义务人",
},
{
prop: "ywrzjzl",
label: "证件种类",
},
{
prop: "ywrzjh",
label: "证件号",
},
{
prop: "fwxz",
label: "房屋性质",
},
{
prop: "ghyt",
label: "规划用途",
},
{
prop: "fwzcs",
label: "房屋总层数",
},
{
prop: "fwszc",
label: "房屋所在层",
},
{
prop: "jzmj",
label: "建筑面积",
},
{
prop: "djyy",
label: "登记原因",
},
{
prop: "bdbzzqse",
label: "取得价格/被担保主债权数额",
},
{
prop: "jedw",
label: "金额单位",
},
{
prop: "dbfw",
label: "担保范围",
},
{
prop: "sfczyd",
label: "是否存在禁止或限制转让抵押不动产的约定",
},
{
prop: "djsj",
label: "登记时间",
},
{
prop: "bdcdjzmh",
label: "不动产登记证明号",
},
{
prop: "dbr",
label: "登簿人",
},
{
prop: "zxygywh",
label: "注销预告业务号",
},
{
prop: "zxygyy",
label: "注销预告原因",
},
{
prop: "zxsj",
label: "注销时间",
},
{
prop: "qszt",
label: "权属状态",
},
],
tableData: {
linshi: {
ssywh: "",
dah: "",
ywh: "200825012285",
bdcdyh: "370205004005GB10030 F00160111",
zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
qlr: "企业",
qlrzjzj: "组织机构代码证",
qlrzjh: "*******",
ywr: "企业",
ywrzjzl: "组织机构代码证",
ywrzjh: "*******",
tdsyqr: "绿地开发有限公司",
fwxz: "商品房",
ghyt: "住宅",
fwzcs: "10",
fwszc: "6",
jzmj: "111.5",
djyy: "",
bdbzzqse: "80.000",
jedw: "万元",
dbfw: "****",
sfczyd: "",
djsj: "2008年3月11日",
bdcdjzmh: "A（2011）B市不动产证明第0000060号",
dbr: "路**",
zxygywh: "",
zxygyy: "",
zxsj: "",
qszt: "",
},
xianshi: {
ssywh: "",
dah: "",
ywh: "200825012285",
bdcdyh: "370205004005GB10030 F00160111",
zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
qlr: "企业",
qlrzjzj: "组织机构代码证",
qlrzjh: "*******",
ywr: "企业",
ywrzjzl: "组织机构代码证",
ywrzjh: "*******",
tdsyqr: "绿地开发有限公司",
fwxz: "商品房",
ghyt: "住宅",
fwzcs: "10",
fwszc: "6",
jzmj: "111.5",
djyy: "",
bdbzzqse: "60.000",
jedw: "",
dbfw: "",
sfczyd: "是",
djsj: "2008年3月11日",
bdcdjzmh: "A（2011）B市不动产证明第0000060号",
dbr: "路**",
zxygywh: "",
zxygyy: "",
zxsj: "",
qszt: "",
},
lishi: {
ssywh: "",
dah: "",
ywh: "200825012285",
bdcdyh: "370205004005GB10030 F00160111",
zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
qlr: "企业",
qlrzjzj: "组织机构代码证",
qlrzjh: "*******",
ywr: "企业",
ywrzjzl: "组织机构代码证",
ywrzjh: "*******",
tdsyqr: "绿地开发有限公司",
fwxz: "商品房",
ghyt: "住宅",
fwzcs: "10",
fwszc: "6",
jzmj: "111.5",
djyy: "",
bdbzzqse: "",
jedw: "",
dbfw: "",
sfczyd: "",
djsj: "2008年3月11日",
bdcdjzmh: "A（2011）B市不动产证明第0000060号",
dbr: "路**",
zxygywh: "200825012286",
zxygyy: "个人原因",
zxsj: "2008年3月11日",
qszt: "",
},
},
};
},
};
</script>
<style lang="scss" scoped>
.ygdj {
width: 100%;
height: 100%;
background: #fff;
overflow-y: scroll;
color: #333;
.tableBox {
width: 810px;
margin: 0 auto;
.title {
font-family: "Arial Negreta", "Arial Normal", "Arial", sans-serif;
font-weight: 700;
font-size: 16px;
text-align: center;
background: #e9e9e9;
height: 62px;
line-height: 62px;
position: relative;
margin: 1px 0;
.checkbox {
position: absolute;
right: 20px;
bottom: -16px;
height: 62px;
}
}
.xxTable {
width: 810px;
border-spacing: 1px;
tr > th {
background: #464c5b;
color: #fff;
font-size: 16px;
}
tr > th:nth-child(1),
tr > th:nth-child(2) {
background: #464c5b;
}
tr > th:nth-child(3) {
background: rgba(70, 76, 91, 0.8);
}
.one th {
height: 25px;
font-size: 14px;
}
.one > th:nth-child(1) {
color: #fe9400;
}
.two th {
height: 45px;
p:nth-child(2) {
font-size: 14px;
}
}
.two > th:nth-child(1) {
color: #fe9400;
}
.linshiIcon {
position: relative;
}
.linshiIcon::after {
content: "";
display: block;
width: 0;
height: 0;
border-width: 0px 0px 45px 45px;
border-style: none solid solid;
border-color: transparent transparent #fe9400;
position: absolute;
top: 0px;
right: 3px;
transform: rotate(-90deg);
}
.icon {
position: absolute;
top: 8px;
right: 6px;
transform: rotate(45deg);
color: #fff;
font-size: 12px;
z-index: 10;
}
tr td {
text-align: center;
height: 40px;
padding: 4px;
font-size: 13px;
}
> tr:nth-child(odd) td {
background: #f2f2f2;
}
> tr:nth-child(even) td {
background: #f9f9f9;
}
tr > td:nth-child(2) {
color: #fe9400;
}
tr > td:nth-child(4) {
color: #7f7f7f;
}
}
}
}
</style>
......
<template>
<div>异议登记</div>
<div class="yydj">
<div class="tableBox">
<div class="title">
异议登记信息
<div class="checkbox">
<el-checkbox-group v-model="checkList">
<el-checkbox label="临时"></el-checkbox>
<el-checkbox label="现势"></el-checkbox>
<el-checkbox label="历史"></el-checkbox>
</el-checkbox-group>
</div>
</div>
<table class="xxTable">
<tr>
<th rowspan="3" width="140">业务类型</th>
</tr>
<tr class="one">
<th class="linshiIcon">
<div class="icon">临时</div>
临时
</th>
<th>现势</th>
<th>历史</th>
</tr>
<tr class="two">
<th>异议登记</th>
<th>异议登记</th>
<th>异议登记</th>
</tr>
<tr v-for="(item, index) in columns" :key="index">
<td>
{{ item.label }}
</td>
<td>{{ tableData.linshi[item.prop] }}</td>
<td>{{ tableData.xianshi[item.prop] }}</td>
<td>{{ tableData.lishi[item.prop] }}</td>
</tr>
</table>
</div>
</div>
</template>
<script>
export default {
name: "yydj",
data() {
return {};
return {
checkList: ["临时", "现势", "历史"],
columns: [
{
prop: "ssywh",
label: "上手业务号",
},
{
prop: "dah",
label: "档案号",
},
{
prop: "ywh",
label: "业务号",
},
{
prop: "bdcdyh",
label: "不动产单元号",
},
{
prop: "zl",
label: "坐落",
},
{
prop: "yyr",
label: "异议人",
},
{
prop: "zjzl",
label: "证件种类",
},
{
prop: "zjh",
label: "证件号",
},
{
prop: "yysx",
label: "异议事项",
},
{
prop: "bdcdjzmh",
label: "不动产登记证明号",
},
{
prop: "djjg",
label: "登记机构",
},
{
prop: "dbr",
label: "登簿人",
},
{
prop: "djsj",
label: "登记时间",
},
{
prop: "zxyyywh",
label: "注销异议业务号",
},
{
prop: "zxyyyy",
label: "注销异议原因",
},
{
prop: "zxyydbr",
label: "注销异议登簿人",
},
{
prop: "zxyydjsj",
label: "注销异议登记时间",
},
],
tableData: {
linshi: {
ssywh: "",
dah: "",
ywh: "200825012285",
bdcdyh: "370205004005GB10030 F00160111",
zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
yyr: "李四",
zjzj: "身份证号",
zjh: "*******",
yysx: "",
djjg: "",
bdcdjzmh: "200825012286",
dbr: "",
djsj: "2008年3月11日",
zxyyywh: "",
zxyyyy: "",
zxyydbr: "",
zxyydjsj: "",
},
xianshi: {
ssywh: "",
dah: "",
ywh: "200825012285",
bdcdyh: "370205004005GB10030 F00160111",
zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
yyr: "李四",
zjzj: "身份证号",
zjh: "*******",
yysx: "",
djjg: "",
bdcdjzmh: "200825012286",
dbr: "",
djsj: "2008年3月11日",
zxyyywh: "200825012286",
zxyyyy: "时间到期",
zxyydbr: "李四",
zxyydjsj: "2008年3月11日",
},
lishi: {
ssywh: "",
dah: "",
ywh: "200825012285",
bdcdyh: "370205004005GB10030 F00160111",
zl: "汉台区东大街街道办事处北大街居委会北大街东侧（莲花池公园西侧）",
yyr: "李四",
zjzj: "身份证号",
zjh: "*******",
yysx: "",
djjg: "",
bdcdjzmh: "200825012286",
dbr: "",
djsj: "2008年3月11日",
zxyyywh: "200825012286",
zxyyyy: "时间到期",
zxyydbr: "李四",
zxyydjsj: "2008年3月11日",
},
},
};
},
};
</script>
<style lang="scss" scoped>
.yydj {
width: 100%;
height: 100%;
background: #fff;
overflow-y: scroll;
color: #333;
.tableBox {
width: 810px;
margin: 0 auto;
.title {
font-family: "Arial Negreta", "Arial Normal", "Arial", sans-serif;
font-weight: 700;
font-size: 16px;
text-align: center;
background: #e9e9e9;
height: 62px;
line-height: 62px;
position: relative;
margin: 1px 0;
.checkbox {
position: absolute;
right: 20px;
bottom: -16px;
height: 62px;
}
}
.xxTable {
width: 810px;
border-spacing: 1px;
tr > th {
background: #464c5b;
color: #fff;
font-size: 16px;
}
tr > th:nth-child(1),
tr > th:nth-child(2) {
background: #464c5b;
}
tr > th:nth-child(3) {
background: rgba(70, 76, 91, 0.8);
}
.one th {
height: 25px;
font-size: 14px;
}
.one > th:nth-child(1) {
color: #fe9400;
}
.two th {
height: 45px;
p:nth-child(2) {
font-size: 14px;
}
}
.two > th:nth-child(1) {
color: #fe9400;
}
.linshiIcon {
position: relative;
}
.linshiIcon::after {
content: "";
display: block;
width: 0;
height: 0;
border-width: 0px 0px 45px 45px;
border-style: none solid solid;
border-color: transparent transparent #fe9400;
position: absolute;
top: 0px;
right: 3px;
transform: rotate(-90deg);
}
.icon {
position: absolute;
top: 8px;
right: 6px;
transform: rotate(45deg);
color: #fff;
font-size: 12px;
z-index: 10;
}
tr td {
text-align: center;
height: 40px;
padding: 4px;
font-size: 13px;
}
> tr:nth-child(odd) td {
background: #f2f2f2;
}
> tr:nth-child(even) td {
background: #f9f9f9;
}
tr > td:nth-child(2) {
color: #fe9400;
}
tr > td:nth-child(4) {
color: #7f7f7f;
}
}
}
}
</style>
......
......@@ -13,10 +13,10 @@
placeholder="请选择权利类型"
>
<el-option
v-for="item in qllxs"
:key="item.value"
:label="item.label"
:value="item.value"
v-for="item in dictData['权利类型']"
:key="item.dcode"
:label="item.dname"
:value="item.dcode"
>
</el-option>
</el-select>
......@@ -80,17 +80,27 @@
>
</lb-table>
</div>
<djbxxDialog v-model="isDialog" ref="djbxxDialog"/>
<djbxxDialog v-model="isDialog" ref="djbxxDialog" :data="djbxxData" />
</div>
</template>
<script>
import table from "@/utils/mixin/table";
import { datas, sendThis } from "./djbcxdata";
import djbxxDialog from "./components/djbxxDialog.vue";
import {
getDjbBysearch,
getDjbfm,
getDjml,
getZdxx,
getQlmc,
} from "@/api/djbcx.js";
import { mapGetters, mapMutations } from "vuex";
import axios from "axios";
export default {
name: "djbcx",
components: {
djbxxDialog
djbxxDialog,
},
mixins: [table],
mounted() {
......@@ -107,51 +117,68 @@ export default {
pageData: {
current: 1,
size: 10,
total: 2,
total: 0,
},
ywlys: datas.ywlys(),
tableData: {
columns: datas.columns(),
data: [
{
qszt: "1",
slsj: "2022-5-12",
qllx: "预告买卖登记"
},
{
qszt: "2",
slsj: "2022-5-13",
qllx: "查封登记"
},
{
qszt: "3",
slsj: "2022-5-13",
qllx: "预告买卖登记"
},
],
data: [],
},
qllxs: [],
isDialog: false,
djbxxData: {},
};
},
computed: {
...mapGetters(["dictData"]),
},
methods: {
// 初始化数据
fetchData() {},
fetchData() {
getDjbBysearch({ ...this.queryForm, ...this.pageData }).then((res) => {
if (res.code === 200) {
let { total, records } = res.result;
this.pageData.total = total;
this.tableData.data = records;
}
});
},
handleSort(name, sort) {
console.log(name, sort);
},
queryClick(){
// 查询
queryClick() {
this.pageData.current = 1;
this.pageData.currentPage = 1;
this.fetchData();
},
moreQueryClick(){},
// 高级查询
moreQueryClick() {},
openDialog(scope) {
this.isDialog = true;
// if(scope.row.qllx == '预告买卖登记'){
// this.$refs.djbxxDialog.showTab = 'ygdj'
// }
// else if(scope.row.qllx == '查封登记'){
// this.$refs.djbxxDialog.showTab = 'cfdj'
// }
let _this = this;
let bsm = scope.row.bsmQlxx;
this.bsm = bsm;
axios
.all([getDjbfm(bsm), getDjml(bsm), getZdxx(bsm), getQlmc(bsm)])
.then(([fm, ml, zdxx, qlmc]) => {
console.log("fm:", fm.result);
console.log("ml:", ml.result);
console.log("zdxx:", zdxx.result);
console.log("qlmc:", qlmc.result);
let obj = {
fm:fm.result,
ml:ml.result,
zdxx:zdxx.result,
qlmc:qlmc.result
}
_this.isDialog = true;
// if (scope.row.qllx == "预告买卖登记") {
// this.$refs.djbxxDialog.showTab = "ygdj";
// } else if (scope.row.qllx == "查封登记") {
// this.$refs.djbxxDialog.showTab = "cfdj";
// }
});
},
},
};
......
......@@ -13,7 +13,14 @@ class data extends filter {
{
label: '序号',
type: 'index',
width: '50'
width: '50',
render: (h, scope) => {
return (
<div>
{(vm.pageData.currentPage - 1) * vm.pageData.pageSize + scope.$index + 1}
</div>
)
}
},
{
label: "权属状态",
......@@ -64,11 +71,11 @@ class data extends filter {
label: "不动产权证号",
},
{
prop: "qlr",
prop: "qlrmc",
label: "权利人",
},
{
prop: "ywr",
prop: "ywrmc",
label: "义务人",
},
{
......