修改显示

src/views/cs/index3.vue

@@ -4,7 +4,8 @@
     <div class="modelTitle" style=" top: 15.2%;left: 3%;">烘房状态</div>
     <div class="modelTitle" style="top:15.2%;left:32%">设备运行数据</div>
     <div class="modelTitle" style="top:15.2%;left:71%">烘房白坯质量统计</div>
-    <div class="modelTitle" style="top:65%;left:32%">近7天产量</div>
+<!--    <div class="modelTitle" style="top:65%;left:32%">近7天产量</div>-->
+    <div class="modelTitle" style="top:65%;left:32%">烘房耗电量</div>
     <div class="modelTitle" style="top:65%;left:71%">计划达成率</div>
     <div class="title1" style="top:24%;left:34%">成型机产量：</div>
     <div class="title1" style="top:24%;left:52.5%">烘房产量：</div>
@@ -257,7 +258,9 @@ export default {
         };
         this.$refs.chart1.setData(option)
       })
-      getHourProductionLists().then(e => {
+
+      EnergyExpend().then(e => {
+        console.log(e)
         let option1 = {
           grid: {
             top: '15%',
@@ -281,7 +284,7 @@ export default {
             }
           },
           xAxis: {
-            data: e.map(v => v.pdate),
+            data: e.map(v => v.monitorName.split(' - ')?.[1]?.split('(')?.[0]),
             axisLine: {
               show: true, //隐藏X轴轴线
               lineStyle: {
@@ -292,6 +295,7 @@ export default {
               show: true //隐藏X轴刻度
             },
             axisLabel: {
+              interval:0,
               show: true,
               textStyle: {
                 color: '#fff' //X轴文字颜色
@@ -333,8 +337,8 @@ export default {
                 formatter: "{c}",
                 color: "#fff"
               },
-              name: '产量',
+              name: '耗电量',
-              type: 'line',
+              type: 'bar',
               smooth: true, //平滑曲线显示
               showAllSymbol: true, //显示所有图形。
               symbol: "emptyCircle", //标记的图形为实心圆
@@ -349,12 +353,110 @@ export default {
               // areaStyle: {
               //   color: "rgba(5,140,255, 0.2)",
               // },
-              data: e.map(v => parseFloat(v.quantity)),
+              data: e.map(v => parseFloat(v.expend)),
             },
           ]
         };
         this.$refs.chart2.setData(option1)
       })
+      getHourProductionLists().then(e => {
+        // let option1 = {
+        //   grid: {
+        //     top: '15%',
+        //     bottom: '10%',
+        //     // left: '5%',
+        //     right: '3%'
+        //   },
+        //   tooltip: {
+        //     trigger: 'axis',
+        //     axisPointer: {
+        //       type: 'shadow',
+        //       label: {
+        //         show: true
+        //       }
+        //     }
+        //   },
+        //   legend: {
+        //     right: 0,
+        //     textStyle: {
+        //       color: '#eee'
+        //     }
+        //   },
+        //   xAxis: {
+        //     data: e.map(v => v.pdate),
+        //     axisLine: {
+        //       show: true, //隐藏X轴轴线
+        //       lineStyle: {
+        //         color: '#fff'
+        //       }
+        //     },
+        //     axisTick: {
+        //       show: true //隐藏X轴刻度
+        //     },
+        //     axisLabel: {
+        //       show: true,
+        //       textStyle: {
+        //         color: '#fff' //X轴文字颜色
+        //       }
+        //     }
+        //   },
+        //   yAxis: [
+        //     {
+        //       type: 'value',
+        //       name: '单位：车',
+        //       nameTextStyle: {
+        //         color: '#fff'
+        //       },
+        //       splitLine: {
+        //         show: false
+        //       },
+        //       axisTick: {
+        //         show: true
+        //       },
+        //       axisLine: {
+        //         show: true,
+        //         lineStyle: {
+        //           color: '#fff'
+        //         }
+        //       },
+        //       axisLabel: {
+        //         show: true,
+        //         textStyle: {
+        //           color: '#fff'
+        //         }
+        //       }
+        //     }
+        //   ],
+        //   series: [
+        //     {
+        //       label: {
+        //         show: true,
+        //         position: 'top',
+        //         formatter: "{c}",
+        //         color: "#fff"
+        //       },
+        //       name: '产量',
+        //       type: 'line',
+        //       smooth: true, //平滑曲线显示
+        //       showAllSymbol: true, //显示所有图形。
+        //       symbol: "emptyCircle", //标记的图形为实心圆
+        //       symbolSize: 5, //标记的大小
+        //       // itemStyle: {
+        //       //   //折线拐点标志的样式
+        //       //   color: "#058cff",
+        //       // },
+        //       // lineStyle: {
+        //       //   color: "#058cff",
+        //       // },
+        //       // areaStyle: {
+        //       //   color: "rgba(5,140,255, 0.2)",
+        //       // },
+        //       data: e.map(v => parseFloat(v.quantity)),
+        //     },
+        //   ]
+        // };
+        // this.$refs.chart2.setData(option1)
+      })
     },
   },
 }