优化动画

src/views/Dashboard.vue

@@ -148,6 +148,11 @@ function updateTimelineChart() {
   const allCodes: StatusCode[] = ['idle', 'busy', 'reasoning', 'using_tool', 'running', 'pending', 'retry', 'completed', 'permission', 'error']
   const codeIndex = Object.fromEntries(allCodes.map((c, i) => [c, i]))
 
+  const seriesData = codes.map((code, i) => ({
+    value: codeIndex[code],
+    itemStyle: {color: getColor(code)},
+  }))
+
   const isDark = theme.value === 'dark'
   timelineChart.setOption({
     tooltip: {
@@ -174,15 +179,11 @@ function updateTimelineChart() {
     },
     series: [{
       type: 'line',
-      data: codes.map((code) => codeIndex[code]),
+      data: seriesData,
       smooth: true,
       symbol: 'circle',
       symbolSize: 8,
       lineStyle: {width: 2, color: '#1890ff'},
-      itemStyle: {
-        color: (params: any) => getColor(codes[params.dataIndex]),
-        borderWidth: 2,
-      },
       areaStyle: {
         color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
           {offset: 0, color: 'rgba(24,144,255,0.25)'},
@@ -190,7 +191,7 @@ function updateTimelineChart() {
         ]),
       },
     }],
-  })
+  }, {replaceMerge: ['series']})
 }
 
 watch(todayStats, () => {
@@ -199,7 +200,7 @@ watch(todayStats, () => {
 
 watch(eventLog, () => {
   nextTick(updateTimelineChart)
-})
+}, {deep: true})
 
 watch(theme, () => {
   nextTick(() => {