修改图谱样式问题

src/views/targetImprove/practice/knowledgeGraph.vue

@@ -3,21 +3,22 @@
 
     <div class="graph_top">
       <!-- 顶部信息模块 -->
-      <div class="knowledge_header">
-        <div class="header_top">
-          <span class="header_title">我的知识图谱</span>
-          <!-- 年级选择标签，只有一个年级时不显示 -->
-          <el-checkbox-group v-if="gradeList && gradeList.length > 1" v-model="currentGradeList" @change="handleGradeChange">
-            <el-checkbox v-for="grade in gradeList" :key="grade.value" :label="grade.value">
-              {{ grade.label }}
-            </el-checkbox>
-          </el-checkbox-group>
-        </div>
-        <div class="header_stats">
-          <span class="stats_text">
-            你的知识图谱共包含<span class="stats_num">{{ totalCount }}</span> 个知识点。当前红色薄弱知识点<span class="stats_weak"> {{ weakCount }}</span> 个，黄色待提升知识点<span class="stats_good"> {{ goodCount }}</span> 个，<span class="stats_excellent">坚持练习，把全部知识点都进阶为绿色已掌握状态吧！</span>
-          </span>
-        </div>
+      <div class="knowledge_info">
+          <div class="knowledge_header">
+            <div class="header_top">
+              <span class="header_title">我的知识图谱</span>
+              <!-- 年级选择标签，只有一个年级时不显示 -->
+              <el-checkbox-group v-if="gradeList && gradeList.length > 1" v-model="currentGradeList" @change="handleGradeChange">
+                <el-checkbox v-for="grade in gradeList" :key="grade.value" :label="grade.value">
+                  {{ grade.label }}
+                </el-checkbox>
+              </el-checkbox-group>
+            </div>
+          <div class="header_stats">
+            <span class="stats_text">
+              你的知识图谱共包含<span class="stats_num">{{ totalCount }}</span> 个知识点。当前红色薄弱知识点<span class="stats_weak"> {{ weakCount }}</span> 个，黄色待提升知识点<span class="stats_good"> {{ goodCount }}</span> 个，<span class="stats_excellent">坚持练习，把全部知识点都进阶为绿色已掌握状态吧！</span>
+            </span>
+          </div>
       </div>
 
       <!-- 环形扩散图组件 -->
@@ -30,6 +31,8 @@
         @activeTabChange="handleActiveTabChange"
         @add-practice="handleAddPractice"
         @knowledge-item-click="handleKnowledgeItemClick" />
+    </div>
+      
 
       <!-- 区域展示组件 -->
       <region
