调试echart曲线图接口和页面展示

@@ -8,26 +8,28 @@ function initChart(canvas: any, width: any, height: any, data: any, dpr: any) {
     devicePixelRatio: dpr // new
     devicePixelRatio: dpr // new
   });
   });
   canvas.setChart(chart);
   canvas.setChart(chart);
-  var color = ["#165DFF", "#14C9C9"]
+  var color = ["#165DFF", "#14C9C9", "#fac858", "#ee6666"]
   var option = {
   var option = {
 
 
     legend: {
     legend: {
-      // data: ['预算', '实际'],//legend
-      top: 20,
+      data: data.nameList,//legend
+      top: 5,
       right: 20,
       right: 20,
       icon: "rect",
       icon: "rect",
+      width: "80%",
       textStyle: {
       textStyle: {
         fontSize: 12,
         fontSize: 12,
         color: '#323241',
         color: '#323241',
       },
       },
+
       itemHeight: 4,
       itemHeight: 4,
       itemWidth: 16
       itemWidth: 16
     },
     },
     grid: {
     grid: {
       containLabel: true,
       containLabel: true,
       bottom: "10",
       bottom: "10",
-      left:"10",
-      right:"10"
+      left: "10",
+      right: "10"
     },
     },
     color: color,
     color: color,
     tooltip: {
     tooltip: {
@@ -36,12 +38,13 @@ function initChart(canvas: any, width: any, height: any, data: any, dpr: any) {
     },
     },
     xAxis: {
     xAxis: {
       type: 'category',
       type: 'category',
-      boundaryGap: true,//不从0开始
+      // boundaryGap: false,//不从0开始
       axisLine: {//不显示
       axisLine: {//不显示
         show: false
         show: false
       },
       },
       axisLabel: {
       axisLabel: {
         show: true, // x轴文字是否显示,刻度值
         show: true, // x轴文字是否显示,刻度值
+        interval: 10,
         textStyle: {
         textStyle: {
           color: '#999999', // 文本颜色
           color: '#999999', // 文本颜色
           fontSize: 10 // 文本字体大小
           fontSize: 10 // 文本字体大小
@@ -51,8 +54,8 @@ function initChart(canvas: any, width: any, height: any, data: any, dpr: any) {
         show: false,
         show: false,
         alignWithLabel: true
         alignWithLabel: true
       },
       },
-      data: ['周一', '周二', '周三', '周四', '周五', '周六', '周日'],
-      // show: false
+      data: data.dateList,
+      show: false
     },
     },
     yAxis: {
     yAxis: {
       x: 'center',
       x: 'center',

 // pages/monitor/monitor.ts
 // pages/monitor/monitor.ts
 import Toast from '@vant/weapp/toast/toast';
 import Toast from '@vant/weapp/toast/toast';
 import { API_CONST } from "./../../api/smartElectric";
 import { API_CONST } from "./../../api/smartElectric";
-import { getUnitEvent, getCardEvent } from './../../utils/util'
+import { getUnitEvent, getCardEvent, getEchartLineType } from './../../utils/util'
 import { HTTPService as HTTP } from "./../../services/HTTPService";
 import { HTTPService as HTTP } from "./../../services/HTTPService";
 
 
 Page({
 Page({
@@ -99,15 +99,25 @@ Page({
     tableList: [],
     tableList: [],
     allcardList: [],// 卡片list数据
     allcardList: [],// 卡片list数据
     myLineObj: {
     myLineObj: {
-      dataList: [[18, 36, 65, 30, 78, 40, 33], [12, 50, 51, 35, 70, 30, 20]],
-      nameList: ['预算', '实际']
+      dataList: [],
+      nameList: []
     },
     },
     homeLineObj: {
     homeLineObj: {
-      dataList: [[180, 306, 65, 30, 78, 40, 133], [12, 50, 251, 235, 170, 30, 20]],
-      nameList: ['总电压', '总电流']
+      dataList: [],
+      nameList: []
     },
     },
     tableHeaderList: [
     tableHeaderList: [
       {
       {
+        type: "INDEX",
+        val: "bms",
+        one: "",
+        two: "",
+        three: "",
+        key_one: "",
+        key_two: "",
+        key_three: ""
+      },
+      {
         type: "BMS",
         type: "BMS",
         val: "bms",
         val: "bms",
         one: "BMS-最高电压模块",
         one: "BMS-最高电压模块",
@@ -166,6 +176,7 @@ Page({
    */
    */
   onLoad() {
   onLoad() {
     this.__getOpenQxCustomHczdInde()
     this.__getOpenQxCustomHczdInde()
+    this.__getOpenQxCustomHczdGetDateEchartLine("INDEX_MAP")
   },
   },
 
 
   /**
   /**
@@ -179,7 +190,9 @@ Page({
    * 生命周期函数--监听页面显示
    * 生命周期函数--监听页面显示
    */
    */
   onShow() {
   onShow() {
-
+    // const pages = getCurrentPages() // 切换tabbar 刷新页面是否执行
+    // const perpage = pages[pages.length - 1]
+    // perpage.onLoad()  
   },
   },
 
 
   /**
   /**
@@ -200,7 +213,7 @@ Page({
    * 页面相关事件处理函数--监听用户下拉动作
    * 页面相关事件处理函数--监听用户下拉动作
    */
    */
   onPullDownRefresh() {
   onPullDownRefresh() {
-
+    this.__getOpenQxCustomHczdInde()
   },
   },
 
 
   /**
   /**
@@ -235,10 +248,12 @@ Page({
         return "EM"
         return "EM"
         break;
         break;
       default:
       default:
-        return ""
+        return "INDEX"
         break;
         break;
     }
     }
   },
   },
+
+
   tabsItemChange(e: any) {
   tabsItemChange(e: any) {
     this.setData({
     this.setData({
       dashboardList: [],
       dashboardList: [],
@@ -267,9 +282,13 @@ Page({
       allcardList: allcardListNew,
       allcardList: allcardListNew,
       tableHeader: tableHeaderNew
       tableHeader: tableHeaderNew
     })
     })
-    if (idx !== 0) {
-      this.__getOpenQxCustomHczdGetDate(idxToName)
+    if (idx !== "0") {
+      this.__getOpenQxCustomHczdGetDate(idxToName)// list
+      this.__getOpenQxCustomHczdGetDateEchartLine(`${idxToName}_MAP`) // 非首页曲线图
+    } else {
+      this.__getOpenQxCustomHczdGetDateEchartLine("INDEX_MAP") // 首页 曲线图
     }
     }
+
     console.log(dashboardListNew, 'dashboardListdashboardList', this.data.dashboardList)
     console.log(dashboardListNew, 'dashboardListdashboardList', this.data.dashboardList)
 
 
   },
   },
@@ -287,6 +306,7 @@ Page({
       }
       }
     }).then((data: any) => {
     }).then((data: any) => {
       Toast.clear()
       Toast.clear()
+      wx.stopPullDownRefresh()
       console.log(data, '-----------datat')
       console.log(data, '-----------datat')
       if (data.success) {
       if (data.success) {
 
 
@@ -577,7 +597,7 @@ Page({
     })
     })
   },
   },
 
 
-  __getOpenQxCustomHczdGetDate(type: String) {//列表滚动数据
+  __getOpenQxCustomHczdGetDate(type: String) {//列表滚动数据  
     HTTP.POST({
     HTTP.POST({
       ...API_CONST.home.getDate,
       ...API_CONST.home.getDate,
       payload: {
       payload: {
@@ -602,5 +622,46 @@ Page({
       }
       }
 
 
     })
     })
+  },
+
+
+  __getOpenQxCustomHczdGetDateEchartLine(type: String) {//曲线图  
+    HTTP.POST({
+      ...API_CONST.home.getDate,
+      payload: {
+        corpCode: "default",
+        type: type
+      }
+    }).then((res: any) => {
+      console.log(res, 'res-----------getDate')
+      var that = this
+      if (res.success) {
+        that.setData({
+          myLineObj: {},
+          homeLineObj: {}
+        })
+        if (type === "INDEX_MAP") {
+          that.setData({
+            myLineObj: getEchartLineType(type, res.data)
+          })
+        } else {
+          that.setData({
+            homeLineObj: getEchartLineType(type, res.data)
+          })
+        }
+
+      } else {
+        that.setData({
+          myLineObj: {},
+          homeLineObj: {}
+        })
+        wx.showToast({
+          title: '请求失败',
+          icon: 'error',
+          duration: 2000
+        });
+      }
+
+    })
   }
   }
 })
 })

@@ -32,7 +32,7 @@
       </view>
       </view>
       <view class="deviceStatistics" wx:if="{{allData&&allData.deviceInfo }}">
       <view class="deviceStatistics" wx:if="{{allData&&allData.deviceInfo }}">
         <topTitle topTitleName="设备统计"></topTitle>
         <topTitle topTitleName="设备统计"></topTitle>
-        <circularDiagram  deviceInfo="{{allData.deviceInfo}}"></circularDiagram>
+        <circularDiagram deviceInfo="{{allData.deviceInfo}}"></circularDiagram>
         <deviceData deviceDataList="{{deviceDataList}}"></deviceData>
         <deviceData deviceDataList="{{deviceDataList}}"></deviceData>
       </view>
       </view>
       <view class="overallOperationStatus" wx:if="{{overallDataList.length>0}}">
       <view class="overallOperationStatus" wx:if="{{overallDataList.length>0}}">
@@ -43,7 +43,7 @@
         <topTitle topTitleName="场景统计"></topTitle>
         <topTitle topTitleName="场景统计"></topTitle>
         <sceneStatistics></sceneStatistics>
         <sceneStatistics></sceneStatistics>
       </view>
       </view>
-      <view class="loadCurveEchart">
+      <view class="loadCurveEchart" wx:if="{{myLineObj&&myLineObj.dataList.length>0}}">
         <topTitle topTitleName="负荷曲线"></topTitle>
         <topTitle topTitleName="负荷曲线"></topTitle>
         <loadCurveEchart echartData="{{myLineObj}}"></loadCurveEchart>
         <loadCurveEchart echartData="{{myLineObj}}"></loadCurveEchart>
       </view>
       </view>
@@ -63,7 +63,7 @@
         <dashboardList dashboardList="{{dashboardList}}"></dashboardList>
         <dashboardList dashboardList="{{dashboardList}}"></dashboardList>
       </view>
       </view>
 
 
-      <view class="loadCurveEchart_home">
+      <view class="loadCurveEchart_home" wx:if="{{homeLineObj&&homeLineObj.dataList.length>0}}">
         <loadCurveEchart echartData="{{homeLineObj}}"></loadCurveEchart>
         <loadCurveEchart echartData="{{homeLineObj}}"></loadCurveEchart>
       </view>
       </view>
 
 

@@ -986,4 +986,145 @@ export const getCardEvent = (n: number, Obj: any) => {
 
 
   return res
   return res
 }
 }
+// echarts 曲线数据统一处理
+export const getEchartLineType = (type: String, arrayList: Array<any>) => {
+  let lineObjLegend = {}
+  let dateList: Array<String> =arrayList.map((item: any) => {
+    return item.date
+  })
+  switch (type) {
+    case "INDEX_MAP": //首页
+      let bmsList: Array<String> = arrayList.map((item: any) => {
+        return item.bms02
+      })
 
 
+      let cpList: Array<String> = arrayList.map((item: any) => {
+        return item.cp02
+      })
+
+      let pvList: Array<String> = arrayList.map((item: any) => {
+        return item.pv03
+      })
+
+      let emList: Array<String> = arrayList.map(() => {
+        return "0"
+      })
+      lineObjLegend = {
+        dataList: [pvList, bmsList, cpList, emList],
+        nameList: ["PV-总功只留功率", "BMS-总电流", "CP-当前功率", "EM-电流变比"],
+        dateList: dateList
+      }
+      return lineObjLegend
+      break;
+
+    case "BMS_MAP": // BMS监控
+      let bmsOne: Array<String> = arrayList.map((item: any) => {
+        return item.bms01
+      })
+
+      let bmsTwo: Array<String> = arrayList.map((item: any) => {
+        return item.bms02
+      })
+
+      let bmsThree: Array<String> = arrayList.map((item: any) => {
+        return item.bms03
+      })
+
+      let bmsFour: Array<String> = arrayList.map((item: any) => {
+        return item.bms05
+      })
+      lineObjLegend = {
+        dataList: [bmsOne, bmsTwo, bmsThree, bmsFour],
+        nameList: ["BMS-允许放电电流", "BMS-总电流", "BMS-总电压", "BMS-SOC"],
+        dateList: dateList
+      }
+      return lineObjLegend
+
+    case "PCS_MAP": // PCS 监视
+      let pcsOne: Array<String> = arrayList.map((item: any) => {
+        return item.bms01
+      })
+
+      let pcsTwo: Array<String> = arrayList.map((item: any) => {
+        return item.bms02
+      })
+
+      let pcsThree: Array<String> = arrayList.map((item: any) => {
+        return item.bms03
+      })
+
+
+      lineObjLegend = {
+        dataList: [pcsOne, pcsTwo, pcsThree],
+        nameList: ["PCS-交流A相电流", "PCS-最大放电电流", "PCS-交流C相电流"],
+        dateList: dateList
+      }
+      return lineObjLegend
+
+    case "CP_MAP": // CP 充电桩
+      let cpOne: Array<String> = arrayList.map((item: any) => {
+        return item.pcs21
+      })
+
+      let cpTwo: Array<String> = arrayList.map((item: any) => {
+        return item.pcs22
+      })
+
+      let cpThree: Array<String> = arrayList.map((item: any) => {
+        return item.pcs23
+      })
+
+
+      lineObjLegend = {
+        dataList: [cpOne, cpTwo, cpThree],
+        nameList: ["PCS-交流A相电流", "PCS-交流B相电流", "PCS-交流C相电流"],
+        dateList: dateList
+      }
+      return lineObjLegend
+
+    case "PV_MAP": // PV 光伏
+      let pvOne: Array<String> = arrayList.map((item: any) => {
+        return item.pv10
+      })
+
+      let pvTwo: Array<String> = arrayList.map((item: any) => {
+        return item.pv11
+      })
+
+      let pvThree: Array<String> = arrayList.map((item: any) => {
+        return item.pv12
+      })
+
+
+      lineObjLegend = {
+        dataList: [pvOne, pvTwo, pvThree],
+        nameList: ["PV-交流A相电流", "PV-交流B相电流", "PV-交流C相电流"],
+        dateList: dateList
+      }
+      return lineObjLegend
+    case "EM_MAP": // EM  电能表 
+      let emOne: Array<String> = arrayList.map((item: any) => {
+        return item.em01
+      })
+
+      let emTwo: Array<String> = arrayList.map((item: any) => {
+        return item.em02
+      })
+
+      let emThree: Array<String> = arrayList.map((item: any) => {
+        return item.em03
+      })
+
+
+      lineObjLegend = {
+        dataList: [emOne, emTwo, emThree],
+        nameList: ["EM-CA线电流", "EM-BC线电流", "EM-AB线电流"],
+        dateList: dateList
+      }
+      return lineObjLegend
+
+    default:
+      return lineObjLegend
+      break;
+  }
+}