修改暂无数据

src/views/targetImprove/practice/knowledgeGraph/circularDiffusion.vue

@@ -41,7 +41,7 @@
             </div>
           </div>
           <div v-if="hasGraphData" ref="chart" class="chart" style="width: 100%;"></div>
-          <div v-else class="empty_tip no_content_data"><span>暂无数据</span></div>
+          <div v-else class="empty_tip no_content_data"><span >暂无数据</span></div>
         </div>
 
         <!-- 右侧容器 -->
@@ -64,7 +64,8 @@
                 </el-button>
               </div>
             </div>
-            <div ref="lineChart" class="line_chart"></div>
+            <div v-if="hasLineChartData" ref="lineChart" class="line_chart"></div>
+            <div v-else class="empty_tip no_content_data"><span >暂无数据</span></div>
           </div>
 
           <!-- Tab切换和表格 -->
@@ -75,7 +76,7 @@
               <el-radio-button label="practice">练习</el-radio-button>
             </el-radio-group>
 
-            <el-table :data="filteredTableData" border stripe class="data_table">
+            <el-table v-if="hasTableData" :data="filteredTableData" border stripe class="data_table">
               <el-table-column prop="index" label="序号" width="60" align="center">
                 <template slot-scope="scope">
                   {{ scope.$index + 1 }}
@@ -89,6 +90,7 @@
                 </template>
               </el-table-column>
             </el-table>
+            <div v-else class="empty_tip no_content_data"><span style="margin-top:8%">暂无数据</span></div>
           </div>
         </div>
       </div>
@@ -362,6 +364,12 @@ export default {
       }
       return list.filter(row => row.dataType === 2 || row.type === 'practice');
     },
+    hasLineChartData() {
+      return Array.isArray(this.selectedExamList) && this.selectedExamList.length > 0;
+    },
+    hasTableData() {
+      return Array.isArray(this.filteredTableData) && this.filteredTableData.length > 0;
+    },
     // 列表视图：根据图例选中状态过滤树形表格数据
     filteredTableDataForList() {
       if (!Array.isArray(this.tableData)) return [];
@@ -481,6 +489,21 @@ export default {
       },
       deep: true
     },
+    // 选中知识点的考试/练习明细变化时，无数据则销毁折线图，有数据则初始化或刷新
+    selectedExamList: {
+      handler() {
+        this.$nextTick(() => {
+          if (this.activeView !== 'graph') return;
+          if (this.hasLineChartData) {
+            if (this.lineChart) this.updateLineChart();
+            else this.initLineChart();
+          } else if (this.lineChart) {
+            this.lineChart.dispose();
+            this.lineChart = null;
+          }
+        });
+      }
+    },
     tableData: {
       deep: true,
       handler(newVal) {
@@ -1644,6 +1667,16 @@ export default {
             height: 180px;
             padding: 15px;
           }
+
+          .empty_tip {
+            height: 210px;
+            width: 100%;
+            border-radius: 8px;
+            background-position: 50% 50% !important;
+            span {
+              margin-top: 23%;
+            }
+          }
         }
 
         .table_container {
@@ -1707,6 +1740,15 @@ export default {
             }
           }
 
+          .empty_tip {
+            height: 360px;
+            width: 100%;
+            border-radius: 8px;
+            span {
+              margin-top: 23%;
+            }
+          }
+
           .data_table {
             height: 360px;
             border-radius: 6px;
@@ -1856,8 +1898,9 @@ export default {
           min-height: 590px;
           width: 100%;
           border-radius: 8px;
+          background-position: 50% 50% !important;
           span {
-            margin-top: 23%;
+            margin-top: 12%;
           }
         }
 
@@ -1949,7 +1992,7 @@ export default {
         width: 100%;
         border-radius: 8px;
         span {
-          margin-top: 23%;
+          margin-top: -1%;
         }
       }
 

src/views/targetImprove/practice/knowledgeGraph/region.vue

@@ -538,9 +538,9 @@ export default {
   transform: translate(-50%, -50%);
   width: 100%;
   border-radius: 8px;
-
+  
   span {
-    margin-top: 23%;
+    margin-top: 28%;
   }
 }