@@ -113,11 +116,12 @@ export default {
       // knowList 扁平化后的一维数组（用于统计、列表展示）
       flatKnowList: [],
       // 知识点分区：由 knowledge_partition 接口返回
-      // conquerZone: 薄弱补强区 / improveZone: 能力提升区 / consolidateZone: 扎实巩固区
+      // conquerZone: 薄弱补强区 / improveZone: 能力提升区 / consolidateZone: 扎实巩固区 / sprintZone: 冲刺进阶区
       partitionData: {
         conquerZone: [],
         improveZone: [],
-        consolidateZone: []
+        consolidateZone: [],
+        sprintZone: []
       },
       // 当前会话中"已加入练习"的知识点 ID 容器（响应式：父级 $set 后自动驱动子组件按钮置灰）
       // 形如 { '1001': true }
@@ -282,10 +286,12 @@ export default {
     fetchKnowledgeGraph() {
       // 读取学段CODE
       const levelCode = localStorage.getItem('student_level_code') || '';
-      // 年级codes：当前选中的value数组；如未初始化则取gradeList全部value
+      // 年级codes：优先取checkbox勾选的value；未初始化时取最后一个年级的value（与默认勾选最后一个逻辑一致）
       let gradeCodes = this.currentGradeList && this.currentGradeList.length
         ? this.currentGradeList
-        : (this.gradeList || []).map(g => g.value);
+        : (this.gradeList && this.gradeList.length > 0
+            ? [this.gradeList[this.gradeList.length - 1].value]
+            : []);
       // 学科code
       const subjectCode = this.subjectCode || '';
 
@@ -331,7 +337,9 @@ export default {
       const levelCode = localStorage.getItem('student_level_code') || '';
       let gradeCodes = this.currentGradeList && this.currentGradeList.length
         ? this.currentGradeList
-        : (this.gradeList || []).map(g => g.value);
+        : (this.gradeList && this.gradeList.length > 0
+            ? [this.gradeList[this.gradeList.length - 1].value]
+            : []);
       const subjectCode = this.subjectCode || '';
       const params = { levelCode, gradeCodes, subjectCode };
 
@@ -341,7 +349,8 @@ export default {
           this.partitionData = {
             conquerZone:    this.mapPartitionItem(Array.isArray(d.conquerZone)    ? d.conquerZone    : []),
             improveZone:    this.mapPartitionItem(Array.isArray(d.improveZone)    ? d.improveZone    : []),
-            consolidateZone:this.mapPartitionItem(Array.isArray(d.consolidateZone)? d.consolidateZone : [])
+            consolidateZone:this.mapPartitionItem(Array.isArray(d.consolidateZone)? d.consolidateZone : []),
+            sprintZone:    this.mapPartitionItem(Array.isArray(d.sprint)         ? d.sprint          : [])
           };
           // 默认选中：薄弱补强区第一条 → 能力提升区第一条 → 扎实巩固区第一条
           this.setDefaultSelectionFromPartition();
@@ -394,7 +403,8 @@ export default {
       this.partitionData = {
         conquerZone: [],
         improveZone: [],
-        consolidateZone: []
+        consolidateZone: [],
+        sprintZone: []
       };
     },
 
@@ -681,11 +691,11 @@ export default {
 
     /**
      * 从分区列表中移除已加入练习的知识点
-     * 遍历三个分区数组，按 knowledgeId 删除匹配项
+     * 遍历四个分区数组，按 knowledgeId 删除匹配项
      */
     removeKnowledgeFromPartition(knowledgeId) {
       const sid = String(knowledgeId);
-      const zones = ['conquerZone', 'improveZone', 'consolidateZone'];
+      const zones = ['conquerZone', 'improveZone', 'consolidateZone', 'sprintZone'];
       let changed = false;
       for (const zone of zones) {
         const list = this.partitionData[zone];
@@ -712,12 +722,15 @@ export default {
   box-sizing: border-box;
 
   .graph_top {
-    background: #FFFFFF;
-    border-radius: 10px;
-    padding: 20px;
     width: 100%;
     box-sizing: border-box;
     overflow: hidden;
+    .knowledge_info{
+      border-radius: 10px;
+      padding: 20px;
+      background: #FFFFFF;
+      margin-bottom: 10px;
+    }
   }
 
   /* 顶部信息模块 */

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

@@ -23,7 +23,7 @@
         >
           <div class="row_left">
             <span class="kp_name" :title="item.knowledgeName">{{ item.knowledgeName }}</span>
-            <div class="kp_meta">
+            <div class="kp_meta" :title="'得分率：' + getScoreRate(item) + '%  考频：' + getExamFreq(item)">
               <span class="kp_score">得分率：{{ getScoreRate(item) }}%</span>
               <span class="kp_freq_tag">考频：{{ getExamFreq(item) }}</span>
             </div>
@@ -61,7 +61,7 @@
         >
           <div class="row_left">
             <span class="kp_name" :title="item.knowledgeName">{{ item.knowledgeName }}</span>
-            <div class="kp_meta">
+            <div class="kp_meta" :title="'得分率：' + getScoreRate(item) + '%  考频：' + getExamFreq(item)">
               <span class="kp_score">得分率：{{ getScoreRate(item) }}%</span>
               <span class="kp_freq_tag">考频：{{ getExamFreq(item) }}</span>
             </div>
@@ -99,7 +99,7 @@
         >
           <div class="row_left">
             <span class="kp_name" :title="item.knowledgeName">{{ item.knowledgeName }}</span>
-            <div class="kp_meta">
+            <div class="kp_meta" :title="'得分率：' + getScoreRate(item) + '%  考频：' + getExamFreq(item)">
               <span class="kp_score">得分率：{{ getScoreRate(item) }}%</span>
               <span class="kp_freq_tag">考频：{{ getExamFreq(item) }}</span>
             </div>
@@ -137,7 +137,7 @@
         >
           <div class="row_left">
             <span class="kp_name" :title="item.knowledgeName">{{ item.knowledgeName }}</span>
-            <div class="kp_meta">
+            <div class="kp_meta" :title="'得分率：' + getScoreRate(item) + '%  考频：' + getExamFreq(item)">
               <span class="kp_score">得分率：{{ getScoreRate(item) }}%</span>
               <span class="kp_freq_tag">考频：{{ getExamFreq(item) }}</span>
             </div>
@@ -163,12 +163,14 @@ export default {
     // conquerZone:    薄弱补强区
     // improveZone:    能力提升区
     // consolidateZone:扎实巩固区
+    // sprintZone:     冲刺进阶区（接口字段：sprint）
     partitionData: {
       type: Object,
       default: () => ({
         conquerZone: [],
         improveZone: [],
-        consolidateZone: []
+        consolidateZone: [],
+        sprintZone: []
       })
     },
     // 父级传入的"联动选中知识点ID"
@@ -201,7 +203,7 @@ export default {
       handler(newVal, oldVal) {
         // 快速跳过空对象/完全一样的引用
         if (!this.selectedKnowledgeId) return;
-        const lists = ['conquerZone', 'improveZone', 'consolidateZone'];
+        const lists = ['conquerZone', 'improveZone', 'consolidateZone', 'sprintZone'];
         let hasAnyData = false;
         if (newVal) {
           for (const k of lists) {
@@ -236,9 +238,9 @@ export default {
     excellentArea() {
       return Array.isArray(this.partitionData?.consolidateZone) ? this.partitionData.consolidateZone : [];
     },
-    // 冲刺进阶区：暂时隐藏，预留空数组
+    // 冲刺进阶区：使用接口返回的 sprint 数组（父级映射为 partitionData.sprintZone）
     advancedArea() {
-      return [];
+      return Array.isArray(this.partitionData?.sprintZone) ? this.partitionData.sprintZone : [];
     }
   },
   methods: {
@@ -393,8 +395,7 @@ export default {
 .region_container {
   display: flex;
   flex-direction: row;
-  gap: 16px;
-  padding: 16px;
+  gap: 10px;
   width: 100%;
   box-sizing: border-box;
   align-items: stretch;
@@ -563,9 +564,19 @@ export default {
       display: flex;
       align-items: center;
       gap: 10px;
-      flex-wrap: wrap;
+      flex-wrap: nowrap;            /* 禁止换行，小屏下更美观 */
+      overflow: hidden;
       color: #999999; /* 考频字色固定浅灰 */
       font-size: 12px;
+
+      .kp_score,
+      .kp_freq_tag {
+        overflow: hidden;
+        text-overflow: ellipsis;
+        white-space: nowrap;
+        flex-shrink: 1;
+        min-width: 0;
+      }
     }
   }
 
@@ -670,7 +681,6 @@ export default {
 @media (max-width: 1366px) {
   .region_container {
     gap: 10px;
-    padding: 10px;
   }
   .region_section {
     height: 460px;