达标函数删除，图表label置于最顶层

2026-04-14 10:17:38 +08:00
parent 0d74e762ce
commit 7135ab0e4b
208 changed files with 3567 additions and 12787 deletions
--- a/src/views/home/netPriceAnalysisComponents/operatingBar.vue
+++ b/src/views/home/netPriceAnalysisComponents/operatingBar.vue
@@ -173,71 +173,7 @@ export default {
            type: 'bar',
            yAxisIndex: 0,
            barWidth: 40,
-            label: {
-              show: true,
-              position: 'top',
-              offset: [32, 0],
-              width: 100,
-              height: 22,
-              formatter: (params) => {
-                const diff = data.diff || [];
-                const flags = data.flags || [];
-                const currentDiff = diff[params.dataIndex] || 0;
-                const currentFlag = flags[params.dataIndex] || 0;
-
-                const prefix = currentFlag === 1 ? '+' : '';
-
-                // 根据标志位选择不同的样式类
-                if (currentFlag === 1) {
-                  // 达标 - 使用 rate-achieved 样式
-                  return `{achieved|${currentDiff}}{text|差值}`;
-                } else {
-                  // 未达标 - 使用 rate-unachieved 样式
-                  return `{unachieved|${currentDiff}}{text|差值}`;
-                }
-              },
-              backgroundColor: {
-                type: 'linear',
-                x: 0, y: 0, x2: 0, y2: 1,
-                colorStops: [
-                  { offset: 0, color: 'rgba(205, 215, 224, 0.6)' },
-                  { offset: 0.2, color: '#ffffff' },
-                  { offset: 1, color: '#ffffff' }
-                ]
-              },
-              shadowColor: 'rgba(191,203,215,0.5)',
-              shadowBlur: 2,
-              shadowOffsetX: 0,
-              shadowOffsetY: 2,
-              borderRadius: 4,
-              borderColor: '#BFCBD577',
-              borderWidth: 0,
-              lineHeight: 26,
-              rich: {
-                text: {
-                  width: 'auto',
-                  padding: [5, 10, 5, 0],
-                  align: 'center',
-                  color: '#464646',
-                  fontSize: 14
-                },
-                achieved: {
-                  width: 'auto',
-                  padding: [5, 0, 5, 10],
-                  align: 'center',
-                  color: '#76DABE', // 与达标的 offset: 1 颜色一致
-                  fontSize: 14
-                },
-                // 未达标样式
-                unachieved: {
-                  width: 'auto',
-                  padding: [5, 0, 5, 10],
-                  align: 'center',
-                  color: '#F9A44A', // 与未达标的 offset: 1 颜色一致
-                  fontSize: 14
-                }
-              }
-            },
+            label: { show: false },
            itemStyle: {
              color: (params) => {
                const safeFlag = data.flags || [];
@@ -264,6 +200,76 @@ export default {
              borderWidth: 0
            },
            data: data.reals || []
+          },
+          // 实际柱状图的标签层（独立scatter系列，zlevel=1确保标签在最上层）
+          {
+            name: '__实际差值标签',
+            type: 'scatter',
+            yAxisIndex: 0,
+            zlevel: 1,
+            symbolSize: 0,
+            tooltip: { show: false },
+            data: (data.reals || []).map((value, index) => ({
+              value: value,
+              label: {
+                show: true,
+                position: 'top',
+                offset: [32, 0],
+                width: 100,
+                height: 22,
+                formatter: () => {
+                  const diff = data.diff || [];
+                  const flags = data.flags || [];
+                  const currentDiff = diff[index] || 0;
+                  const currentFlag = flags[index] || 0;
+                  if (currentFlag === 1) {
+                    return `{achieved|${currentDiff}}{text|差值}`;
+                  } else {
+                    return `{unachieved|${currentDiff}}{text|差值}`;
+                  }
+                },
+                backgroundColor: {
+                  type: 'linear',
+                  x: 0, y: 0, x2: 0, y2: 1,
+                  colorStops: [
+                    { offset: 0, color: 'rgba(205, 215, 224, 0.6)' },
+                    { offset: 0.2, color: '#ffffff' },
+                    { offset: 1, color: '#ffffff' }
+                  ]
+                },
+                shadowColor: 'rgba(191,203,215,0.5)',
+                shadowBlur: 2,
+                shadowOffsetX: 0,
+                shadowOffsetY: 2,
+                borderRadius: 4,
+                borderColor: '#BFCBD577',
+                borderWidth: 0,
+                lineHeight: 26,
+                rich: {
+                  text: {
+                    width: 'auto',
+                    padding: [5, 10, 5, 0],
+                    align: 'center',
+                    color: '#464646',
+                    fontSize: 14
+                  },
+                  achieved: {
+                    width: 'auto',
+                    padding: [5, 0, 5, 10],
+                    align: 'center',
+                    color: '#76DABE',
+                    fontSize: 14
+                  },
+                  unachieved: {
+                    width: 'auto',
+                    padding: [5, 0, 5, 10],
+                    align: 'center',
+                    color: '#F9A44A',
+                    fontSize: 14
+                  }
+                }
+              }
+            }))
          }
        ]
      };