Skip to content

任超 / js.CadastralSystem

Go to a project
Toggle navigation
Toggle navigation pinning
4e2c62ef by zhaoqian
Options

Merge remote-tracking branch 'origin/master'

2 parents 74ea6241 f35f0f09
Inline Side-by-side
Showing 5 changed files with 500 additions and 68 deletions
......@@ -5,7 +5,7 @@
:visible.sync="isVisible"
width="70%"
@close="close"
:modal-append-to-body="false"
append-to-body
>
<div class="search">
<el-row>
......
<template>
<div class="main">
<div>
<p class="tips">查询条件</p>
<template v-if="isCxlz">
<p class="tips">查询条件</p>
<div class="search">
<el-row>
<el-col :span="24" style="margin-left: -10px;">
......@@ -49,7 +49,7 @@
</el-col>
</el-row>
</div>
<p class="tips">查询列表</p>
<p class="tips">查询列表</p>
<el-table :data="Data" :height="tableHeight">
<td class="xh">序号</td>
<td class="cz">操作</td>
......@@ -75,48 +75,185 @@
<el-table-column label="操作" align="center" width="100">
<template slot-scope="scope">
<el-tooltip class="item" effect="light" content="选择" placement="top">
<i class="iconfont iconbanli iconfontEdit" @click="xzzrz(scope.row)" style="padding:0 10px"></i>
</el-tooltip>
<i class="iconfont iconbanli iconfontEdit" @click="xzzrz(scope.row)" style="padding:0 10px"></i>
</el-tooltip>
<!-- <el-button @click="xzzrz(scope.row)" type="text" size="small"
>选择
</el-button> -->
</template>
</el-table-column>
</el-table>
</div>
<span slot="footer" class="dialog-footer"> </span>
<cxlz-query-data
:centerDialogVisible="centerDialogVisible"
:dylxs="dylxs"
@close="close"
:zrzbsm="zrzbsm"
></cxlz-query-data>
<div class="page">
<el-pagination
background
layout="prev, pager, next,total"
:page-size="queryData.pageSize"
:total="total"
@current-change="currentChange"
>
</el-pagination>
<div class="page">
<el-pagination
background
layout="prev, pager, next,total"
:page-size="queryData.pageSize"
:total="total"
@current-change="currentChange"
>
</el-pagination>
</div>
</template>
<div class="lpb" v-if="!isCxlz">
<div class="lpb-header">
<el-radio-group v-model="scyclx" @change="scyclxChange">
<el-radio-button label="0">预测</el-radio-button>
<el-radio-button label="1">实测</el-radio-button>
</el-radio-group>
<el-input
maxlength="28"
v-model="bdcdyh"
:style="{ width: inputWidth + 'px' }"
@change="inputChange"
class="searchInput"
placeholder="输入不动产单元号或室号"
><i
slot="suffix"
class="el-input__icon el-icon-search"
@click="inputChange"
></i
></el-input>
<el-link type="primary" style="margin-left:20px" @click="isCxlz=true">重新选择户</el-link>
</div>
<div class="lpb-content" ref="lpbContentWrap" :style="{ height: lpbContentHeight + 'px' }">
<!-- 楼盘表主体 -->
<div class="lp-overview" :style="{ width: lpbContentwidth + 'px' }">
<lpbContent ref="lpbContent" class="" :zrzbsm='zrzbsm' lpbParent = 'isCxlz'></lpbContent>
</div>
<!-- 右侧图例 -->
<div class="lp-legend">
<div class="handleCol">
<div class="btn" @click="legendToggle">
<i v-show="!legendToggleFlag" class="el-icon-d-arrow-left"></i>
<i v-show="legendToggleFlag" class="el-icon-d-arrow-right"></i>
</div>
<div
:class="selectedZt == 'dyzt' ? 'dyzt selectedZt' : 'dyzt'"
@click="selectedZt = 'dyzt'"
>
<span>单元状态</span>
</div>
<div
:class="selectedZt == 'fwxz' ? 'fwxz selectedZt' : 'fwxz'"
@click="selectedZt = 'fwxz'"
>
<span>房屋性质</span>
</div>
<div
:class="selectedZt == 'fwyt' ? 'fwyt selectedZt' : 'fwyt'"
@click="selectedZt = 'fwyt'"
>
<span>房屋用途</span>
</div>
</div>
<div
class="legendTable-wrap"
:style="{ width: legendToggleFlag ? '204px' : '0' }"
>
<table
class="legendTable"
v-show="selectedZt == 'dyzt'"
cellspacing="1"
cellpadding="1"
border="1"
>
<tr>
<th>状态</th>
<th>套数</th>
<th>面积</th>
</tr>
<tr
v-for="(item, index) in dyztList"
:key="index"
class="cp"
@click="handleChoosedH(item.bsms,item.color)"
>
<td>
<i class="fa fa-circle" :style="{ color: item.color }"></i
>{{ item.name }}
</td>
<td>{{ item.ts }}</td>
<td>{{ item.mj }}</td>
</tr>
</table>
<table
class="legendTable"
v-show="selectedZt == 'fwxz'"
cellspacing="1"
cellpadding="1"
border="1"
>
<tr>
<th>性质</th>
<th>套数</th>
<th>面积</th>
</tr>
<tr
v-for="(item, index) in fwxzList"
:key="index"
class="cp"
@click="handleChoosedH(item.bsms,item.color)"
>
<td>
<i class="fa fa-circle" :style="{ color: item.color }"></i
>{{ item.name }}
</td>
<td>{{ item.ts }}</td>
<td>{{ item.mj }}</td>
</tr>
<tr v-show="fwxzList.length < 1">
<td colspan="3" class="tac">暂无数据</td>
</tr>
</table>
<table
class="legendTable"
v-show="selectedZt == 'fwyt'"
cellspacing="1"
cellpadding="1"
border="1"
>
<tr>
<th>用途</th>
<th>套数</th>
<th>面积</th>
</tr>
<tr
v-for="(item, index) in fwytList"
:key="index"
class="cp"
@click="handleChoosedH(item.bsms,item.color)"
>
<td>
<i class="fa fa-circle" :style="{ color: item.color }"></i
>{{ item.name }}
</td>
<td>{{ item.ts }}</td>
<td>{{ item.mj }}</td>
</tr>
<tr v-show="fwytList.length < 1">
<td colspan="3" class="tac">暂无数据</td>
</tr>
</table>
</div>
</div>
</div>
</div>
</div>
</template>
<script>
import { cxlzZrzList } from "@api/zrz";
import cxlzQueryData from "@components/cxlxQueryData/cxlzQueryData";
import lpbContent from "../../../zrz/lpb/bjlp/lpbContent/index";
export default {
name: "",
components: { cxlzQueryData },
props: {},
components: { lpbContent },
data() {
return {
total: 1,
centerDialogVisible: false,
zrzbsm: "",
queryData: {
bdcdyh: "",
bdcqzh: "",
......@@ -131,6 +268,73 @@ export default {
Data: [],
dylxs: ["zd"],
tableHeight: 0,
isCxlz:true,
zrzbsm:'',
scyclx:'0', //实预测类型
bdcdyh:'',//室号搜索
inputWidth: 220,//搜索框宽度
legendToggleFlag: false,
selectedZt:'dyzt',
dyztList: [
{
name: "未确权",
color: "#83AAFE",
ts: "12",
mj: "1633",
},
{
name: "已确权",
color: "#6EDEE1",
ts: "22",
mj: "3109",
},
{
name: "已备案",
color: "#8ADC88",
ts: "3",
mj: "409",
},
{
name: "预抵押",
color: "#F2AD67",
ts: "11",
mj: "1466",
},
{
name: "在建抵押",
color: "#F191C8",
ts: "13",
mj: "1792",
},
{
name: "抵押",
color: "#FF8282",
ts: "14",
mj: "13",
},
{
name: "查封",
color: "#D7CECF",
ts: "9",
mj: "1436",
},
{
name: "异议",
color: "#D4A3EB",
ts: "34",
mj: "4342",
},
{
name: "限制",
color: "#A5A3FB",
ts: "2",
mj: "285",
},
],
fwxzList: [],
fwytList: [],
lpbContentHeight: 0,
lpbContentwidth: 0,
};
},
created() {},
......@@ -140,6 +344,8 @@ export default {
this.tableHeight =
(document.documentElement.clientHeight ||
document.body.clientHeight) - 396;
this.lpbContentHeight = (document.documentElement.clientHeight || document.body.clientHeight) - 208;
this.lpbContentwidth = this.$refs.lpbContentWrap.clientWidth - 34 - 6;
});
},
methods: {
......@@ -148,8 +354,8 @@ export default {
this.getData(this.queryData);
},
xzzrz: function(item) {
this.centerDialogVisible = true;
this.zrzbsm = item.glbsm;
this.isCxlz = false;
this.zrzbsm = item.bsm;
},
close: function() {
this.centerDialogVisible = false;
......@@ -176,9 +382,151 @@ export default {
search: function() {
this.getData(this.queryData);
},
//实预测转换
scyclxChange(){
//清空已选中层户
// this.bsms = [];
this.$refs.lpbContent.hbsmList = [];
this.$nextTick(()=>{
//户
this.$refs.lpbContent.$refs.hBsm.forEach(item=>{
item.style.borderColor = 'rgb(230, 230, 230)';
if (item.className == "tdSelect") {
item.className = "";
}
});
//层
this.$refs.lpbContent.$refs.cBsm.forEach(item=>{
console.log(item.className,'item.className');
item.className = "floor";
});
})
//获取图例数据
this.getDyztBsmList();
this.getLpbFwytAndQlxz();
},
inputChange() {
if (this.bdcdyh != "") {
// 根据不动产单元号或者室号搜索
// this.$refs.lpbContent.lpbDataMap(this.bdcdyh);
} else {
this.$message({
message: "请输入内容后查询",
type: "warning",
});
}
},
//图例的展开收起
legendToggle() {
this.legendToggleFlag = !this.legendToggleFlag;
},
//获取各项单元状态统计数据
getDyztBsmList() {
let data = {
zrzbsm: this.$store.state.zrzbsm,
scyclx: this.scyclx,
};
getLpbTj(data).then((res) => {
if (res.code === 200) {
this.dyztList = res.result;
this.dyztList.splice(1,0,this.dyztList[8]);
this.dyztList.pop();
this.dyztList.forEach(item=>{
item.ts = item.bsms.length;
switch (item.name) {
case 'Qqzt':
item.color = "#6EDEE1";
item.name = "已确权"
break;
case 'Wqqzt':
item.color = "#83AAFE";
item.name = "未确权"
break;
case 'Bazt':
item.color = "#8ADC88";
item.name = "已备案"
break;
case 'Ydyzt':
item.color = "#F2AD67";
item.name = "预抵押"
break;
case 'Zjgcdyzt':
item.color = "#F191C8";
item.name = "在建抵押"
break;
case 'Dyzt':
item.color = "#FF8282";
item.name = "抵押"
break;
case 'Cfzt':
item.color = "#D7CECF";
item.name = "查封"
break;
case 'Yyzt':
item.color = "#D4A3EB";
item.name = "异议"
break;
case 'Xzzt':
item.color = "#A5A3FB";
item.name = "限制"
break;
default:
break;
}
})
}
});
},
// 获取房屋用途和房屋性质统计数据
getLpbFwytAndQlxz(){
let data = {
zrzbsm: this.$store.state.zrzbsm,
scyclx: this.scyclx,
};
getLpbFwytAndQlxz(data).then((res) => {
if (res.code === 200) {
// this.fwytList = res.result
this.fwytList = res.result.fwyt;
this.fwxzList = res.result.qlxz;
if(this.fwytList.length>0){
this.fwytList.forEach(item=>{
item.color = "#2591FD";
item.ts = item.bsms.length
})
}
if(this.fwxzList.length>0){
this.fwxzList.forEach(item=>{
item.color = "#2591FD";
item.ts = item.bsms.length
})
}
}
});
}
},
computed: {},
watch: {},
watch: {
//树结构和图例伸缩时修改楼盘表主要内容区宽度
legendToggleFlag(n) {
if (n) {
this.lpbContentwidth -= 204;
} else {
this.lpbContentwidth += 204;
}
},
//选择自然幢展示楼盘表后，查询右侧图例数据
isSearch(n){
if (!n) {
this.getDyztBsmList();
this.getLpbFwytAndQlxz();
}
},
//改变syclx，更新楼盘表数据
scyclx(n){
this.$refs.lpbContent.lpbData = n == 0 ? this.$refs.lpbContent.yclpbData : this.$refs.lpbContent.sclpbData
}
},
};
</script>
<style scoped lang="less">
......@@ -290,21 +638,102 @@ table:hover {
width: auto;
height: auto;
}
// /deep/ .el-form-item__label {
// width: 96px;
// }
// /deep/ .el-form {
// margin-left: -28px;
// .el-button{
// margin: 0 22px;
// }
// }
// .el-form-item{
// width: 100%;
// box-sizing: border-box;
// padding: 0 20px;
// /deep/.el-form-item__content{
// width: calc(100% - 96px);
// }
// }
.lpb{
box-sizing: border-box;
padding-left: 2px;
.searchInput {
transition: 0.5s;
margin-left: 20px;
display: inline-block;
}
.lpb-content{
margin-top: 20px;
background-color: #ffffff;
display: flex;
overflow-y: scroll;
.lp-overview {
transition: 0.5s;
flex: 1;
margin-right: 20px;
box-sizing: border-box;
border: 1px solid rgb(236, 236, 236);
border-top: 0;
border-bottom: 0;
}
.lp-legend {
transition: 0.5s;
height: 100%;
font-size: 14px;
.handleCol {
width: 34px;
float: right;
height: 100%;
.btn {
cursor: pointer;
height: 40px;
line-height: 40px;
text-align: center;
background-color: #0091ff;
color: #fff;
border-bottom: 1px solid #e6e6e6;
}
.dyzt {
height: 81px;
line-height: 81px;
}
.fwxz,
.fwyt {
height: 122px;
}
.dyzt,
.fwxz,
.fwyt {
cursor: pointer;
border-bottom: 1px solid #e6e6e6;
span {
text-align: center;
height: 100%;
-webkit-writing-mode: vertical-rl;
writing-mode: vertical-rl;
line-height: 34px;
letter-spacing: 2px;
}
}
.selectedZt {
background-color: #0091ff;
color: #fff;
}
}
.legendTable-wrap {
transition: 0.5s;
float: right;
overflow: hidden;
.legendTable {
margin-top: -1px;
tr {
height: 40px;
line-height: 40px;
th:first-child {
width: 80px;
}
th {
width: 60px;
height: 40px;
white-space: nowrap;
}
td {
height: 40px;
text-align: center;
white-space: nowrap;
}
td:first-child {
text-align: left;
text-indent: 2px;
}
}
}
}
}
}
}
</style>
......
......@@ -313,7 +313,7 @@ export default {
this.tableHeight =
(document.documentElement.clientHeight || document.body.clientHeight) -
392;
this.lpbContentHeight = (document.documentElement.clientHeight || document.body.clientHeight) - 205;
this.lpbContentHeight = (document.documentElement.clientHeight || document.body.clientHeight) - 208;
this.lpbContentwidth = this.$refs.lpbContentWrap.clientWidth - 34 - 6;
});
},
......
......@@ -252,17 +252,11 @@
<pl-zl :pl-zl-visible="plzlVisible" :bsms="bsms" @close="plZlClose" @lodding="lodding"></pl-zl>
<pl-c :plc-visible="plcVisible" :bsms="cbsmList" @close="plcClose" @lodding="lodding"></pl-c>
<pl-sh :plShVisible="plShVisible" :bsms="bsms" @close="plshClose" @lodding="lodding"></pl-sh>
<h-cxlz
:h-cxlz-visble="hcxlzVisible"
:bsms="bsms"
@close="hcxlzClose"
></h-cxlz>
</div>
</template>
<script>
import {Message} from "element-ui"
import HCxlz from "@components/hCxlz/hCxlz";
import PlC from "@components/plc/plC";
import PlSh from "@components/plsh/plSh";
import PlH from "@components/plh/plH";
......@@ -286,7 +280,6 @@ export default {
PlSh,
PlH,
PlZl,
HCxlz,
},
props: {},
data() {
......@@ -297,8 +290,6 @@ export default {
plhVisible: false,
plShVisible: false,
plzlVisible: false,
hbjVisible: false,
hcxlzVisible:false,
scyclx: "0", //1是实测 0是预测
radio1: "",
radio2: "",
......@@ -404,13 +395,6 @@ export default {
}
})
},
hcxlz(){
if (this.bsms.length <= 0) {
Message.warning("请选择操作户")
return
}
this.hcxlzVisible = true
},
loading(){
this.getLpbMenuTree(this.$store.state.zrzbsm);
},
......@@ -443,9 +427,6 @@ export default {
lodding(){
this.getlpbData();
},
hcxlzClose() {
this.hcxlzVisible = false;
},
plZlClose() {
this.plzlVisible = false;
},
......
......@@ -304,6 +304,8 @@
<li v-show="rightClickFlag == 'fg'" @click="handleFg">户分割</li>
<!-- 范围属性变更 -->
<li v-show="rightClickFlag == 'fwsxbg'" @click="handleFwsxbg">变更信息</li>
<!-- 重新落宗 -->
<li v-show="rightClickFlag == 'cxlz'" @click="handleCxlz">重新落宗</li>
</ul>
......@@ -368,10 +370,17 @@
<el-dialog v-dialogDrag :close-on-click-modal="false" title="户编辑" class="hbjDialog" :visible.sync="hbjVisible" width="80%" >
<hbj ref="hbj" :bsm="hbsm" :scyclx="scyclx"></hbj>
</el-dialog>
<!-- 户重新落宗 -->
<h-cxlz
:h-cxlz-visble="hcxlzVisible"
:bsms="hbsmList"
@close="hcxlzVisible = false"
></h-cxlz>
</div>
</template>
<script>
import moveH from "@components/moveH/moveH";
import HCxlz from "@components/hCxlz/hCxlz";
import { getLpb, insertUpDownC, deleteCByBsm } from "@api/lpb";
import { hhb,hfg } from "@api/h";
import { Message } from 'element-ui';
......@@ -379,7 +388,7 @@ import { fwsxbgbl } from "@api/common";
import hbj from "../hbj/index";
export default {
name: "",
components: { moveH,hbj },
components: { moveH,hbj,HCxlz, },
props: {
zrzbsm:{
type:String,
......@@ -403,6 +412,7 @@ export default {
zdys: [],
},
hbjVisible:false,
hcxlzVisible:false,
lpbContentWidth: "",
ljzWidth: 10000,
zdyWidth: 1000,
......@@ -708,6 +718,10 @@ export default {
this.rightClickFlag = 'fwsxbg';
this.lpbChVisible = true;
break;
case 'isCxlz':
this.rightClickFlag = 'cxlz';
this.lpbChVisible = true;
break;
case 'isLpb':
this.rightClickFlag = type;
this.lpbChVisible = true;
......@@ -904,6 +918,14 @@ export default {
}).catch(() => {
});
},
//户重新落宗
handleCxlz(){
if (this.hbsmList.length <= 0) {
Message.warning("请选择操作户")
return
}
this.hcxlzVisible = true
}
},
computed: {
......