From be606ff614a797c6565804305dcbadd6e87ac2d8 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E2=80=9Cyu=E2=80=9D?= <“winebunny@163.com”>
Date: Sun, 14 Jul 2024 23:33:51 +0800
Subject: [PATCH] u

---
 .../pages/CapacityAdjustmentPage/index.vue    |  17 +-
 .../pages/OpticalStoragePage/cdzLine.vue      | 314 +++++++------
 src/views/pages/pvPage/index.vue              |  68 ++-
 src/views/pages/pvPage/powerLine.vue          | 435 ++++++++---------
 src/views/pages/pvPage/rateLine.vue           | 439 +++++++++---------
 5 files changed, 664 insertions(+), 609 deletions(-)

diff --git a/src/views/pages/CapacityAdjustmentPage/index.vue b/src/views/pages/CapacityAdjustmentPage/index.vue
index e46418f..2ba5a48 100644
--- a/src/views/pages/CapacityAdjustmentPage/index.vue
+++ b/src/views/pages/CapacityAdjustmentPage/index.vue
@@ -123,7 +123,7 @@
               <rateLine
                 :rateDate="rateDate_cur"
                 :keysv="key2"
-                v-if="treeAreaId"
+                v-if="rateDate_cur"
               ></rateLine>
             </div>
             <div class="infotitle_box">
