楼盘表内容区高度动态计算
Showing
2 changed files
with
17 additions
and
7 deletions
... | @@ -18,7 +18,7 @@ | ... | @@ -18,7 +18,7 @@ |
18 | <el-button class="radioBtn" label="7" border>批量单元号</el-button> | 18 | <el-button class="radioBtn" label="7" border>批量单元号</el-button> |
19 | </div> | 19 | </div> |
20 | </div> | 20 | </div> |
21 | <div class="tab-content"> | 21 | <div class="tab-content" :style="{'height':lpbContentHight+'px'}"> |
22 | <div class="lp-tree" :class="createFlag ? 'w260':'w0'"> | 22 | <div class="lp-tree" :class="createFlag ? 'w260':'w0'"> |
23 | <LineTree :pd="pd" class="treeData" :islpb = "islpb" ></LineTree> | 23 | <LineTree :pd="pd" class="treeData" :islpb = "islpb" ></LineTree> |
24 | <p @click="createFlag = false" style="width:20px;float:left;cursor:pointer;">X</p> | 24 | <p @click="createFlag = false" style="width:20px;float:left;cursor:pointer;">X</p> |
... | @@ -29,8 +29,8 @@ | ... | @@ -29,8 +29,8 @@ |
29 | <div class="lp-legend"> | 29 | <div class="lp-legend"> |
30 | <div class="handleCol"> | 30 | <div class="handleCol"> |
31 | <div class="btn" @click="legendToggle"> | 31 | <div class="btn" @click="legendToggle"> |
32 | <i class="el-icon-d-arrow-left"></i> | 32 | <i v-show="!legendToggleFlag" class="el-icon-d-arrow-left"></i> |
33 | <!-- <i class="el-icon-d-arrow-right"></i> --> | 33 | <i v-show="legendToggleFlag" class="el-icon-d-arrow-right"></i> |
34 | </div> | 34 | </div> |
35 | <div class="dyzt"> | 35 | <div class="dyzt"> |
36 | <span>单元状态</span> | 36 | <span>单元状态</span> |
... | @@ -165,14 +165,22 @@ export default { | ... | @@ -165,14 +165,22 @@ export default { |
165 | mj:'285' | 165 | mj:'285' |
166 | }, | 166 | }, |
167 | ], | 167 | ], |
168 | legendToggleFlag:false | 168 | legendToggleFlag:false, |
169 | lpbContentHight:'' | ||
169 | } | 170 | } |
170 | }, | 171 | }, |
171 | created(){}, | 172 | created(){ |
173 | window.addEventListener('resize', this.getHeight); | ||
174 | this.getHeight() | ||
175 | }, | ||
172 | mounted(){ | 176 | mounted(){ |
173 | this.getLpbMenuTree('d1b82b27f2a6ab7bf3f0e7708c96e46f') | 177 | this.getLpbMenuTree('d1b82b27f2a6ab7bf3f0e7708c96e46f') |
174 | }, | 178 | }, |
175 | methods:{ | 179 | methods:{ |
180 | //获取高度计算lpb内容区高度 | ||
181 | getHeight(){ | ||
182 | this.lpbContentHight = window.innerHeight - 340 | ||
183 | }, | ||
176 | //创建楼盘 | 184 | //创建楼盘 |
177 | create(){ | 185 | create(){ |
178 | this.createFlag = true | 186 | this.createFlag = true |
... | @@ -236,6 +244,9 @@ export default { | ... | @@ -236,6 +244,9 @@ export default { |
236 | } | 244 | } |
237 | }, | 245 | }, |
238 | computed: {}, | 246 | computed: {}, |
247 | destroyed(){ | ||
248 | window.removeEventListener('resize', this.getHeight) | ||
249 | }, | ||
239 | watch: { | 250 | watch: { |
240 | }, | 251 | }, |
241 | } | 252 | } |
... | @@ -269,9 +280,9 @@ export default { | ... | @@ -269,9 +280,9 @@ export default { |
269 | } | 280 | } |
270 | } | 281 | } |
271 | .tab-content{ | 282 | .tab-content{ |
272 | height: calc(100% - 161px); | ||
273 | background-color: #ffffff; | 283 | background-color: #ffffff; |
274 | display: flex; | 284 | display: flex; |
285 | overflow-y: scroll; | ||
275 | .lp-tree{ | 286 | .lp-tree{ |
276 | height: 100%; | 287 | height: 100%; |
277 | overflow: hidden; | 288 | overflow: hidden; | ... | ... |
-
Please register or sign in to post a comment