From c9b35826ad94529aefbb8a3485c86a813c19f34e Mon Sep 17 00:00:00 2001
From: chenlin <linchenm@isoftstone.com>
Date: Thu, 8 Jan 2026 18:08:29 +0800
Subject: [PATCH] =?UTF-8?q?echarts=E5=88=B7=E6=96=B0bug=E4=BF=AE=E5=A4=8D?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/views/Home/Index10.vue | 16 +++++++++++++---
 src/views/Home/Index12.vue | 16 +++++++++++++---
 src/views/Home/Index13.vue | 16 +++++++++++++---
 3 files changed, 39 insertions(+), 9 deletions(-)

diff --git a/src/views/Home/Index10.vue b/src/views/Home/Index10.vue
index c04c599..d86df45 100644
--- a/src/views/Home/Index10.vue
+++ b/src/views/Home/Index10.vue
@@ -144,7 +144,7 @@
           </div>
           <div class="card-content">
             <div class="line-chart-wrapper">
-              <Echart :options="hiddenDangerChartOption" width="100%" height="180px" />
+              <Echart :key="hiddenDangerChartKey" :options="hiddenDangerChartOption" width="100%" height="180px" />
             </div>
             <div class="rectification-status-grid">
               <div class="distribution-title">区域整改状态</div>
@@ -669,6 +669,16 @@ const riskChartOption = computed<EChartsOption>(() => {
   }
 })
 
+// 隐患管理图表 key，用于强制刷新图表
+const hiddenDangerChartKey = computed(() => {
+  // 基于数据长度和内容生成 key，确保数据变化时图表能正确刷新
+  const dataLength = hiddenDangerTrend.value.length
+  const dataHash = dataLength > 0 
+    ? JSON.stringify(hiddenDangerTrend.value.map(item => `${item.date}-${item.general}-${item.major}`)).slice(0, 50)
+    : 'empty'
+  return `hidden-danger-${dataLength}-${dataHash}`
+})
+
 // 隐患管理折线图配置
 const hiddenDangerChartOption = computed<EChartsOption>(() => {
   // 提取日期和对应的数据
@@ -713,12 +723,12 @@ const hiddenDangerChartOption = computed<EChartsOption>(() => {
     xAxis: {
       type: 'category',
       boundaryGap: false,
-      data: dates.length > 0 ? dates : [],
+      data: isEmpty ? [] : dates,
       show: !isEmpty
     },
     yAxis: {
       type: 'value',
-      max: yAxisMax,
+      max: isEmpty ? 10 : yAxisMax,
       show: !isEmpty
     },
     graphic: isEmpty ? [
diff --git a/src/views/Home/Index12.vue b/src/views/Home/Index12.vue
index 1bc13ff..8a90408 100644
--- a/src/views/Home/Index12.vue
+++ b/src/views/Home/Index12.vue
@@ -146,8 +146,8 @@
                     </div>
           <div class="card-content">
             <div class="line-chart-wrapper">
-              <Echart :options="hiddenDangerChartOption" width="100%" height="180px" />
-                  </div>
+              <Echart :key="hiddenDangerChartKey" :options="hiddenDangerChartOption" width="100%" height="180px" />
+            </div>
             <div class="rectification-status-grid">
               <div class="distribution-title">园区整改状态</div>
               <div v-if="parkRectificationStatus.length === 0" class="empty-data-tip">
@@ -1182,6 +1182,16 @@ const riskChartOption = computed<EChartsOption>(() => {
   }
 })
 
+// 隐患管理图表 key，用于强制刷新图表
+const hiddenDangerChartKey = computed(() => {
+  // 基于数据长度和内容生成 key，确保数据变化时图表能正确刷新
+  const dataLength = hiddenDangerTrend.value.length
+  const dataHash = dataLength > 0 
+    ? JSON.stringify(hiddenDangerTrend.value.map(item => `${item.date}-${item.general}-${item.major}`)).slice(0, 50)
+    : 'empty'
+  return `hidden-danger-${dataLength}-${dataHash}`
+})
+
 // 隐患管理折线图配置
 const hiddenDangerChartOption = computed<EChartsOption>(() => {
   const dates = hiddenDangerTrend.value.map(item => item.date).filter(date => date) // 过滤掉空日期
@@ -1203,7 +1213,7 @@ const hiddenDangerChartOption = computed<EChartsOption>(() => {
     xAxis: {
       type: 'category',
       boundaryGap: false,
-      data: dates,
+      data: isEmpty ? [] : dates,
       show: !isEmpty
     },
     yAxis: { 
diff --git a/src/views/Home/Index13.vue b/src/views/Home/Index13.vue
index 090422e..56a5aa1 100644
--- a/src/views/Home/Index13.vue
+++ b/src/views/Home/Index13.vue
@@ -143,8 +143,8 @@
                     </div>
           <div class="card-content">
             <div class="line-chart-wrapper">
-              <Echart :options="hiddenDangerChartOption" width="100%" height="180px" />
-                  </div>
+              <Echart :key="hiddenDangerChartKey" :options="hiddenDangerChartOption" width="100%" height="180px" />
+            </div>
             <div class="rectification-status-grid">
               <div class="distribution-title">所属公司整改状态</div>
               <div v-if="companyRectificationStatus.length === 0" class="empty-data-tip">
@@ -1141,6 +1141,16 @@ const riskChartOption = computed<EChartsOption>(() => {
   }
 })
 
+// 隐患管理图表 key，用于强制刷新图表
+const hiddenDangerChartKey = computed(() => {
+  // 基于数据长度和内容生成 key，确保数据变化时图表能正确刷新
+  const dataLength = hiddenDangerTrend.value.length
+  const dataHash = dataLength > 0 
+    ? JSON.stringify(hiddenDangerTrend.value.map(item => `${item.date}-${item.general}-${item.major}`)).slice(0, 50)
+    : 'empty'
+  return `hidden-danger-${dataLength}-${dataHash}`
+})
+
 // 隐患管理折线图配置
 const hiddenDangerChartOption = computed<EChartsOption>(() => {
   const dates = hiddenDangerTrend.value.map(item => item.date).filter(date => date) // 过滤掉空日期
@@ -1162,7 +1172,7 @@ const hiddenDangerChartOption = computed<EChartsOption>(() => {
     xAxis: {
       type: 'category',
       boundaryGap: false,
-      data: dates,
+      data: isEmpty ? [] : dates,
       show: !isEmpty
     },
     yAxis: {