refactor(ops): 统计面板变量重命名与 EMPTY_STATS 补全
- hourlyChartRef → heatmapChartRef(实际用于热力图渲染) - funnelChartRef → statusChartRef(漏斗图已改为状态分布饼图) - getFunnelChartOptions → getStatusDistributionChartOptions - EMPTY_STATS 补全 monthlyTrendData 和 badgeQueueStats 字段 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -100,16 +100,16 @@ const chartLoading = ref(true);
|
||||
|
||||
// 图表引用
|
||||
const trendChartRef = ref();
|
||||
const hourlyChartRef = ref();
|
||||
const heatmapChartRef = ref();
|
||||
const timeTrendChartRef = ref();
|
||||
const funnelChartRef = ref();
|
||||
const statusChartRef = ref();
|
||||
const functionTypeRankingChartRef = ref();
|
||||
const badgeQueueChartRef = ref();
|
||||
|
||||
const { renderEcharts: renderTrendChart } = useEcharts(trendChartRef);
|
||||
const { renderEcharts: renderHourlyChart } = useEcharts(hourlyChartRef);
|
||||
const { renderEcharts: renderHeatmapChart } = useEcharts(heatmapChartRef);
|
||||
const { renderEcharts: renderTimeTrendChart } = useEcharts(timeTrendChartRef);
|
||||
const { renderEcharts: renderFunnelChart } = useEcharts(funnelChartRef);
|
||||
const { renderEcharts: renderStatusChart } = useEcharts(statusChartRef);
|
||||
const { renderEcharts: renderFunctionTypeRankingChart } = useEcharts(
|
||||
functionTypeRankingChartRef,
|
||||
);
|
||||
@@ -159,6 +159,8 @@ const EMPTY_STATS: DashboardStats = {
|
||||
statusDistribution: [],
|
||||
heatmapData: { days: [], hours: [], data: [] },
|
||||
functionTypeRanking: [],
|
||||
monthlyTrendData: undefined,
|
||||
badgeQueueStats: undefined,
|
||||
};
|
||||
|
||||
// ========== 图表配置 ==========
|
||||
@@ -395,7 +397,7 @@ function getTimeTrendChartOptions(): ECOption {
|
||||
/**
|
||||
* 工单状态分布环形饼图配置
|
||||
*/
|
||||
function getFunnelChartOptions(): ECOption {
|
||||
function getStatusDistributionChartOptions(): ECOption {
|
||||
const { statusDistribution } = statsData.value;
|
||||
const STATUS_COLORS: Record<string, string> = {
|
||||
待处理: '#f5a623',
|
||||
@@ -756,9 +758,9 @@ async function loadStats() {
|
||||
chartLoading.value = false;
|
||||
await nextTick();
|
||||
renderTrendChart(getTrendChartOptions());
|
||||
renderHourlyChart(getHeatmapChartOptions());
|
||||
renderHeatmapChart(getHeatmapChartOptions());
|
||||
renderTimeTrendChart(getTimeTrendChartOptions());
|
||||
renderFunnelChart(getFunnelChartOptions());
|
||||
renderStatusChart(getStatusDistributionChartOptions());
|
||||
renderFunctionTypeRankingChart(getFunctionTypeRankingChartOptions());
|
||||
renderBadgeQueueChart(getBadgeQueueChartOptions());
|
||||
} catch {
|
||||
@@ -914,7 +916,7 @@ onUnmounted(stopPolling);
|
||||
</Tooltip>
|
||||
</template>
|
||||
<Spin :spinning="chartLoading">
|
||||
<EchartsUI ref="hourlyChartRef" class="chart-container" />
|
||||
<EchartsUI ref="heatmapChartRef" class="chart-container" />
|
||||
</Spin>
|
||||
</Card>
|
||||
</Col>
|
||||
@@ -953,7 +955,7 @@ onUnmounted(stopPolling);
|
||||
</template>
|
||||
<Spin :spinning="chartLoading">
|
||||
<EchartsUI
|
||||
ref="funnelChartRef"
|
||||
ref="statusChartRef"
|
||||
class="chart-container chart-container--medium"
|
||||
/>
|
||||
</Spin>
|
||||
|
||||
Reference in New Issue
Block a user