图谱增加题量

src/views/targetImprove/practice/knowledgeGraph.vue

@@ -658,7 +658,7 @@ export default {
           const startEl = (sourceEl && sourceEl.nodeType === 1)
             ? sourceEl
             : this.getGrabSourceEl();
-          const animPromise = this.createGrabAnimation(startEl);
+          const animPromise = this.createGrabAnimation(startEl, item);
           // 3. 从 region 分区列表中移除该条数据
           this.removeKnowledgeFromPartition(knowledgeId);
           await animPromise;
@@ -679,24 +679,56 @@ export default {
       const chartRef = this.$refs.circularDiffusion;
       return (chartRef && chartRef.$refs && chartRef.$refs.grabSourceEl) || null;
     },
+    /**
+     * 按知识点类型取分区条目的背景色 / 边框色
+     * 1薄弱 #F2B5B5 / 2能力提升 #F7DEA5 / 3扎实巩固 #AEE2C5 / 其他冲刺 #B9CBFC
+     */
+    getZoneGrabTheme(item) {
+      const t = Number(item && (item.knowledgeType ?? item.type));
+      if (t === 2) return { backgroundColor: '#FFFFFF', borderColor: '#F7DEA5' };
+      if (t === 3) return { backgroundColor: '#FFFFFF', borderColor: '#AEE2C5' };
+      if (t === 4) return { backgroundColor: '#FFFFFF', borderColor: '#B9CBFC' };
+      return { backgroundColor: '#FFFFFF', borderColor: '#F2B5B5' };
+    },
     /**
      * 抓取飞入动画：从加入练习模块飞向顶部「知识点练习作答」
      * 起点/终点均用 getBoundingClientRect（相对视口），自动适配页面滚动
+     * 克隆体带上当前分区条目的背景色和边框色
      */
-    createGrabAnimation(startEl) {
+    createGrabAnimation(startEl, item) {
       try {
         const endEl = document.querySelector('.js-practice-answer-step');
         if (!startEl || !endEl) return Promise.resolve();
 
-        const startRect = startEl.getBoundingClientRect();
+        const visualEl = (startEl.closest && startEl.closest('.knowledge_row')) || startEl;
+        const startRect = visualEl.getBoundingClientRect();
         const endRect = endEl.getBoundingClientRect();
         if (!startRect.width || !startRect.height) return Promise.resolve();
 
         const HOLD_MS = 60;
         const FLY_MS = 600;
         const FADE_MS = 100;
+        const theme = this.getZoneGrabTheme(item);
+        let backgroundColor = theme.backgroundColor;
+        let borderColor = theme.borderColor;
+        let borderRadius = '4px';
+        const isRow = visualEl.classList && visualEl.classList.contains('knowledge_row');
+        if (isRow) {
+          try {
+            const cs = window.getComputedStyle(visualEl);
+            if (cs.backgroundColor && cs.backgroundColor !== 'rgba(0, 0, 0, 0)' && cs.backgroundColor !== 'transparent') {
+              backgroundColor = cs.backgroundColor;
+            }
+            if (cs.borderColor && cs.borderColor !== 'rgba(0, 0, 0, 0)') {
+              borderColor = cs.borderColor;
+            }
+            if (cs.borderRadius) {
+              borderRadius = cs.borderRadius;
+            }
+          } catch (e) {}
+        }
 
-        const clone = startEl.cloneNode(true);
+        const clone = visualEl.cloneNode(true);
         clone.style.position = 'fixed';
         clone.style.left = `${startRect.left}px`;
         clone.style.top = `${startRect.top}px`;
@@ -706,7 +738,9 @@ export default {
         clone.style.zIndex = '2000';
         clone.style.transition = `transform ${FLY_MS}ms cubic-bezier(.22,.61,.36,1)`;
         clone.style.boxSizing = 'border-box';
-        clone.style.backgroundColor = '#ffffff';
+        clone.style.backgroundColor = backgroundColor;
+        clone.style.border = `1px solid ${borderColor}`;
+        clone.style.borderRadius = borderRadius;
         clone.style.boxShadow = '0 4px 12px rgba(0, 0, 0, 0.3)';
         clone.style.overflow = 'hidden';
         clone.style.pointerEvents = 'none';

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

@@ -52,7 +52,10 @@
             <div class="chart_title" v-if="selectedKnowledgeName">
               <div class="chart_title_left">
                 <span class="title_text" :title="selectedKnowledgeName">{{ selectedKnowledgeName }}</span>
-                <span class="exam_freq">考频：{{ filteredTableData.length }}</span>
+                <div class="title_meta">
+                  <span class="exam_freq">考频：{{ filteredTableData.length }}</span>
+                  <span class="exam_freq">题量：{{ selectedQuestionNum }}</span>
+                </div>
               </div>
               <div ref="grabSourceEl" class="add_practice_grab_source">
                 <el-button
@@ -298,6 +301,14 @@ export default {
     hasGraphData() {
       return Array.isArray(this.tableData) && this.tableData.length > 0;
     },
+    // 当前选中知识点的题量
+    selectedQuestionNum() {
+      const item = this.currentKnowledgeItem;
+      const num = item && item.questionNum;
+      if (num === null || num === undefined || num === '') return 0;
+      const n = Number(num);
+      return isNaN(n) ? 0 : n;
+    },
     // 当前选中知识点是否"已加入练习"
     // 优先级：1) 父级 addedKnowledgeIds（当前会话刚点按钮成功，立即生效）→ 2) 节点自身 isJoin===1（接口返回的静态字段）
     selectedIsJoin() {
@@ -1597,6 +1608,12 @@ export default {
               line-height: 1.2;
             }
 
+            .title_meta {
+              display: flex;
+              align-items: center;
+              gap: 12px;
+            }
+
             .add_practice_grab_source {
               flex-shrink: 0;
             }

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

@@ -23,9 +23,10 @@
         >
           <div class="row_left">
             <span class="kp_name" :title="item.knowledgeName">{{ item.knowledgeName }}</span>
-            <div class="kp_meta" :title="'得分率：' + getScoreRate(item) + '%  考频：' + getExamFreq(item)">
+            <div class="kp_meta" :title="'得分率：' + getScoreRate(item) + '%  考频：' + getExamFreq(item) + '  题量：' + getQuestionNum(item)">
               <span class="kp_score">得分率：{{ getScoreRate(item) }}%</span>
               <span class="kp_freq_tag">考频：{{ getExamFreq(item) }}</span>
+              <span class="kp_freq_tag">题量：{{ getQuestionNum(item) }}</span>
             </div>
           </div>
           <div class="row_right">
@@ -62,9 +63,10 @@
         >
           <div class="row_left">
             <span class="kp_name" :title="item.knowledgeName">{{ item.knowledgeName }}</span>
-            <div class="kp_meta" :title="'得分率：' + getScoreRate(item) + '%  考频：' + getExamFreq(item)">
+            <div class="kp_meta" :title="'得分率：' + getScoreRate(item) + '%  考频：' + getExamFreq(item) + '  题量：' + getQuestionNum(item)">
               <span class="kp_score">得分率：{{ getScoreRate(item) }}%</span>
               <span class="kp_freq_tag">考频：{{ getExamFreq(item) }}</span>
+              <span class="kp_freq_tag">题量：{{ getQuestionNum(item) }}</span>
             </div>
           </div>
           <div class="row_right">
@@ -101,9 +103,10 @@
         >
           <div class="row_left">
             <span class="kp_name" :title="item.knowledgeName">{{ item.knowledgeName }}</span>
-            <div class="kp_meta" :title="'得分率：' + getScoreRate(item) + '%  考频：' + getExamFreq(item)">
+            <div class="kp_meta" :title="'得分率：' + getScoreRate(item) + '%  考频：' + getExamFreq(item) + '  题量：' + getQuestionNum(item)">
               <span class="kp_score">得分率：{{ getScoreRate(item) }}%</span>
               <span class="kp_freq_tag">考频：{{ getExamFreq(item) }}</span>
+              <span class="kp_freq_tag">题量：{{ getQuestionNum(item) }}</span>
             </div>
           </div>
           <div class="row_right">
@@ -140,9 +143,10 @@
         >
           <div class="row_left">
             <span class="kp_name" :title="item.knowledgeName">{{ item.knowledgeName }}</span>
-            <div class="kp_meta" :title="'得分率：' + getScoreRate(item) + '%  考频：' + getExamFreq(item)">
+            <div class="kp_meta" :title="'得分率：' + getScoreRate(item) + '%  考频：' + getExamFreq(item) + '  题量：' + getQuestionNum(item)">
               <span class="kp_score">得分率：{{ getScoreRate(item) }}%</span>
               <span class="kp_freq_tag">考频：{{ getExamFreq(item) }}</span>
+              <span class="kp_freq_tag">题量：{{ getQuestionNum(item) }}</span>
             </div>
           </div>
           <div class="row_right">
@@ -265,11 +269,18 @@ export default {
         const n = Number(item.examNum);
         return isNaN(n) ? 0 : n;
       }
-      const fallback = item?.examFreq ?? item?.examCount ?? item?.questionNum ?? item?.wrongCount;
+      const fallback = item?.examFreq ?? item?.examCount ?? item?.wrongCount;
       if (fallback === null || fallback === undefined || fallback === '') return 0;
       const n = Number(fallback);
       return isNaN(n) ? 0 : n;
     },
+    // 获取题量：接口 questionNum
+    getQuestionNum(item) {
+      const num = item && item.questionNum;
+      if (num === null || num === undefined || num === '') return 0;
+      const n = Number(num);
+      return isNaN(n) ? 0 : n;
+    },
     /**
      * 判断某个知识点条目是不是"当前联动选中"（跨区单选：三/四个区只能有一条高亮）
      * 把父级 selectedKnowledgeId 和条目 knowledgeId 做字符串比较即可
@@ -538,7 +549,7 @@ export default {
   transform: translate(-50%, -50%);
   width: 100%;
   border-radius: 8px;
-  
+
   span {
     margin-top: 28%;
   }