forked from drone/command-center-dashboard

shuishen
2025-04-16 a7e6761ba0cfccdf33ed552eb2d3b783c8e4ab4a
src/views/TaskManage/TaskTop/TaskIndustry.vue
@@ -9,8 +9,12 @@
<script setup>
import * as echarts from 'echarts';
import { industryJobNumPieChart } from '@/api/home/task';
import useEchartsResize from '@/hooks/useEchartsResize';
import { useStore } from 'vuex';
const store = useStore();
const chartRef = ref(null);
let chart = null;
let { chart } = useEchartsResize(chartRef);
const option = {
  tooltip: {
@@ -64,8 +68,8 @@
};
// 获取行业统计数据
const getIndustryJobNumPieChart = () => {
  industryJobNumPieChart().then(res => {
const getIndustryJobNumPieChart = (value) => {
  industryJobNumPieChart(value).then(res => {
    if (res.data.code !== 0) return;
    option.series[0].data.forEach(item => {
      const matchData = res.data.data.find(d => d.name === item.name);
@@ -73,7 +77,7 @@
        item.value = matchData.value;
      }
    });
    chart.setOption(option);
    chart.value.setOption(option);
  });
};
@@ -90,23 +94,20 @@
//       }
//     }));
//     option.series[0].data = data;
//     chart.setOption(option);
//     chart.value.setOption(option);
//   });
// };
// 添加监听
watch(() => store.state.task.taskSearchParams, (newVal) => {
  console.log(newVal, '2222');
  if (newVal) {
    getIndustryJobNumPieChart(newVal);
  }
}, { deep: true });
onMounted(() => {
  chart = echarts.init(chartRef.value);
  getIndustryJobNumPieChart();
  window.addEventListener('resize', () => {
    chart?.resize();
  });
});
onUnmounted(() => {
  window.removeEventListener('resize', chart?.resize);
  chart?.dispose();
  getIndustryJobNumPieChart({date_enum: 'TODAY'});
});
</script>
@@ -116,17 +117,18 @@
  width: 244px;
  height: 100%;
  .title {
    margin-top: 10px;
    margin-top: 10px;
    width: 244px;
    height: 26px;
    background: url('@/assets/images/task/title.png') no-repeat center / 100% 100%;
    color: #CFEAFF;
    padding-left: 38px;
    line-height: 8px;
    font-size: 14px;
  }
  .chart {
    width: 100%;
    height: 200px;
  }
}
</style>
</style>