|  |  | 
 |  |  | <template> | 
 |  |  |   <GlobalWindow title="楼宇详情" :showConfirm="false" :visible.sync="visible" width="800px"> | 
 |  |  |     <div class="model_wrap"> | 
 |  |  |       <div class="title">基础信息</div> | 
 |  |  |       <div class="list"> | 
 |  |  |         <div class="item"> | 
 |  |  |           <div class="la">所属项目</div> | 
 |  |  |           <div class="val">{{ info.projectName }}</div> | 
 |  |  |         </div> | 
 |  |  |         <div class="item"> | 
 |  |  |           <div class="la">楼宇名称</div> | 
 |  |  |           <div class="val">{{ info.buildingName || info.name }}</div> | 
 |  |  |         </div> | 
 |  |  |         <div class="item"> | 
 |  |  |           <div class="la">楼宇编码</div> | 
 |  |  |           <div class="val">{{ info.code }}</div> | 
 |  |  |         </div> | 
 |  |  |         <div class="item"> | 
 |  |  |           <div class="la">详细地址</div> | 
 |  |  |           <div class="val">{{ info.addr }}</div> | 
 |  |  |         </div> | 
 |  |  |         <div class="item"> | 
 |  |  |           <div class="la">楼宇简介</div> | 
 |  |  |           <div class="val">{{ info.remark }}</div> | 
 |  |  |         </div> | 
 |  |  |       </div> | 
 |  |  |       <div class="title">建筑面积</div> | 
 |  |  |       <div class="list"> | 
 |  |  |         <div class="item"> | 
 |  |  |           <div class="la">建筑面积</div> | 
 |  |  |           <div class="val">{{ info.area }}</div> | 
 |  |  |         </div> | 
 |  |  |         <div class="item"> | 
 |  |  |           <div class="la">产权面积</div> | 
 |  |  |           <div class="val">{{ info.cqArea }}</div> | 
 |  |  |         </div> | 
 |  |  |         <div class="item"> | 
 |  |  |           <div class="la">可租面积</div> | 
 |  |  |           <div class="val">{{ info.rentArea }}</div> | 
 |  |  |         </div> | 
 |  |  |       </div> | 
 |  |  |       <div class="title">楼层信息</div> | 
 |  |  |       <div class="list"> | 
 |  |  |         <div class="item"> | 
 |  |  |           <div class="la">地上层数</div> | 
 |  |  |           <div class="val">{{ info.onFloor }}</div> | 
 |  |  |         </div> | 
 |  |  |         <div class="item"> | 
 |  |  |           <div class="la">地下层数</div> | 
 |  |  |           <div class="val">{{ info.underFloor }}</div> | 
 |  |  |         </div> | 
 |  |  |       </div> | 
 |  |  |     </div> | 
 |  |  |   </GlobalWindow> | 
 |  |  | </template> | 
 |  |  |  | 
 |  |  | <script> | 
 |  |  | import BaseOpera from '@/components/base/BaseOpera' | 
 |  |  | import GlobalWindow from '@/components/common/GlobalWindow' | 
 |  |  | import { detailById } from '@/api/project/ywBuilding' | 
 |  |  | export default { | 
 |  |  |   extends: BaseOpera, | 
 |  |  |   components: { GlobalWindow }, | 
 |  |  |   data() { | 
 |  |  |     return { | 
 |  |  |       // 表单数据 | 
 |  |  |       info: {} | 
 |  |  |     } | 
 |  |  |   }, | 
 |  |  |   created() { | 
 |  |  |  | 
 |  |  |   }, | 
 |  |  |   methods: { | 
 |  |  |     getDetail(id) { | 
 |  |  |       detailById(id).then(res => { | 
 |  |  |         this.info = res | 
 |  |  |       }) | 
 |  |  |     } | 
 |  |  |   } | 
 |  |  | } | 
 |  |  | </script> | 
 |  |  | <style lang="scss" scoped> | 
 |  |  | .model_wrap{ | 
 |  |  |   .title{ | 
 |  |  |     font-size: 18px; | 
 |  |  |     font-weight: 600; | 
 |  |  |     margin-bottom: 16px; | 
 |  |  |   } | 
 |  |  |   .list{ | 
 |  |  |     display: flex; | 
 |  |  |     flex-wrap: wrap; | 
 |  |  |     .item{ | 
 |  |  |       width: 33.33%; | 
 |  |  |       margin-bottom: 8px; | 
 |  |  |       .la{ | 
 |  |  |         color: #7f7f7f | 
 |  |  |       } | 
 |  |  |     } | 
 |  |  |   } | 
 |  |  | } | 
 |  |  | </style> |