Skip to content

任超 / js.CadastralSystem

Go to a project
Toggle navigation
Toggle navigation pinning
9696a1a5 by 杨威
Options

业主共有页面样式修改

1 parent dce31912
Inline Side-by-side
Showing 2 changed files with 89 additions and 63 deletions
......@@ -2,7 +2,7 @@
<div ref="lpb" class="content_box">
<el-tabs v-model="activeName" class="tabs" @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>
<el-tab-pane label="业主共有" name="yzgy"><yzgy v-if="yzgyLoad"></yzgy></el-tab-pane>
<el-tab-pane label="登记簿" name="djb"><djb></djb></el-tab-pane>
<el-tab-pane label="楼盘表" name="lpb"><lpb v-if="lpbLoad"></lpb></el-tab-pane>
<el-tab-pane label="历史回溯" name="lshs"><lshs></lshs></el-tab-pane>
......@@ -28,6 +28,7 @@ export default {
return {
activeName: "zrzxx",
lpbLoad:false, //默认不加载楼盘表组件
yzgyLoad:false,
};
},
methods: {
......@@ -35,6 +36,9 @@ export default {
if(!this.lpbLoad){
this.lpbLoad = tab.name == 'lpb' ? true : false
}
if(!this.yzgyLoad){
this.yzgyLoad = tab.name == 'yzgy' ? true : false
}
},
},
created() {},
......
<template>
<div class="">
<div class="main">
<table border="1">
<tr>
<td colspan="3">宗地代码</td>
<td colspan="4"><input type="text" class="formInput" v-model="zddm " disabled/></td>
</tr>
<tr>
<td colspan="3">建筑物区分所有权业主共有部分权利人</td>
<td colspan="4"><input type="text" class="formInput" v-model="Data.qlr" disabled/></td>
</tr>
</table>
<table border="1">
<tr>
<td>
<el-button
type="primary"
class="changeBtn outAdd addMinus"
@click="addRow"
>+</el-button
>
</td>
<td>建(构)筑物编号</td>
<td>建(构)筑物数量</td>
<td>建(构)筑物面积(㎡)</td>
<td>占地面积(㎡)</td>
<td>分摊土地面积(㎡)</td>
<td>附记</td>
</tr>
<tr v-for="(item,i) in Data.list" :key="i">
<td>
<el-button
type="primary"
class="changeBtn outMinus addMinus"
@click="delRow(i)"
>-</el-button
>
</td>
<td><el-input v-model="item.jgzwbh" placeholder="请输入建(构)筑物编号"></el-input></td>
<td><el-input v-model="item.jgzsl" oninput="value = (value.match(/^\d*/g)) || null" placeholder="请输入建(构)筑物数量"></el-input></td>
<td><el-input v-model="item.jgzmj" oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null" placeholder="请输入建(构)筑物面积(㎡)"></el-input></td>
<td><el-input v-model="item.zdmj" oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null" placeholder="请输入占地面积(㎡)"></el-input></td>
<td><el-input v-model="item.fttdmj" oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null" placeholder="请输入分摊土地面积(㎡)"></el-input></td>
<td><el-input v-model="item.fj" placeholder="请输入附记"></el-input></td>
</tr>
<!-- <tr>
<td>统计</td>
<td>{{sumTdsyqsyqmj}}</td>
<td>{{sumDydytdmj}}</td>
<td>{{sumFttdmj}}</td>
<td>{{sumFttdmj}}</td>
<td>{{sumFttdmj}}</td>
<td>{{sumFttdmj}}</td>
</tr>-->
</table>
<div class="pers">
<el-button @click="save" type="primary">保存</el-button>
</div>
<div class="main" ref="mainBox">
<table border="1">
<tr>
<td colspan="3">宗地代码</td>
<td colspan="4"><input type="text" class="formInput" v-model="zddm " disabled/></td>
</tr>
<tr>
<td colspan="3">建筑物区分所有权业主共有部分权利人</td>
<td colspan="4"><input type="text" class="formInput" v-model="Data.qlr" disabled/></td>
</tr>
</table>
<table border="1">
<tr>
<td>
<el-button
type="primary"
class="changeBtn outAdd addMinus"
@click="addRow"
>+</el-button
>
</td>
<td>建(构)筑物编号</td>
<td>建(构)筑物数量</td>
<td>建(构)筑物面积(㎡)</td>
<td>占地面积(㎡)</td>
<td>分摊土地面积(㎡)</td>
<td>附记</td>
</tr>
<tr v-for="(item,i) in Data.list" :key="i">
<td>
<el-button
type="primary"
class="changeBtn outMinus addMinus"
@click="delRow(i)"
>-</el-button
>
</td>
<td><el-input v-model="item.jgzwbh" placeholder="请输入建(构)筑物编号"></el-input></td>
<td><el-input v-model="item.jgzsl" oninput="value = (value.match(/^\d*/g)) || null" placeholder="请输入建(构)筑物数量"></el-input></td>
<td><el-input v-model="item.jgzmj" oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null" placeholder="请输入建(构)筑物面积(㎡)"></el-input></td>
<td><el-input v-model="item.zdmj" oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null" placeholder="请输入占地面积(㎡)"></el-input></td>
<td><el-input v-model="item.fttdmj" oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null" placeholder="请输入分摊土地面积(㎡)"></el-input></td>
<td><el-input v-model="item.fj" placeholder="请输入附记"></el-input></td>
</tr>
<!-- <tr>
<td>统计</td>
<td>{{sumTdsyqsyqmj}}</td>
<td>{{sumDydytdmj}}</td>
<td>{{sumFttdmj}}</td>
<td>{{sumFttdmj}}</td>
<td>{{sumFttdmj}}</td>
<td>{{sumFttdmj}}</td>
</tr>-->
</table>
<!-- <div class="pers">
<el-button @click="save" type="primary">保存</el-button>
</div> -->
<div class="header-button" :style="{width:mainBoxWidth+'px'}">
<el-button type="primary" class="saveBtn" @click="save">保存</el-button>
</div>
</div>
</template>
......@@ -83,7 +84,8 @@
fttdmj: '', //分摊土地面积
fj: ''
}]
}
},
mainBoxWidth:0
}
},
......@@ -127,10 +129,12 @@
console.log("create init...")
},
mounted() {
console.log("mounted init...")
// console.log(this.$refs.mainBox.clientWidth,"this.$refs.mainBox.clientWidth")
this.Data.glbsm = this.$store.state.zrzbsm
this.zddm = this.$store.state.zddm
this.getData(this.Data.glbsm)
this.$nextTick(() => {
this.mainBoxWidth = this.$refs.mainBox.clientWidth;
})
},
watch: {
"$store.state.zdbsm": function (bsm) {
......@@ -147,7 +151,7 @@
box-sizing: border-box;
padding: 18px;
height: auto;
width: 80%;
width: 100%;
}
table {
......@@ -186,4 +190,22 @@
.dzwsl {
width: 200px;
}
.header-button {
height: 50px;
position: fixed;
bottom: 0;
right: 0;
text-align: center;
background-color: #ffffff;
.saveBtn {
background-color: #00CACD;
border-color: #00CACD;
padding: 10px 30px;
margin-top: 8px;
}
.saveBtn:hover {
background-color: rgba(0, 202, 205, .8);
border-color: rgba(0, 202, 205, .8);
}
}
</style>
......