Skip to content

任超 / js.CadastralSystem

Go to a project
Toggle navigation
Toggle navigation pinning
0a51ce55 by weimo934
Options

Merge remote-tracking branch 'origin/master'

2 parents 0f35099c fe2bdbd0
Inline Side-by-side
Showing 14 changed files with 1235 additions and 544 deletions
......@@ -11,9 +11,18 @@ export function getLpbMenuTree (data) {
},
})
}
/**
* 新增幢单元接口信息
* 添加逻辑幢信息接口
*/
export function insertLjzInfo (data) {
return request({
url: '/system/qjLjz/insertQjLjz',
method: 'post',
data:data
})
}
/**
* 添加幢单元接口信息
*/
export function insertZdyInfo (data) {
return request({
......@@ -22,3 +31,13 @@ export function insertZdyInfo (data) {
data:data
})
}
/**
* 添加层户接口信息
*/
export function insertChInfo (data) {
return request({
url: 'fw/lpb/insertQjCH',
method: 'post',
data:data
})
}
\ No newline at end of file
......
......@@ -69,16 +69,6 @@ export function queryYzgy(id) {
params: {id}
})
}
/**
* 新增逻辑幢信息接口
*/
export function insertLjzInfo (data) {
return request({
url: '/system/qjLjz/insertQjLjz',
method: 'post',
data:data
})
}
/**
* 新增逻辑幢信息接口
......
.content_box {
padding: 18px;
padding-top: 0;
padding: 0 0 18px;
box-sizing: border-box;
width: 100%;
}
.el-table .success-row {
background:@tablebg;
......@@ -10,6 +10,7 @@
.main{
width: 100%;
height: 100%;
box-sizing: border-box;
padding: 18px 18px 0!important;
}
.pagination {
......@@ -49,3 +50,24 @@ ol, ul { list-style:none; }
font-style: normal;
color: red;
}
// 滚动条样式
::-webkit-scrollbar {
width: 6px;
}
::-webkit-scrollbar {
height: 6px;
}
::-webkit-scrollbar-thumb {
border-radius: 3px;
background: #cbcbcb;
}
::-webkit-scrollbar-thumb {
border-radius: 3px;
background: #cbcbcb;
}
::-webkit-scrollbar-track {
border-radius: 0;
}
::-webkit-scrollbar-track {
border-radius: 0;
}
\ No newline at end of file
......
......@@ -84,23 +84,11 @@ const constantRoutes = [
component: () => import("@/views/systemZD/index"),
},
{
path: "/ljz",
name: "逻辑幢",
code: "1-6",
component: () => import("@/views/systemZRZ/ljz/index"),
},
{
path: "/c",
name: "层",
code: "1-7",
component: () => import("@/views/systemZRZ/c/index"),
},
{
path: "/zdy",
name: "幢单元",
code: "1-8",
component: () => import("@/views/systemZRZ/lpb/zdy/index"),
},
],
},
];
......
......@@ -39,7 +39,8 @@ const store = new Vuex.Store({
zrzbsm: '',
zjlxList: [],
gyfsList: [],
hbsm:''
hbsm:'',
contentWidth:'' //内容区域宽度
},
modules: {
user,
......
......@@ -109,7 +109,6 @@
},
//点击办理
handleClick(row) {
debugger;
console.log('fwsxbg');
console.log(row);
var bsm = row.glbsm;
......
......@@ -149,7 +149,7 @@ export default {
}
.notice {
flex: auto;
padding: 0 18px;
padding: 0;
box-sizing: border-box;
.el-card__body {
......
<template>
<div class="content_box">
<div ref="lpb" class="content_box">
<el-tabs v-model="activeName" @tab-click="handleClick">
<el-tab-pane label="自然幢信息" name="zrzxx"><zrzxx></zrzxx></el-tab-pane>
<el-tab-pane label="业主共有" name="yzgy"><yzgy></yzgy></el-tab-pane>
......@@ -33,13 +33,17 @@ export default {
},
},
created() {},
mounted() {},
mounted() {
this.$store.state.contentWidth = this.$refs.lpb.offsetWidth - 40;
},
computed: {},
watch: {},
};
</script>
<style scoped lang="less">
.content_box{
box-sizing: border-box;
padding: 0 20px;
.el-tabs{
width: 100%;
height: 100%;
......
<template>
<div class="h content-form">
<el-form ref="form" :model="form" label-width="160px">
<table border="1" width="100%" cellspacing="0" cellpadding="0" class="hTable">
<tbody>
<tr height="30">
<td colspan="12" align="center" ><font size="4">逻辑幢基本信息</font></td>
</tr>
<tr height="30">
<td colspan="2" align="center" >逻辑幢号</td>
<td colspan="4" >
<el-input v-model="form.ljzh"></el-input>
</td>
<td colspan="2" align="center" >自然幢号</td>
<td colspan="4" >
<el-input v-model="form.zrzh"></el-input>
</td>
</tr>
<tr height="30">
<td colspan="2" align="center" >逻辑幢名称</td>
<td colspan="4" >
<el-input v-model="form.ljzmc"></el-input>
</td>
<td colspan="2" align="center" >不动产单元号</td>
<td colspan="4" >
<el-input v-model="form.bdcdyh" style="width: 70%"></el-input>
<el-button @click.prevent="" size="mini" type="primary" style="width:25%;margin-left:3%">生成</el-button>
</td>
</tr>
<tr height="30">
<td colspan="2" align="center" >门牌号</td>
<td colspan="4" >
<el-input v-model="form.mph"></el-input>
</td>
<td colspan="2" align="center" >竣工日期</td>
<td colspan="4" >
<el-date-picker
v-model="form.jgrq"
type="date"
value-format="yyyy-MM-dd"
placeholder="选择日期">
</el-date-picker>
</td>
</tr>
<tr height="30">
<td colspan="2" align="center" >预测建筑面积(㎡)</td>
<td colspan="4" >
<el-input v-model="form.ycjzmj"></el-input>
</td>
<td colspan="2" align="center" >实测建筑面积(㎡)</td>
<td colspan="4" >
<el-input v-model="form.scjzmj"></el-input>
</td>
</tr>
<tr height="30">
<td colspan="2" align="center" >预测地下面积(㎡)</td>
<td colspan="4" >
<el-input v-model="form.ycdxmj"></el-input>
</td>
<td colspan="2" align="center" >实测地下面积(㎡)</td>
<td colspan="4" >
<el-input v-model="form.scdxmj"></el-input>
</td>
</tr>
<tr height="30">
<td colspan="2" align="center" >预测其他面积(㎡)</td>
<td colspan="4" >
<el-input v-model="form.ycqtmj"></el-input>
</td>
<td colspan="2" align="center" >实测其他面积(㎡)</td>
<td colspan="4" >
<el-input v-model="form.scqymj"></el-input>
</td>
</tr>
<tr height="30" v-for="(item1,index) in form.ytList" :key="'yt'+index">
<td colspan="2" v-if="index===0" :rowspan="ytTitleRowspan" align="center" >
<el-button type="primary" size="mini" style="margin-right: 10px" @click="addYtInfo">添加</el-button>
<span>用途</span>
</td>
<td colspan="1" align="center" >
<span @click="deleteYtInfo(index)">删除</span>
</td>
<td colspan="9" >
<el-select v-model="item1.fwytzdbsm" placeholder="请选择" >
<el-option
v-for="item in $store.state.tdytList"
:key="item.bsm"
:label="item.mc"
:value="item.bsm">
</el-option>
</el-select>
</td>
</tr>
<tr height="30" v-for="(item1,index) in form.fwjgList" :key="'jg'+index">
<td colspan="2" v-if="index===0" :rowspan="fwjgTitleRowspan" align="center" >
<el-button type="primary" size="mini" style="margin-right: 10px" @click="addFwjgInfo">添加</el-button>
<span>房屋结构</span>
</td>
<td colspan="1" align="center" >
<span @click="deleteFwjgInfo(index)">删除</span>
</td>
<td colspan="9" >
<el-select v-model="item1.fwjgzdbsm" placeholder="请选择" >
<el-option
v-for="item in $store.state.jgOptions"
:key="item.bsm"
:label="item.mc"
:value="item.bsm">
</el-option>
</el-select>
</td>
</tr>
<tr height="30">
<td colspan="2" align="center" >地下层数</td>
<td colspan="4" >
<el-input v-model="form.dxcs"></el-input>
</td>
<td colspan="2" align="center" >地上层数</td>
<td colspan="4" >
<el-input v-model="form.dscs"></el-input>
</td>
</tr>
<tr height="30">
<td colspan="2" align="center" >总层数</td>
<td colspan="4" >
<el-input v-model="form.zcs"></el-input>
</td>
<td colspan="2" align="center" >建筑物状态</td>
<td colspan="4" >
<el-input v-model="form.jzwzt"></el-input>
</td>
</tr>
<tr height="30">
<td colspan="2" rowspan="2" align="center" >
<span>备注</span>
</td>
<td colspan="10" rowspan="2" >
<el-input v-model="form.bz" type="textarea"></el-input>
</td>
</tr>
<tr height="30">
</tr>
</tbody>
</table>
</el-form>
</div>
</template>
<script>
import {insertLjzInfo} from "../../../api/zrz";
import {formdate} from "../../../libs/function";
export default {
name:'ljz',
components:{},
data () {
return {
form:{
zrzbsm:'',
ljzh:'', //逻辑幢号
zrzh:'', //自然幢号
ljzmc:'', //逻辑幢顺序号
bdcdyh:'', //不动产单元号
mph:'', //门牌号
jgrq:'', //竣工日期
ycjzmj:'', //预测建筑面积
scjzmj:'', //实测建筑面积
ycdxmj:'', //预测地下面积
scdxmj:'', //实测地下面积
ycqtmj:'', //预测其他面积
scqymj:'', //实测其他面积
ytList:[{
glbsm:'', //关联标识码
fwytzdbsm:'', //房屋用途字典标识码
sx:'', //顺序
}],
fwjgList:[{
fwjgzdbsm:'', //房屋结构字典标识码
glbsm:'', //关联标识码
sx:'', //顺序
}],
dxcs:'', //地下层数
dscs:'', //地上层数
zcs:'', //总层数
jzwzt:'', //建筑物状态
},
value: '',
ytTitleRowspan:1, //用途的单元格垂直合并数量
fwjgTitleRowspan:1, //房屋结构的单元格垂直合并数量
}
},
methods: {
addYtInfo(){
this.form.ytList.push({
glbsm:'',
fwytzdbsm:'',
sx:'',
});
this.ytTitleRowspan=this.form.ytList.length;
},
deleteYtInfo(index){
if(this.form.ytList.length<=1){
this.$message({
message: '不能删除，最少含有一条用途信息',
type: 'warning'
});
}else{
this.form.ytList.splice(index,1);
this.ytTitleRowspan=this.form.ytList.length;
}
},
addFwjgInfo(){
this.form.fwjgList.push({
fwjgzdbsm:'', //房屋结构字典标识码
glbsm:'', //关联标识码
sx:'', //顺序
});
this.fwjgTitleRowspan=this.form.fwjgList.length;
},
//重置数据
reset(){
this.form = {
zrzbsm:'',
ljzh:'', //逻辑幢号
zrzh:'', //自然幢号
ljzmc:'', //逻辑幢顺序号
bdcdyh:'', //不动产单元号
mph:'', //门牌号
jgrq:'', //竣工日期
ycjzmj:'', //预测建筑面积
scjzmj:'', //实测建筑面积
ycdxmj:'', //预测地下面积
scdxmj:'', //实测地下面积
ycqtmj:'', //预测其他面积
scqymj:'', //实测其他面积
ytList:[{
glbsm:'', //关联标识码
fwytzdbsm:'', //房屋用途字典标识码
sx:'', //顺序
}],
fwjgList:[{
fwjgzdbsm:'', //房屋结构字典标识码
glbsm:'', //关联标识码
sx:'', //顺序
}],
dxcs:'', //地下层数
dscs:'', //地上层数
zcs:'', //总层数
jzwzt:'', //建筑物状态
}
},
deleteFwjgInfo(index){
if(this.form.fwjgList.length<=1){
this.$message({
message: '不能删除，最少含有一条房屋结构信息',
type: 'warning'
});
}else{
this.form.fwjgList.splice(index,1);
this.fwjgTitleRowspan=this.form.fwjgList.length;
}
},
onSave(data,bsm){
//自然幢标识码
this.form.zrzbsm= bsm;
insertLjzInfo(this.form).then((res)=>{
if(res.code===200){
this.$message.success("保存成功")
//更新树结构数据
console.log(this);
this.$parent.$parent.getLpbMenuTree(bsm);
//关闭弹框
this.$parent.$parent.closeDaialog()
}
})
},
onSubmit(){
console.log(this.form)
}
},
created() {
},
mounted() {
}
}
</script>
<style rel="stylesheet/less" lang="less" scoped>
.h {
min-height: 200px;
width: 100%;
margin: 0 auto;
/deep/.el-input__inner{
width: 100%;
border: 0;
}
/deep/textarea{
width: 100%;
border: 0;
}
.el-form-item{
font-weight: bold;
font-size: xx-large
}
table{
background: #fff;
table-layout: fixed;
}
td{
//bgcolor:#F1F4FC;
background-color:#fff;
width:8.33%
}
.el-select{
display:block;
}
}
table{
font-size: 14px;
}
.hTable{
margin-top: 10px;
}
</style>
\ No newline at end of file
<template>
<div class="addCh">
<el-table class="addChTable" :data="tableData" style="width: 100%" border>
<el-table-column prop="cz" width="40" align="center">
<template slot-scope="scope">
<span class="cp" @click="handleRowClick(scope.row, scope.$index)">{{
scope.row.cz
}}</span>
</template>
</el-table-column>
<el-table-column prop="ljzmc" label="逻辑幢" align="center">
<!-- <template slot-scope="scope">
<el-input size="small" v-model="scope.row.ljzbsm"></el-input>
</template> -->
</el-table-column>
<el-table-column prop="zdymc" label="幢单元" align="center">
<!-- <template slot-scope="scope">
<el-input size="small" v-model="scope.row.zdybsm"></el-input>
</template> -->
</el-table-column>
<el-table-column prop="qsc" label="起始层" align="center">
<template slot-scope="scope">
<el-input size="small" v-model="scope.row.qsc"></el-input>
</template>
</el-table-column>
<el-table-column prop="jsc" label="结束层" align="center">
<template slot-scope="scope">
<el-input size="small" v-model="scope.row.jsc"></el-input>
</template>
</el-table-column>
<el-table-column prop="mchs" label="每层户数" align="center">
<template slot-scope="scope">
<el-input size="small" v-model="scope.row.mchs"></el-input>
</template>
</el-table-column>
</el-table>
</div>
</template>
<script>
import { insertChInfo } from "../../../../../api/lpb";
export default {
name: "",
components: {},
props: {
treeData: {},
dialogVisible: {
type: Boolean,
default: false,
},
},
data() {
return {
ljzBsm: null,
zdyBsm: null,
zrzBsm: null,
tableData: [],
formData: {
cz: "+",
ljzbsm: "",
ljzmc:"",
zdymc:"",
zdybsm: "",
zrzbsm: "",
syclx: "0",
qsc: "",
jsc: "",
hs: "",
},
};
},
created() {},
mounted() {
console.log(this.treeData, "treeData");
},
methods: {
//行操作
handleRowClick(row, index) {
console.log(this.tableData, "this.tableData");
console.log(this.formData, "this.formData");
console.log(index);
if (row.cz == "+") {
let temp = JSON.parse(JSON.stringify(this.formData));
temp.cz = "-";
this.tableData.push(temp);
} else {
this.tableData.splice(index, 1);
}
},
onSave(bsm) {
insertChInfo(this.tableData).then((res) => {
if (res.code === 200) {
this.$message.success("保存成功");
//更新树结构数据
console.log(this);
this.$parent.$parent.getLpbMenuTree(bsm);
//关闭弹框
this.$parent.$parent.closeDaialog();
}
});
},
//重置数据
reset() {
this.tableData = [
{
cz: "+",
ljzbsm: "",
zdybsm: "",
qsc: "",
jsc: "",
mchs: "",
},
];
},
},
computed: {},
watch: {
treeData: {
handler(n) {
this.formData = {
cz: "+",
ljzbsm: "",
zdybsm: "",
zrzbsm: "",
syclx: "0",
qsc: "",
jsc: "",
hs: "",
};
switch (n.type) {
case "zrz":
this.formData.zrzbsm = n.bsm;
break;
case "ljz":
this.formData.zrzbsm = n.zrzbsm;
this.formData.ljzbsm = n.bsm;
this.formData.ljzmc = n.ljzmc;
break;
case "zdy":
this.formData.zrzbsm = n.zrzbsm;
this.formData.ljzbsm = n.ljzbsm;
this.formData.ljzmc = n.ljzmc;
this.formData.zdybsm = n.bsm;
this.formData.zdymc = n.mc;
break;
default:
break;
}
this.tableData = [];
this.tableData.push(this.formData);
},
//深度监听，第一次接收到父组件传值就触发事件
immediate: true,
deep: true,
},
// dialogVisible(n){
// this.tableData = [];
// if(n){
// this.tableData.push(this.formData);
// }
// }
},
};
</script>
<style lang="less">
.addCh {
.addChTable {
.el-input__inner {
height: 20px;
margin: 0;
line-height: 20px;
outline: none;
border: none;
color: #606764;
overflow: visible;
cursor: text;
text-align: center;
}
}
.cp {
cursor: pointer;
}
}
</style>
......@@ -3,13 +3,23 @@
<div class="tab-header">
<div class="searchContent">
<el-radio-group v-model="radio1">
<el-radio-button class="radioBtn" label="1" border>实测</el-radio-button>
<el-radio-button class="radioBtn" label="2" border>预测</el-radio-button>
<el-radio-button class="radioBtn" label="1" border
>实测</el-radio-button
>
<el-radio-button class="radioBtn" label="2" border
>预测</el-radio-button
>
</el-radio-group>
<el-input v-model="bdcdyh" class="searchInput" placeholder="输入不动产单元号"></el-input>
<el-input
v-model="bdcdyh"
class="searchInput"
placeholder="输入不动产单元号"
></el-input>
</div>
<div>
<el-button class="radioBtn" label="1" @click="create" border>创建楼盘</el-button>
<el-button class="radioBtn" label="1" @click="create" border
>创建楼盘</el-button
>
<el-button class="radioBtn" label="2" border>实预测转换</el-button>
<el-button class="radioBtn" label="3" border>批量户</el-button>
<el-button class="radioBtn" label="4" border>批量层</el-button>
......@@ -18,14 +28,26 @@
<el-button class="radioBtn" label="7" border>批量单元号</el-button>
</div>
</div>
<div class="tab-content" :style="{'height':lpbContentHight+'px'}">
<div class="lp-tree" :class="createFlag ? 'w260':'w0'">
<LineTree :pd="pd" class="treeData" :islpb = "islpb" ></LineTree>
<p @click="createFlag = false" style="width:20px;float:left;cursor:pointer;">X</p>
<div
class="tab-content"
ref="tabContent"
:style="{ height: lpbContentHight + 'px' }"
>
<!-- 左侧树结构 -->
<div class="lp-tree" :class="createFlag ? 'w260' : 'w0'">
<LineTree :pd="pd" class="treeData" :islpb="islpb"></LineTree>
<p
@click="createFlag = false"
style="width:20px;float:left;margin-top: 12px;margin-left:10px;cursor:pointer;"
>
X
</p>
</div>
<div class="lp-overview">
楼盘单元格
<!-- 楼盘表主体 -->
<div class="lp-overview" :style="{ width: lpbContentwidth + 'px' }">
<lpbContent></lpbContent>
</div>
<!-- 右侧图例 -->
<div class="lp-legend">
<div class="handleCol">
<div class="btn" @click="legendToggle">
......@@ -42,43 +64,46 @@
<span>房屋用途</span>
</div>
</div>
<div class="legendTable-wrap" :style="{'width':legendToggleFlag ? '204px' : '0'}">
<div
class="legendTable-wrap"
:style="{ width: legendToggleFlag ? '204px' : '0' }"
>
<table class="legendTable" cellspacing="1" cellpadding="1" border="1">
<tr>
<th>状态</th>
<th>套数</th>
<th>面积</th>
</tr>
<tr v-for="(item,index) in legendList" :key="index">
<td><i class="el-icon-star-on" :style="{'color':item.color}"></i>{{item.name}}</td>
<td>{{item.ts}}</td>
<td>{{item.mj}}</td>
<tr v-for="(item, index) in legendList" :key="index">
<td>
<i class="el-icon-star-on" :style="{ color: item.color }"></i
>{{ item.name }}
</td>
<td>{{ item.ts }}</td>
<td>{{ item.mj }}</td>
</tr>
</table>
</div>
</div>
</div>
<el-dialog
title="添加"
:visible.sync="dialogVisible"
width="50%"
center
>
<el-dialog title="添加" :visible.sync="dialogVisible" width="50%" center>
<!-- 根据菜单类型（menuType）和右键点击的楼盘类型（treeData.type）来区分弹框内容 -->
<div class="addCh" v-show="menuType == 'ljz'">
<addLjz ref="ljz"></addLjz>
</div>
<div class="addCh" v-show="menuType == 'zdy'">
幢单元
<addZdy ref="zdy"></addZdy>
</div>
<div class="addCh" v-show="menuType == 'ch'">
层户
<addCh ref="ch" :dialogVisible="dialogVisible" :treeData="treeData"></addCh>
</div>
<div class="btnGroup">
<el-button type="primary" @click="saveInfo">保存</el-button>
<el-button type="primary" @click="resetInfo">重置</el-button>
<el-button type="primary" @click="dialogVisible = false">取消</el-button>
<el-button type="primary" @click="dialogVisible = false"
>取消</el-button
>
</div>
</el-dialog>
</div>
......@@ -86,107 +111,115 @@
<script>
import LineTree from "../../../../components/lineTree/lineTree";
import addLjz from "../../ljz/index"
import {getLpbMenuTree} from "../../../../api/lpb"
import addLjz from "./ljz/index";
import addZdy from "./zdy/index";
import addCh from "./ch/index";
import lpbContent from "./lpbContent/index";
import { getLpbMenuTree } from "../../../../api/lpb";
export default {
name:"",
components:{LineTree,addLjz},
props:{},
data(){
name: "",
components: { LineTree, addLjz, addZdy, addCh, lpbContent },
props: {},
data() {
return {
radio1:'',
radio2:'',
createFlag:false,
bdcdyh:'',
islpb:true,
pd:[], //创建楼盘的树结构数据
dialogVisible:false,
menuType:'',
treeData:{},
legendList:[
radio1: "",
radio2: "",
createFlag: false,
bdcdyh: "",
islpb: true,
pd: [], //创建楼盘的树结构数据
dialogVisible: false,
menuType: "",
treeData: {},
legendList: [
{
name:'未确权',
color:'#2591FD',
ts:'12',
mj:'1633'
name: "未确权",
color: "#2591FD",
ts: "12",
mj: "1633",
},
{
name:'已确权',
color:'#2591FD',
ts:'22',
mj:'3109'
name: "已确权",
color: "#2591FD",
ts: "22",
mj: "3109",
},
{
name:'已注销',
color:'#2591FD',
ts:'13',
mj:'1457'
name: "已注销",
color: "#2591FD",
ts: "13",
mj: "1457",
},
{
name:'已备案',
color:'#2591FD',
ts:'3',
mj:'409'
name: "已备案",
color: "#2591FD",
ts: "3",
mj: "409",
},
{
name:'预抵押',
color:'#2591FD',
ts:'11',
mj:'1466'
name: "预抵押",
color: "#2591FD",
ts: "11",
mj: "1466",
},
{
name:'在建抵押',
color:'#2591FD',
ts:'13',
mj:'1792'
name: "在建抵押",
color: "#2591FD",
ts: "13",
mj: "1792",
},
{
name:'抵押',
color:'#2591FD',
ts:'14',
mj:'13'
name: "抵押",
color: "#2591FD",
ts: "14",
mj: "13",
},
{
name:'查封',
color:'#2591FD',
ts:'9',
mj:'1436'
name: "查封",
color: "#2591FD",
ts: "9",
mj: "1436",
},
{
name:'异议',
color:'#2591FD',
ts:'34',
mj:'4342'
name: "异议",
color: "#2591FD",
ts: "34",
mj: "4342",
},
{
name:'限制',
color:'#2591FD',
ts:'2',
mj:'285'
name: "限制",
color: "#2591FD",
ts: "2",
mj: "285",
},
],
legendToggleFlag:false,
lpbContentHight:''
}
legendToggleFlag: false,
lpbContentHight: "",
lpbContentwidth: "",
};
},
created(){
window.addEventListener('resize', this.getHeight);
this.getHeight()
created() {
window.addEventListener("resize", this.getHeight);
this.getHeight();
},
mounted(){
this.getLpbMenuTree('d1b82b27f2a6ab7bf3f0e7708c96e46f')
mounted() {
this.getLpbMenuTree("1e0c83dfe2e73284f834a80a0947f0c9");
// 楼盘表绘制区域宽度计算：楼盘表区域宽度-图例宽度34-滚动条宽度6
setTimeout(() => {
this.lpbContentwidth = this.$store.state.contentWidth - 34 - 6;
}, 100);
},
methods:{
methods: {
//获取高度计算lpb内容区高度
getHeight(){
this.lpbContentHight = window.innerHeight - 340
getHeight() {
this.lpbContentHight = window.innerHeight - 340;
},
//创建楼盘
create(){
this.createFlag = true
create() {
this.createFlag = true;
},
//获取自然幢树结构数据
getLpbMenuTree(zrzbsm){
getLpbMenuTree(zrzbsm) {
getLpbMenuTree(zrzbsm)
.then((res) => {
this.pd = res.result;
......@@ -194,40 +227,39 @@ export default {
.catch((error) => {});
},
//打开新建楼盘树结构右键菜单唤起的弹框
openLpbDialog(data,type){
console.log(data,'data');
openLpbDialog(data, type) {
console.log(data, "data");
this.treeData = data;
this.menuType = type;
this.dialogVisible = true
this.dialogVisible = true;
},
//弹框中的保存按钮
saveInfo(){
saveInfo() {
switch (this.menuType) {
case 'ljz':
this.$refs.ljz.onSave(this.$refs.ljz.form,this.treeData.bsm)
case "ljz":
this.$refs.ljz.onSave(this.$refs.ljz.form, this.treeData.bsm);
break;
case 'zdy':
case "zdy":
this.$refs.zdy.submitForm("form", this.pd[0].bsm, this.treeData.bsm);
break;
case 'ch':
case "ch":
this.$refs.ch.onSave(this.pd[0].bsm);
break;
default:
break;
}
},
//弹框中的重置按钮
resetInfo(){
resetInfo() {
switch (this.menuType) {
case 'ljz':
this.$refs.ljz.reset()
case "ljz":
this.$refs.ljz.reset();
break;
case 'zdy':
case "zdy":
this.$refs.zdy.reset();
break;
case 'ch':
case "ch":
this.$refs.ch.reset();
break;
default:
......@@ -235,98 +267,117 @@ export default {
}
},
//关闭弹框
closeDaialog(){
this.dialogVisible = false
closeDaialog() {
this.dialogVisible = false;
},
//图例的展开收起
legendToggle(){
legendToggle() {
this.legendToggleFlag = !this.legendToggleFlag;
}
},
computed: {},
destroyed(){
window.removeEventListener('resize', this.getHeight)
},
computed: {
},
destroyed() {
window.removeEventListener("resize", this.getHeight);
},
watch: {
legendToggleFlag(n) {
if (n) {
this.lpbContentwidth -= 204;
} else {
this.lpbContentwidth += 204;
}
},
}
createFlag(n) {
if (n) {
this.lpbContentwidth -= 260;
} else {
this.lpbContentwidth += 260;
}
},
},
};
</script>
<style scoped lang="less">
.edit{
.edit {
height: 100%;
background-color: #EAEDF5;
.tab-header{
border: 1px solid #DEDEDE;
background-color: #eaedf5;
.tab-header {
border: 1px solid #dedede;
border-top: 0;
box-sizing: border-box;
padding: 20px 0;
background-color: #ffffff;
margin-bottom: 20px;
.searchContent{
.searchContent {
margin-bottom: 20px;
.searchInput{
.searchInput {
width: 300px;
margin-left: 20px;
display: inline-block;
}
}
.radioBtn{
.radioBtn {
margin-left: 20px;
/deep/.el-radio-button__inner{
border: 1px solid #DCDFE6;
border-radius:4px;
box-shadow: 0 0 0 0 #409EFF!important;
/deep/.el-radio-button__inner {
border: 1px solid #dcdfe6;
border-radius: 4px;
box-shadow: 0 0 0 0 #409eff !important;
}
}
}
.tab-content{
.tab-content {
background-color: #ffffff;
display: flex;
overflow-y: scroll;
.lp-tree{
.lp-tree {
height: 100%;
overflow: hidden;
transition: .5s;
.treeData{
transition: 0.5s;
.treeData {
margin-top: 20px;
margin-left: 20px;
float: left;
}
}
.w0{
.w0 {
width: 0;
}
.w260{
.w260 {
width: 260px;
}
.lp-overview{
.lp-overview {
transition: 0.5s;
flex: 1;
}
.lp-legend{
transition: .5s;
.lp-legend {
transition: 0.5s;
height: 100%;
font-size: 14px;
.handleCol{
.handleCol {
width: 34px;
float: right;
height: 100%;
.btn{
.btn {
cursor: pointer;
height: 40px;
line-height: 40px;
text-align: center;
border-bottom: 1px solid #E6E6E6 ;
border-bottom: 1px solid #e6e6e6;
}
.dyzt{
.dyzt {
height: 81px;
line-height: 81px;
}
.fwxz,.fwyt{
.fwxz,
.fwyt {
height: 122px;
}
.dyzt,.fwxz,.fwyt{
border-bottom: 1px solid #E6E6E6 ;
span{
.dyzt,
.fwxz,
.fwyt {
border-bottom: 1px solid #e6e6e6;
span {
text-align: center;
height: 100%;
-webkit-writing-mode: vertical-rl;
......@@ -336,19 +387,19 @@ export default {
}
}
}
.legendTable-wrap{
transition: .5s;
.legendTable-wrap {
transition: 0.5s;
float: right;
overflow: hidden;
.legendTable{
.legendTable {
margin-top: -1px;
tr{
tr {
height: 40px;
line-height: 40px;
th:first-child{
th:first-child {
width: 80px;
}
th{
th {
width: 60px;
height: 40px;
white-space: nowrap;
......@@ -358,7 +409,7 @@ export default {
text-align: center;
white-space: nowrap;
}
td:first-child{
td:first-child {
text-align: left;
text-indent: 2px;
}
......@@ -367,7 +418,7 @@ export default {
}
}
}
.btnGroup{
.btnGroup {
margin: 20px auto 0;
width: 230px;
}
......
<template>
<div class="h content-form">
<el-form ref="form" :model="form" label-width="160px">
<table
border="1"
width="100%"
cellspacing="0"
cellpadding="0"
class="hTable"
>
<tbody>
<tr height="30">
<td colspan="12" align="center">
<font size="4">逻辑幢基本信息</font>
</td>
</tr>
<tr height="30">
<td colspan="2" align="center">逻辑幢号</td>
<td colspan="4">
<el-input v-model="form.ljzh"></el-input>
</td>
<td colspan="2" align="center">自然幢号</td>
<td colspan="4">
<el-input v-model="form.zrzh"></el-input>
</td>
</tr>
<tr height="30">
<td colspan="2" align="center">逻辑幢名称</td>
<td colspan="4">
<el-input v-model="form.ljzmc"></el-input>
</td>
<td colspan="2" align="center">不动产单元号</td>
<td colspan="4">
<el-input v-model="form.bdcdyh" style="width: 70%"></el-input>
<el-button
@click.prevent=""
size="mini"
type="primary"
style="width:25%;margin-left:3%"
>生成</el-button
>
</td>
</tr>
<tr height="30">
<td colspan="2" align="center">门牌号</td>
<td colspan="4">
<el-input v-model="form.mph"></el-input>
</td>
<td colspan="2" align="center">竣工日期</td>
<td colspan="4">
<el-date-picker
v-model="form.jgrq"
type="date"
value-format="yyyy-MM-dd"
placeholder="选择日期"
>
</el-date-picker>
</td>
</tr>
<tr height="30">
<td colspan="2" align="center">预测建筑面积(㎡)</td>
<td colspan="4">
<el-input v-model="form.ycjzmj"></el-input>
</td>
<td colspan="2" align="center">实测建筑面积(㎡)</td>
<td colspan="4">
<el-input v-model="form.scjzmj"></el-input>
</td>
</tr>
<tr height="30">
<td colspan="2" align="center">预测地下面积(㎡)</td>
<td colspan="4">
<el-input v-model="form.ycdxmj"></el-input>
</td>
<td colspan="2" align="center">实测地下面积(㎡)</td>
<td colspan="4">
<el-input v-model="form.scdxmj"></el-input>
</td>
</tr>
<tr height="30">
<td colspan="2" align="center">预测其他面积(㎡)</td>
<td colspan="4">
<el-input v-model="form.ycqtmj"></el-input>
</td>
<td colspan="2" align="center">实测其他面积(㎡)</td>
<td colspan="4">
<el-input v-model="form.scqymj"></el-input>
</td>
</tr>
<tr
height="30"
v-for="(item1, index) in form.ytList"
:key="'yt' + index"
>
<td
colspan="2"
v-if="index === 0"
:rowspan="ytTitleRowspan"
align="center"
>
<el-button
type="primary"
size="mini"
style="margin-right: 10px"
@click="addYtInfo"
>添加</el-button
>
<span>用途</span>
</td>
<td colspan="1" align="center">
<span @click="deleteYtInfo(index)">删除</span>
</td>
<td colspan="9">
<el-select v-model="item1.fwytzdbsm" placeholder="请选择">
<el-option
v-for="item in $store.state.tdytList"
:key="item.bsm"
:label="item.mc"
:value="item.bsm"
>
</el-option>
</el-select>
</td>
</tr>
<tr
height="30"
v-for="(item1, index) in form.fwjgList"
:key="'jg' + index"
>
<td
colspan="2"
v-if="index === 0"
:rowspan="fwjgTitleRowspan"
align="center"
>
<el-button
type="primary"
size="mini"
style="margin-right: 10px"
@click="addFwjgInfo"
>添加</el-button
>
<span>房屋结构</span>
</td>
<td colspan="1" align="center">
<span @click="deleteFwjgInfo(index)">删除</span>
</td>
<td colspan="9">
<el-select v-model="item1.fwjgzdbsm" placeholder="请选择">
<el-option
v-for="item in $store.state.jgOptions"
:key="item.bsm"
:label="item.mc"
:value="item.bsm"
>
</el-option>
</el-select>
</td>
</tr>
<tr height="30">
<td colspan="2" align="center">地下层数</td>
<td colspan="4">
<el-input v-model="form.dxcs"></el-input>
</td>
<td colspan="2" align="center">地上层数</td>
<td colspan="4">
<el-input v-model="form.dscs"></el-input>
</td>
</tr>
<tr height="30">
<td colspan="2" align="center">总层数</td>
<td colspan="4">
<el-input v-model="form.zcs"></el-input>
</td>
<td colspan="2" align="center">建筑物状态</td>
<td colspan="4">
<el-input v-model="form.jzwzt"></el-input>
</td>
</tr>
<tr height="30">
<td colspan="2" rowspan="2" align="center">
<span>备注</span>
</td>
<td colspan="10" rowspan="2">
<el-input v-model="form.bz" type="textarea"></el-input>
</td>
</tr>
<tr height="30"></tr>
</tbody>
</table>
</el-form>
</div>
</template>
<script>
import { insertLjzInfo } from "../../../../../api/lpb";
import { formdate } from "../../../../../libs/function";
export default {
name: "ljz",
components: {},
data() {
return {
form: {
zrzbsm: "",
ljzh: "", //逻辑幢号
zrzh: "", //自然幢号
ljzmc: "", //逻辑幢顺序号
bdcdyh: "", //不动产单元号
mph: "", //门牌号
jgrq: "", //竣工日期
ycjzmj: "", //预测建筑面积
scjzmj: "", //实测建筑面积
ycdxmj: "", //预测地下面积
scdxmj: "", //实测地下面积
ycqtmj: "", //预测其他面积
scqymj: "", //实测其他面积
ytList: [
{
glbsm: "", //关联标识码
fwytzdbsm: "", //房屋用途字典标识码
sx: "", //顺序
},
],
fwjgList: [
{
fwjgzdbsm: "", //房屋结构字典标识码
glbsm: "", //关联标识码
sx: "", //顺序
},
],
dxcs: "", //地下层数
dscs: "", //地上层数
zcs: "", //总层数
jzwzt: "", //建筑物状态
},
value: "",
ytTitleRowspan: 1, //用途的单元格垂直合并数量
fwjgTitleRowspan: 1, //房屋结构的单元格垂直合并数量
};
},
methods: {
addYtInfo() {
this.form.ytList.push({
glbsm: "",
fwytzdbsm: "",
sx: "",
});
this.ytTitleRowspan = this.form.ytList.length;
},
deleteYtInfo(index) {
if (this.form.ytList.length <= 1) {
this.$message({
message: "不能删除，最少含有一条用途信息",
type: "warning",
});
} else {
this.form.ytList.splice(index, 1);
this.ytTitleRowspan = this.form.ytList.length;
}
},
addFwjgInfo() {
this.form.fwjgList.push({
fwjgzdbsm: "", //房屋结构字典标识码
glbsm: "", //关联标识码
sx: "", //顺序
});
this.fwjgTitleRowspan = this.form.fwjgList.length;
},
//重置数据
reset() {
this.form = {
zrzbsm: "",
ljzh: "", //逻辑幢号
zrzh: "", //自然幢号
ljzmc: "", //逻辑幢顺序号
bdcdyh: "", //不动产单元号
mph: "", //门牌号
jgrq: "", //竣工日期
ycjzmj: "", //预测建筑面积
scjzmj: "", //实测建筑面积
ycdxmj: "", //预测地下面积
scdxmj: "", //实测地下面积
ycqtmj: "", //预测其他面积
scqymj: "", //实测其他面积
ytList: [
{
glbsm: "", //关联标识码
fwytzdbsm: "", //房屋用途字典标识码
sx: "", //顺序
},
],
fwjgList: [
{
fwjgzdbsm: "", //房屋结构字典标识码
glbsm: "", //关联标识码
sx: "", //顺序
},
],
dxcs: "", //地下层数
dscs: "", //地上层数
zcs: "", //总层数
jzwzt: "", //建筑物状态
};
},
deleteFwjgInfo(index) {
if (this.form.fwjgList.length <= 1) {
this.$message({
message: "不能删除，最少含有一条房屋结构信息",
type: "warning",
});
} else {
this.form.fwjgList.splice(index, 1);
this.fwjgTitleRowspan = this.form.fwjgList.length;
}
},
onSave(data, bsm) {
debugger
//自然幢标识码
this.form.zrzbsm = bsm;
insertLjzInfo(this.form).then((res) => {
if (res.code === 200) {
this.$message.success("保存成功");
//更新树结构数据
console.log(this);
this.$parent.$parent.getLpbMenuTree(bsm);
//关闭弹框
this.$parent.$parent.closeDaialog();
}
});
},
onSubmit() {
console.log(this.form);
},
},
created() {},
mounted() {},
};
</script>
<style rel="stylesheet/less" lang="less" scoped>
.h {
min-height: 200px;
width: 100%;
margin: 0 auto;
/deep/.el-input__inner {
width: 100%;
border: 0;
}
/deep/textarea {
width: 100%;
border: 0;
}
.el-form-item {
font-weight: bold;
font-size: xx-large;
}
table {
background: #fff;
table-layout: fixed;
}
td {
//bgcolor:#F1F4FC;
background-color: #fff;
width: 8.33%;
}
.el-select {
display: block;
}
}
table {
font-size: 14px;
}
.hTable {
margin-top: 10px;
}
</style>
<template>
<div class="lpbContent-wrap" ref="lpbContent">
<div class="lpbContent">
<div class="ljz">逻辑幢</div>
<div class="zdy">幢单元</div>
<div class="ch">层户</div>
</div>
<div
class="zrz"
:style="{ width: lpbContentWidth + 'px'}"
>
{{ lpbData.xmmc }}
</div>
</div>
</template>
<script>
export default {
name: "",
components: {},
props: {},
data() {
return {
lpbData: {
bsm: "e9d1d425c30dd51b72d6f9daacd65d51",
xmmc: "金星小区A幢",
type: "zrz",
max_singlefloorhouse: "10",
zrzh: "600000 000 000 GB 00000 F0001",
total_floors: "10",
min_floor: "-2",
max_floor: "8",
ljzs: [
{
bsm: "ljzljz0101010101",
ljzmc: "地下车库",
type: "ljz",
max_singlefloorhouse: "10",
total_hs: "2",
min_c: "1",
max_c: "2",
zdys: [
{
bsm: "zdybsm01",
zdymc: "一单元",
type: "zdy",
max_singlefloorhouse: "2",
total_floors: "2",
min_floor: "1",
max_floor: "2",
cs: [
{
bsm: "c_01",
type: "c",
sjc: "1",
ch: "1",
maxhs: "2",
hs: [
{
BSM: "e9d1d425c30dd51b72d6f9daacd65d51",
SHBW: "S01-01(1)",
SJCS: "1",
SJHS: "1",
HH: "1",
BDCDYH: "F0001",
status: "10101011",
},
{
BSM: "e9d1d425c30dd51b72d6f9daacd65d51",
SHBW: "S01-02(2)",
SJCS: "2",
SJHS: "1",
HH: "2",
BDCDYH: "F0002",
status: "10101011",
},
],
},
{
bsm: "c_02",
type: "c",
sjc: "2",
ch: "2",
maxhs: "2",
hs: [
{
BSM: "e9d1d425c30dd51b72d6f9daacd65d51",
SHBW: "S01-01(1)",
SJCS: "1",
SJHS: "1",
HH: "1",
BDCDYH: "F0001",
status: "10101011",
},
{
BSM: "e9d1d425c30dd51b72d6f9daacd65d51",
SHBW: "S01-02(2)",
SJCS: "2",
SJHS: "1",
HH: "2",
BDCDYH: "F0002",
status: "10101011",
},
],
},
],
},
],
},
{
bsm: "ljzljz0101010101",
ljzmc: "商业",
type: "ljz",
max_singlefloorhouse: "10",
total_hs: "2",
min_c: "1",
max_c: "2",
},
{
bsm: "ljzljz0101010101",
ljzmc: "住宅",
type: "ljz",
max_singlefloorhouse: "10",
total_hs: "2",
min_c: "1",
max_c: "2",
},
],
zdys: [
{
bsm: "zdybsm01",
zdymc: "一单元",
type: "zdy",
max_singlefloorhouse: "2",
total_floors: "2",
min_floor: "1",
max_floor: "2",
cs: [
{
bsm: "c_01",
type: "c",
sjc: "1",
ch: "1",
maxhs: "2",
hs: [
{
BSM: "e9d1d425c30dd51b72d6f9daacd65d51",
SHBW: "S01-01(1)",
SJCS: "1",
SJHS: "1",
HH: "1",
BDCDYH: "F0001",
status: "10101011",
},
{
BSM: "e9d1d425c30dd51b72d6f9daacd65d51",
SHBW: "S01-02(2)",
SJCS: "2",
SJHS: "1",
HH: "2",
BDCDYH: "F0002",
status: "10101011",
},
],
},
{
bsm: "c_02",
type: "c",
sjc: "2",
ch: "2",
maxhs: "2",
hs: [
{
BSM: "e9d1d425c30dd51b72d6f9daacd65d51",
SHBW: "S01-01(1)",
SJCS: "1",
SJHS: "1",
HH: "1",
BDCDYH: "F0001",
status: "10101011",
},
{
BSM: "e9d1d425c30dd51b72d6f9daacd65d51",
SHBW: "S01-02(2)",
SJCS: "2",
SJHS: "1",
HH: "2",
BDCDYH: "F0002",
status: "10101011",
},
],
},
],
},
{
bsm: "zdybsm02",
zdymc: "二单元",
type: "zdy",
max_singlefloorhouse: "2",
total_floors: "2",
min_floor: "1",
max_floor: "2",
cs: [
{
bsm: "c_01",
type: "c",
sjc: "1",
ch: "1",
maxhs: "2",
hs: [
{
BSM: "e9d1d425c30dd51b72d6f9daacd65d51",
SHBW: "S01-01(1)",
SJCS: "1",
SJHS: "1",
HH: "1",
BDCDYH: "F0001",
status: "10101011",
},
{
BSM: "e9d1d425c30dd51b72d6f9daacd65d51",
SHBW: "S01-02(2)",
SJCS: "2",
SJHS: "1",
HH: "2",
BDCDYH: "F0002",
status: "10101011",
},
],
},
{
bsm: "c_02",
type: "c",
sjc: "2",
ch: "2",
maxhs: "2",
hs: [
{
ID: "e9d1d425c30dd51b72d6f9daacd65d51",
RoomNo: "S01-01(2)",
SJCS: "2",
SJHS: "1",
SXH: "1",
REUN: "F0001",
status: "10101011",
},
{
ID: "e9d1d425c30dd51b72d6f9daacd65d51",
RoomNo: "S01-02",
SJCS: "1",
SJHS: "2",
SXH: "2",
REUN: "F0002",
status: "10101011",
},
],
},
],
},
],
cs: [
{
bsm: "c_01",
type: "c",
sjc: "1",
ch: "1",
maxhs: "2",
hs: [
{
BSM: "e9d1d425c30dd51b72d6f9daacd65d51",
SHBW: "S01-01(1)",
SJCS: "1",
SJHS: "1",
HH: "1",
BDCDYH: "F0001",
status: "10101011",
},
{
BSM: "e9d1d425c30dd51b72d6f9daacd65d51",
SHBW: "S01-02(2)",
SJCS: "2",
SJHS: "1",
HH: "2",
BDCDYH: "F0002",
status: "10101011",
},
],
},
{
bsm: "c_02",
type: "c",
sjc: "2",
ch: "2",
maxhs: "2",
hs: [
{
BSM: "e9d1d425c30dd51b72d6f9daacd65d51",
SHBW: "S01-01(1)",
SJCS: "1",
SJHS: "1",
HH: "1",
BDCDYH: "F0001",
status: "10101011",
},
{
BSM: "e9d1d425c30dd51b72d6f9daacd65d51",
SHBW: "S01-02(2)",
SJCS: "2",
SJHS: "1",
HH: "2",
BDCDYH: "F0002",
status: "10101011",
},
],
},
],
},
lpbContentWidth: "",
};
},
created() {},
mounted() {
setTimeout(() => {
this.lpbContentWidth = this.$store.state.contentWidth - 34 - 6;
}, 100);
},
methods: {},
computed: {
createFlagChange() {
return this.$parent.createFlag;
},
legendToggleFlagChange() {
return this.$parent.legendToggleFlag;
},
},
watch: {
createFlagChange: function(val) {
setTimeout(() => {
this.lpbContentWidth = this.$refs.lpbContent.offsetWidth -6;
}, 501);
},
legendToggleFlagChange: function(val) {
setTimeout(() => {
this.lpbContentWidth = this.$refs.lpbContent.offsetWidth -6;
}, 501);
},
},
};
</script>
<style scoped lang="less">
.lpbContent-wrap {
width: 100%;
height: 100%;
overflow: hidden;
position: relative;
.lpbContent {
width: 100%;
height: 100%;
position: relative;
overflow: scroll;
.ljz {
width: 500px;
height: 400px;
background-color: darkorange;
}
.zdy {
width: 1580px;
height: 200px;
background-color: rosybrown;
}
.ch {
width: 800px;
height: 200px;
background-color: rgb(165, 136, 62);
}
}
.zrz {
height: 60px;
line-height: 60px;
background-color: darkgoldenrod;
position: absolute;
bottom: 0;
text-align: center;
transition: 0.5s;
}
}
</style>
......@@ -39,25 +39,16 @@
</tr>
</tbody>
</table>
<el-row :gutter="24">
<el-col :span="24">
<el-button type="primary" @click="submitForm('form')">立即创建</el-button>
</el-col>
</el-row>
</el-form>
</div>
</template>
<script>
import {insertZdyInfo} from "../../../../api/lpb"
import {insertZdyInfo} from "../../../../../api/lpb"
export default {
name: "index",
components: {},
data(){
return{
form:{
......@@ -112,6 +103,16 @@
}
});
},
reset(){
this.form = {
zdyh:'',
zdymc:'',
dscs:'',
dxcs:'',
zcs:'',
bz:'',
}
}
}
}
</script>
......