修改首页显示和统计任务

wangrong

2026-09-26 781539c6bea54b7689baf008e22fb25028729b4a

 src/modules/report/views/screen/map.vue

@@ -85,6 +85,7 @@
import ScreenMapPanel from '../../components/screen-map-panel.vue';
import CameraMonitor from '../../../monitor/views/cameras.vue';
import { TIME_RANGE_OPTIONS } from '../../data/screen';
import { chartSeries, pieTooltipFormatter, toPieData } from '../../data/screen-chart';
import { useChartTheme, useScreenData, useScreenFieldSource } from '../../hooks/use-screen';

const { data, timeRange } = useScreenData();
@@ -142,7 +143,7 @@

/** 垃圾分类结构（饼） */
const mixOption = computed(() => ({
   tooltip: { trigger: 'item', formatter: '{b}<br/>{c} ({d}%)', ...tooltip() },
   tooltip: { trigger: 'item', ...tooltip(), formatter: pieTooltipFormatter() },
   series: [
      {
         type: 'pie',
@@ -151,18 +152,18 @@
         padAngle: 3,
         itemStyle: { borderRadius: 6 },
         label: { color: textColor.value, formatter: '{b}\n{d}%' },
         data: data.value.wasteMix.map(e => ({
            name: e.name,
            value: e[mixMetric.value],
            itemStyle: { color: e.color }
         }))
         data: toPieData(
            chartSeries(data.value.wasteMix, e => e[mixMetric.value]),
            e => e.name,
            e => e.color
         )
      }
   ]
}));

/** 碳减排来源（饼） */
/** 碳减排来源（饼）：碳值可为负，按绝对值展示减排量 */
const carbonOption = computed(() => ({
   tooltip: { trigger: 'item', formatter: '{b}<br/>{c} kgCO₂e ({d}%)', ...tooltip() },
   tooltip: { trigger: 'item', ...tooltip(), formatter: pieTooltipFormatter('kgCO₂e') },
   series: [
      {
         type: 'pie',
@@ -171,11 +172,11 @@
         padAngle: 3,
         itemStyle: { borderRadius: 6 },
         label: { color: textColor.value, formatter: '{b}\n{d}%' },
         data: data.value.recycleItems.map(e => ({
            name: e.name + '回收',
            value: e.carbon,
            itemStyle: { color: e.color }
         }))
         data: toPieData(
            chartSeries(data.value.recycleItems, e => e.carbon, { carbon: true }),
            e => e.name + '回收',
            e => e.color
         )
      }
   ]
}));
@@ -208,8 +209,12 @@

/** 各类回收量（横向条形） */
const itemOption = computed(() => {
   // 反转让数值最大的排在顶部
   const rows = [...data.value.recycleItems].reverse();
   const carbon = itemMetric.value === 'carbon';
   const rows = chartSeries(
      data.value.recycleItems,
      e => Number(e[itemMetric.value] || 0),
      { carbon, evenSplit: false }
   ).reverse();
   return {
      grid: { containLabel: true, left: 8, right: 24, top: 12, bottom: 8 },
      tooltip: {
@@ -229,7 +234,7 @@
      },
      yAxis: {
         type: 'category',
         data: rows.map(e => e.name),
         data: rows.map(e => e.item.name),
         axisLabel: { color: textColor.value },
         axisLine: { show: false },
         axisTick: { show: false }
@@ -238,11 +243,10 @@
         {
            type: 'bar',
            barWidth: 14,
            data: rows.map(e => Number(e[itemMetric.value] || 0)),
            data: rows.map(e => e.value),
            itemStyle: {
               borderRadius: [0, 8, 8, 0],
               // 沿用各类自身配色，与左侧碳减排饼图视觉一致
               color: (params: any) => rows[params.dataIndex]?.color || primary.value
               color: (params: any) => rows[params.dataIndex]?.item.color || primary.value
            }
         }
      ]