<template>
|
<div class="app-container">
|
<div class="content">
|
<div class="box">
|
<div>{{dataInfo.companyNum || 0}}</div>
|
<div>入驻企业总数</div>
|
</div>
|
<div class="box">
|
<div>{{dataInfo.enforceCompanyNum|| 0}}</div>
|
<div>已检查企业数</div>
|
</div>
|
<div class="box">
|
<div>{{dataInfo.enforceDeptNum|| 0}}</div>
|
<div>执法单位数</div>
|
</div>
|
<div class="box">
|
<div>{{dataInfo.enforceUserNum|| 0}}</div>
|
<div>执法人员数</div>
|
</div>
|
<div class="box">
|
<div>{{dataInfo.enforce0rderNum|| 0}}</div>
|
<div>执法记录总数</div>
|
</div>
|
<div class="box">
|
<div>{{dataInfo.complaintNum|| 0}}</div>
|
<div>投诉记录数</div>
|
</div>
|
<div class="box">
|
<div>{{dataInfo.docNum}}</div>
|
<div>政策条数</div>
|
</div>
|
</div>
|
<div class="line"></div>
|
<enforceSituation></enforceSituation>
|
</div>
|
</template>
|
<script lang="ts" setup>
|
import { getTotalInfo } from '@/api/system/company/company'
|
import enforceSituation from './component/enforceSituation.vue'
|
const dataInfo = ref({})
|
function getTotalInfoHttp() {
|
getTotalInfo().then(res => {
|
dataInfo.value = res.data
|
})
|
}
|
getTotalInfoHttp()
|
</script>
|
<style lang="scss" scoped>
|
.content{
|
display: grid;
|
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
|
grid-gap: 20px;
|
&>.box{
|
border: 1px solid #fbfbfb;
|
box-shadow:0px 0px 12px rgba(0,0,0,0.12);
|
border-radius: 5px;
|
padding: 20px;
|
cursor: pointer;
|
&>div:nth-child(1){
|
font-size: 25px;
|
font-weight: bold;
|
margin-bottom: 10px;
|
}
|
&>div:nth-child(2){
|
color: #818181;
|
}
|
}
|
|
}
|
.line{
|
margin: 20px;
|
}
|
</style>
|
