接口联调数据处理

whycwx

2021-03-18 e44f5e02675b21562a4e033afc87db934a63d50d

接口联调数据处理

 src/assets/js/charts/persons/wangxuan.js

@@ -26,7 +26,34 @@
        x: 0.35,
        y: 0.35,
        type: 'monomerVoltage',
        setData:{}
        setData:{
              legendData : ['单体电压', '单体内阻','单体温度'],
              yAxisData : ['高告警数量', '低告警数量', '告警总数', '告警总数比例', '告警机房总数', '告警机房总数比例'],
              data : [{
                        name: '单体电压',
                        type: 'bar',
                        data: [24, 18, 38, 31, 24, 13],
                        itemStyle:{
                            color:'#FED601'
                        }
                    },
                    {
                        name: '单体内阻',
                        type: 'bar',
                        data: [19, 28, 46, 24, 14, 9],
                        itemStyle:{
                            color:'#67E0E3'
                        }
                    },
                    {
                        name: '单体温度',
                        type: 'bar',
                        data: [15, 22, 36, 15, 21, 8],
                        itemStyle:{
                            color:'#EB6F49'
                        }
                    }]
        }
    }
},{
    img: require("@/assets/images/dischargeCircuit.png"),

 src/components/charts/dischargeCircuit.vue

@@ -8,7 +8,7 @@

<script>
import * as echarts from 'echarts';

// 放电电流 页面
export default {
  name: "dischargeCircuit",
  chart: "",

 src/components/charts/histogramAlternating.vue

@@ -12,7 +12,7 @@

<script>
import * as echarts from 'echarts';

// 交流ABC 页面
export default {
  name: "histogramAlternating",
  chart: "",

 src/components/charts/monomerVoltage.vue

@@ -8,10 +8,11 @@

<script>
import * as echarts from 'echarts';

// 单体电压、内阻和温度 页面
export default {
  name: "monomerVoltage",
  chart: "",
  chartData: {},
  props: {
    id: {
      require: true,
@@ -43,8 +44,48 @@
    setOption(opt) {
      this.$options.chart.setOption(opt);
    },
    setData() {
        let option = {
    setData(dataList) {
      console.log(dataList)
        let self = this;
        let legendData = [];
        let yAxisData = [];
        let data = [];
            // 存值
            self.$options.chartData = dataList;
            if(!dataList){
              self.$axios({
                method:"get",
                url:"/batteryAlarm/monVRTAnalysis",
                params:null
              }).then(res=>{
                if(res.data.code == 1){
                  let result = res.data.data;
                  let index = 0;
                      for (const key in result) {
                        let obj = {
                              name: key,
                              type: 'bar',
                              data:[]
                            }
                            legendData.push(key);
                        for (const item in result[key]) {
                          if(index === 0){
                            yAxisData.push(item);
                          }
                          obj.data.push(result[key][item])
                        }
                        data.push(obj);
                        index++;
                      }
                      self.optionSet(legendData,yAxisData,data);
                }
              })
            }else{
              self.optionSet(dataList.legendData,dataList.yAxisData,dataList.data);
            }
    },
    optionSet(legendData,yAxisData,data){
      let option = {
                // title: {
                //     text: '世界人口总量',
                //     subtext: '数据来自网络'
@@ -57,7 +98,7 @@
                },
                legend: {
                    right:"4%",
                    data: ['单体电压', '单体内阻','单体温度'],
                    data: legendData,//['单体电压', '单体内阻','单体温度'],
                    itemStyle:{
                        right:"0",
                    },
@@ -106,34 +147,35 @@
                    },
                    
                    
                    data: ['高告警数量', '低告警数量', '告警总数', '告警总数比例', '告警机房总数', '告警机房总数比例']
                    data: yAxisData,//['高告警数量', '低告警数量', '告警总数', '告警总数比例', '告警机房总数', '告警机房总数比例']
                },
                series: [
                    {
                        name: '单体电压',
                        type: 'bar',
                        data: [24, 18, 38, 31, 24, 13],
                        itemStyle:{
                            color:'#FED601'
                        }
                    },
                    {
                        name: '单体内阻',
                        type: 'bar',
                        data: [19, 28, 46, 24, 14, 9],
                        itemStyle:{
                            color:'#67E0E3'
                        }
                    },
                    {
                        name: '单体温度',
                        type: 'bar',
                        data: [15, 22, 36, 15, 21, 8],
                        itemStyle:{
                            color:'#EB6F49'
                        }
                    }
                ]
                series: data
                // [
                //     {
                //         name: '单体电压',
                //         type: 'bar',
                //         data: [24, 18, 38, 31, 24, 13],
                //         itemStyle:{
                //             color:'#FED601'
                //         }
                //     },
                //     {
                //         name: '单体内阻',
                //         type: 'bar',
                //         data: [19, 28, 46, 24, 14, 9],
                //         itemStyle:{
                //             color:'#67E0E3'
                //         }
                //     },
                //     {
                //         name: '单体温度',
                //         type: 'bar',
                //         data: [15, 22, 36, 15, 21, 8],
                //         itemStyle:{
                //             color:'#EB6F49'
                //         }
                //     }
                // ]
            };
            this.setOption(option);
    },
@@ -141,7 +183,7 @@
      let self = this;
      setTimeout(function(){
        self.$options.chart.resize();
        self.setData(null);
        self.setData(self.$options.chartData);
      },300)
      
    }

 src/pages/index.vue

@@ -110,10 +110,14 @@
      // 获取列表数据
      getData() {
        let self = this;
        let opt = self.$route.query;
        console.log(opt)
        self.$axios({
          method: "get",
          url: "/application/all",
          data: null
          data: {
            userId:opt.userId || "1001"
          }
        }).then(res => {
          if (res.data.code == 1) {
            self.listData = res.data.data.map(item => {