sgxt_web/src/views/home/model/qbfkCount.vue

<template>
  <div class="comom-title">
    <span class="title">情报反馈统计</span>
  </div> 
  <div class="comom-cnt">
    <pieEcharts echartsId='qbfk' :data="countData"></pieEcharts>
    <!-- <div id="qbfk" class="qbfkBox" style="width: 100%; height: 100%"></div> -->
  </div>
</template>

<script setup>
import pieEcharts from "@/views/home/echarts/pieEcharts.vue";
import { qcckPost } from "@/api/qcckApi.js";
import { ref, onMounted } from 'vue';
const countData = ref([
  { label:'实反馈',value:0,color:['#FF6B9A','#FF4B7A']},
  { label:'超时反馈',value:0,color:['#FFAA33','#FF8A00']},
  { label:'处置下发',value:0,color:['#FFE699','#FFD666']},
  { label:'未反馈',value:0,color:['#66B5FF','#3AA1FF']},
])

onMounted(() => {
  getCount();
});

const getCount = () =>{
  // 获取处置状态统计 
  qcckPost({cjLx:0}, '/mosty-gsxt/qbcj/getXscjTjByCzzt').then(res => {
    console.log(res,'=====');
    
  });
}

</script>

<style lang="scss" scoped>
@import "@/assets/css/homeScreen.scss";
.xsBox{
    background: #052249;
    .xs-item{
        width: 31%;
        height: 36px;
        line-height: 36px;
        text-align: center;
        background: url("~@/assets/images/content-item.png") no-repeat center center;
        background-size: 100% 100%;
    }
}

.qbfkBox {
    width: 100%;
    height: 100%;
    position: relative;
}
</style>