fix: 修复风险趋势图表中轴标签颜色函数的作用域问题

hejianhao

2026-04-01 b7548d6a63ebb6f122583220e762f3604f82194d

fix: 修复风险趋势图表中轴标签颜色函数的作用域问题

将axisLabel.color函数从普通函数改为箭头函数，以正确访问组件实例中的riskTrendData.statusData数据，避免因作用域问题导致的颜色计算错误

 screen/src/view/projectHome/index.vue

@@ -662,7 +662,7 @@
      riskTrendData: {
        xAxisData: [],
        seriesData: [],
        statusData: [],
        statusData: []
      },
      // 9各分项隐患趋势 10隐患数量 11设备数量 12查看报告入口 13人员在岗率 14重大风险源 15 项目风险趋势
      permissionProject:
@@ -1983,9 +1983,9 @@
          this.riskTrendData.seriesData = res.map((item) => {
            const value = this.levelToValue(item.level)

            return value;
          });
          this.riskTrendData.statusData = res.map((item) => item.status);
            return value
          })
          this.riskTrendData.statusData = res.map((item) => item.status)

          // 更新图表
          this.updateRiskChart()
@@ -1993,9 +1993,9 @@
      } catch (error) {
        console.error('获取项目风险趋势失败:', error)
        // 设置默认值，确保图表可以正常显示
        this.riskTrendData.xAxisData = [];
        this.riskTrendData.seriesData = [];
        this.riskTrendData.statusData = [];
        this.riskTrendData.xAxisData = []
        this.riskTrendData.seriesData = []
        this.riskTrendData.statusData = []
      }
    },
    // 更新风险趋势图表
@@ -2067,13 +2067,13 @@
            }
          },
          axisLabel: {
            color: function (value, index) {
            color: (value, index) => {
              const status =
                Array.isArray(self.riskTrendData.statusData) &&
                typeof index === "number"
                  ? self.riskTrendData.statusData[index]
                  : undefined;
              return Number(status) === 2 ? "#999" : "#fff";
                Array.isArray(this.riskTrendData.statusData) &&
                typeof index === 'number'
                  ? this.riskTrendData.statusData[index]
                  : undefined
              return Number(status) === 2 ? '#999' : '#fff'
            },
            fontSize: 12,
            interval: 0,
@@ -2180,7 +2180,6 @@
        }
        return textStr
      }

      let option = {
        tooltip: {
          trigger: 'axis',
@@ -2214,13 +2213,13 @@
            }
          },
          axisLabel: {
            color: function (value, index) {
            color: (value, index) => {
              const status =
                Array.isArray(this.riskTrendData.statusData) &&
                typeof index === "number"
                typeof index === 'number'
                  ? this.riskTrendData.statusData[index]
                  : undefined;
              return Number(status) === 2 ? "#999" : "#fff";
                  : undefined
              return Number(status) === 2 ? '#999' : '#fff'
            },
            fontSize: 12,
            interval: 0, // 强制显示所有标签