首页数据添加

wjt

2024-06-24 8e1323b1cd842f9364d89089d342a176d9242d45

 src/views/index/index.vue

@@ -2,45 +2,57 @@
  <div class="app-container">
    <div class="content">
      <div class="box">
        <div>153</div>
        <div>{{dataInfo.companyNum || 0}}</div>
        <div>入驻企业总数</div>
      </div>
      <div class="box">
        <div>153</div>
        <div>{{dataInfo.enforceOrderCheckedNum|| 0}}</div>
        <div>已检查企业数</div>
      </div>
      <div class="box">
        <div>153</div>
        <div>{{dataInfo.enforceCompanyNum|| 0}}</div>
        <div>执法单位数</div>
      </div>
      <div class="box">
        <div>153</div>
        <div>{{dataInfo.enforceUserNum|| 0}}</div>
        <div>执法人员数</div>
      </div>
      <div class="box">
        <div>153</div>
        <div>{{dataInfo.enforceOrderNum|| 0}}</div>
        <div>执法记录总数</div>
      </div>
      <div class="box">
        <div>153</div>
        <div>{{dataInfo.enforceOrderCompleteNum|| 0}}</div>
        <div>投诉记录数</div>
      </div>
      <div class="box">
        <div>153</div>
        <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 #bfbfbf;
    border: 1px solid #fbfbfb;
    box-shadow:0px 0px 12px rgba(0,0,0,0.12);
    border-radius: 5px;
    padding: 20px;
    cursor: pointer;
@@ -53,5 +65,9 @@
      color: #818181;
    }
  }

}
.line{
    margin: 20px;
  }
</style>