ll

liukangdong

2025-03-13 6fdb27916ce66c9b5492dd21724e55b2c3f1eeb2

 admin/src/views/business/dangerStatic.vue

@@ -13,11 +13,18 @@
    <div class="main_content">
      <div class="type_wrap">
        <div class="title">隐患类型统计</div>
        <div class="echart1" ref="typeRef"></div>
        <div v-show="typeList && typeList.length > 0" class="echart1" ref="typeRef"></div>
        <div v-show="typeList.length == 0" style="width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;">
          <img style="width: 240px;" src="@/assets/images/default_homeimg.png" alt="">
        </div>

      </div>
      <div class="dept_wrap">
        <div class="title">隐患归属部门统计</div>
        <div class="echart2" ref="deptRef"></div>
        <div v-show="deptList && deptList.length > 0" class="echart2" ref="deptRef"></div>
        <div v-show="deptList.length == 0" style="width: 100%;height: 100%;display: flex;align-items: center;justify-content: center;">
          <img style="width: 240px;" src="@/assets/images/default_homeimg.png" alt="">
        </div>
      </div>
    </div>
  </div>
@@ -35,7 +42,7 @@
  data() {
    return {
      filters: {
        fastdate: '0',
        fastdate: '29',
        queryStartTime: '',
        queryEndTime: ''
      },
@@ -48,7 +55,7 @@
            options: [
              { label: '待处理', value: '0' },
              { label: '已处理', value: '1' },
              { label: '不处理', value: '2' },
              { label: '已退回', value: '2' },
            ]
          },
          {
@@ -70,7 +77,8 @@
    }
  },
  mounted() {
    this.changeRadio('0')
    this.changeRadio('29')
    // this.getData()
  },
  methods: {
    changeRadio(day) {
@@ -84,8 +92,11 @@
        if (res) {
          this.typeList = res.cateList || []
          this.deptList = res.departmentList || []
          this.initType()
          this.initDept()
          this.$nextTick(() => {
            this.initType()
            this.initDept()
          })

        }
      })

@@ -99,13 +110,20 @@
      this.typeList.forEach(i => {
        total += i.total
      })
      let colors = ['#d75a44', '#e39f4d', '#7ac7f6', '#7ac7f6', '#4469ee', '#698af0', '#9fb5f4', '#b6c7f7', '#c8d5f8']
      let colors = ['#d75a44', '#e39f4d', '#f0d05f', '#7ac7f6', '#4469ee', '#698af0','#86a2f1','#a1b4f6','#a0b5f5', '#9fb5f4', '#b6c7f7', '#c8d5f8']
      let option = {
        grid: {
          left: '0%',
          // right: '4%',
          // bottom: '3%',
          top: '0%',
          containLabel: true
        },
        title: [
          {
            text: '隐患总数',
            top: '46%',
            left: '46%',
            left: '45%',
            textStyle: {
              color: '#666666',
              fontSize: 16,
@@ -113,7 +131,7 @@
          }, {
            text: total,
            top: '50%',
            left: '48%',
            left: '47.6%',
            textStyle: {
              color: '#080404',
              fontSize: 24,
@@ -138,9 +156,8 @@
        },
        series: [
          {
            name: 'Access From',
            type: 'pie',
            radius: ['28%', '46%'],
            radius: ['24%', '40%'],
            label: {
              formatter: "{a|{b}}\n\n{c} | {d}%",
              rich: {
@@ -232,9 +249,9 @@
</script>

<style lang="scss" scoped>
.main_app {
/*.main_app {
  height: 100%;
}
}*/

.main_content {
  display: flex;
@@ -249,7 +266,7 @@
  }

  .type_wrap {
    flex: 5;
    flex: 11;
    flex-shrink: 0;
    height: calc(100% - 20px);
    border-right: 12px solid #f7f7f7;
@@ -262,7 +279,7 @@
  }

  .dept_wrap {
    flex: 4;
    flex: 10;
    flex-shrink: 0;
    height: calc(100% - 20px);
    padding-left: 20px;
@@ -273,4 +290,4 @@
    }
  }
}
</style>
</style>