装备台账

src/views/EquipmentLedger/components/EquAnalysis.vue

@@ -175,6 +175,7 @@ export default {
 
         if (res4.data && res4.data.length > 0) {
           this.dataMap.major = res4.data.map((item) => ({
+            ...item,
             name: item.type,
             value: item.total,
           }))
@@ -184,6 +185,7 @@ export default {
         const res5 = await getTenMajorApi(this.queryParams)
         if (res5.data && res5.data.length > 0) {
           this.dataMap.process = res5.data.map((item) => ({
+            ...item,
             name: item.type,
             value: item.total,
           }))
@@ -216,10 +218,17 @@ export default {
         },
         legend: {
           orient: 'vertical',
-          right: '5%',
+          right: '-1%',
           top: 'center',
           itemWidth: 10,
           itemHeight: 10,
+          itemGap: 15,
+          textStyle: {
+            // 👈 图例文字样式
+            fontSize: 16, // 字体大小
+            color: '#3F3F3F',
+            lineHeight: 20, // 行高（让文字更松一点）
+          },
           formatter: (name) => {
             const item = this.chartData.find((i) => i.name === name)
             const percent = item.value > 0 && this.total > 0 ? ((item.value / this.total) * 100).toFixed(2) : '0.00'
@@ -230,7 +239,7 @@ export default {
           {
             type: 'pie',
             radius: ['60%', '80%'],
-            center: ['35%', '50%'],
+            center: ['25%', '50%'],
             avoidLabelOverlap: false,
             label: { show: false },
             labelLine: { show: false },
@@ -240,7 +249,7 @@ export default {
         graphic: [
           {
             type: 'group',
-            left: '35%', // 与饼图 center[0] 保持一致
+            left: '25%', // 与饼图 center[0] 保持一致
             top: '42%',
             bounding: 'raw',
             children: [
@@ -283,7 +292,11 @@ export default {
     renderBarChart() {
       const list = this.dataMap[this.activeTab2]
       const xData = list.map((i) => i.name)
-      const yData = list.map((i) => i.value)
+      const yData = list.map((item) => ({
+        value: item.value,
+        proType: item.proType,
+      }))
+      console.log('🚀 ~ yData:', yData)
 
       const option = {
         tooltip: {
@@ -296,7 +309,7 @@ export default {
             return `
               <div>
                 <div>${item.name}</div>
-                <div>数量：${item.value}</div>
+                <div>总数：${item.value}</div>
               </div>
             `
           },
@@ -332,18 +345,22 @@ export default {
           {
             type: 'bar',
             data: yData,
-            barWidth: 24,
+            barWidth: 20,
             itemStyle: {
               borderRadius: [12, 12, 0, 0],
               color: (params) => {
-                const colors = [
-                  ['#5DA9FF', '#8EC5FF'],
-                  ['#4ED6C8', '#7BE7D7'],
-                  ['#FDBA4F', '#FFD78A'],
-                ]
+                const colorMap = {
+                  1: ['#5DA9FF', '#8EC5FF'], // 专业1
+                  2: ['#4ED6C8', '#7BE7D7'], // 专业2
+                  3: ['#FDBA4F', '#FFD78A'], // 专业3
+                }
+
+                const type = params.data.proType
+                const colors = colorMap[type] || ['#5DA9FF', '#8EC5FF'] // 兜底色
+
                 return new echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                  { offset: 0, color: colors[params.dataIndex % 3][0] },
-                  { offset: 1, color: colors[params.dataIndex % 3][1] },
+                  { offset: 0, color: colors[0] },
+                  { offset: 1, color: colors[1] },
                 ])
               },
             },