refactor(portraitRadar): 优化雷达图样式与进度条配色

1.  调整进度条使用传入的item.color作为渐变色和端点颜色
2.  修改雷达图配置：扩大半径、调整中心位置、增加分割线数量，优化轴标签样式与分割线配色
3.  简化系列配置，移除冗余注释并优化交互显示逻辑

src/views/portraitManagement/components/ProfileRadar.vue

@@ -7,11 +7,11 @@
           <span class="item-label">{{ item.name }}</span>
           <div class="progress-row">
             <div class="progress-bar">
-              <div class="progress-fill"
-                :style="{ width: ((item.finalScore || 0) / (computedMaxScore || 1) * 100) + '%', background: '#2babeb' }">
-                <span class="progress-end" :style="{ background: '#2babeb' }"></span>
-              </div>
+            <div class="progress-fill"
+              :style="{ width: ((item.finalScore || 0) / (computedMaxScore || 1) * 100) + '%', background: `linear-gradient(90deg, ${item.color}33, ${item.color})` }">
+                <span class="progress-end" :style="{ background: item.color }"></span>
             </div>
+          </div>
             <span class="item-value">{{ item.finalScore || 0 }}</span>
           </div>
         </div>
@@ -59,7 +59,7 @@ const computedIndicators = computed(() => {
   const allScores = data.map(item => item.finalScore || 0)
   const maxValue = allScores.length > 0 ? Math.max(...allScores) : 100
   return data.map(item => ({
-    name: item.name,
+    name: item.name + '\n\n' + (item.finalScore || 0),
     max: Math.max(maxValue, 1)
   }))
 })
@@ -98,30 +98,15 @@ const updateRadarChart = () => {
     },
     radar: {
       indicator: indicators,
-      center: ['50%', '50%'],
-      radius: '60%',
-      splitNumber: 4,
-      axisLine: {
-        lineStyle: {
-          color: 'rgba(255, 255, 255, 0.1)'
-        }
-      },
-      splitArea: {
-        show: true,
-        areaStyle: {
-          color: ['transparent', 'transparent', 'transparent', 'transparent', 'transparent']
-        }
-      },
-      splitLine: {
-        lineStyle: {
-          color: 'rgba(255, 255, 255, 0.1)'
-        }
-      },
-      name: {
-        textStyle: {
-          color: '#a0c4ff',
-          fontSize: 11
-        }
+      center: ['50%', '52%'],
+      radius: '50%',
+      splitNumber: 8,
+      axisLine: { lineStyle: { color: '#ccc' } },
+      splitLine: { lineStyle: { color: ['#ccc', '#ccc', '#ccc', '#ccc', '#ccc', '#ccc', '#fe4322', '#8EC742', '#ccc'], width: 3 } },
+      splitArea: { show: false },
+      axisName: {
+        color: '#fff',
+        fontSize: 13
       }
     },
     series: [
@@ -133,39 +118,22 @@ const updateRadarChart = () => {
           {
             value: pointValues,
             name: '综合得分',
-            // areaStyle: {
-            //   color: 'rgba(189, 3, 251, 0)'
-            // },
             opacity: 0,
             lineStyle: {
               color: '#4DC8FE',
               width: 2
-
             },
             itemStyle: { color: '#fff', borderWidth: 1, borderColor: '#00C8DA', borderJoin: 'round' }
-            // itemStyle: {
-            //   color: 'transparent'
-            // }
           }
-        ]
-      },
-      // ...(pointValues.length > 0 ? [
-      //   {
-      //     type: 'scatter',
-      //     coordinateSystem: 'radar',
-      //     data: pointValues.map((_, i) => {
-      //       const arr = new Array(pointValues.length).fill(null)
-      //       arr[i] = pointValues[i]
-      //       return { value: arr }
-      //     }),
-      //     symbol: 'circle',
-      //     symbolSize: 22,
-      //     itemStyle: {
-      //       color: ({ dataIndex }) => pointColors[dataIndex]
-      //     },
-      //     z: 10
-      //   }
-      // ] : [])
+        ],
+        label: {
+          show: false,
+          formatter: (p) => p.value,
+          color: '#fff',
+          fontSize: 16,
+          fontWeight: 'bold'
+        }
+      }
     ],
     tooltip: {
       trigger: 'item',