@@ -474,15 +474,18 @@ const getRateDate = (treeAreaId: string) => {
   }).then((res) => {
     console.log(res, "res");
 
-    if (res?.data.result.length) {
+    if (res.data.result.length>0) {
       rateDate_cur = res?.data.result;
       // console.log(res, "res");
     } else {
-      ElMessage({
-        message: "Congrats, this is a success message.",
-        type: "success",
-        plain: true,
-      });
+      // ElMessage({
+      
+      //   message: "",
+      //   type: "success",
+      //   plain: true,
+      // });
+      console.log('暂无数据负载率');
+      
     }
   });
   // let rateDate = rateJSONData as any;
diff --git a/src/views/pages/OpticalStoragePage/cdzLine.vue b/src/views/pages/OpticalStoragePage/cdzLine.vue
index 55575ca..52b25de 100644
--- a/src/views/pages/OpticalStoragePage/cdzLine.vue
+++ b/src/views/pages/OpticalStoragePage/cdzLine.vue
@@ -1,176 +1,174 @@
 <template>
-    <div class="OneLine" ref="OneLine"></div>
-  </template>
-  
-  <script setup lang="ts">
-  import {
-    ref,
-    inject,
-    onBeforeUnmount,
-    getCurrentInstance,
-    onMounted,
-    watchEffect,
-  } from "vue";
-  import transformFontSize from "@/hooks/transFormSize.ts";
-  import "echarts/lib/component/dataZoom";
-  onMounted(() => {
-    drawOneLine(props.echartArr);
-  });
-  const props = defineProps<{
+  <div class="OneLine" ref="OneLine"></div>
+</template>
+
+<script setup lang="ts">
+import {
+  ref,
+  inject,
+  onBeforeUnmount,
+  getCurrentInstance,
+  onMounted,
+  watchEffect,
+} from "vue";
+import transformFontSize from "@/hooks/transFormSize.ts";
+import "echarts/lib/component/dataZoom";
+onMounted(() => {
+  drawOneLine(props.echartArr);
+});
+const props = defineProps<{
   echartArr: any[];
 }>();
-  // 获取echart挂载的DOM节点
-  const OneLine: any = ref();
-  
-  // 获取当前组件实例
-  const { proxy }: any = getCurrentInstance();
-  
-  const drawOneLine = (arr: any) => {
-    let myChart = proxy.$echarts.init(OneLine.value);
-    
-    myChart.clear();
-    const option = {
-      tooltip: {
-        trigger: "axis",
-        // axisPointer: { type: 'cross' }
-        textStyle: {
-          color: "#FFFFFF",
-        },
-        // padding: transformFontSize(15),
-        backgroundColor: "rgba(0,163,166,.9)", //设置自定义背景
-        borderColor: "rgba(0,163,166,.9)",
-        borderRadius: 5,
-        
-        formatter: function (param: any) {
-          let str = `
+// 获取echart挂载的DOM节点
+const OneLine: any = ref();
+
+// 获取当前组件实例
+const { proxy }: any = getCurrentInstance();
+
+const drawOneLine = (arr: any) => {
+  let myChart = proxy.$echarts.init(OneLine.value);
+
+  myChart.clear();
+  const option = {
+    tooltip: {
+      trigger: "axis",
+      // axisPointer: { type: 'cross' }
+      textStyle: {
+        color: "#FFFFFF",
+      },
+      // padding: transformFontSize(15),
+      backgroundColor: "rgba(0,163,166,.9)", //设置自定义背景
+      borderColor: "rgba(0,163,166,.9)",
+      borderRadius: 5,
+
+      formatter: function (param: any) {
+        let str = `
           <div style="width:100%:height:100%">
             <div style="display:flex;justify-content:space-between;"> ${
               param[0].name.split(" ")[0]
             }</div>
             ${getDom(param)}
           </div>`;
-          function getDom(param: any) {
-            let newStr = "";
-            param.forEach((item: any) => {
-              newStr += `<div style="display:flex;"><div>${
-                item.seriesName
-              }：</div><div>${
-                item.value === undefined ? "0" : item.value
-              }kW</div></div>`;
-            });
-            return newStr;
-          }
-          return str;
-        },
+        function getDom(param: any) {
+          let newStr = "";
+          param.forEach((item: any) => {
+            newStr += `<div style="display:flex;"><div>${
+              item.seriesName
+            }：</div><div>${
+              item.value === undefined ? "0" : item.value
+            }kW</div></div>`;
+          });
+          return newStr;
+        }
+        return str;
       },
-      legend: {
-        top: "0%",
-        right: "5%",
-        orient: "vertical",
-        data: ["总功率",],
-        itemWidth: transformFontSize(40),
-        itemHeight: transformFontSize(18),
-        itemGap:transformFontSize(8),
-        textStyle: {
-          fontSize: transformFontSize(35),
-          color: "#FFFFFF",
-        },
+    },
+    legend: {
+      top: "0%",
+      right: "5%",
+      orient: "vertical",
+      data: ["总功率"],
+      itemWidth: transformFontSize(40),
+      itemHeight: transformFontSize(18),
+      itemGap: transformFontSize(8),
+      textStyle: {
+        fontSize: transformFontSize(35),
+        color: "#FFFFFF",
       },
-      grid: {
-        top: "25%",
-        left: "8%",
-        right: "8%",
-        bottom: "13%",
+    },
+    grid: {
+      top: "25%",
+      left: "8%",
+      right: "8%",
+      bottom: "13%",
+    },
+    xAxis: {
+      type: "category",
+      axisTick: {
+        show: false,
+        alignWithLabel: true,
       },
-      xAxis: {
-        type: "category",
-        axisTick: {
-          show: false,
-          alignWithLabel: true,
-        },
-        boundaryGap: false,
-        axisLabel: {
-          color: "#fff",
-          fontSize: transformFontSize(35),
-          padding: [0, 0, 0, 30],
-          // formatter: function (param: any) {
-          //   return param.split(' ')[1].split(':')[0] + ':' + param.split(' ')[1].split(':')[1]
-          // },
-        },
-        // data: ["03:00", "06:00", "09:00", "12:00", "15:00", "18:00", "24:00"],
-        data: arr.map((rtime) => rtime?.timeStamp.slice(-5)),
-  
+      boundaryGap: false,
+      axisLabel: {
+        color: "#fff",
+        fontSize: transformFontSize(35),
+        padding: [0, 0, 0, 30],
+        // formatter: function (param: any) {
+        //   return param.split(' ')[1].split(':')[0] + ':' + param.split(' ')[1].split(':')[1]
+        // },
       },
-      yAxis: {
-        splitLine: {
-          show: false,
-        },
-        axisLine: {
-          show: true, //y轴轴线
-        },
-        type: "value",
-        name: "kW",
-        //   min: 0,
-        //   max: 100,
-        nameTextStyle: {
-          //y轴name的颜色
-          color: "#fff",
-          fontSize: transformFontSize(35),
-          padding: [0, 40, 0, 0],
-        },
-        position: "left",
-        axisLabel: {
-          //刻度标签文字的颜色大小
-          color: "#fff",
-          fontSize: transformFontSize(35),
-          formatter: "{value}",
-        },
+      // data: ["03:00", "06:00", "09:00", "12:00", "15:00", "18:00", "24:00"],
+      data: arr.map((rtime) => rtime?.timeStamp.slice(-5)),
+    },
+    yAxis: {
+      splitLine: {
+        show: false,
       },
-      series: [
-        {
-          name: "总功率",
-          type: "line",
-          barWidth: 2, // 柱子宽度核心代码
-          smooth: true,
-          showSymbol: false,
-          itemStyle: {
-            color: "rgba(18, 231, 227, 1)",
-          },
-          areaStyle: {
-            normal: {
-              color: new proxy.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                {
-                  offset: 0,
-                  color: "rgba(18, 231, 227, 0.4)",
-                },
-  
-                {
-                  offset: 1,
-  
-                  color: "rgba(18, 231, 227, 0.01)",
-                },
-              ]),
-            },
+      axisLine: {
+        show: true, //y轴轴线
+      },
+      type: "value",
+      name: "kW",
+      //   min: 0,
+      //   max: 100,
+      nameTextStyle: {
+        //y轴name的颜色
+        color: "#fff",
+        fontSize: transformFontSize(35),
+        padding: [0, 40, 0, 0],
+      },
+      position: "left",
+      axisLabel: {
+        //刻度标签文字的颜色大小
+        color: "#fff",
+        fontSize: transformFontSize(35),
+        formatter: "{value}",
+      },
+    },
+    series: [
+      {
+        name: "总功率",
+        type: "line",
+        barWidth: 2, // 柱子宽度核心代码
+        smooth: true,
+        showSymbol: false,
+        itemStyle: {
+          color: "rgba(18, 231, 227, 1)",
+        },
+        areaStyle: {
+          normal: {
+            color: new proxy.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              {
+                offset: 0,
+                color: "rgba(18, 231, 227, 0.4)",
+              },
+
+              {
+                offset: 1,
+
+                color: "rgba(18, 231, 227, 0.01)",
+              },
+            ]),
           },
+        },
         data: arr.map((yitem) => yitem.p),
 
-          // data: [20, 42, 41, 24, 40, 30, 10],
-        },
-      ],
-    };
-    myChart.setOption(option);
-  
-    // 根据页面大小自动响应图表大小
-    window.addEventListener("resize", function () {
-      myChart.resize();
-    });
+        // data: [20, 42, 41, 24, 40, 30, 10],
+      },
+    ],
   };
-  </script>
-  
-  <style scoped>
-  .OneLine {
-    height: 100%;
-    width: 100%;
-  }
-  </style>
-  
\ No newline at end of file
+  myChart.setOption(option);
+
+  // 根据页面大小自动响应图表大小
+  window.addEventListener("resize", function () {
+    myChart.resize();
+  });
+};
+</script>
+
+<style scoped>
+.OneLine {
+  height: 100%;
+  width: 100%;
+}
+</style>
diff --git a/src/views/pages/pvPage/index.vue b/src/views/pages/pvPage/index.vue
index 4da010a..75ce116 100644
--- a/src/views/pages/pvPage/index.vue
+++ b/src/views/pages/pvPage/index.vue
@@ -81,7 +81,7 @@
                     />
                   </div>
                   <div class="right">
-                    <div class="val">9999</div>
+                    <div class="val">{{ total_cur }}</div>
                     <span>kWh</span>
                   </div>
                 </div>
@@ -98,7 +98,7 @@
                     />
                   </div>
                   <div class="right">
-                    <div class="val">9999</div>
+                    <div class="val">{{ power35kv }}</div>
                     <span>kWh</span>
                   </div>
                 </div>
@@ -115,7 +115,7 @@
                     />
                   </div>
                   <div class="right">
-                    <div class="val">9999</div>
+                    <div class="val">{{ power10kv }}</div>
                     <span>kWh</span>
                   </div>
                 </div>
@@ -132,7 +132,7 @@
                     />
                   </div>
                   <div class="right">
-                    <div class="val">9999</div>
+                    <div class="val">{{ power380V }}</div>
                     <span>kWh</span>
                   </div>
                 </div>
@@ -140,7 +140,7 @@
             </div>
             <div class="infotitle"><span>实时发电量曲线</span></div>
             <div class="info2">
-              <powerLine></powerLine>
+              <powerLine :cur_pvArr="cur_pvArr" v-if="cur_pvArrFlag"></powerLine>
             </div>
             <div class="infotitle"><span>实时功率曲线</span></div>
             <div class="info3">
@@ -217,18 +217,62 @@ import timePvLine from "./timePvLine.vue";
 import { useNow, useDateFormat } from "@vueuse/core";
 import { id } from "element-plus/es/locale/index.mjs";
 import { curpower_api } from "@/api/pvPage/pvApi";
+import {  pvApi } from '@/api/Osp/svgApi'
+
 onMounted(() => {
- 
-  
-  let Objinput={orgID: "8af8470a47aad8e20147aad92e400335"} //全部 获取光伏实时发电量
+  let Objinput = { orgID: "8af8470a47aad8e20147aad92e400335" }; //全部 获取光伏实时发电量
   getCurves(Objinput); //获取城南的接口{orgID}
+  getpv() //光伏功率曲线
 });
- // 获取光伏实时发电量
+// 当日累计发电量
+let total_cur = ref("0");
+let power35kv = ref("0");
+let power10kv = ref("0");
+let power380V = ref("0");
+let cur_pvArrFlag=ref(false)
+let cur_pvArr=reactive([]);
+// 获取光伏实时发电量
 const getCurves = (datares: any) => {
-  curpower_api(datares).then((res) => {
-    console.log("res", res);
-  });
+  curpower_api(datares)
+    .then((res) => {
+      console.log("res", res);
+      //实时量测信息
+      if (res.data) {
+        if (res.data.total) {
+          total_cur.value = res.data.total;
+        }
+        if (res.data["380V"]) {
+          power380V.value = res.data["380V"];
+        }
+        if (res.data["35kV"]) {
+          power35kv.value = res.data["35kV"];
+        }
+        if (res.data["10kV"]) {
+          power10kv.value = res.data["10kV"];
+        }
+      }
+      // 发电量曲线
+      if(res.data.data){
+        cur_pvArrFlag.value=true
+        cur_pvArr=res.data.data;
+      }
+    })
+    .catch((error) => {
+      console.log(error);
+    });
 };
+let pvArr = reactive([]) //光伏
+let pvArrFlag = ref<boolean>(false)
+// 获取光伏功率曲线
+const getpv = () => {
+  pvApi({ mrid: '03DKX-24289' }).then(res => {
+    console.log(res, 'respv')
+    pvArr = res.data
+    if (pvArr.length > 0) {
+      pvArrFlag.value = true
+    }
+  })
+}
 
 const HMS = useDateFormat(useNow(), "HH:mm:ss"); //当前时间
 const YMD = useDateFormat(useNow(), "YYYY-MM-DD"); //当前日期
diff --git a/src/views/pages/pvPage/powerLine.vue b/src/views/pages/pvPage/powerLine.vue
index 291f2e6..c0d76d7 100644
--- a/src/views/pages/pvPage/powerLine.vue
+++ b/src/views/pages/pvPage/powerLine.vue
@@ -1,229 +1,232 @@
 <template>
-    <div class="ThreeLine" ref="ThreeLine"></div>
-  </template>
-  
-  <script setup lang="ts">
-  import {
-    ref,
-    inject,
-    onBeforeUnmount,
-    getCurrentInstance,
-    onMounted,
-    watchEffect,
-  } from "vue";
-  import transformFontSize from "@/hooks/transFormSize.ts";
-  import "echarts/lib/component/dataZoom";
-  onMounted(() => {
-    drawOneLine();
-  });
-  
-  // 获取echart挂载的DOM节点
-  const ThreeLine: any = ref();
-  
-  // 获取当前组件实例
-  const { proxy }: any = getCurrentInstance();
-  
-  const drawOneLine = () => {
-    let myChart = proxy.$echarts.init(ThreeLine.value);
-    
-    myChart.clear();
-    const option = {
-      tooltip: {
-        trigger: "axis",
-        // axisPointer: { type: 'cross' }
-        textStyle: {
-          color: "#FFFFFF",
-        },
-        // padding: transformFontSize(15),
-        backgroundColor: "rgba(0,163,166,.9)", //设置自定义背景
-        borderColor: "rgba(0,163,166,.9)",
-        borderRadius: 5,
-        
-        formatter: function (param: any) {
-          let str = `
+  <div class="ThreeLine" ref="ThreeLine"></div>
+</template>
+
+<script setup lang="ts">
+import {
+  ref,
+  inject,
+  onBeforeUnmount,
+  getCurrentInstance,
+  onMounted,
+  watchEffect,
+} from "vue";
+import transformFontSize from "@/hooks/transFormSize.ts";
+import "echarts/lib/component/dataZoom";
+onMounted(() => {
+  drawOneLine(props.cur_pvArr);
+});
+const props = defineProps<{
+  cur_pvArr: any;
+}>();
+
+// 获取echart挂载的DOM节点
+const ThreeLine: any = ref();
+
+// 获取当前组件实例
+const { proxy }: any = getCurrentInstance();
+
+const drawOneLine = (arr: any) => {
+  let myChart = proxy.$echarts.init(ThreeLine.value);
+
+  myChart.clear();
+  const option = {
+    tooltip: {
+      trigger: "axis",
+      // axisPointer: { type: 'cross' }
+      textStyle: {
+        color: "#FFFFFF",
+      },
+      // padding: transformFontSize(15),
+      backgroundColor: "rgba(0,163,166,.9)", //设置自定义背景
+      borderColor: "rgba(0,163,166,.9)",
+      borderRadius: 5,
+
+      formatter: function (param: any) {
+        let str = `
           <div style="width:100%:height:100%">
             <div style="display:flex;justify-content:space-between;"> ${
               param[0].name.split(" ")[0]
             }</div>
             ${getDom(param)}
           </div>`;
-          function getDom(param: any) {
-            let newStr = "";
-            param.forEach((item: any) => {
-              newStr += `<div style="display:flex;"><div>${
-                item.seriesName
-              }负荷：</div><div>${
-                item.value === undefined ? "0" : item.value
-              }kW</div></div>`;
-            });
-            return newStr;
-          }
-          return str;
-        },
+        function getDom(param: any) {
+          let newStr = "";
+          param.forEach((item: any) => {
+            newStr += `<div style="display:flex;"><div>${
+              item.seriesName
+            }负荷：</div><div>${
+              item.value === undefined ? "0" : item.value
+            }kW</div></div>`;
+          });
+          return newStr;
+        }
+        return str;
       },
-      legend: {
-        top: "5%",
-        // right: "5%",
-        // orient: "vertical",
-        // data: ["实时发电量", "短期预测发电量", "超短期预测发电量"],
-        data: ["实时发电量"],
+    },
+    legend: {
+      top: "5%",
+      // right: "5%",
+      // orient: "vertical",
+      // data: ["实时发电量", "短期预测发电量", "超短期预测发电量"],
+      data: ["实时发电量"],
 
-        itemWidth: transformFontSize(35),
-        itemHeight: transformFontSize(18),
-        itemGap:transformFontSize(50),
-        textStyle: {
-          fontSize: transformFontSize(25),
-          color: "#FFFFFF",
-        },
+      itemWidth: transformFontSize(35),
+      itemHeight: transformFontSize(18),
+      itemGap: transformFontSize(50),
+      textStyle: {
+        fontSize: transformFontSize(25),
+        color: "#FFFFFF",
       },
-      grid: {
-        top: "25%",
-        left: "8%",
-        right: "8%",
-        bottom: "13%",
+    },
+    grid: {
+      top: "25%",
+      left: "8%",
+      right: "8%",
+      bottom: "13%",
+    },
+    xAxis: {
+      type: "category",
+      axisTick: {
+        show: false,
+        alignWithLabel: true,
       },
-      xAxis: {
-        type: "category",
-        axisTick: {
-          show: false,
-          alignWithLabel: true,
-        },
-        boundaryGap: false,
-        axisLabel: {
-          color: "#fff",
-          fontSize: transformFontSize(35),
-          padding: [0, 0, 0, 30],
-          // formatter: function (param: any) {
-          //   return param.split(' ')[1].split(':')[0] + ':' + param.split(' ')[1].split(':')[1]
-          // },
-        },
-        data: ["03:00", "06:00", "09:00", "12:00", "15:00", "18:00", "24:00"],
-  
-      },
-      yAxis: {
-        splitLine: {
-          show: false,
-        },
-        axisLine: {
-          show: true, //y轴轴线
-        },
-        type: "value",
-        name: "kWh",
-        //   min: 0,
-        //   max: 100,
-        nameTextStyle: {
-          //y轴name的颜色
-          color: "#fff",
-          fontSize: transformFontSize(35),
-          padding: [0, 50, 0, 0],
-        },
-        position: "left",
-        axisLabel: {
-          //刻度标签文字的颜色大小
-          color: "#fff",
-          fontSize: transformFontSize(35),
-          formatter: "{value}",
-        },
-      },
-      series: [
-        {
-          name: "实时发电量",
-          type: "line",
-          barWidth: 2, // 柱子宽度核心代码
-          smooth: true,
-          showSymbol: false,
-          itemStyle: {
-            color: "rgba(18, 231, 227, 1)",
-          },
-          areaStyle: {
-            normal: {
-              color: new proxy.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                {
-                  offset: 0,
-                  color: "rgba(18, 231, 227, 0.4)",
-                },
-  
-                {
-                  offset: 1,
-  
-                  color: "rgba(18, 231, 227, 0.01)",
-                },
-              ]),
-            },
-          },
-          data: [20, 42, 41, 24, 40, 30, 10],
-        },
-        // {
-        //   name: "短期预测发电量",
-        //   type: "line",
-        //   barWidth: 2, // 柱子宽度核心代码
-        //   smooth: true,
-        //   showSymbol: false,
-        //   itemStyle: {
-        //     color: "rgba(251, 187, 111, 1)",
-        //   },
-        //   areaStyle: {
-        //     normal: {
-        //       color: new proxy.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
-        //         {
-        //           offset: 0,
-  
-        //           color: "rgba(251, 187, 111, 0.4)",
-        //         },
-  
-        //         {
-        //           offset: 1,
-  
-        //           color: "rgba(251, 187, 111, 0.01)",
-        //         },
-        //       ]),
-        //     },
-        //   },
-        //   data: [30, 12, 11, 24, 20, 30, 30],
+      boundaryGap: false,
+      axisLabel: {
+        color: "#fff",
+        fontSize: transformFontSize(35),
+        padding: [0, 0, 0, 30],
+        // formatter: function (param: any) {
+        //   return param.split(' ')[1].split(':')[0] + ':' + param.split(' ')[1].split(':')[1]
         // },
-        // {
-        //   name: "超短期预测发电量",
-        //   type: "line",
-        //   barWidth: 2, // 柱子宽度核心代码
-        //   smooth: true,
-        //   showSymbol: false,
-        //   itemStyle: {
-        //     color: "rgba(107, 255, 130, 1)",
-        //   },
-        //   areaStyle: {
-        //     normal: {
-        //       color: new proxy.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
-        //         {
-        //           offset: 0,
-  
-        //           color: "rgba(107, 255, 130, 0.4)",
-        //         },
-  
-        //         {
-        //           offset: 1,
-  
-        //           color: "rgba(107, 255, 130, 0.01)",
-        //         },
-        //       ]),
-        //     },
-        //   },
-        //   data: [40, 18, 19, 23, 29, 33, 31],
-        // },
-      ],
-    };
-    myChart.setOption(option);
-  
-    // 根据页面大小自动响应图表大小
-    window.addEventListener("resize", function () {
-      myChart.resize();
-    });
+      },
+      // data: ["03:00", "06:00", "09:00", "12:00", "15:00", "18:00", "24:00"],
+      data: arr.map((rtime) => rtime?.timeStamp.slice(-5)),
+    },
+    yAxis: {
+      splitLine: {
+        show: false,
+      },
+      axisLine: {
+        show: true, //y轴轴线
+      },
+      type: "value",
+      name: "kWh",
+      //   min: 0,
+      //   max: 100,
+      nameTextStyle: {
+        //y轴name的颜色
+        color: "#fff",
+        fontSize: transformFontSize(35),
+        padding: [0, 50, 0, 0],
+      },
+      position: "left",
+      axisLabel: {
+        //刻度标签文字的颜色大小
+        color: "#fff",
+        fontSize: transformFontSize(35),
+        formatter: "{value}",
+      },
+    },
+    series: [
+      {
+        name: "实时发电量",
+        type: "line",
+        barWidth: 2, // 柱子宽度核心代码
+        smooth: true,
+        showSymbol: false,
+        itemStyle: {
+          color: "rgba(18, 231, 227, 1)",
+        },
+        areaStyle: {
+          normal: {
+            color: new proxy.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              {
+                offset: 0,
+                color: "rgba(18, 231, 227, 0.4)",
+              },
+
+              {
+                offset: 1,
+
+                color: "rgba(18, 231, 227, 0.01)",
+              },
+            ]),
+          },
+        },
+        // data: [20, 42, 41, 24, 40, 30, 10],
+        data: arr.map((pvdata) => pvdata.p),
+      },
+      // {
+      //   name: "短期预测发电量",
+      //   type: "line",
+      //   barWidth: 2, // 柱子宽度核心代码
+      //   smooth: true,
+      //   showSymbol: false,
+      //   itemStyle: {
+      //     color: "rgba(251, 187, 111, 1)",
+      //   },
+      //   areaStyle: {
+      //     normal: {
+      //       color: new proxy.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
+      //         {
+      //           offset: 0,
+
+      //           color: "rgba(251, 187, 111, 0.4)",
+      //         },
+
+      //         {
+      //           offset: 1,
+
+      //           color: "rgba(251, 187, 111, 0.01)",
+      //         },
+      //       ]),
+      //     },
+      //   },
+      //   data: [30, 12, 11, 24, 20, 30, 30],
+      // },
+      // {
+      //   name: "超短期预测发电量",
+      //   type: "line",
+      //   barWidth: 2, // 柱子宽度核心代码
+      //   smooth: true,
+      //   showSymbol: false,
+      //   itemStyle: {
+      //     color: "rgba(107, 255, 130, 1)",
+      //   },
+      //   areaStyle: {
+      //     normal: {
+      //       color: new proxy.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
+      //         {
+      //           offset: 0,
+
+      //           color: "rgba(107, 255, 130, 0.4)",
+      //         },
+
+      //         {
+      //           offset: 1,
+
+      //           color: "rgba(107, 255, 130, 0.01)",
+      //         },
+      //       ]),
+      //     },
+      //   },
+      //   data: [40, 18, 19, 23, 29, 33, 31],
+      // },
+    ],
   };
-  </script>
-  
-  <style scoped>
-  .ThreeLine {
-    height: 100%;
-    width: 100%;
-  }
-  </style>
-  
\ No newline at end of file
+  myChart.setOption(option);
+
+  // 根据页面大小自动响应图表大小
+  window.addEventListener("resize", function () {
+    myChart.resize();
+  });
+};
+</script>
+
+<style scoped>
+.ThreeLine {
+  height: 100%;
+  width: 100%;
+}
+</style>
diff --git a/src/views/pages/pvPage/rateLine.vue b/src/views/pages/pvPage/rateLine.vue
index ac8c1a0..0682bc5 100644
--- a/src/views/pages/pvPage/rateLine.vue
+++ b/src/views/pages/pvPage/rateLine.vue
@@ -1,229 +1,236 @@
 <template>
-    <div class="ThreeLine" ref="ThreeLine"></div>
-  </template>
-  
-  <script setup lang="ts">
-  import {
-    ref,
-    inject,
-    onBeforeUnmount,
-    getCurrentInstance,
-    onMounted,
-    watchEffect,
-  } from "vue";
-  import transformFontSize from "@/hooks/transFormSize.ts";
-  import "echarts/lib/component/dataZoom";
-  onMounted(() => {
-    drawOneLine();
-  });
-  
-  // 获取echart挂载的DOM节点
-  const ThreeLine: any = ref();
-  
-  // 获取当前组件实例
-  const { proxy }: any = getCurrentInstance();
-  
-  const drawOneLine = () => {
-    let myChart = proxy.$echarts.init(ThreeLine.value);
-    
-    myChart.clear();
-    const option = {
-      tooltip: {
-        trigger: "axis",
-        // axisPointer: { type: 'cross' }
-        textStyle: {
-          color: "#FFFFFF",
-        },
-        // padding: transformFontSize(15),
-        backgroundColor: "rgba(0,163,166,.9)", //设置自定义背景
-        borderColor: "rgba(0,163,166,.9)",
-        borderRadius: 5,
-        
-        formatter: function (param: any) {
-          let str = `
+  <div class="ThreeLine" ref="ThreeLine"></div>
+</template>
+
+<script setup lang="ts">
+import {
+  ref,
+  inject,
+  onBeforeUnmount,
+  getCurrentInstance,
+  onMounted,
+  watchEffect,
+} from "vue";
+import transformFontSize from "@/hooks/transFormSize.ts";
+import "echarts/lib/component/dataZoom";
+onMounted(() => {
+  drawOneLine();
+});
+// const props = defineProps<{
+//   cur_pvArr: any;
+// }>();
+
+// 获取echart挂载的DOM节点
+const ThreeLine: any = ref();
+
+// 获取当前组件实例
+const { proxy }: any = getCurrentInstance();
+
+const drawOneLine = () => {
+  let myChart = proxy.$echarts.init(ThreeLine.value);
+
+  myChart.clear();
+  const option = {
+    tooltip: {
+      trigger: "axis",
+      // axisPointer: { type: 'cross' }
+      textStyle: {
+        color: "#FFFFFF",
+      },
+      // padding: transformFontSize(15),
+      backgroundColor: "rgba(0,163,166,.9)", //设置自定义背景
+      borderColor: "rgba(0,163,166,.9)",
+      borderRadius: 5,
+
+      formatter: function (param: any) {
+        let str = `
           <div style="width:100%:height:100%">
             <div style="display:flex;justify-content:space-between;"> ${
               param[0].name.split(" ")[0]
             }</div>
             ${getDom(param)}
           </div>`;
-          function getDom(param: any) {
-            let newStr = "";
-            param.forEach((item: any) => {
-              newStr += `<div style="display:flex;"><div>${
-                item.seriesName
-              }负荷：</div><div>${
-                item.value === undefined ? "0" : item.value
-              }kW</div></div>`;
-            });
-            return newStr;
-          }
-          return str;
-        },
+        function getDom(param: any) {
+          let newStr = "";
+          param.forEach((item: any) => {
+            newStr += `<div style="display:flex;"><div>${
+              item.seriesName
+            }负荷：</div><div>${
+              item.value === undefined ? "0" : item.value
+            }kW</div></div>`;
+          });
+          return newStr;
+        }
+        return str;
       },
-      legend: {
-        top: "0%",
-        right: "5%",
-        orient: "vertical",
-        // data: ["实时功率", "短期预测功率", "超短期预测功率"],
-        data: ["实时功率"],
+    },
+    legend: {
+      top: "0%",
+      right: "5%",
+      orient: "vertical",
+      // data: ["实时功率", "短期预测功率", "超短期预测功率"],
+      data: ["实时功率"],
 
-        itemWidth: transformFontSize(35),
-        itemHeight: transformFontSize(18),
-        itemGap:transformFontSize(20),
-        textStyle: {
-          fontSize: transformFontSize(25),
-          color: "#FFFFFF",
-        },
+      itemWidth: transformFontSize(35),
+      itemHeight: transformFontSize(18),
+      itemGap: transformFontSize(20),
+      textStyle: {
+        fontSize: transformFontSize(25),
+        color: "#FFFFFF",
       },
-      grid: {
-        top: "25%",
-        left: "8%",
-        right: "8%",
-        bottom: "13%",
+    },
+    grid: {
+      top: "25%",
+      left: "8%",
+      right: "8%",
+      bottom: "13%",
+    },
+    xAxis: {
+      type: "category",
+      axisTick: {
+        show: false,
+        alignWithLabel: true,
       },
-      xAxis: {
-        type: "category",
-        axisTick: {
-          show: false,
-          alignWithLabel: true,
-        },
-        boundaryGap: false,
-        axisLabel: {
-          color: "#fff",
-          fontSize: transformFontSize(35),
-          padding: [0, 0, 0, 30],
-          // formatter: function (param: any) {
-          //   return param.split(' ')[1].split(':')[0] + ':' + param.split(' ')[1].split(':')[1]
-          // },
-        },
-        data: ["03:00", "06:00", "09:00", "12:00", "15:00", "18:00", "24:00"],
-  
-      },
-      yAxis: {
-        splitLine: {
-          show: false,
-        },
-        axisLine: {
-          show: true, //y轴轴线
-        },
-        type: "value",
-        name: "kW",
-        //   min: 0,
-        //   max: 100,
-        nameTextStyle: {
-          //y轴name的颜色
-          color: "#fff",
-          fontSize: transformFontSize(35),
-          padding: [0, 50, 0, 0],
-        },
-        position: "left",
-        axisLabel: {
-          //刻度标签文字的颜色大小
-          color: "#fff",
-          fontSize: transformFontSize(35),
-          formatter: "{value}",
-        },
-      },
-      series: [
-        {
-          name: "实时功率",
-          type: "line",
-          barWidth: 2, // 柱子宽度核心代码
-          smooth: true,
-          showSymbol: false,
-          itemStyle: {
-            color: "rgba(18, 231, 227, 1)",
-          },
-          areaStyle: {
-            normal: {
-              color: new proxy.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
-                {
-                  offset: 0,
-                  color: "rgba(18, 231, 227, 0.4)",
-                },
-  
-                {
-                  offset: 1,
-  
-                  color: "rgba(18, 231, 227, 0.01)",
-                },
-              ]),
-            },
-          },
-          data: [20, 42, 41, 24, 40, 30, 10],
-        },
-        // {
-        //   name: "短期预测功率",
-        //   type: "line",
-        //   barWidth: 2, // 柱子宽度核心代码
-        //   smooth: true,
-        //   showSymbol: false,
-        //   itemStyle: {
-        //     color: "rgba(251, 187, 111, 1)",
-        //   },
-        //   areaStyle: {
-        //     normal: {
-        //       color: new proxy.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
-        //         {
-        //           offset: 0,
-  
-        //           color: "rgba(251, 187, 111, 0.4)",
-        //         },
-  
-        //         {
-        //           offset: 1,
-  
-        //           color: "rgba(251, 187, 111, 0.01)",
-        //         },
-        //       ]),
-        //     },
-        //   },
-        //   data: [30, 12, 11, 24, 20, 30, 30],
+      boundaryGap: false,
+      axisLabel: {
+        color: "#fff",
+        fontSize: transformFontSize(35),
+        padding: [0, 0, 0, 30],
+        // formatter: function (param: any) {
+        //   return param.split(' ')[1].split(':')[0] + ':' + param.split(' ')[1].split(':')[1]
         // },
-        // {
-        //   name: "超短期预测功率",
-        //   type: "line",
-        //   barWidth: 2, // 柱子宽度核心代码
-        //   smooth: true,
-        //   showSymbol: false,
-        //   itemStyle: {
-        //     color: "rgba(107, 255, 130, 1)",
-        //   },
-        //   areaStyle: {
-        //     normal: {
-        //       color: new proxy.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
-        //         {
-        //           offset: 0,
-  
-        //           color: "rgba(107, 255, 130, 0.4)",
-        //         },
-  
-        //         {
-        //           offset: 1,
-  
-        //           color: "rgba(107, 255, 130, 0.01)",
-        //         },
-        //       ]),
-        //     },
-        //   },
-        //   data: [40, 18, 19, 23, 29, 33, 31],
-        // },
-      ],
-    };
-    myChart.setOption(option);
-  
-    // 根据页面大小自动响应图表大小
-    window.addEventListener("resize", function () {
-      myChart.resize();
-    });
+      },
+      data: ["03:00", "06:00", "09:00", "12:00", "15:00", "18:00", "24:00"],
+      // data: (arr.map((rtime) => rtime?.timeStamp.slice(-8))),
+     
+
+      // data: ["03:00", "06:00", "09:00", "12:00", "15:00", "18:00", "24:00"],
+    },
+    yAxis: {
+      splitLine: {
+        show: false,
+      },
+      axisLine: {
+        show: true, //y轴轴线
+      },
+      type: "value",
+      name: "kW",
+      //   min: 0,
+      //   max: 100,
+      nameTextStyle: {
+        //y轴name的颜色
+        color: "#fff",
+        fontSize: transformFontSize(35),
+        padding: [0, 50, 0, 0],
+      },
+      position: "left",
+      axisLabel: {
+        //刻度标签文字的颜色大小
+        color: "#fff",
+        fontSize: transformFontSize(35),
+        formatter: "{value}",
+      },
+    },
+    series: [
+      {
+        name: "实时功率",
+        type: "line",
+        barWidth: 2, // 柱子宽度核心代码
+        smooth: true,
+        showSymbol: false,
+        itemStyle: {
+          color: "rgba(18, 231, 227, 1)",
+        },
+        areaStyle: {
+          normal: {
+            color: new proxy.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
+              {
+                offset: 0,
+                color: "rgba(18, 231, 227, 0.4)",
+              },
+
+              {
+                offset: 1,
+
+                color: "rgba(18, 231, 227, 0.01)",
+              },
+            ]),
+          },
+        },
+        data: [20, 42, 41, 24, 40, 30, 10],
+        // data: arr.map((pvdata) => pvdata.p),
+
+      },
+      // {
+      //   name: "短期预测功率",
+      //   type: "line",
+      //   barWidth: 2, // 柱子宽度核心代码
+      //   smooth: true,
+      //   showSymbol: false,
+      //   itemStyle: {
+      //     color: "rgba(251, 187, 111, 1)",
+      //   },
+      //   areaStyle: {
+      //     normal: {
+      //       color: new proxy.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
+      //         {
+      //           offset: 0,
+
+      //           color: "rgba(251, 187, 111, 0.4)",
+      //         },
+
+      //         {
+      //           offset: 1,
+
+      //           color: "rgba(251, 187, 111, 0.01)",
+      //         },
+      //       ]),
+      //     },
+      //   },
+      //   data: [30, 12, 11, 24, 20, 30, 30],
+      // },
+      // {
+      //   name: "超短期预测功率",
+      //   type: "line",
+      //   barWidth: 2, // 柱子宽度核心代码
+      //   smooth: true,
+      //   showSymbol: false,
+      //   itemStyle: {
+      //     color: "rgba(107, 255, 130, 1)",
+      //   },
+      //   areaStyle: {
+      //     normal: {
+      //       color: new proxy.$echarts.graphic.LinearGradient(0, 0, 0, 1, [
+      //         {
+      //           offset: 0,
+
+      //           color: "rgba(107, 255, 130, 0.4)",
+      //         },
+
+      //         {
+      //           offset: 1,
+
+      //           color: "rgba(107, 255, 130, 0.01)",
+      //         },
+      //       ]),
+      //     },
+      //   },
+      //   data: [40, 18, 19, 23, 29, 33, 31],
+      // },
+    ],
   };
-  </script>
-  
-  <style scoped>
-  .ThreeLine {
-    height: 100%;
-    width: 100%;
-  }
-  </style>
-  
\ No newline at end of file
+  myChart.setOption(option);
+
+  // 根据页面大小自动响应图表大小
+  window.addEventListener("resize", function () {
+    myChart.resize();
+  });
+};
+</script>
+
+<style scoped>
+.ThreeLine {
+  height: 100%;
+  width: 100%;
+}
+</style>