fix(ops): 修复仪表盘图表不显示 — funnelData 字段名与后端 statusDistribution 不匹配
后端 API 返回的字段名为 statusDistribution,但前端类型定义和数据映射使用的是 funnelData, 导致工单状态分布、工牌队列统计、功能类型排行图表数据为 undefined 无法渲染。 Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
@@ -198,7 +198,7 @@ export interface DashboardStatsResp {
|
||||
dates: string[];
|
||||
responseTimeData: number[];
|
||||
};
|
||||
funnelData: Array<{ name: string; value: number }>;
|
||||
statusDistribution: Array<{ name: string; value: number }>;
|
||||
heatmapData: { data: number[][]; days: string[]; hours: string[] };
|
||||
functionTypeRanking: Array<{
|
||||
completed: number;
|
||||
|
||||
@@ -64,7 +64,7 @@ interface DashboardStats {
|
||||
};
|
||||
|
||||
// 工单状态分布
|
||||
funnelData: Array<{ name: string; value: number }>;
|
||||
statusDistribution: Array<{ name: string; value: number }>;
|
||||
|
||||
// 时段热力图数据(近7天 x 24小时)
|
||||
heatmapData: {
|
||||
@@ -136,7 +136,7 @@ const statsData = ref<DashboardStats>({
|
||||
responseTimeData: [],
|
||||
completionTimeData: [],
|
||||
},
|
||||
funnelData: [],
|
||||
statusDistribution: [],
|
||||
heatmapData: {
|
||||
days: [],
|
||||
hours: [],
|
||||
@@ -156,7 +156,7 @@ const EMPTY_STATS: DashboardStats = {
|
||||
trendData: { dates: [], createdData: [], completedData: [] },
|
||||
hourlyDistribution: { hours: [], data: [] },
|
||||
timeTrendData: { dates: [], responseTimeData: [], completionTimeData: [] },
|
||||
funnelData: [],
|
||||
statusDistribution: [],
|
||||
heatmapData: { days: [], hours: [], data: [] },
|
||||
functionTypeRanking: [],
|
||||
};
|
||||
@@ -396,7 +396,7 @@ function getTimeTrendChartOptions(): ECOption {
|
||||
* 工单状态分布环形饼图配置
|
||||
*/
|
||||
function getFunnelChartOptions(): ECOption {
|
||||
const { funnelData } = statsData.value;
|
||||
const { statusDistribution } = statsData.value;
|
||||
const STATUS_COLORS: Record<string, string> = {
|
||||
待处理: '#f5a623',
|
||||
排队中: '#8b5cf6',
|
||||
@@ -406,7 +406,7 @@ function getFunnelChartOptions(): ECOption {
|
||||
已取消: '#f43f5e',
|
||||
已暂停: '#94a3b8',
|
||||
};
|
||||
const total = funnelData.reduce((sum, item) => sum + item.value, 0);
|
||||
const total = statusDistribution.reduce((sum, item) => sum + item.value, 0);
|
||||
return {
|
||||
tooltip: {
|
||||
trigger: 'item',
|
||||
@@ -478,7 +478,7 @@ function getFunnelChartOptions(): ECOption {
|
||||
borderWidth: 2,
|
||||
borderRadius: 4,
|
||||
},
|
||||
data: funnelData.map((item) => ({
|
||||
data: statusDistribution.map((item) => ({
|
||||
...item,
|
||||
itemStyle: {
|
||||
color: STATUS_COLORS[item.name] || '#d1d5db',
|
||||
@@ -745,7 +745,7 @@ async function loadStats() {
|
||||
trendData: resp.trendData,
|
||||
hourlyDistribution: resp.hourlyDistribution,
|
||||
timeTrendData: resp.timeTrendData,
|
||||
funnelData: resp.funnelData,
|
||||
statusDistribution: resp.statusDistribution,
|
||||
heatmapData: resp.heatmapData,
|
||||
functionTypeRanking: resp.functionTypeRanking,
|
||||
monthlyTrendData: resp.monthlyTrendData,
|
||||
|
||||
Reference in New Issue
Block a user