Skip to content

bdc / bdcdj-web

Go to a project
Toggle navigation
Toggle navigation pinning
d27bc659 by renchao@pashanhoo.com
Options

style:楼盘表

1 parent 80b42bf9
Inline Side-by-side
Showing 3 changed files with 61 additions and 82 deletions
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-09-15 14:46:47
* @LastEditTime: 2024-03-08 08:50:28
-->
<template>
<div class="edit">
......@@ -16,9 +16,11 @@
:style="{ height: lpbContentHight + 'px' }"
v-show="bjztFlag">
<!-- 楼盘表主体 -->
<div class="lp-overview" :style="{ width: lpbContentwidth + 'px','margin-right': formData.onlyShow ? '10px' : 0 }">
<div class="lp-overview"
:style="{ width: lpbContentwidth + 'px','margin-right': formData.onlyShow ? '10px' : 0 }">
<lpbContent
ref="lpbContent"
v-if="formData.bsm"
:zrzbsm="formData.bsm"
:scyclx="formData.scyclx"
:onlyShow="formData.onlyShow"
......@@ -26,9 +28,10 @@
:unitData="formData.unitData"
:sqywInfo="formData"
:key="time"></lpbContent>
<el-empty v-else description="暂无楼盘表"></el-empty>
</div>
<!-- 右侧图例 -->
<div class="lp-legend" v-if="formData.onlyShow">
<div class="lp-legend" v-if="formData.onlyShow && formData.bsm">
<div class="handleCol">
<div class="btn" @click="legendToggle">
<i v-show="!legendToggleFlag" class="el-icon-d-arrow-left"></i>
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2023-09-20 16:55:00
* @LastEditTime: 2024-03-08 08:47:12
-->
<template>
<div class="edit">
......@@ -13,16 +13,15 @@
class="tab-content"
ref="tabContent"
:style="{ height: lpbContentHight + 'px' }"
v-show="bjztFlag"
>
v-show="bjztFlag">
<!-- 楼盘表主体 -->
<div
class="lp-overview"
v-if="zrzList.length>0"
:style="{
width: lpbContentwidth + 'px',
'margin-right': formData.onlyShow ? '10px' : 0,
}"
>
}">
<lpbContent
ref="lpbContent"
:zrzbsm="item.bsm"
......@@ -31,58 +30,50 @@
:showSave="formData.showSave"
:unitData="formData.unitData"
:sqywInfo="formData"
:key="item.bsm"
></lpbContent>
:key="item.bsm"></lpbContent>
</div>
<el-empty v-else description="暂无楼盘表"></el-empty>
<!-- 右侧图例 -->
<div class="lp-legend" v-if="formData.onlyShow">
<div class="handleCol">
<div class="btn" @click="legendToggle">
<i
v-show="!legendToggleFlag"
class="el-icon-d-arrow-left"
></i>
class="el-icon-d-arrow-left"></i>
<i
v-show="legendToggleFlag"
class="el-icon-d-arrow-right"
></i>
class="el-icon-d-arrow-right"></i>
</div>
<div
:class="selectedZt == 'dyzt' ? 'dyzt selectedZt' : 'dyzt'"
@click="selectedZt = 'dyzt'"
>
@click="selectedZt = 'dyzt'">
<span>单元状态</span>
</div>
<div
:class="selectedZt == 'fwxz' ? 'fwxz selectedZt' : 'fwxz'"
@click="selectedZt = 'fwxz'"
>
@click="selectedZt = 'fwxz'">
<span>房屋性质</span>
</div>
<div
:class="selectedZt == 'fwyt' ? 'fwyt selectedZt' : 'fwyt'"
@click="selectedZt = 'fwyt'"
>
@click="selectedZt = 'fwyt'">
<span>房屋用途</span>
</div>
<div
:class="selectedZt == 'qsx' ? 'qsx selectedZt' : 'qsx'"
@click="selectedZt = 'qsx'"
>
@click="selectedZt = 'qsx'">
<span>缺失项</span>
</div>
</div>
<div
class="legendTable-wrap"
:style="{ width: legendToggleFlag ? '200px' : '0' }"
>
:style="{ width: legendToggleFlag ? '200px' : '0' }">
<table
class="legendTable"
v-show="selectedZt == 'dyzt'"
cellspacing="1"
cellpadding="1"
border="1"
>
border="1">
<tr>
<th>状态</th>
<th>套数</th>
......@@ -92,14 +83,11 @@
v-for="(item, index) in dyztList"
:key="index"
class="cp"
@click="handleChoosedH(item.bsms, item.color)"
>
@click="handleChoosedH(item.bsms, item.color)">
<td>
<i
class="fa fa-circle"
:style="{ backgroundColor: item.color }"
></i
>{{ item.name }}
:style="{ backgroundColor: item.color }"></i>{{ item.name }}
</td>
<td>{{ item.ts }}</td>
<td>{{ item.mj }}</td>
......@@ -111,8 +99,7 @@
v-show="selectedZt == 'fwxz'"
cellspacing="1"
cellpadding="1"
border="1"
>
border="1">
<tr>
<th>性质</th>
<th>套数</th>
......@@ -122,14 +109,11 @@
v-for="(item, index) in fwxzList"
:key="index"
class="cp"
@click="handleChoosedH(item.bsms, item.color)"
>
@click="handleChoosedH(item.bsms, item.color)">
<td>
<i
class="fa fa-circle"
:style="{ backgroundColor: item.color }"
></i
>{{ item.name }}
:style="{ backgroundColor: item.color }"></i>{{ item.name }}
</td>
<td>{{ item.ts }}</td>
<td>{{ item.mj }}</td>
......@@ -144,8 +128,7 @@
v-show="selectedZt == 'fwyt'"
cellspacing="1"
cellpadding="1"
border="1"
>
border="1">
<tr>
<th>用途</th>
<th>套数</th>
......@@ -155,14 +138,11 @@
v-for="(item, index) in fwytList"
:key="index"
class="cp"
@click="handleChoosedH(item.bsms, item.color)"
>
@click="handleChoosedH(item.bsms, item.color)">
<td>
<i
class="fa fa-circle"
:style="{ backgroundColor: item.color }"
></i
>{{ item.name }}
:style="{ backgroundColor: item.color }"></i>{{ item.name }}
</td>
<td>{{ item.ts }}</td>
<td>{{ item.mj }}</td>
......@@ -177,8 +157,7 @@
v-show="selectedZt == 'qsx'"
cellspacing="1"
cellpadding="1"
border="1"
>
border="1">
<tr>
<th>数据缺失项</th>
<th>套数</th>
......@@ -188,14 +167,11 @@
v-for="(item, index) in qsxList"
:key="index"
class="cp"
@click="handleChoosedH(item.bsms, item.color)"
>
@click="handleChoosedH(item.bsms, item.color)">
<td>
<i
class="fa fa-circle"
:style="{ backgroundColor: item.color }"
></i
>{{ item.name }}
:style="{ backgroundColor: item.color }"></i>{{ item.name }}
</td>
<td>{{ item.ts }}</td>
<td>0</td>
......@@ -216,7 +192,7 @@
</el-tab-pane>
</el-tabs>
</div>
</template>
</template>
<script>
import lpbContent from "./lpbContent/index";
......@@ -237,7 +213,7 @@
lpbContent,
selectZrzH,
},
data() {
data () {
return {
activeName: "first",
bsms: [],
......@@ -314,7 +290,7 @@
zrzList: [],
};
},
created() {
created () {
window.addEventListener("resize", this.getHeight);
this.getHeight();
let params = {
......@@ -327,7 +303,7 @@
}
});
},
mounted() {
mounted () {
//获取各项单元状态的户bsm
this.formData.onlyShow && this.getDyztBsmList();
//获取房屋用途统计数据
......@@ -358,7 +334,7 @@
* @description: 获取高度计算lpb内容区高度
* @author: renchao
*/
getHeight() {
getHeight () {
this.lpbContentHight = window.innerHeight - 226;
},
//图例的展开收起
......@@ -366,7 +342,7 @@
* @description: 图例的展开收起
* @author: renchao
*/
legendToggle() {
legendToggle () {
this.legendToggleFlag = !this.legendToggleFlag;
},
//切换房屋状态
......@@ -376,7 +352,7 @@
* @param {*} color
* @author: renchao
*/
handleChoosedH(bsms, color) {
handleChoosedH (bsms, color) {
this.$refs.lpbContent.changeChoosed(bsms, color);
},
//获取各项单元状态统计数据
......@@ -384,7 +360,7 @@
* @description: 获取各项单元状态统计数据
* @author: renchao
*/
getDyztBsmList() {
getDyztBsmList () {
getLpbTj(this.formData.bsm).then((res) => {
if (res.code === 200) {
this.dyztList = res.result;
......@@ -441,7 +417,7 @@
* @description: 获取房屋用途和房屋性质及缺失项统计数据
* @author: renchao
*/
getLpbFwytAndQlxz() {
getLpbFwytAndQlxz () {
getLpbFwytAndQlxz(this.formData.bsm).then((res) => {
if (res.code === 200) {
// this.fwytList = res.result
......@@ -488,19 +464,19 @@
},
},
computed: {},
destroyed() {
destroyed () {
window.removeEventListener("resize", this.getHeight);
},
watch: {
//树结构和图例伸缩时修改楼盘表主要内容区宽度
legendToggleFlag(n) {
legendToggleFlag (n) {
if (n) {
this.lpbContentwidth -= 204;
} else {
this.lpbContentwidth += 204;
}
},
selectedZt(n) {
selectedZt (n) {
this.legendToggleFlag = true;
},
},
......@@ -633,5 +609,5 @@
}
}
}
</style>
</style>
\ No newline at end of file
......
<!--
* @Description:
* @Autor: renchao
* @LastEditTime: 2024-01-29 13:29:56
* @LastEditTime: 2024-03-07 16:59:12
-->
<template>
<div class="from-clues">
......@@ -9,7 +9,7 @@
<div class="from-clues-header">
<el-form :model="queryForm" ref="queryForm" @submit.native.prevent label-width="70px">
<el-row>
<el-col :span="4">
<el-col :span="5">
<el-form-item label="权利类型" prop="qllx">
<el-select v-model="queryForm.qllx" filterable class="width100" clearable placeholder="请选择权利类型">
<el-option v-for="item in dictData['A8']" :key="item.dcode" :label="item.dname" :value="item.dcode">
......@@ -17,7 +17,7 @@
</el-select>
</el-form-item>
</el-col>
<el-col :span="4">
<el-col :span="5">
<el-form-item label="登记类型" prop="djlx">
<el-select v-model="queryForm.djlx" filterable class="width100" clearable placeholder="请选择登记类型">
<el-option v-for="item in dictData['A21']" :key="item.dcode" :label="item.dname" :value="item.dcode">
......@@ -36,13 +36,13 @@
</el-select>
</el-form-item>
</el-col>
<el-col :span="6">
<el-col :span="5">
<el-form-item label="不动产单元号" prop="bdcdyh" label-width="105px">
<el-input placeholder="请输入不动产单元号" maxlength="28" v-model.trim="queryForm.bdcdyh" clearable class="width100">
</el-input>
</el-form-item>
</el-col>
<el-col :span="6">
<el-col :span="5">
<el-form-item label="不动产权证号" prop="bdcqzh" label-width="105px">
<el-input placeholder="请输入不动产权证号" v-model.trim="queryForm.bdcqzh" clearable class="width100">
</el-input>
......@@ -57,25 +57,25 @@
</el-form-item>
</el-col>
<el-col :span="5">
<el-form-item label="坐落:" prop="zl" label-width="105px">
<el-input v-model.trim="queryForm.zl" placeholder="坐落" clearable class="width100">
</el-input>
</el-form-item>
</el-col>
<el-col :span="5">
<el-form-item label="权利人:" prop="qlrmc" label-width="105px">
<el-form-item label="权利人:" prop="qlrmc">
<el-input v-model.trim="queryForm.qlrmc" placeholder="权利人" clearable class="width100">
</el-input>
</el-form-item>
</el-col>
<el-col :span="5">
<el-col :span="4">
<el-form-item label="义务人:" prop="ywrmc">
<el-input v-model.trim="queryForm.ywrmc" placeholder="义务人" clearable class="width100">
</el-input>
</el-form-item>
</el-col>
<el-col :span="7">
<el-form-item label="坐落:" prop="zl" label-width="105px">
<el-input v-model.trim="queryForm.zl" placeholder="坐落" clearable class="width100">
</el-input>
</el-form-item>
</el-col>
<el-col :span="4" class="btnColRight">
<el-col :span="3" class="btnColRight">
<el-form-item>
<el-button @click="handleReset">重置</el-button>
<el-button type="primary" native-type="submit" @click="handleSearch">查询</el-button>
......@@ -139,7 +139,7 @@
qllxs: [],
isDialog: false,
djbxxData: {},
zrzbsm:""
zrzbsm: ""
}
},
computed: {
......@@ -190,12 +190,12 @@
* @author: renchao
*/
handleLpbClick (item) {
let params = {zdbsm:item.bsmZd};
let params = { zdbsm: item.bsmZd };
getZrzListByBsmSlsq(params).then((res) => {
if (res.code === 200) {
}
});
console.log("zrzbsm",item,item.zrzbsm);
console.log("zrzbsm", item, item.zrzbsm);
this.$popupDialog('楼盘表', 'lpb/index', {
bsm: item.zrzbsm,
zrzbsm: item.zrzbsm,
......