解决报警分析页面饼图颜色缺失问题

zhaowei

2025-06-09 456b737c86bb9614b43df9108826c18e852a44e2

解决报警分析页面饼图颜色缺失问题

 .env.development

@@ -2,7 +2,7 @@
# VUE_APP_API_BASE_URL=http://192.168.1.118:3000
# VUE_APP_API_BASE_URL=http://195.0.1.10:6099
# VUE_APP_API_BASE_URL=http://192.168.1.12:9999
VUE_APP_API_BASE_URL=http://127.0.0.1:9999
VUE_APP_API_BASE_URL=http://127.0.0.1:8888
# VUE_APP_API_BASE_URL=http://195.0.1.10:8099
VUE_APP_CAS_BASE_URL=http://cas.example.org:8443/cas
VUE_APP_ONLINE_BASE_URL=http://fileview.jeecg.com/onlinePreview

 src/views/eam/repair/EamReportRepairList.vue

@@ -34,7 +34,7 @@
          <a-col :xl="6" :lg="7" :md="8" :sm="24">
            <a-form-item label="是否停机">
              <a-radio-group v-model="queryParam.breakdownFlag">
                <a-radio v-for="item in breakdown_flag_list" :value="item.value">{{ item.label }}</a-radio>
                <a-radio v-for="item in breakdown_flag_list" :key="item.value" :value="item.value">{{ item.label }}</a-radio>
              </a-radio-group>
            </a-form-item>
          </a-col>

 src/views/mdc/base/modules/alarmAnalysis/alarmAnalysisMain.vue

@@ -142,7 +142,7 @@
        YData: [0],
        columns,
        innerColumns,
        hasRequsetAlarmCodeList: []
        hasRequestAlarmCodeList: []
      }
    },
    props: { nodeTree: '', Type: '', nodePeople: '' },
@@ -258,14 +258,6 @@
              that.XData = res.result.dateCountList.map(item => item.key)
              that.YData = res.result.dateCountList.map(item => item.count)

              // this.tableHeads = res.result.dates
              // this.dataList = res.result
              // this.draw()
              // this.checkSameData(this.dataList)
              // this.checkSameData1(this.dataList)
              // this.checkSameData2(this.dataList)
              // this.combineCell();
              // this.initDeviceType(this.dataList)
              that.drawWrin()
            }
          })
@@ -326,16 +318,8 @@
        this.dataList = []
        getAction(this.url.efficiencyList, this.queryParam).then(res => {
          if (res.success) {
            // this.tableHeads = res.result.dates
            this.dataList = res.result
            this.hasRequsetAlarmCodeList = []
            // this.draw()
            // this.checkSameData(this.dataList)
            // this.checkSameData1(this.dataList)
            // this.checkSameData2(this.dataList)
            // this.combineCell();
            // this.initDeviceType(this.dataList)

            this.hasRequestAlarmCodeList = []
          }
        }).finally(() => {
          this.outerDataLoading = false
@@ -354,32 +338,26 @@
          },
          tooltip: {
            trigger: 'item',
            formatter: '<br/>{b} : {c} ({d}%)'
            formatter: '{b} : {c} ({d}%)'
          },
          calculable: true,
          series: [{
          series: {
            type: 'pie',
            radius: '60%',
            label: {
              show: true,
              formatter: '{b}\n{c}',
              color: 'inherit'
            },
            itemStyle: {
              normal: {
                color: function(params) {
                  var colorList = ['#5AB1EF', '#2EC7C9', '#B6A2DE', '#FFB980', '#D87A80', '#8D98B3']
                  return colorList[params.dataIndex]
                },
                label: {
                  show: true,
                  // position: 'top',
                  formatter: '{b}\n{c}',
                  color: function(params) {
                    var colorList = ['#5AB1EF', '#2EC7C9', '#B6A2DE', '#FFB980', '#D87A80', '#8D98B3']
                    return colorList[params.dataIndex]
                  }
                }
              color: function(params) {
                const colorList = ['#5AB1EF', '#2EC7C9', '#B6A2DE', '#FFB980', '#D87A80', '#8D98B3']
                return colorList[params.dataIndex % colorList.length]
              }

            },
            data: this.pieDate
            // data:[{name:'jjjjjjj',value:'2'}]
          }]
          }
        }
        this.equipmentWarningPie.setOption(equipmentWarningPieOption, true)
        this.equipmentWarningLine = this.$echarts.init(document.getElementById('MdcEquipmentWarningLine'), 'macarons')
@@ -483,7 +461,7 @@
        let _this = this
        // 当展开时若该行未被展开过才会请求后台数据，展开过的数据会被缓存无需重复请求
        this.queryParam.alarmCode = record.alarmCode
        if (expanded && !this.hasRequsetAlarmCodeList.includes(record.alarmCode)) {
        if (expanded && !this.hasRequestAlarmCodeList.includes(record.alarmCode)) {
          this.innerDataLoading = true
          getAction(this.url.equipmentAlarmList, this.queryParam).then(res => {
            if (res.success) {
@@ -492,7 +470,7 @@
                  item.innerDataList = res.result
                }
              })
              _this.hasRequsetAlarmCodeList.push(record.alarmCode)
              _this.hasRequestAlarmCodeList.push(record.alarmCode)
            }
          })
            .finally(() => {

 vue.config.js

@@ -88,7 +88,7 @@
  devServer: {
    port: 3000,
    open: true,
    https: false,
    // https: true,
    // hot: true,
    disableHostCheck: true,
    // overlay: {
@@ -110,7 +110,8 @@
      /* 注意：jeecgboot前端做了改造，此处不需要配置跨域和后台接口（只需要改.env相关配置文件即可）
          issues/3462 很多人此处做了配置，导致刷新前端404问题，请一定注意*/
      '/jeecg-boot': {
        target: 'http://localhost:9999/', // 请求本地 需要jeecg-boot后台项目
        target: 'http://localhost:8888/', // 请求本地 需要jeecg-boot后台项目
        // target: 'http://192.168.1.24:9999/', // 请求本地 需要jeecg-boot后台项目
        ws: false,
        changeOrigin: true
      }