9696a1a5 by 杨威

业主共有页面样式修改

1 parent dce31912
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
2 <div ref="lpb" class="content_box"> 2 <div ref="lpb" class="content_box">
3 <el-tabs v-model="activeName" class="tabs" @tab-click="handleClick"> 3 <el-tabs v-model="activeName" class="tabs" @tab-click="handleClick">
4 <el-tab-pane label="自然幢信息" name="zrzxx"><zrzxx></zrzxx></el-tab-pane> 4 <el-tab-pane label="自然幢信息" name="zrzxx"><zrzxx></zrzxx></el-tab-pane>
5 <el-tab-pane label="业主共有" name="yzgy"><yzgy></yzgy></el-tab-pane> 5 <el-tab-pane label="业主共有" name="yzgy"><yzgy v-if="yzgyLoad"></yzgy></el-tab-pane>
6 <el-tab-pane label="登记簿" name="djb"><djb></djb></el-tab-pane> 6 <el-tab-pane label="登记簿" name="djb"><djb></djb></el-tab-pane>
7 <el-tab-pane label="楼盘表" name="lpb"><lpb v-if="lpbLoad"></lpb></el-tab-pane> 7 <el-tab-pane label="楼盘表" name="lpb"><lpb v-if="lpbLoad"></lpb></el-tab-pane>
8 <el-tab-pane label="历史回溯" name="lshs"><lshs></lshs></el-tab-pane> 8 <el-tab-pane label="历史回溯" name="lshs"><lshs></lshs></el-tab-pane>
...@@ -28,6 +28,7 @@ export default { ...@@ -28,6 +28,7 @@ export default {
28 return { 28 return {
29 activeName: "zrzxx", 29 activeName: "zrzxx",
30 lpbLoad:false, //默认不加载楼盘表组件 30 lpbLoad:false, //默认不加载楼盘表组件
31 yzgyLoad:false,
31 }; 32 };
32 }, 33 },
33 methods: { 34 methods: {
...@@ -35,6 +36,9 @@ export default { ...@@ -35,6 +36,9 @@ export default {
35 if(!this.lpbLoad){ 36 if(!this.lpbLoad){
36 this.lpbLoad = tab.name == 'lpb' ? true : false 37 this.lpbLoad = tab.name == 'lpb' ? true : false
37 } 38 }
39 if(!this.yzgyLoad){
40 this.yzgyLoad = tab.name == 'yzgy' ? true : false
41 }
38 }, 42 },
39 }, 43 },
40 created() {}, 44 created() {},
......
1 <template> 1 <template>
2 <div class=""> 2 <div class="main" ref="mainBox">
3 <div class="main"> 3 <table border="1">
4 <table border="1"> 4 <tr>
5 <tr> 5 <td colspan="3">宗地代码</td>
6 <td colspan="3">宗地代码</td> 6 <td colspan="4"><input type="text" class="formInput" v-model="zddm " disabled/></td>
7 <td colspan="4"><input type="text" class="formInput" v-model="zddm " disabled/></td> 7 </tr>
8 </tr> 8 <tr>
9 <tr> 9 <td colspan="3">建筑物区分所有权业主共有部分权利人</td>
10 <td colspan="3">建筑物区分所有权业主共有部分权利人</td> 10 <td colspan="4"><input type="text" class="formInput" v-model="Data.qlr" disabled/></td>
11 <td colspan="4"><input type="text" class="formInput" v-model="Data.qlr" disabled/></td> 11 </tr>
12 </tr> 12 </table>
13 </table> 13 <table border="1">
14 <table border="1"> 14 <tr>
15 <tr> 15 <td>
16 <td> 16 <el-button
17 <el-button 17 type="primary"
18 type="primary" 18 class="changeBtn outAdd addMinus"
19 class="changeBtn outAdd addMinus" 19 @click="addRow"
20 @click="addRow" 20 >+</el-button
21 >+</el-button 21 >
22 > 22 </td>
23 </td> 23 <td>建(构)筑物编号</td>
24 <td>建(构)筑物编号</td> 24 <td>建(构)筑物数量</td>
25 <td>建(构)筑物数量</td> 25 <td>建(构)筑物面积(㎡)</td>
26 <td>建(构)筑物面积(㎡)</td> 26 <td>占地面积(㎡)</td>
27 <td>占地面积(㎡)</td> 27 <td>分摊土地面积(㎡)</td>
28 <td>分摊土地面积(㎡)</td> 28 <td>附记</td>
29 <td>附记</td> 29 </tr>
30 </tr> 30 <tr v-for="(item,i) in Data.list" :key="i">
31 <tr v-for="(item,i) in Data.list" :key="i"> 31 <td>
32 <td> 32 <el-button
33 <el-button 33 type="primary"
34 type="primary" 34 class="changeBtn outMinus addMinus"
35 class="changeBtn outMinus addMinus" 35 @click="delRow(i)"
36 @click="delRow(i)" 36 >-</el-button
37 >-</el-button 37 >
38 > 38 </td>
39 </td> 39 <td><el-input v-model="item.jgzwbh" placeholder="请输入建(构)筑物编号"></el-input></td>
40 <td><el-input v-model="item.jgzwbh" placeholder="请输入建(构)筑物编号"></el-input></td> 40 <td><el-input v-model="item.jgzsl" oninput="value = (value.match(/^\d*/g)) || null" placeholder="请输入建(构)筑物数量"></el-input></td>
41 <td><el-input v-model="item.jgzsl" oninput="value = (value.match(/^\d*/g)) || null" placeholder="请输入建(构)筑物数量"></el-input></td> 41 <td><el-input v-model="item.jgzmj" oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null" placeholder="请输入建(构)筑物面积(㎡)"></el-input></td>
42 <td><el-input v-model="item.jgzmj" oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null" placeholder="请输入建(构)筑物面积(㎡)"></el-input></td> 42 <td><el-input v-model="item.zdmj" oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null" placeholder="请输入占地面积(㎡)"></el-input></td>
43 <td><el-input v-model="item.zdmj" oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null" placeholder="请输入占地面积(㎡)"></el-input></td> 43 <td><el-input v-model="item.fttdmj" oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null" placeholder="请输入分摊土地面积(㎡)"></el-input></td>
44 <td><el-input v-model="item.fttdmj" oninput="value = (value.match(/^\d*(\.?\d{0,3})/g)[0]) || null" placeholder="请输入分摊土地面积(㎡)"></el-input></td> 44 <td><el-input v-model="item.fj" placeholder="请输入附记"></el-input></td>
45 <td><el-input v-model="item.fj" placeholder="请输入附记"></el-input></td> 45 </tr>
46 </tr> 46 <!-- <tr>
47 <!-- <tr> 47 <td>统计</td>
48 <td>统计</td> 48 <td>{{sumTdsyqsyqmj}}</td>
49 <td>{{sumTdsyqsyqmj}}</td> 49 <td>{{sumDydytdmj}}</td>
50 <td>{{sumDydytdmj}}</td> 50 <td>{{sumFttdmj}}</td>
51 <td>{{sumFttdmj}}</td> 51 <td>{{sumFttdmj}}</td>
52 <td>{{sumFttdmj}}</td> 52 <td>{{sumFttdmj}}</td>
53 <td>{{sumFttdmj}}</td> 53 <td>{{sumFttdmj}}</td>
54 <td>{{sumFttdmj}}</td> 54 </tr>-->
55 </tr>--> 55 </table>
56 </table> 56 <!-- <div class="pers">
57 <div class="pers"> 57 <el-button @click="save" type="primary">保存</el-button>
58 <el-button @click="save" type="primary">保存</el-button> 58 </div> -->
59 </div> 59 <div class="header-button" :style="{width:mainBoxWidth+'px'}">
60 <el-button type="primary" class="saveBtn" @click="save">保存</el-button>
60 </div> 61 </div>
61 </div> 62 </div>
62 </template> 63 </template>
...@@ -83,7 +84,8 @@ ...@@ -83,7 +84,8 @@
83 fttdmj: '', //分摊土地面积 84 fttdmj: '', //分摊土地面积
84 fj: '' 85 fj: ''
85 }] 86 }]
86 } 87 },
88 mainBoxWidth:0
87 } 89 }
88 }, 90 },
89 91
...@@ -127,10 +129,12 @@ ...@@ -127,10 +129,12 @@
127 console.log("create init...") 129 console.log("create init...")
128 }, 130 },
129 mounted() { 131 mounted() {
130 console.log("mounted init...") 132 // console.log(this.$refs.mainBox.clientWidth,"this.$refs.mainBox.clientWidth")
131 this.Data.glbsm = this.$store.state.zrzbsm 133 this.Data.glbsm = this.$store.state.zrzbsm
132 this.zddm = this.$store.state.zddm 134 this.zddm = this.$store.state.zddm
133 this.getData(this.Data.glbsm) 135 this.$nextTick(() => {
136 this.mainBoxWidth = this.$refs.mainBox.clientWidth;
137 })
134 }, 138 },
135 watch: { 139 watch: {
136 "$store.state.zdbsm": function (bsm) { 140 "$store.state.zdbsm": function (bsm) {
...@@ -147,7 +151,7 @@ ...@@ -147,7 +151,7 @@
147 box-sizing: border-box; 151 box-sizing: border-box;
148 padding: 18px; 152 padding: 18px;
149 height: auto; 153 height: auto;
150 width: 80%; 154 width: 100%;
151 } 155 }
152 156
153 table { 157 table {
...@@ -186,4 +190,22 @@ ...@@ -186,4 +190,22 @@
186 .dzwsl { 190 .dzwsl {
187 width: 200px; 191 width: 200px;
188 } 192 }
193 .header-button {
194 height: 50px;
195 position: fixed;
196 bottom: 0;
197 right: 0;
198 text-align: center;
199 background-color: #ffffff;
200 .saveBtn {
201 background-color: #00CACD;
202 border-color: #00CACD;
203 padding: 10px 30px;
204 margin-top: 8px;
205 }
206 .saveBtn:hover {
207 background-color: rgba(0, 202, 205, .8);
208 border-color: rgba(0, 202, 205, .8);
209 }
210 }
189 </style> 211 </style>
......