Browse Source

修改功率曲线展示,修改矩阵图标不对应,修改矩阵样式

baiyanting 1 year ago
parent
commit
c31fe169c5

+ 8 - 1
.env.production

@@ -1,3 +1,10 @@
 VUE_APP_API=http://10.81.3.153:6060
 VUE_APP_Matrix=http://10.81.3.153:6060
-VUE_APP_ADAPTERURL=http://10.81.3.155:8011
+VUE_APP_ADAPTERURL=http://10.81.3.155:8011
+
+
+# 趋势对比数据条数
+VUE_APP_DIALOG_NUM = 8
+
+#趋势对比鼠标点击
+VUE_APP_DIALOG_POINT = contextmenu

+ 3 - 3
src/components/chart/powerEcharts.vue

@@ -129,7 +129,7 @@ export default {
         },
         grid: [
           {
-            left: 65,
+            left: 80,
             right: 100,
             top: 30,
             bottom: 30,
@@ -168,10 +168,10 @@ export default {
       var timeStamp = [];
       let stamp = new Date(new Date().setHours(0, 0, 0, 0)).getTime();
       if (this.predictFlag) {
-        for (let i = 0; i < 96; i++) {
+        for (let i = 0; i < 48; i++) {
           timeStamp.push(dayjs(stamp).format("HH:mm"));
           this.emptyData.push("0");
-          stamp = parseInt(stamp) + 15 * 60 * 1000;
+          stamp = parseInt(stamp) + 30 * 60 * 1000;
         }
         timeStamp.push("24:00");
       } else {

+ 4 - 27
src/views/stateMonitor/Agc/Agc.vue

@@ -44,6 +44,9 @@ export default {
       this.activeTab = activeTab;
       this.tabIndex = activeTab == "all" ? 0 : activeTab == "fc" ? -1 : -2;
       this.enterpriseIndex = enterpriseIndex;
+      this.$nextTick(() => {
+        this.requestData();
+      });
     },
     // 请求服务
     requestData() {
@@ -60,28 +63,7 @@ export default {
       });
     },
   },
-  watch: {
-    tabIndex(newVal, oldVal) {
-      if (newVal !== oldVal) {
-        // clearInterval(this.timer);
-        // this.timer = null;
-        this.requestData();
-        // this.timer = setInterval(() => {
-        //   this.requestData();
-        // }, 5000);
-      }
-    },
-    enterpriseIndex(newVal, oldVal) {
-      if (newVal !== oldVal) {
-        // clearInterval(this.timer);
-        // this.timer = null;
-        this.requestData();
-        // this.timer = setInterval(() => {
-        //   this.requestData();
-        // }, 5000);
-      }
-    },
-  },
+  watch: {},
   created() {
     let that = this;
     that.$nextTick(() => {
@@ -114,14 +96,9 @@ export default {
   }
 
   .panel-groups {
-    // display: flex;
-    // flex-direction: row;
-    // width: 100%;
-    // flex-wrap: wrap;
     display: grid;
     justify-content: space-evenly;
     grid-template-columns: repeat(auto-fill, 442px);
-    height: calc(100vh - 117px);
     overflow-y: auto;
     overflow-x: hidden;
     .el-col + .el-col {

+ 5 - 5
src/views/stateMonitor/DetailMatrix/detailMatrix.vue

@@ -3,7 +3,7 @@
     :class="$store.state.themeName === 'dark' ? 'dark-matrix' : 'light-matrix'"
   >
     <!-- 头部按钮选项 -->
-    <HeaderNav @typeFlag="typeFlag" :isAll="true"/>
+    <HeaderNav @typeFlag="typeFlag" :isAll="true" />
     <div class="matrix-body">
       <!-- 接入台数  欠发情况 -->
       <div class="body-title">
@@ -353,8 +353,8 @@ export default {
         9: "svg-downtime",
         10: "svg-intranet-involvement",
         11: "svg-environment",
-        12: "svg-unknown",
-        13: "svg-offline",
+        12: "svg-offline",
+        13: "svg-unknown",
       },
       status: "all",
       titleArr: [],
@@ -450,8 +450,8 @@ export default {
           text1: "离线",
           text2: "未知",
           value1: "lx",
-          value2: "13",
-          value3: "12",
+          value2: "12",
+          value3: "13",
           code: "lx",
           code1: "lxz",
           code2: "wz",

+ 4 - 21
src/views/stateMonitor/Status/Status.vue

@@ -1,5 +1,5 @@
 <template>
-  <HeaderNav @typeFlag="typeFlag" :isAll="true"/>
+  <HeaderNav @typeFlag="typeFlag" :isAll="true" />
   <div class="status">
     <el-scrollbar>
       <el-row
@@ -53,6 +53,9 @@ export default {
       this.activeTab = activeTab;
       this.tabIndex = activeTab == "all" ? 0 : activeTab == "fc" ? -1 : -2;
       this.enterpriseIndex = enterpriseIndex;
+      this.$nextTick(() => {
+        this.requestData();
+      });
     },
     // 请求服务
     requestData() {
@@ -70,26 +73,6 @@ export default {
     },
   },
   watch: {
-    tabIndex(newVal, oldVal) {
-      if (newVal !== oldVal) {
-        // clearInterval(this.timer);
-        // this.timer = null;
-        this.requestData();
-        // this.timer = setInterval(() => {
-        //   this.requestData();
-        // }, 5000);
-      }
-    },
-    enterpriseIndex(newVal, oldVal) {
-      if (newVal !== oldVal) {
-        // clearInterval(this.timer);
-        // this.timer = null;
-        this.requestData();
-        // this.timer = setInterval(() => {
-        //   this.requestData();
-        // }, 5000);
-      }
-    },
   },
   created() {
     let that = this;

+ 15 - 14
src/views/stateMonitor/factoryMonitor/photovoltaic/lightMatrixMonitor/index.vue

@@ -115,7 +115,7 @@
         >
           <div class="matrix-title">
             <div class="matrix-svg">
-              <i class="svg-icon svg-icon-sm svg-icon-blue">
+              <i class="svg-icon svg-icon-sm svg-icon-orange">
                 <SvgIcon svgid="svg-issue"></SvgIcon
               ></i>
               <span class="station-name">{{ value.name }}</span>
@@ -124,7 +124,7 @@
             <div class="indicator">
               <div
                 class="sub-title-item"
-                :class="{ active: index >= 8 }"
+                :class="{ active: index >= 7 }"
                 v-for="(item, index) in subTitleDatas"
                 :key="index"
                 @click="handleIndicatorClick(value.id)"
@@ -136,7 +136,7 @@
                   :class="item.cls"
                 >
                   {{
-                    index >= 8
+                    index >= 7
                       ? item.ratio
                         ? (
                             Number(value[item.key] ? value[item.key] : "0") /
@@ -465,8 +465,8 @@ export default {
           text1: "离线",
           text2: "未知",
           value1: "lx",
-          value2: "13",
-          value3: "12",
+          value2: "12",
+          value3: "13",
           code: "lxts",
           code1: "lxzts",
           code2: "wzts",
@@ -486,11 +486,11 @@ export default {
       ],
       //   期次右侧
       subTitleDatas: [
-        {
-          text: "接入台数",
-          color: "#FFFFFF",
-          key: "jrts",
-        },
+        // {
+        //   text: "接入台数",
+        //   color: "#FFFFFF",
+        //   key: "jrts",
+        // },
         {
           text: "待机台数",
           color: "#1c99ff",
@@ -588,8 +588,8 @@ export default {
         9: "svg-downtime",
         10: "svg-intranet-involvement",
         11: "svg-environment",
-        12: "svg-unknown",
-        13: "svg-offline",
+        12: "svg-offline",
+        13: "svg-unknown",
       },
       colorList: [
         "blue",
@@ -1483,11 +1483,12 @@ p {
       align-items: center;
       width: 100%;
       height: 32px;
-      background-color: #001844;
+      //   background-color: #001844;
+      background-color: rgba(96, 103, 105, 0.4);
       font-size: 12px;
       font-family: SourceHanSansCN;
       font-weight: 400;
-      color: #1c99ff;
+      color: #ff8100;
       padding: 0 12px;
       .matrix-svg {
         flex: 0 0 auto;

+ 4 - 5
src/views/stateMonitor/factoryMonitor/photovoltaic/lighthome/index.vue

@@ -356,7 +356,7 @@
               width="100%"
               :ratio="1000"
               :height="screenHeight > 1050 ? '23vh' : '19vh'"
-              unit="MW"
+              :units="['MW']"
               :showLegend="true"
             >
             </LineCharts>
@@ -692,8 +692,7 @@ export default {
       return this.weather.weather ? "width: 20%" : "display: none";
     },
   },
-  created() {
-  },
+  created() {},
   mounted() {
     if (document.getElementById("ifrId")) {
       const oIframe = document.getElementById("ifrId");
@@ -837,7 +836,7 @@ export default {
     getPoints(pointIds) {
       GetPointFitting({
         begin: dayjs().startOf("date").format("YYYY-MM-DD HH:mm:ss"),
-        end: dayjs().endOf("date").format("YYYY-MM-DD HH:mm:ss"),
+        end: dayjs().format("YYYY-MM-DD HH:mm:ss"),
         interval: 60 * 30,
         pointIds,
       }).then((res) => {
@@ -871,7 +870,7 @@ export default {
       // 获取今日测点数据
       GetPointFitting({
         begin: dayjs().startOf("date").format("YYYY-MM-DD HH:mm:ss"),
-        end: dayjs().endOf("date").format("YYYY-MM-DD HH:mm:ss"),
+        end: dayjs().format("YYYY-MM-DD HH:mm:ss"),
         interval: 60 * 30,
         pointIds: pointId,
       }).then((res) => {

+ 29 - 95
src/views/stateMonitor/factoryMonitor/windPowerPlant/components/lineCharts.vue

@@ -24,9 +24,9 @@ export default {
       default: 4,
     },
     // 单位
-    units: {
-      type: Array,
-      default: () => ["", ""],
+    unit: {
+      type: String,
+      default: "",
     },
     // 单位数据
     unitDatas: {
@@ -98,10 +98,10 @@ export default {
       // 当日0点时间
       var timeStamp = [];
       let stamp = new Date(new Date().setHours(0, 0, 0, 0)).getTime();
-      for (let i = 0; i < 96; i++) {
+      for (let i = 0; i < 48; i++) {
         timeStamp.push(dayjs(stamp).format("HH:mm"));
         // this.emptyData.push("0");
-        stamp = parseInt(stamp) + 15 * 60 * 1000;
+        stamp = parseInt(stamp) + 30 * 60 * 1000;
       }
       timeStamp.push("24:00");
       return timeStamp;
@@ -166,95 +166,6 @@ export default {
       });
       return result;
     },
-    yAxis() {
-      let result = [];
-      let i = 0;
-      this.units.forEach((value, index) => {
-        var option = {
-          type: "value",
-          // name: this.units[index],
-          nameTextStyle: {
-            color: this.color[index],
-            fontSize: 12,
-          },
-          splitNumber: 11,
-          // position:'left',
-          axisLabel: {
-            formatter: "{value}",
-            textStyle: {
-              color: this.color[index],
-              fontSize: util.vh(10),
-            },
-          },
-          axisLine: {
-            lineStyle: {
-              color: this.color[this.unitDatas[index].codex],
-              width: 1,
-            },
-          },
-          boundaryGap: false,
-          //分格线
-          splitLine: {
-            show: false,
-            lineStyle: {
-              color: "#2D3338",
-              width: 1, //轴线的宽度
-              type: "dashed",
-            },
-          },
-        };
-        if (this.unitDatas[index].flag) {
-          i++;
-          option.min = this.unitDatas[index].min;
-          option.max = this.unitDatas[index].max;
-          if (i % 2 != 0) {
-            option.position = "left";
-            option.offset = (i - 1) * 35;
-            if (i >= 3) {
-              option.offset = (i - 2) * 35;
-            }
-            if (i >= 5) {
-              option.offset = (i - 3) * 35;
-            }
-            if (i >= 7) {
-              option.offset = (i - 4) * 35;
-            }
-          } else {
-            if (i >= 4) {
-              option.offset = (i - 3) * 35;
-            }
-            if (i >= 6) {
-              option.offset = (i - 4) * 35;
-            }
-            if (i >= 8) {
-              option.offset = (i - 5) * 35;
-            }
-          }
-
-          result.push(option);
-        } else if (index == 0) {
-          if (!this.unitDatas[0].flag) {
-            option.axisLine.lineStyle.color = "#525252";
-            option.axisLabel.textStyle.color = "#828484";
-          }
-          if (
-            this.unitDatas[index].min == 0 &&
-            this.unitDatas[index].max == 0
-          ) {
-            result.push(option);
-          } else {
-            option.min = this.unitDatas[index].min;
-            option.max = this.unitDatas[index].max;
-            result.push(option);
-          }
-        }
-        this.leftOffset = 35;
-        if (i == 0) {
-          this.leftOffset = 35;
-        }
-      });
-      return result;
-    },
   },
   methods: {
     childMethod(index) {
@@ -327,7 +238,30 @@ export default {
             data: this.getTimeStanp,
           },
         ],
-        yAxis: this.yAxis,
+        yAxis: {
+          type: "value",
+          name: this.unit,
+          nameTextStyle: {
+            color: "#828484",
+            fontSize: 12,
+          },
+          splitNumber: 3,
+          splitLine: {
+            show: false,
+          },
+          axisLabel: {
+            show: true,
+            textStyle: {
+              color: "#606769",
+            },
+          },
+          axisLine: {
+            lineStyle: {
+              color: "#606769", // y轴的颜色
+              width: 1, //y轴线的宽度
+            },
+          },
+        },
         // dataZoom: [
         //   {
         //     type: "slider",

+ 15 - 14
src/views/stateMonitor/factoryMonitor/windPowerPlant/matrixMonitor/index.vue

@@ -115,7 +115,7 @@
         >
           <div class="matrix-title">
             <div class="matrix-svg">
-              <i class="svg-icon svg-icon-sm svg-icon-blue">
+              <i class="svg-icon svg-icon-sm svg-icon-green">
                 <SvgIcon svgid="svg-issue"></SvgIcon
               ></i>
               <span class="station-name">{{ value.name }}</span>
@@ -124,7 +124,7 @@
             <div class="indicator">
               <div
                 class="sub-title-item"
-                :class="{ active: index >= 8 }"
+                :class="{ active: index >= 7 }"
                 v-for="(item, index) in subTitleDatas"
                 :key="index"
                 @click="handleIndicatorClick(value.id)"
@@ -136,7 +136,7 @@
                   :class="item.cls"
                 >
                   {{
-                    index >= 8
+                    index >= 7
                       ? item.ratio
                         ? (
                             Number(value[item.key] ? value[item.key] : "0") /
@@ -465,8 +465,8 @@ export default {
           text1: "离线",
           text2: "未知",
           value1: "lx",
-          value2: "13",
-          value3: "12",
+          value2: "12",
+          value3: "13",
           code: "lxts",
           code1: "lxzts",
           code2: "wzts",
@@ -486,11 +486,11 @@ export default {
       ],
       //   期次右侧
       subTitleDatas: [
-        {
-          text: "接入台数",
-          color: "#FFFFFF",
-          key: "jrts",
-        },
+        // {
+        //   text: "接入台数",
+        //   color: "#FFFFFF",
+        //   key: "jrts",
+        // },
         {
           text: "待机台数",
           color: "#1c99ff",
@@ -588,8 +588,8 @@ export default {
         9: "svg-downtime",
         10: "svg-intranet-involvement",
         11: "svg-environment",
-        12: "svg-unknown",
-        13: "svg-offline",
+        12: "svg-offline",
+        13: "svg-unknown",
       },
       colorList: [
         "blue",
@@ -1494,11 +1494,12 @@ p {
       align-items: center;
       width: 100%;
       height: 32px;
-      background-color: #001844;
+      //   background-color: #001844;
+      background-color: rgba(96, 103, 105, 0.4);
       font-size: 12px;
       font-family: SourceHanSansCN;
       font-weight: 400;
-      color: #1c99ff;
+      color: #05bb4c;
       padding: 0 12px;
       .matrix-svg {
         flex: 0 0 auto;

+ 9 - 21
src/views/stateMonitor/factoryMonitor/windPowerPlant/windPower/components/windEchart.vue

@@ -9,7 +9,7 @@ import * as echarts from "echarts";
 import dayjs from "dayjs";
 
 export default {
-  name: "powerEcharts",
+  name: "windEcharts",
   props: {
     CurveValues: {
       type: Array,
@@ -31,17 +31,6 @@ export default {
     };
   },
   methods: {
-    dataToFix2(obj) {
-      if (obj) {
-        if (obj == "" || obj == "undefined") {
-          return "0.00";
-        } else {
-          return obj.toFixed(2);
-        }
-      } else {
-        return "0.00";
-      }
-    },
     getChart() {
       var chartDom = document.getElementById("maine");
       var myChart = echarts.init(chartDom); // 绘制图表
@@ -74,12 +63,12 @@ export default {
         },
         xAxis: {
           axisLabel: {
-            interval: 7,
-            showMinLabel: true,
-            showMaxLabel: true,
-            // textStyle: {
-            //     color: '#606769',
-            // },
+            textStyle: {
+              color: "#606769",
+            },
+          },
+          axisTick: {
+            alignWithLabel: true,
           },
           axisLine: {
             lineStyle: {
@@ -201,10 +190,10 @@ export default {
       // 当日0点时间
       var timeStamp = [];
       let stamp = new Date(new Date().setHours(0, 0, 0, 0)).getTime();
-      for (let i = 0; i < 96; i++) {
+      for (let i = 0; i < 48; i++) {
         timeStamp.push(dayjs(stamp).format("MM-DD HH:mm"));
         this.emptyData.push("0");
-        stamp = parseInt(stamp) + 15 * 60 * 1000;
+        stamp = parseInt(stamp) + 30 * 60 * 1000;
       }
       timeStamp.push(dayjs(stamp).format("MM-DD") + "\xa0" + "24:00");
       this.emptyData.push("0");
@@ -218,7 +207,6 @@ export default {
           this.getChart();
         });
       },
-      immediate: true,
     },
   },
 };

+ 2 - 17
src/views/stateMonitor/factoryMonitor/windPowerPlant/windPower/index.vue

@@ -335,7 +335,7 @@ export default {
     getPoints(pointIds) {
       GetPointFitting({
         begin: dayjs().startOf("date").format("YYYY-MM-DD HH:mm:ss"),
-        end: dayjs().endOf("date").format("YYYY-MM-DD HH:mm:ss"),
+        end: dayjs().format("YYYY-MM-DD HH:mm:ss"),
         interval: 60 * 30,
         pointIds,
       }).then((res) => {
@@ -424,21 +424,6 @@ img {
   background-size: 100% 100%;
 }
 
-.meigui {
-  width: 335px;
-  height: 280px;
-  background-color: rgba(0, 0, 0, 0.45);
-
-  .indicator-title {
-    left: 10px;
-    line-height: 30px;
-  }
-
-  .rander-chart {
-    margin-top: 35px;
-  }
-}
-
 .indicator-title {
   border-bottom: 1px solid rgba(153, 153, 153, 0.5);
   width: 95%;
@@ -606,7 +591,7 @@ img {
       border: 1px solid #606769;
     }
     .tower-name {
-      font-size: 14px;
+      font-size: 12px;
       padding: 0 18px;
       &.tower-actived {
         color: #fff;

+ 2 - 2
src/views/stateMonitor/factoryMonitor/windPowerPlant/windhome/index.vue

@@ -863,7 +863,7 @@ export default {
     getPoints(pointIds) {
       GetPointFitting({
         begin: dayjs().startOf("date").format("YYYY-MM-DD HH:mm:ss"),
-        end: dayjs().endOf("date").format("YYYY-MM-DD HH:mm:ss"),
+        end: dayjs().format("YYYY-MM-DD HH:mm:ss"),
         interval: 60 * 30,
         pointIds,
       }).then((res) => {
@@ -897,7 +897,7 @@ export default {
       // 获取今日测点数据
       GetPointFitting({
         begin: dayjs().startOf("date").format("YYYY-MM-DD HH:mm:ss"),
-        end: dayjs().endOf("date").format("YYYY-MM-DD HH:mm:ss"),
+        end: dayjs().format("YYYY-MM-DD HH:mm:ss"),
         interval: 60 * 30,
         pointIds: pointId,
       }).then((res) => {

+ 4 - 24
src/views/stateMonitor/zhzb/zhzb.vue

@@ -233,7 +233,7 @@ export default {
         JSON.stringify(this.uniformDetial)
       );
     }
-    this.$nextTick(() => this.firstRender());
+    // this.$nextTick(() => this.firstRender());
   },
   mounted() {
     this.timer = setInterval(() => {
@@ -252,6 +252,7 @@ export default {
       this.activeTab = activeTab;
       this.tabIndex = activeTab == "all" ? 0 : activeTab == "fc" ? -1 : -2;
       this.enterpriseIndex = enterpriseIndex;
+      this.$nextTick(() => this.firstRender());
     },
     // 查询数据
     async firstRender() {
@@ -356,7 +357,8 @@ export default {
     },
     //添加指标
     addTargets() {
-      this.$refs.zbdialog.openDialog(this.tabIndex.toString());
+      if (this.stationData.length)
+        this.$refs.zbdialog.openDialog(this.tabIndex.toString());
     },
     //更多指标--确定刷新指标,刷新数据
     tableRefresh(checkList, moreTargetData) {
@@ -421,28 +423,6 @@ export default {
       return arr;
     },
   },
-  watch: {
-    tabIndex(newVal, oldVal) {
-      if (newVal !== oldVal) {
-        clearInterval(this.timer);
-        this.timer = null;
-        this.firstRender();
-        this.timer = setInterval(() => {
-          this.firstRender();
-        }, 3000);
-      }
-    },
-    enterpriseIndex(newVal, oldVal) {
-      if (newVal !== oldVal) {
-        clearInterval(this.timer);
-        this.timer = null;
-        this.firstRender();
-        this.timer = setInterval(() => {
-          this.firstRender();
-        }, 3000);
-      }
-    },
-  },
 };
 </script>
 <style lang="less" scoped>