<!-- -->
|
<template>
|
<div class='basicTopics'>
|
<div class="buildingTable-title" @click="openClick">
|
<div>
|
<img src="../../../../public/img/icon/business.png" alt="" srcset="">
|
</div>
|
<div style="margin-left: 5px;">
|
<div class="buildingTable-title-text">
|
<span>专题信息</span>
|
</div>
|
<div class="buildingTable-title-text-botom"></div>
|
</div>
|
</div>
|
|
<div class="basicTopics-info" v-if="basicTopics">
|
<div class="basicTopics-info-item">
|
<img src="../../../../public/img/icon/business.png" alt="" srcset="">
|
<div>
|
<span>楼栋数</span>
|
<div class="basicTopics-info-item-num">
|
{{ staticInfo.empNum }}
|
</div>
|
</div>
|
</div>
|
|
<div class="basicTopics-info-item">
|
<img src="../../../../public/img/icon/business.png" alt="" srcset="">
|
<div>
|
<span>单元数</span>
|
<div class="basicTopics-info-item-num">
|
{{ staticInfo.unitNum }}
|
</div>
|
</div>
|
</div>
|
|
<!-- <div class="basicTopics-info-item">
|
<img src="../../../../public/img/icon/business.png" alt="" srcset="">
|
<div>
|
<span>专题信息</span>
|
<div class="basicTopics-info-item-num">
|
908
|
</div>
|
</div>
|
</div> -->
|
</div>
|
<enterpriseList v-if="basicTopics"> </enterpriseList>
|
</div>
|
</template>
|
|
<script>
|
import enterpriseList from './enterpriseList'
|
|
import {
|
getStaticPlaceAndEmpNum
|
} from '@/api/company/company'
|
|
export default {
|
//import引入的组件需要注入到对象中才能使用
|
components: {
|
enterpriseList
|
},
|
data() {
|
//这里存放数据
|
return {
|
basicTopics: false,
|
aoiId: '111',
|
buildId: '',
|
staticInfo: {},
|
|
};
|
},
|
//监听属性 类似于data概念
|
computed: {},
|
//监控data中的数据变化
|
watch: {},
|
//方法集合
|
methods: {
|
openClick() {
|
this.basicTopics = !this.basicTopics
|
},
|
getStatic() {
|
getStaticPlaceAndEmpNum(this.aoiId, this.buildId).then(res => {
|
this.staticInfo = res.data.data
|
})
|
|
}
|
|
},
|
//生命周期 - 创建完成(可以访问当前this实例)
|
created() {
|
|
},
|
//生命周期 - 挂载完成(可以访问DOM元素)
|
mounted() {
|
this.getStatic()
|
},
|
beforeCreate() { }, //生命周期 - 创建之前
|
beforeMount() { }, //生命周期 - 挂载之前
|
beforeUpdate() { }, //生命周期 - 更新之前
|
updated() { }, //生命周期 - 更新之后
|
beforeDestroy() { }, //生命周期 - 销毁之前
|
destroyed() { }, //生命周期 - 销毁完成
|
activated() { }, //如果页面有keep-alive缓存功能,这个函数会触发
|
}
|
</script>
|
<style lang='scss' scoped>
|
//@import url(); 引入公共css类
|
|
|
.basicTopics {
|
margin-top: 10px;
|
overflow: hidden;
|
overflow-y: auto;
|
}
|
|
.buildingTable-title {
|
display: flex;
|
|
img {
|
width: 30px;
|
height: 30px;
|
}
|
|
}
|
|
.buildingTable-title-text {
|
display: flex;
|
font-size: 16px;
|
line-height: 24px;
|
width: 90px;
|
}
|
|
.buildingTable-title-text:after {
|
content: "";
|
width: 0;
|
height: 0;
|
margin-left: 13px;
|
border-top: solid 6px transparent;
|
border-left: solid 6px #ffff;
|
border-bottom: solid 6px transparent;
|
margin-top: 6px;
|
}
|
|
.buildingTable-title-text-botom {
|
height: 4px;
|
background: linear-gradient(to right, #4c90ff, #c0d2f1);
|
}
|
|
.basicTopics-info {
|
margin: 10px;
|
display: flex;
|
justify-content: space-between;
|
|
.basicTopics-info-item {
|
display: flex;
|
// background-color: #c0d2f1;
|
border-radius: 5px;
|
padding: 10px;
|
|
span {
|
color: red;
|
}
|
|
.basicTopics-info-item-num {
|
text-align: left;
|
}
|
}
|
|
}
|
</style>
|