常规上传

src/App.vue

@@ -143,7 +143,7 @@ export default {
   created() {},
   mounted() {
     let that = this;
-    const value = window.sessionStorage.getItem("moreSty") || "greenSty";
+    const value = localStorage.getItem("themeName") || "greenSty";
     that.$emit("proStyle", value);
     if (value === "blueSty") {
       document.body.classList.remove("blueStyle");
@@ -167,8 +167,8 @@ export default {
   },
   methods: {
     proStyleFn(value) {
-        window.sessionStorage.setItem("moreSty", value);
-        this.$store.commit("changeMoreSty", value)
+      window.sessionStorage.setItem("moreSty", value);
+      this.$store.commit("changeMoreSty", value);
     },
     getScale() {
       const w = window.innerWidth / this.style.width;
@@ -356,7 +356,7 @@ body {
       padding-left: 20px;
       margin: auto;
       color: #fff;
-      img{
+      img {
         width: 400px;
       }
     }

src/components/chart/combination/area-line-chart.vue

@@ -30,7 +30,7 @@ export default {
     // 单位
     units: {
       type: Array,
-      default: () => ["健康趋势", "风机健康状态数量"],
+      default: () => ["运行情况", "风机健康状态数量"],
     },
     // 显示 legend
     showLegend: {
@@ -129,10 +129,10 @@ export default {
       let option = {
         color: this.color,
         grid: {
-          left: 40,
-          right: 40,
-          bottom: 40,
-          top: 32,
+          left: 12,
+          right: 12,
+          bottom: 12,
+          top: 30,
           containLabel: true,
         },
         tooltip: {
@@ -141,35 +141,23 @@ export default {
           axisPointer: {
             type: "cross",
           },
-          backgroundColor:
-            this.$store.state.themeName === "dark"
-              ? "rgba(0,0,0,0.4)"
-              : "rgba(255,255,255,0.5)",
-          borderColor:
-            this.$store.state.themeName === "dark"
-              ? partten.getColor("gray")
-              : "#000",
+          backgroundColor: "rgba(255, 255, 255, 0.5)",
+          borderColor: "#fff",
           textStyle: {
-            color: this.$store.state.themeName === "dark" ? "#fff" : "#000",
+            color: "#fff",
             fontSize: 14,
           },
         },
         legend: {
           show: this.showLegend,
           data: this.legend,
-          right: 120,
+          right: 20,
           icon: "ract",
           itemWidth: 8,
           itemHeight: 8,
-          inactiveColor:
-            this.$store.state.themeName === "dark"
-              ? partten.getColor("gray")
-              : "#000",
+          inactiveColor: "#fff",
           textStyle: {
-            color:
-              this.$store.state.themeName === "dark"
-                ? partten.getColor("grayl")
-                : "#000",
+            color: "#fff",
             fontSize: 12,
           },
         },
@@ -177,10 +165,7 @@ export default {
           {
             type: "category",
             axisLabel: {
-              color:
-                this.$store.state.themeName === "dark"
-                  ? partten.getColor("gray")
-                  : "#000",
+              color: "#fff",
             },
             axisLine: {
               show: false,
@@ -208,18 +193,13 @@ export default {
             name: this.units[0],
             axisLabel: {
               formatter: "{value} ",
-              color:
-                this.$store.state.themeName === "dark"
-                  ? partten.getColor("gray")
-                  : "#000",
+              color: "#fff",
             },
             axisLine: {
+              show: false,
               type: "dashed",
               lineStyle: {
-                color:
-                  this.$store.state.themeName === "dark"
-                    ? partten.getColor("gray")
-                    : "#000",
+                color: "#fff",
               },
               width: 5,
             },
@@ -230,10 +210,7 @@ export default {
               lineStyle: {
                 type: "dashed",
                 dashOffset: 10,
-                color:
-                  this.$store.state.themeName === "dark"
-                    ? partten.getColor("gray")
-                    : "#000" + 80,
+                color: "rgba(#fff, 0.2)",
               },
             },
           },

src/components/chart/combination/multiple-bar-line-chart.vue

@@ -109,11 +109,20 @@ export default {
             axisLabel: {
               formatter: "{value} ",
               fontSize: 12,
+              color: "#fff",
+            },
+            axisLine: {
+              show: false,
+              type: "dashed",
+              lineStyle: {
+                color: "#fff",
+              },
+              width: 5,
             },
             //分格线
             splitLine: {
               lineStyle: {
-                color: "#5a6162",
+                color: "rgba(#fff, 0.2)",
                 type: "dashed",
               },
             },
@@ -123,8 +132,17 @@ export default {
             type: "value",
             name: value,
             axisLabel: {
-              formatter: "{value}",
+              formatter: "{value} ",
               fontSize: 12,
+              color: "#fff",
+            },
+            axisLine: {
+              show: false,
+              type: "dashed",
+              lineStyle: {
+                color: "#fff",
+              },
+              width: 5,
             },
             //分格线
             splitLine: {
@@ -185,16 +203,10 @@ export default {
         color: this.color,
         tooltip: {
           trigger: "axis",
-          backgroundColor:
-            this.$store.state.themeName === "dark"
-              ? "rgba(0,0,0,0.4)"
-              : "rgba(255,255,255,0.5)",
-          borderColor:
-            this.$store.state.themeName === "dark"
-              ? partten.getColor("gray")
-              : "#000",
+          backgroundColor: "rgba(255, 255, 255, 0.5)",
+          borderColor: "#fff",
           textStyle: {
-            color: this.$store.state.themeName === "dark" ? "#fff" : "#000",
+            color: "#fff",
             fontSize: 12,
           },
         },
@@ -205,15 +217,9 @@ export default {
           icon: "ract",
           itemWidth: 8,
           itemHeight: 8,
-          inactiveColor:
-            this.$store.state.themeName === "dark"
-              ? partten.getColor("gray")
-              : "#000",
+          inactiveColor: "#fff",
           textStyle: {
-            color:
-              this.$store.state.themeName === "dark"
-                ? partten.getColor("grayl")
-                : "#000",
+            color: "#fff",
             fontSize: 12,
           },
         },
@@ -231,6 +237,7 @@ export default {
               type: "shadow",
             },
             axisLabel: {
+              color: "#fff",
               fontSize: 12,
             },
           },

src/components/chart/radar/direction-radar-chart.vue

@@ -27,453 +27,331 @@ export default {
       default: "标题",
     },
     // 值
-    series: {
-      type: Object,
-      default: () => {},
+    value: {
+      type: Number,
+      default: 90,
     },
   },
   data() {
     return {
       id: "",
       chart: null,
-      Data: [],
-      label: [],
       indicator: [
         {
-          name: "N",
+          name: "北",
           max: 100,
         },
         {
-          name: "NNE",
+          name: "北北西",
           max: 100,
         },
         {
-          name: "NE",
+          name: "北西",
           max: 100,
         },
         {
-          name: "ENE",
+          name: "西北西",
           max: 100,
         },
         {
-          name: "E",
+          name: "西",
           max: 100,
         },
         {
-          name: "ESE",
+          name: "西南西",
           max: 100,
         },
         {
-          name: "SE",
+          name: "南西",
           max: 100,
         },
         {
-          name: "SSE",
+          name: "南南西",
           max: 100,
         },
         {
-          name: "S",
+          name: "南",
           max: 100,
         },
         {
-          name: "SSW",
+          name: "南南东",
           max: 100,
         },
         {
-          name: "SW",
+          name: "东南",
           max: 100,
         },
         {
-          name: "WSW",
+          name: "东南东",
           max: 100,
         },
         {
-          name: "W",
+          name: "东",
           max: 100,
         },
         {
-          name: "WNW",
+          name: "东北东",
           max: 100,
         },
         {
-          name: "NW",
+          name: "北东",
           max: 100,
         },
         {
-          name: "NNW",
+          name: "北北东",
           max: 100,
         },
       ],
     };
   },
-
+  computed: {},
   methods: {
     initChart() {
-      console.log(this.series);
-      let nameList =
-        this.series.name && this.series.name.length ? this.series.name : [];
       let option = {
         grid: {
-          left: 40,
-          right: 40,
-          bottom: "40%",
-          top: "40%",
+          left: 20,
+          right: 20,
+          bottom: 20,
+          top: 20,
           containLabel: false,
         },
-        legend: {
-          show: false,
-        },
-        polar: {},
-        tooltip: {
-          trigger: "axis",
-          axisPointer: {
-            type: "cross",
-          },
-        },
-        angleAxis: {
-          type: "value",
-          startAngle: 90,
-          min: 0, //最小刻度
-          max: 360, //最大刻度
-          interval: 360 / nameList.length, //间隔刻度 16方位间隔22.5，可改8方位
-          axisLabel: {
-            show: false,
-            // formatter: function (value, index) {
-            //   return nameList.reverse()[index] || "";
-            // },
-          },
-        },
-        radiusAxis: {},
-        // series: [
-        //   {
-        //     // coordinateSystem: "polar",
-        //     name: "line",
-        //     type: "radar",
-        //     data: this.series.data
-        //       ? [{ name: "a", value: this.series.data.map((i) => i[0]) }]
-        //       : [],
-        //     areaStyle: {
-        //       color: "rgba(227, 127, 127, 1)",
-        //     },
-        //   },
-        // ],
-        series: [
+        radar: [
+          // 最低层 80
           {
-            type: "radar",
-            tooltip: {
-              trigger: "item",
+            radius: "70%",
+            center: ["50%", "50%"],
+            splitNumber: 1,
+            nameGap: "10",
+            name: {
+              textStyle: {
+                color: partten.getColor("gray") + 99,
+                fontSize: 12,
+              },
             },
-            itemStyle: {
-              //此属性的颜色和下面areaStyle属性的颜色都设置成相同色即可实现
-              color: "#087636",
-              borderColor: "#087636",
+            axisLine: {
+              lineStyle: {
+                color: partten.getColor("gray") + 40,
+              },
             },
-            areaStyle: {
-              color: "#087636",
+            splitLine: {
+              lineStyle: {
+                width: 1,
+                color: partten.getColor("gray") + 40,
+              },
             },
-            data: [
-              {
-                value: this.series.data
-                  ? this.series.data.map((i) => i[0])
-                  : "",
-                name: "风向频率",
+            splitArea: {
+              areaStyle: {
+                color: "transparent",
               },
-            ],
+            },
+            indicator: this.indicator,
           },
-        ],
-        radar: [
+          // 次外层 70 - 80
           {
-            indicator: this.indicator,
+            radius: ["60%", "70%"],
             center: ["50%", "50%"],
-            radius: "70%",
+            startAngle: 90,
+            splitNumber: 2,
+            name: {
+              show: false,
+            },
+            axisLine: {
+              lineStyle: {
+                color: partten.getColor("gray") + 40,
+                shadowBlur: 1,
+                shadowColor: "#fff",
+                shadowOffsetX: 0.5,
+                shadowOffsetY: 1,
+              },
+            },
             splitLine: {
-              //配置雷达图的每一圈的网格线颜色
               lineStyle: {
-                color: "#262732",
+                width: 1,
+                color: partten.getColor("gray") + 40,
+                shadowColor: "#fff",
+                shadowBlur: 0,
+                shadowOffsetX: 0.5,
+                shadowOffsetY: 0.5,
               },
             },
             splitArea: {
-              //配置雷达图的网格线背景
+              areaStyle: {
+                color: "transparent",
+              },
+            },
+            indicator: this.indicator,
+          },
+          // 渐变层 40 - 70
+          {
+            radius: ["30%", "60%"],
+            center: ["50%", "50%"],
+            splitNumber: 1,
+            name: {
               show: false,
             },
+            axisLine: {
+              lineStyle: {
+                color: partten.getColor("gray") + 40,
+              },
+            },
+            splitLine: {
+              lineStyle: {
+                width: 1,
+                color: partten.getColor("gray"),
+              },
+            },
+            splitArea: {
+              areaStyle: {
+                shadowBlur: 4,
+                color: {
+                  type: "radial",
+                  x: 0.5,
+                  y: 0.5,
+                  r: 0.5,
+                  colorStops: [
+                    {
+                      offset: 0.5,
+                      color: "transparent", // 0% 处的颜色
+                    },
+                    {
+                      offset: 1,
+                      color: this.$store.state.themeName === "dark" ? partten.getColor("green") : partten.getColor("deepblue") + 60, // 100% 处的颜色
+                    },
+                  ],
+                  global: false, // 缺省为 false
+                },
+              },
+            },
+            indicator: this.indicator,
+          },
+          // 内层 0 - 40
+          {
+            radius: "30%",
+            center: ["50%", "50%"],
+            splitNumber: 1,
             name: {
-              //配置雷达图的每个指示器的名称颜色
-              textStyle: {
-                color: "#838D9E",
+              show: false,
+            },
+            axisLine: {
+              lineStyle: {
+                color: partten.getColor("gray") + 40,
               },
             },
+            splitLine: {
+              lineStyle: {
+                width: 1,
+                color: partten.getColor("gray"),
+              },
+            },
+            splitArea: {
+              areaStyle: {
+                shadowBlur: 4,
+                color: "transparent",
+              },
+            },
+            indicator: this.indicator,
+          },
+        ],
+        series: [
+          // 进度条
+          {
+            z: 1,
+            name: "内部（环形）进度条",
+            type: "gauge",
+            radius: "70%",
+            splitNumber: 5,
             axisLine: {
-              //配置雷达图的射线样式颜色
               lineStyle: {
-                color: "#262732",
+                color: [
+                  [
+                    this.value / 360,
+                    new echarts.graphic.LinearGradient(0, 0, 1, 0, [
+                      {
+                        offset: 0,
+                        color: this.$store.state.themeName === "dark" ? partten.getColor(this.color) + 10 : partten.getColor("deepblue") + 10,
+                      },
+                      {
+                        offset: 1,
+                        color: this.$store.state.themeName === "dark" ? partten.getColor(this.color) + 99 : partten.getColor("deepblue") + 99,
+                      },
+                    ]),
+                  ],
+                  [1, "transparent"],
+                ],
+                width: 40,
               },
             },
+            startAngle: 90,
+            endAngle: 450,
+            clockwise: true,
+            axisLabel: {
+              show: false,
+            },
+            axisTick: {
+              show: false,
+            },
+            splitLine: {
+              show: false,
+            },
+            pointer: {
+              show: false,
+            },
+          },
+          // 指针
+          {
+            name: "指针",
+            type: "gauge",
+            z: 2,
+            min: 0,
+            max: 360,
+            radius: "100%",
+            startAngle: 90,
+            endAngle: 360 + 90,
+            clockwise: false,
+            axisLine: {
+              show: false,
+            },
+            tooltip: {
+              show: false,
+            },
+            axisLabel: {
+              show: false,
+            },
+            axisTick: {
+              show: false,
+            },
+            splitLine: {
+              show: false,
+            },
+            detail: {
+              show: false,
+            },
+            title: {
+              //标题
+              show: false,
+            },
+            data: [
+              {
+                value: this.value,
+              },
+            ],
+            itemStyle: {
+              normal: {
+                color: "#fff",
+              },
+            },
+            pointer: {
+              show: true,
+              length: "70%",
+              radius: "0%",
+              width: util.vh(3), //指针粗细
+              offsetCenter: ["0%", "0%"],
+            },
+            animationDuration: 1000,
           },
         ],
-        // radar: [
-        //   // 最低层 80
-        //   {
-        //     radius: "70%",
-        //     center: ["50%", "50%"],
-        //     splitNumber: 1,
-        //     nameGap: "10",
-        //     name: {
-        //       textStyle: {
-        //         color: partten.getColor("gray") + 99,
-        //         fontSize: 12,
-        //       },
-        //     },
-        //     axisLine: {
-        //       lineStyle: {
-        //         color: partten.getColor("gray") + 40,
-        //       },
-        //     },
-        //     splitLine: {
-        //       lineStyle: {
-        //         width: 1,
-        //         color: partten.getColor("gray") + 40,
-        //       },
-        //     },
-        //     splitArea: {
-        //       areaStyle: {
-        //         color: "transparent",
-        //       },
-        //     },
-        //     indicator: this.indicator,
-        //   },
-        //   // 次外层 70 - 80
-        //   {
-        //     radius: ["60%", "70%"],
-        //     center: ["50%", "50%"],
-        //     startAngle: 90,
-        //     splitNumber: 2,
-        //     name: {
-        //       show: false,
-        //     },
-        //     axisLine: {
-        //       lineStyle: {
-        //         color: partten.getColor("gray") + 40,
-        //         shadowBlur: 1,
-        //         shadowColor: "#fff",
-        //         shadowOffsetX: 0.5,
-        //         shadowOffsetY: 1,
-        //       },
-        //     },
-        //     splitLine: {
-        //       lineStyle: {
-        //         width: 1,
-        //         color: partten.getColor("gray") + 40,
-        //         shadowColor: "#fff",
-        //         shadowBlur: 0,
-        //         shadowOffsetX: 0.5,
-        //         shadowOffsetY: 0.5,
-        //       },
-        //     },
-        //     splitArea: {
-        //       areaStyle: {
-        //         color: "transparent",
-        //       },
-        //     },
-        //     indicator: this.indicator,
-        //   },
-        //   // 渐变层 40 - 70
-        //   {
-        //     radius: ["30%", "60%"],
-        //     center: ["50%", "50%"],
-        //     splitNumber: 1,
-        //     name: {
-        //       show: false,
-        //     },
-        //     axisLine: {
-        //       lineStyle: {
-        //         color: partten.getColor("gray") + 40,
-        //       },
-        //     },
-        //     splitLine: {
-        //       lineStyle: {
-        //         width: 1,
-        //         color: partten.getColor("gray"),
-        //       },
-        //     },
-        //     splitArea: {
-        //       areaStyle: {
-        //         shadowBlur: 4,
-        //         color: {
-        //           type: "radial",
-        //           x: 0.5,
-        //           y: 0.5,
-        //           r: 0.5,
-        //           colorStops: [
-        //             {
-        //               offset: 0.5,
-        //               color: "transparent", // 0% 处的颜色
-        //             },
-        //             {
-        //               offset: 1,
-        //               color:
-        //                 this.$store.state.themeName === "dark"
-        //                   ? partten.getColor("green")
-        //                   : partten.getColor("deepblue") + 60, // 100% 处的颜色
-        //             },
-        //           ],
-        //           global: false, // 缺省为 false
-        //         },
-        //       },
-        //     },
-        //     indicator: this.indicator,
-        //   },
-        //   // 内层 0 - 40
-        //   {
-        //     radius: "30%",
-        //     center: ["50%", "50%"],
-        //     splitNumber: 1,
-        //     name: {
-        //       show: false,
-        //     },
-        //     axisLine: {
-        //       lineStyle: {
-        //         color: partten.getColor("gray") + 40,
-        //       },
-        //     },
-        //     splitLine: {
-        //       lineStyle: {
-        //         width: 1,
-        //         color: partten.getColor("gray"),
-        //       },
-        //     },
-        //     splitArea: {
-        //       areaStyle: {
-        //         shadowBlur: 4,
-        //         color: "transparent",
-        //       },
-        //     },
-        //     indicator: this.indicator,
-        //   },
-        // ],
-        // series: [
-        //   // 进度条
-        //   {
-        //     z: 1,
-        //     name: "内部（环形）进度条",
-        //     type: "gauge",
-        //     radius: "70%",
-        //     splitNumber: 5,
-        //     axisLine: {
-        //       lineStyle: {
-        //         color: [
-        //           ...(this.value.data
-        //             ? this.value.data.map((item) => {
-        //                 return [
-        //                   item.value / 360,
-        //                   new echarts.graphic.LinearGradient(0, 0, 1, 0, [
-        //                     {
-        //                       offset: 0,
-        //                       color:
-        //                         this.$store.state.themeName === "dark"
-        //                           ? partten.getColor(this.color) + 10
-        //                           : partten.getColor("deepblue") + 10,
-        //                     },
-        //                     {
-        //                       offset: 1,
-        //                       color:
-        //                         this.$store.state.themeName === "dark"
-        //                           ? partten.getColor(this.color) + 99
-        //                           : partten.getColor("deepblue") + 99,
-        //                     },
-        //                   ]),
-        //                 ];
-        //               })
-        //             : [
-        //                 0,
-        //                 new echarts.graphic.LinearGradient(0, 0, 1, 0, [
-        //                   {
-        //                     offset: 0,
-        //                     color:
-        //                       this.$store.state.themeName === "dark"
-        //                         ? partten.getColor(this.color) + 10
-        //                         : partten.getColor("deepblue") + 10,
-        //                   },
-        //                   {
-        //                     offset: 1,
-        //                     color:
-        //                       this.$store.state.themeName === "dark"
-        //                         ? partten.getColor(this.color) + 99
-        //                         : partten.getColor("deepblue") + 99,
-        //                   },
-        //                 ]),
-        //               ]),
-        //           [1, "transparent"],
-        //         ],
-        //         width: 40,
-        //       },
-        //     },
-        //     startAngle: 90,
-        //     endAngle: 450,
-        //     clockwise: true,
-        //     axisLabel: {
-        //       show: false,
-        //     },
-        //     axisTick: {
-        //       show: false,
-        //     },
-        //     splitLine: {
-        //       show: false,
-        //     },
-        //     pointer: {
-        //       show: false,
-        //     },
-        //   },
-        //   // 指针
-        //   {
-        //     name: "指针",
-        //     type: "gauge",
-        //     z: 2,
-        //     min: 0,
-        //     max: 360,
-        //     radius: "100%",
-        //     startAngle: 90,
-        //     endAngle: 360 + 90,
-        //     clockwise: false,
-        //     axisLine: {
-        //       show: false,
-        //     },
-        //     tooltip: {
-        //       show: false,
-        //     },
-        //     axisLabel: {
-        //       show: false,
-        //     },
-        //     axisTick: {
-        //       show: false,
-        //     },
-        //     splitLine: {
-        //       show: false,
-        //     },
-        //     detail: {
-        //       show: false,
-        //     },
-        //     title: {
-        //       //标题
-        //       show: false,
-        //     },
-        //     data: this.value.data,
-        //     itemStyle: {
-        //       normal: {
-        //         color: "#fff",
-        //       },
-        //     },
-        //     pointer: {
-        //       show: true,
-        //       length: "70%",
-        //       radius: "0%",
-        //       width: util.vh(3), //指针粗细
-        //       offsetCenter: ["0%", "0%"],
-        //     },
-        //     animationDuration: 1000,
-        //   },
-        // ],
       };
-      console.log(option);
+
       this.chart.setOption(option);
     },
   },

src/components/chart/radar/radar-chart.vue

@@ -32,22 +32,22 @@ export default {
       default: () => {
         return {
           indicator: [
-            "北(0.0/0.0)",
-            "北北西(0.0/0.0)",
-            "北西(0.0/0.0)",
-            "西北西(0.0/0.0)",
-            "西(0.0/0.0)",
-            "西南西(0.0/0.0)",
-            "南西(0.0/0.0)",
-            "南南西(0.0/0.0)",
-            "南(0.0/0.0)",
-            "南南东(0.0/0.0)",
-            "东南(0.0/0.0)",
-            "东南东(0.0/0.0)",
-            "东(0.0/0.0)",
-            "东北东(0.0/0.0)",
-            "北东(0.0/0.0)",
-            "北北东(0.0/0.0)",
+            "北",
+            "北北西",
+            "北西",
+            "西北西",
+            "西",
+            "西南西",
+            "南西",
+            "南南西",
+            "南",
+            "南南东",
+            "东南",
+            "东南东",
+            "东",
+            "东北东",
+            "北东",
+            "北北东",
           ],
           data: [
             {
@@ -56,7 +56,7 @@ export default {
                 35000, 50000, 38000, 44200, 14200, 20000, 35000, 50000, 38000,
                 20000, 35000, 50000, 38000,
               ],
-              name: "NAME",
+              name: "风资源",
             },
           ],
         };
@@ -99,17 +99,17 @@ export default {
   computed: {},
   methods: {
     initChart() {
+      const dom = document.getElementById(this.id);
+      dom && dom.removeAttribute("_echarts_instance_");
+      let chart = echarts.init(document.getElementById(this.id));
+      this.chart = chart;
+
       let themeName = "";
-      let theme = this.$store.state.themeName;
-      if (theme == "dark" || theme == "light") {
-        themeName = theme;
-      } else {
-        themeName = theme.split(" ")[1];
-      }
-      let chart = echarts.init(this.$el);
+      let theme = localStorage.getItem("themeName");
+      themeName = theme;
 
       let maxValue = -1;
-      if (themeName === "dark") {
+      if (themeName === "greenSty") {
         this.lineStyles = [this.green, this.blue];
       } else {
         this.lineStyles = [this.blue, this.green];
@@ -136,7 +136,10 @@ export default {
           indicator.push({ name: item, max: maxValue });
         });
 
-      let baseSize = 65;
+      let radius = "70%";
+      if (/px/.test(this.width)) {
+        radius = `${parseInt(this.width) * 0.8}px`;
+      }
 
       let option = {
         grid: {
@@ -147,21 +150,15 @@ export default {
         },
         tooltip: {
           trigger: "item",
-          backgroundColor:
-            this.$store.state.themeName === "dark"
-              ? "rgba(0,0,0,0.4)"
-              : "rgba(255,255,255,0.5)",
-          borderColor:
-            this.$store.state.themeName === "dark"
-              ? partten.getColor("gray")
-              : "#000",
+          backgroundColor: "#000",
+          borderColor: "#fff",
           textStyle: {
-            color: this.$store.state.themeName === "dark" ? "#fff" : "#000",
-            fontSize: util.vh(16),
+            color: "#fff",
+            fontSize: util.vh(14),
           },
           position: function (pos, params, dom, rect, size) {
             // 鼠标在左侧时 tooltip 显示到右侧，鼠标在右侧时 tooltip 显示到左侧。
-            var obj = { top: 60 };
+            var obj = { top: 30 };
             obj[["left", "right"][+(pos[0] < size.viewSize[0] / 2)]] = 5;
             return obj;
           },
@@ -171,255 +168,228 @@ export default {
         radar: [
           // 最低层 90
           {
-            radius: baseSize + "%",
+            radius,
             center: ["50%", "50%"],
             splitNumber: 1,
-            nameGap: "4",
+            nameGap: "2",
             name: {
               textStyle: {
-                color:
-                  this.$store.state.themeName === "dark"
-                    ? partten.getColor("gray")
-                    : "#000",
-                fontSize: 12,
-                padding: [0, 16],
-              },
-            },
-            axisLine: {
-              lineStyle: {
-                color:
-                  this.$store.state.themeName === "dark"
-                    ? partten.getColor("gray") + 40
-                    : "#000" + 40,
-              },
-            },
-            splitLine: {
-              lineStyle: {
-                width: 1,
-                color:
-                  this.$store.state.themeName === "dark"
-                    ? partten.getColor("gray") + 40
-                    : "#000" + 40,
-              },
-            },
-            splitArea: {
-              areaStyle: {
-                color: "transparent",
-              },
-            },
-            indicator: indicator,
-          },
-          // 次外层 80 - 90
-          {
-            radius: ["55%", "65%"],
-            center: ["50%", "50%"],
-            startAngle: 90,
-            splitNumber: 2,
-            name: {
-              show: false,
-            },
-            axisLine: {
-              lineStyle: {
-                color:
-                  this.$store.state.themeName === "dark"
-                    ? partten.getColor("gray") + 40
-                    : "#000" + 40,
-                shadowBlur: 1,
-                shadowColor: "#fff",
-                shadowOffsetX: 0.5,
-                shadowOffsetY: 1,
-              },
-            },
-            splitLine: {
-              lineStyle: {
-                width: 1,
-                color:
-                  this.$store.state.themeName === "dark"
-                    ? partten.getColor("gray") + 40
-                    : "#000" + 40,
-                shadowColor: "#fff",
-                shadowBlur: 0,
-                shadowOffsetX: 0.5,
-                shadowOffsetY: 0.5,
-              },
-            },
-            splitArea: {
-              areaStyle: {
-                color: "transparent",
-              },
-            },
-            indicator: indicator,
-          },
-          // 渐变层 40 - 80
-          {
-            radius: ["30%", "55%"],
-            center: ["50%", "50%"],
-            splitNumber: 1,
-            name: {
-              show: false,
-            },
-            axisLine: {
-              lineStyle: {
-                color:
-                  this.$store.state.themeName === "dark"
-                    ? partten.getColor("gray") + 40
-                    : "#000" + 40,
-              },
-            },
-            splitLine: {
-              lineStyle: {
-                width: 1,
-                color:
-                  this.$store.state.themeName === "dark"
-                    ? partten.getColor("gray")
-                    : "#000",
-              },
-            },
-            splitArea: {
-              areaStyle: {
-                shadowBlur: 4,
-                color: {
-                  type: "radial",
-                  x: 0.5,
-                  y: 0.5,
-                  r: 0.5,
-                  colorStops: [
-                    {
-                      offset: 0.5,
-                      color: "transparent", // 0% 处的颜色
-                    },
-                    {
-                      offset: 1,
-                      color:
-                        this.$store.state.themeName === "dark"
-                          ? partten.getColor("green") + 60
-                          : partten.getColor("deepblue") + 60, // 100% 处的颜色
-                    },
-                  ],
-                  global: false, // 缺省为 false
-                },
+                color: "#fff",
+                fontSize: 11,
+                padding: [0, 8],
               },
             },
-            indicator: indicator,
-          },
-          // 渐变层 0 - 40
-          {
-            radius: ["0%", "30%"],
-            center: ["50%", "50%"],
-            splitNumber: 1,
-            name: {
-              show: false,
-            },
             axisLine: {
               lineStyle: {
-                color:
-                  this.$store.state.themeName === "dark"
-                    ? partten.getColor("gray") + 40
-                    : "#000" + 40,
+                color: "#fff",
               },
             },
             splitLine: {
               lineStyle: {
                 width: 1,
-                color:
-                  this.$store.state.themeName === "dark"
-                    ? partten.getColor("gray")
-                    : "#000",
+                color: "#fff",
               },
             },
             splitArea: {
               areaStyle: {
-                shadowBlur: 4,
-                color: {
-                  type: "radial",
-                  x: 0.5,
-                  y: 0.5,
-                  r: 0.5,
-                  colorStops: [
-                    {
-                      offset: 0.5,
-                      color: "transparent", // 0% 处的颜色
-                    },
-                    {
-                      offset: 1,
-                      color:
-                        this.$store.state.themeName === "dark"
-                          ? partten.getColor("green") + 60
-                          : partten.getColor("deepblue") + 60, // 100% 处的颜色
-                    },
-                  ],
-                  global: false, // 缺省为 false
-                },
-              },
-            },
-            indicator: indicator,
-          },
-          // 内层 0 - 50
-          {
-            radius: "50%",
-            center: ["50%", "50%"],
-            splitNumber: 1,
-            name: {
-              show: false,
-            },
-            axisLine: {
-              lineStyle: {
-                color:
-                  this.$store.state.themeName === "dark"
-                    ? partten.getColor("gray") + 40
-                    : "#000" + 40,
-              },
-            },
-            splitLine: {
-              lineStyle: {
-                width: 1,
-                color:
-                  this.$store.state.themeName === "dark"
-                    ? partten.getColor("gray")
-                    : "#000",
-              },
-            },
-            splitArea: {
-              areaStyle: {
-                shadowBlur: 4,
-                color: "transparent",
-              },
-            },
-            indicator: indicator,
-          },
-          // 内层 0 - 45
-          {
-            radius: "35%",
-            center: ["50%", "50%"],
-            splitNumber: 1,
-            name: {
-              show: false,
-            },
-            axisLine: {
-              lineStyle: {
-                color:
-                  this.$store.state.themeName === "dark"
-                    ? partten.getColor("gray") + 40
-                    : "#000" + 40,
-              },
-            },
-            splitLine: {
-              lineStyle: {
-                width: 1,
-                color:
-                  this.$store.state.themeName === "dark"
-                    ? partten.getColor("gray")
-                    : "#000",
-              },
-            },
-            splitArea: {
-              areaStyle: {
-                shadowBlur: 4,
                 color: "transparent",
               },
             },
             indicator: indicator,
           },
+          // // 次外层 80 - 90
+          // {
+          //   radius: ["55%", "65%"],
+          //   center: ["50%", "50%"],
+          //   startAngle: 90,
+          //   splitNumber: 2,
+          //   name: {
+          //     show: false,
+          //   },
+          //   axisLine: {
+          //     lineStyle: {
+          //       color: "#fff",
+          //       shadowBlur: 1,
+          //       shadowColor: "#fff",
+          //       shadowOffsetX: 0.5,
+          //       shadowOffsetY: 1,
+          //     },
+          //   },
+          //   splitLine: {
+          //     lineStyle: {
+          //       width: 1,
+          //       color: "#fff",
+          //       shadowColor: "#fff",
+          //       shadowBlur: 0,
+          //       shadowOffsetX: 0.5,
+          //       shadowOffsetY: 0.5,
+          //     },
+          //   },
+          //   splitArea: {
+          //     areaStyle: {
+          //       color: "transparent",
+          //     },
+          //   },
+          //   indicator: indicator,
+          // },
+          // // 渐变层 40 - 80
+          // {
+          //   radius: ["30%", "55%"],
+          //   center: ["50%", "50%"],
+          //   splitNumber: 1,
+          //   name: {
+          //     show: false,
+          //   },
+          //   axisLine: {
+          //     lineStyle: {
+          //       color: "#fff",
+          //     },
+          //   },
+          //   splitLine: {
+          //     lineStyle: {
+          //       width: 1,
+          //       color: "#fff",
+          //     },
+          //   },
+          //   splitArea: {
+          //     areaStyle: {
+          //       shadowBlur: 4,
+          //       color: {
+          //         type: "radial",
+          //         x: 0.5,
+          //         y: 0.5,
+          //         r: 0.5,
+          //         colorStops: [
+          //           {
+          //             offset: 0.5,
+          //             color: "transparent", // 0% 处的颜色
+          //           },
+          //           {
+          //             offset: 1,
+          //             color:
+          //               this.$store.state.themeName === "dark"
+          //                 ? partten.getColor("green") + 60
+          //                 : partten.getColor("deepblue") + 60, // 100% 处的颜色
+          //           },
+          //         ],
+          //         global: false, // 缺省为 false
+          //       },
+          //     },
+          //   },
+          //   indicator: indicator,
+          // },
+          // // 渐变层 0 - 40
+          // {
+          //   radius: ["0%", "30%"],
+          //   center: ["50%", "50%"],
+          //   splitNumber: 1,
+          //   name: {
+          //     show: false,
+          //   },
+          //   axisLine: {
+          //     lineStyle: {
+          //       color: "rgba(255, 255, 255, 0.5)",
+          //     },
+          //   },
+          //   splitLine: {
+          //     lineStyle: {
+          //       width: 1,
+          //       color: "rgba(255, 255, 255, 0.5)",
+          //     },
+          //   },
+          //   splitArea: {
+          //     areaStyle: {
+          //       shadowBlur: 4,
+          //       color: {
+          //         type: "radial",
+          //         x: 0.5,
+          //         y: 0.5,
+          //         r: 0.5,
+          //         colorStops: [
+          //           {
+          //             offset: 0.5,
+          //             color: "transparent", // 0% 处的颜色
+          //           },
+          //           {
+          //             offset: 1,
+          //             color:
+          //               this.$store.state.themeName === "dark"
+          //                 ? partten.getColor("green") + 60
+          //                 : partten.getColor("deepblue") + 60, // 100% 处的颜色
+          //           },
+          //         ],
+          //         global: false, // 缺省为 false
+          //       },
+          //     },
+          //   },
+          //   indicator: indicator,
+          // },
+          // // 内层 0 - 50
+          // {
+          //   radius: "50%",
+          //   center: ["50%", "50%"],
+          //   splitNumber: 1,
+          //   name: {
+          //     show: false,
+          //   },
+          //   axisLine: {
+          //     lineStyle: {
+          //       color:
+          //         this.$store.state.themeName === "dark"
+          //           ? partten.getColor("gray") + 40
+          //           : "#000" + 40,
+          //     },
+          //   },
+          //   splitLine: {
+          //     lineStyle: {
+          //       width: 1,
+          //       color:
+          //         this.$store.state.themeName === "dark"
+          //           ? partten.getColor("gray")
+          //           : "#000",
+          //     },
+          //   },
+          //   splitArea: {
+          //     areaStyle: {
+          //       shadowBlur: 4,
+          //       color: "transparent",
+          //     },
+          //   },
+          //   indicator: indicator,
+          // },
+          // // 内层 0 - 45
+          // {
+          //   radius: "35%",
+          //   center: ["50%", "50%"],
+          //   splitNumber: 1,
+          //   name: {
+          //     show: false,
+          //   },
+          //   axisLine: {
+          //     lineStyle: {
+          //       color:
+          //         this.$store.state.themeName === "dark"
+          //           ? partten.getColor("gray") + 40
+          //           : "#000" + 40,
+          //     },
+          //   },
+          //   splitLine: {
+          //     lineStyle: {
+          //       width: 1,
+          //       color:
+          //         this.$store.state.themeName === "dark"
+          //           ? partten.getColor("gray")
+          //           : "#000",
+          //     },
+          //   },
+          //   splitArea: {
+          //     areaStyle: {
+          //       shadowBlur: 4,
+          //       color: "transparent",
+          //     },
+          //   },
+          //   indicator: indicator,
+          // },
         ],
         series: [
           {
@@ -429,9 +399,14 @@ export default {
           },
         ],
       };
-      console.log(option);
       chart.setOption(option);
+      this.resize = function () {
+        chart.resize();
+      };
+
+      window.addEventListener("resize", this.resize);
     },
+    resize() {},
   },
   created() {
     this.id = "pie-chart-" + util.newGUID();
@@ -452,16 +427,12 @@ export default {
     "$store.state.themeName"() {
       this.initChart();
     },
+    width() {
+      this.initChart();
+    },
   },
 };
 </script>
 
 <style lang="less" scoped>
-.chart {
-  width: 100%;
-  height: 100%;
-  display: block;
-  margin: auto;
-  position: relative;
-}
 </style>

src/store/index.js

@@ -10,7 +10,7 @@ import { get } from "jquery";
 const state = {
   websocketTimeSec: 1000,
   loading: false, //全局 - 加载中....
-  themeName: localStorage.getItem("themeName") || "dark", // 主题
+  themeName: localStorage.getItem("themeName") || "greenSty", // 主题
   menuData: [],
   windturbineMap: {},
   moudleName: localStorage.getItem("ModuleName") || "",
@@ -32,12 +32,16 @@ const state = {
   //实时报警列表最大长度
   warningListLimitLength: 30,
   setConfig: 1,
-    menuState: 1,
-    moreSty: sessionStorage.getItem("moreSty") || "greenSty"
+  menuState: 1,
+  moreSty: localStorage.getItem("moreSty") || "greenSty"
 };
 
 //改变状态的方法`
 const mutations = {
+  proStyle(state, tag) {
+    state.themeName = tag;
+    state.moreSty = tag;
+  },
   loadingStore(state, tag) {
     state.loading = tag;
   },
@@ -67,12 +71,12 @@ const mutations = {
   changeBoosterAlarm(state, data) {
     state.boosterAlarm = data;
     localStorage.setItem("boosterAlarm", JSON.stringify(data));
-    },
-  
-    changeMoreSty(state, data) {
-        state.moreSty = data;
-        localStorage.setItem("moreSty", JSON.stringify(data));
-    },
+  },
+
+  changeMoreSty(state, data) {
+    state.moreSty = data;
+    localStorage.setItem("moreSty", JSON.stringify(data));
+  },
   //升压站报警列表弹窗
   changeDrawer(state, data) {
     state.drawer = data;
@@ -166,10 +170,13 @@ const mutations = {
   },
   changeMenuState(state) {
     state.menuState++;
-    },
+  },
 };
 
 const actions = {
+  proStyle(context, newData) {
+    context.commit("proStyle", newData);
+  },
   actionAlarmList(context, newData) {
     context.commit("changeAlarmlist", newData);
   },
@@ -188,7 +195,7 @@ const actions = {
   },
   changeMenuState(state, data) {
     context.commit("changeMenuState");
-    },
+  },
 };
 
 export default createStore({

src/themeBlue.less

@@ -42,6 +42,14 @@
 .nsfStyle {
     #app {
 
+        .el-overlay {
+            .dialog-title {
+                .title {
+                    color: #fff !important;
+                }
+            }
+        }
+
         .map {
             .bTable {
                 .value {

src/themeDark.less

@@ -41,6 +41,14 @@
 // 绿色主题
 .blueStyle {
 
+    .el-overlay {
+        .dialog-title {
+            .title {
+                color: #fff !important;
+            }
+        }
+    }
+
     .map {
         .bTable {
             .value {

src/views/economicsOperation/windAnalyse/djxxzl/current-scatter-chart.json

@@ -0,0 +1,398 @@
+
+{
+	"color": [
+			"#1C99FF",
+			"#FF8700",
+			"#e6b600d9",
+			"#0098d9",
+			"#3D54BE",
+			"#005eaa",
+			"#cda819",
+			"#32a487"
+	],
+	"textStyle": {},
+	"title": {
+			"textStyle": {
+					"color": "#333333"
+			},
+			"subtextStyle": {
+					"color": "#aaaaaa"
+			}
+	},
+	"line": {
+			"itemStyle": {
+					"borderWidth": 1
+			},
+			"lineStyle": {
+					"width": 2
+			},
+			"symbolSize": 4,
+			"symbol": "emptyCircle",
+			"smooth": false
+	},
+	"radar": {
+			"itemStyle": {
+					"borderWidth": 1
+			},
+			"lineStyle": {
+					"width": 2
+			},
+			"symbolSize": 4,
+			"symbol": "emptyCircle",
+			"smooth": false
+	},
+	"bar": {
+			"itemStyle": {
+					"barBorderWidth": 0,
+					"barBorderColor": "#ccc"
+			}
+	},
+	"pie": {
+			"itemStyle": {
+					"borderWidth": 0,
+					"borderColor": "#ccc"
+			}
+	},
+	"scatter": {
+			"itemStyle": {
+					"borderWidth": 0,
+					"borderColor": "#ccc"
+			}
+	},
+	"boxplot": {
+			"itemStyle": {
+					"borderWidth": 0,
+					"borderColor": "#ccc"
+			}
+	},
+	"parallel": {
+			"itemStyle": {
+					"borderWidth": 0,
+					"borderColor": "#ccc"
+			}
+	},
+	"sankey": {
+			"itemStyle": {
+					"borderWidth": 0,
+					"borderColor": "#ccc"
+			}
+	},
+	"funnel": {
+			"itemStyle": {
+					"borderWidth": 0,
+					"borderColor": "#ccc"
+			}
+	},
+	"gauge": {
+			"itemStyle": {
+					"borderWidth": 0,
+					"borderColor": "#ccc"
+			}
+	},
+	"candlestick": {
+			"itemStyle": {
+					"color": "#c12e34",
+					"color0": "#2b821d",
+					"borderColor": "#c12e34",
+					"borderColor0": "#2b821d",
+					"borderWidth": 1
+			}
+	},
+	"graph": {
+			"itemStyle": {
+					"borderWidth": 0,
+					"borderColor": "#ccc"
+			},
+			"lineStyle": {
+					"width": 1,
+					"color": "#aaaaaa"
+			},
+			"symbolSize": 4,
+			"symbol": "emptyCircle",
+			"smooth": false,
+			"color": [
+					"#c12e34",
+					"#e6b600",
+					"#0098d9",
+					"#50ec39",
+					"#005eaa",
+					"#339ca8",
+					"#cda819",
+					"#32a487"
+			],
+			"label": {
+					"color": "#eeeeee"
+			}
+	},
+	"map": {
+			"itemStyle": {
+					"areaColor": "#ddd",
+					"borderColor": "#eee",
+					"borderWidth": 0.5
+			},
+			"label": {
+					"color": "#c12e34"
+			},
+			"emphasis": {
+					"itemStyle": {
+							"areaColor": "#e6b600",
+							"borderColor": "#ddd",
+							"borderWidth": 1
+					},
+					"label": {
+							"color": "#c12e34"
+					}
+			}
+	},
+	"geo": {
+			"itemStyle": {
+					"areaColor": "#ddd",
+					"borderColor": "#eee",
+					"borderWidth": 0.5
+			},
+			"label": {
+					"color": "#c12e34"
+			},
+			"emphasis": {
+					"itemStyle": {
+							"areaColor": "#e6b600",
+							"borderColor": "#ddd",
+							"borderWidth": 1
+					},
+					"label": {
+							"color": "#c12e34"
+					}
+			}
+	},
+	"categoryAxis": {
+			"axisLine": {
+					"show": true,
+					"lineStyle": {
+							"color": "#333"
+					}
+			},
+			"axisTick": {
+					"show": true,
+					"lineStyle": {
+							"color": "#333"
+					}
+			},
+			"axisLabel": {
+					"show": true,
+					"color": "#333"
+			},
+			"splitLine": {
+					"show": false,
+					"lineStyle": {
+							"color": [
+									"#ccc"
+							]
+					}
+			},
+			"splitArea": {
+					"show": false,
+					"areaStyle": {
+							"color": [
+									"rgba(250,250,250,0.3)",
+									"rgba(200,200,200,0.3)"
+							]
+					}
+			}
+	},
+	"valueAxis": {
+			"axisLine": {
+					"show": true,
+					"lineStyle": {
+							"color": "#838383"
+					}
+			},
+			"axisTick": {
+					"show": true,
+					"lineStyle": {
+							"color": "#838383"
+					}
+			},
+			"axisLabel": {
+					"show": true,
+					"color": "#838383"
+			},
+			"splitLine": {
+					"show": true,
+					"lineStyle": {
+							"color": [
+									"#ccc"
+							]
+					}
+			},
+			"splitArea": {
+					"show": false,
+					"areaStyle": {
+							"color": [
+									"rgba(250,250,250,0.3)",
+									"rgba(200,200,200,0.3)"
+							]
+					}
+			}
+	},
+	"logAxis": {
+			"axisLine": {
+					"show": true,
+					"lineStyle": {
+							"color": "#333"
+					}
+			},
+			"axisTick": {
+					"show": true,
+					"lineStyle": {
+							"color": "#333"
+					}
+			},
+			"axisLabel": {
+					"show": true,
+					"color": "#333"
+			},
+			"splitLine": {
+					"show": true,
+					"lineStyle": {
+							"color": [
+									"#ccc"
+							]
+					}
+			},
+			"splitArea": {
+					"show": false,
+					"areaStyle": {
+							"color": [
+									"rgba(250,250,250,0.3)",
+									"rgba(200,200,200,0.3)"
+							]
+					}
+			}
+	},
+	"timeAxis": {
+			"axisLine": {
+					"show": true,
+					"lineStyle": {
+							"color": "#333"
+					}
+			},
+			"axisTick": {
+					"show": true,
+					"lineStyle": {
+							"color": "#333"
+					}
+			},
+			"axisLabel": {
+					"show": true,
+					"color": "#333"
+			},
+			"splitLine": {
+					"show": true,
+					"lineStyle": {
+							"color": [
+									"#ccc"
+							]
+					}
+			},
+			"splitArea": {
+					"show": false,
+					"areaStyle": {
+							"color": [
+									"rgba(250,250,250,0.3)",
+									"rgba(200,200,200,0.3)"
+							]
+					}
+			}
+	},
+	"toolbox": {
+			"iconStyle": {
+					"borderColor": "#06467c"
+			},
+			"emphasis": {
+					"iconStyle": {
+							"borderColor": "#4187c2"
+					}
+			},
+			"textStyle": {
+				"color": "#838383"
+			}
+	},
+	"legend": {
+			"textStyle": {
+					"color": "#838383"
+			}
+	},
+	"tooltip": {
+			"axisPointer": {
+					"lineStyle": {
+							"color": "#cccccc",
+							"width": 1
+					},
+					"crossStyle": {
+							"color": "#cccccc",
+							"width": 1
+					}
+			}
+	},
+	"timeline": {
+			"lineStyle": {
+					"color": "#005eaa",
+					"width": 1
+			},
+			"itemStyle": {
+					"color": "#005eaa",
+					"borderWidth": 1
+			},
+			"controlStyle": {
+					"color": "#005eaa",
+					"borderColor": "#005eaa",
+					"borderWidth": 0.5
+			},
+			"checkpointStyle": {
+					"color": "#005eaa",
+					"borderColor": "#316bc2"
+			},
+			"label": {
+					"color": "#005eaa"
+			},
+			"emphasis": {
+					"itemStyle": {
+							"color": "#005eaa"
+					},
+					"controlStyle": {
+							"color": "#005eaa",
+							"borderColor": "#005eaa",
+							"borderWidth": 0.5
+					},
+					"label": {
+							"color": "#005eaa"
+					}
+			}
+	},
+	"visualMap": {
+			"color": [
+					"#1790cf",
+					"#a2d4e6"
+			]
+	},
+	"dataZoom": {
+			"backgroundColor": "rgba(47,69,84,0)",
+			"dataBackgroundColor": "rgba(47,69,84,0.3)",
+			"fillerColor": "rgba(167,183,204,0.4)",
+			"handleColor": "#a7b7cc",
+			"handleSize": "100%",
+			"textStyle": {
+					"color": "#333333"
+			}
+	},
+	"markPoint": {
+			"label": {
+					"color": "#eeeeee"
+			},
+			"emphasis": {
+					"label": {
+							"color": "#eeeeee"
+					}
+			}
+	}
+}

src/views/economicsOperation/windAnalyse/djxxzl/current-scatter-chart.vue

@@ -0,0 +1,366 @@
+<template>
+  <div class="chart" :id="id"></div>
+</template>
+
+<script>
+import util from "@/helper/util.js";
+import partten from "@/helper/partten";
+import * as echarts from "echarts";
+import chartTheme from "./current-scatter-chart.json";
+
+export default {
+  name: "currentScatterChart",
+  props: {
+    // 图表宽度
+    width: {
+      type: String,
+      default: "100%",
+    },
+    // 图表高度
+    height: {
+      type: String,
+      default: "350px",
+    },
+    // 图表主标题
+    chartTitle: {
+      type: String,
+      default: "自定义图表组件",
+    },
+    // X 轴配置项
+    xAxisData: {
+      type: Array,
+      default: () => {
+        return [];
+      },
+    },
+    // Y 轴配置项
+    yAxisData: {
+      type: Array,
+      default: () => {
+        return [];
+      },
+    },
+    dataSet: {
+      type: String,
+      default: "",
+    },
+    // 图表核心数据
+    seriesData: {
+      type: Array,
+      default: () => {
+        return [];
+      },
+    },
+    // 是否显示图表图例
+    showLegend: {
+      type: Boolean,
+      default: true,
+    },
+    // 是否默认采用笔刷模式
+    brushSelected: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  data() {
+    return {
+      id: "",
+      chart: null,
+      color: [
+        "#05bb4c",
+        "#4b55ae",
+        "#fa8c16",
+        "#f8de5b",
+        "#1a93cf",
+        "#c531c7",
+        "#bd3338",
+      ],
+      theme: "dark",
+    };
+  },
+  computed: {
+    collapse() {
+      return this.$store.state.collapse;
+    },
+  },
+  watch: {
+    height() {
+      if (this.chart) {
+        this.chart.resize();
+      }
+    },
+    collapse(val) {
+      if (this.chart) {
+        setTimeout(() => {
+          this.chart.resize();
+        }, 300);
+      }
+    },
+  },
+  methods: {
+    resize() {},
+    initChart() {
+      const that = this;
+      echarts.registerTheme("chartTheme", chartTheme);
+      let myChart = echarts.init(
+        document.getElementById(this.id),
+        "chartTheme"
+      );
+      that.chart = myChart;
+      //指定图表的配置项和数据
+      const option = {
+        //标题
+        title: {
+          text: that.chartTitle,
+          left: 120,
+          top: 4,
+          textStyle: {
+            fontSize: 14,
+            color: "#fff",
+          },
+        },
+        // backgroundColor:
+        //   that.theme === "dark"
+        //     ? "rgba(0,0,0,0.4)"
+        //     : "rgba(255,255,255,0.5)",
+        //工具箱
+        color: [
+          "#3D54BE",
+          "rgb(255,0,0)",
+          "#a1a1a1",
+          "#0098d9",
+          "#FF8700",
+          "#005eaa",
+          "#cda819",
+          "#32a487",
+        ],
+        // toolbox: {
+        //   show: true,
+        //   x: "right",
+        //   position: [10, 10],
+        //   // backgroundColor:'rgba(0,0,0,0.4)',
+        //   borderColor: "#ccc",
+        //   textStyle: {
+        //     fontSize: 16,
+        //     color: "#ccc",
+        //   },
+        //   iconStyle: {
+        //     borderColor: "#ccc",
+        //   },
+        //   emphasis: {
+        //     iconStyle: {
+        //       borderColor: "#ccc",
+        //     },
+        //   },
+        // },
+        tooltip: {
+          trigger: "item",
+          axisPointer: {
+            type: "cross",
+          },
+          backgroundColor: "rgba(0,0,0,0.4)",
+          borderColor: partten.getColor("gray"),
+          textStyle: {
+            fontSize: util.vh(16),
+            color: "#fff",
+          },
+          formatter(params) {
+            return params.value?.x
+              ? `${params.seriesName}<br />风速：${params.value.x} m/s<br />功率：${params.value.y} kW`
+              : `${params.name}`;
+          },
+        },
+        // brush: {
+        //   seriesIndex: [2, 3],
+        //   yAxisIndex: 0,
+        //   transformable: true,
+        //   throttleType: "debounce",
+        //   throttleDelay: 1000,
+        //   removeOnClick: true,
+        //   brushType: "polygon",
+        //   brushMode: "multiple",
+        //   brushStyle: {
+        //     borderWidth: 1,
+        //     borderColor: "#ff2424",
+        //   },
+        // },
+        // dataZoom: [
+        //   {
+        //     type: "inside", //图表下方的伸缩条
+        //     show: false, //是否显示
+        //     realtime: true, //拖动时，是否实时更新系列的视图
+        //     start: 0, //伸缩条开始位置（1-100），可以随时更改
+        //     end: 100, //伸缩条结束位置（1-100），可以随时更改
+        //   },
+        //   {
+        //     type: "slider", //图表下方的伸缩条
+        //     show: false, //是否显示
+        //     realtime: true, //拖动时，是否实时更新系列的视图
+        //     start: 0, //伸缩条开始位置（1-100），可以随时更改
+        //     end: 100, //伸缩条结束位置（1-100），可以随时更改
+        //   },
+        // ],
+        textStyle: {
+          fontSize: 16,
+          color: "#fff",
+        },
+        //图例-每一条数据的名字
+        legend: {
+          show: that.showLegend,
+          data: ["拟合功率", "保证功率", "无用点", "有用点", "Cp值"],
+          right: "20",
+          top: "5",
+          // icon: "circle",
+          itemWidth: 6,
+          inactiveColor: "#fff",
+          textStyle: {
+            color: "#fff",
+            fontSize: 12,
+          },
+        },
+        grid: {
+          top: 48,
+          left: 20,
+          right: 20,
+          bottom: 20,
+          containLabel: true,
+        },
+        //x轴
+        xAxis: [
+          {
+            name: "m/s",
+            nameTextStyle: {
+              color: "#fff",
+            },
+            type: "value",
+            boundaryGap: false,
+            data: that.xAxisData || [],
+            min: 0,
+            max: 25,
+            interval: 1,
+            axisLabel: {
+              color: "#fff",
+              formatter: "{value}",
+            },
+            splitLine: {
+              show: false,
+            },
+            textStyle: {
+              color: "#fff",
+            },
+          },
+        ],
+        //y轴没有显式设置，根据值自动生成y轴
+        yAxis: [
+          {
+            splitLine: { show: false },
+            position: "left",
+            min: 0,
+            name: "kW",
+            nameTextStyle: {
+              color: "#fff",
+            },
+            axisLabel: {
+              color: "#fff",
+            },
+          },
+          {
+            splitLine: { show: false },
+            position: "right",
+            min: 0,
+            axisLabel: {
+              color: "#fff",
+            },
+          },
+        ],
+        animation: true,
+        dataset: that.dataSet.length ? JSON.parse(that.dataSet) : [],
+        //数据-data是最终要显示的数据
+        series: that.seriesData,
+      };
+
+      that.resize = function () {
+        myChart.resize();
+      };
+
+      window.addEventListener("resize", that.resize);
+
+      myChart.setOption(option);
+      if (that.brushSelected) {
+        myChart.dispatchAction({
+          type: "takeGlobalCursor",
+          // 如果想变为“可刷选状态”，必须设置。不设置则会关闭“可刷选状态”。
+          key: "brush",
+          brushOption: {
+            seriesIndex: [2, 3],
+            yAxisIndex: 0,
+            transformable: true,
+            throttleType: "debounce",
+            throttleDelay: 1000,
+            removeOnClick: true,
+            brushType: "polygon",
+            brushMode: "multiple",
+            brushStyle: {
+              borderWidth: 1,
+              color: "rgba(255,36,36,0.2)",
+              borderColor: "#ff2424",
+            },
+          },
+        });
+      }
+      myChart.off("brushSelected");
+      myChart.on("brushSelected", (params) => {
+        that.$emit("getSelected", params.batch || []);
+      });
+      myChart.off("click");
+      myChart.on("click", (params) => {
+        // console.log(params)
+        if (params.componentType === "markArea") {
+          myChart.dispatchAction({
+            type: "brush",
+            areas: [
+              {
+                xAxisIndex: 0,
+                brushType: "lineX",
+                coordRange: [params.data.coord[0][0], params.data.coord[1][0]],
+              },
+            ],
+          });
+        }
+      });
+    },
+  },
+  created() {
+    this.id = "chart-" + util.newGUID();
+  },
+  mounted() {
+    // this.$nextTick(() => {
+    this.$el.style.width = this.width;
+    this.$el.style.height = this.height;
+    this.initChart();
+    if (this.chart) {
+      this.chart.resize();
+    }
+    // });
+  },
+  updated() {
+    // console.log('update')
+    let myChart = echarts.init(document.getElementById(this.id));
+    myChart.dispose();
+    this.$nextTick(() => {
+      this.initChart();
+    });
+  },
+  unmounted() {
+    window.removeEventListener("resize", this.resize);
+  },
+};
+</script>
+
+<style>
+.chart {
+  width: 100%;
+  height: 100%;
+  display: inline-block;
+}
+</style>

src/views/economicsOperation/windAnalyse/djxxzl/dataHistoryJson.json

@@ -0,0 +1,902 @@
+{
+    "code": 0,
+    "data": {
+        "success": true,
+        "code": 200,
+        "message": "成功",
+        "count": null,
+        "data": [
+            {
+                "id": "1810950367689637911",
+                "windpowerstationId": "SXJ_KGDL_XWT_FDC_STA",
+                "projectId": "SXJ_KGDL_XWTF01_EG",
+                "lineId": "SXJ_KGDL_XWTF01_LN",
+                "windturbineId": "SXJ_KGDL_XWT_F_WT_0001_EQ",
+                "nemCode": "#1",
+                "recordDate": "2024-08-06",
+                "dayfdl": 51628.0,
+                "monthfdl": 0.0,
+                "yearfdl": 0.0,
+                "dayllfdl": 75112.43,
+                "monthllfdl": 0.0,
+                "yearllfdl": 0.0,
+                "dayfs": 6.69,
+                "monthfs": 2.0,
+                "yearfs": 9.0,
+                "daygl": 290.86,
+                "monthgl": 0.0,
+                "yeargl": 0.0,
+                "daygzssdl": 13067.16,
+                "monthgzssdl": 0.0,
+                "yeargzssdl": 0.0,
+                "dayxdssdl": 0.0,
+                "monthxdssdl": 0.0,
+                "yearxdssdl": 0.0,
+                "daywhssdl": 0.0,
+                "monthwhssdl": 0.0,
+                "yearwhssdl": 0.0,
+                "dayxnssdl": 0.0,
+                "monthxnssdl": 1.0,
+                "yearxnssdl": 0.0,
+                "daygzsj": 6.05,
+                "monthgzsj": 0.0,
+                "yeargzsj": 0.0,
+                "daywhsj": 0.0,
+                "monthwhsj": 0.0,
+                "yearwhsj": 0.0,
+                "dayyxsj": 87.9,
+                "monthyxsj": 0.0,
+                "yearyxsj": 0.0,
+                "daytjsj": 6.05,
+                "monthtjsj": 0.0,
+                "yeartjsj": 0.0,
+                "daylyxs": 41.3,
+                "monthlyxs": 3.0,
+                "yearlyxs": 9.0,
+                "daynhyd": 0.0,
+                "monthnhyd": 1.0,
+                "yearnhyd": 0.0,
+                "daysbklyl": 95.8,
+                "monthsbklyl": 18.0,
+                "yearsbklyl": 5.0,
+                "daydxkyxs": 95.8,
+                "monthdxkyxs": 18.0,
+                "yeardxkyxs": 5.0,
+                "dayyxfss": 0.0,
+                "monthyxfss": 1.0,
+                "yearyxfss": 0.0,
+                "dayxfqr": 0.0,
+                "monthxfqr": 1.0,
+                "yearxfqr": 0.0,
+                "dayjfpl": 0.0,
+                "monthjfpl": 1.0,
+                "yearjfpl": 0.0,
+                "dayglyzxxs": 0.0,
+                "monthglyzxxs": 1.0,
+                "yearglyzxxs": 0.0,
+                "types": 2,
+                "dayRank": 4,
+                "monthRank": null,
+                "yearRank": null,
+                "year": 2024,
+                "month": 1,
+                "dayScore": 48.0,
+                "monthScore": null,
+                "yearScore": null,
+                "dayLevel": "C",
+                "yearLevel": null,
+                "monthLevel": null
+            },
+            {
+                "id": "1810950452792066062",
+                "windpowerstationId": "SXJ_KGDL_XWT_FDC_STA",
+                "projectId": "SXJ_KGDL_XWTF01_EG",
+                "lineId": "SXJ_KGDL_XWTF01_LN",
+                "windturbineId": "SXJ_KGDL_XWT_F_WT_0001_EQ",
+                "nemCode": "#1",
+                "recordDate": "2024-08-09",
+                "dayfdl": 77412.0,
+                "monthfdl": 0.0,
+                "yearfdl": 0.0,
+                "dayllfdl": 101622.84,
+                "monthllfdl": 0.0,
+                "yearllfdl": 0.0,
+                "dayfs": 4.78,
+                "monthfs": 3.0,
+                "yearfs": 9.0,
+                "daygl": 133.17,
+                "monthgl": 0.0,
+                "yeargl": 0.0,
+                "daygzssdl": 13119.64,
+                "monthgzssdl": 0.0,
+                "yeargzssdl": 0.0,
+                "dayxdssdl": 0.0,
+                "monthxdssdl": 0.0,
+                "yearxdssdl": 0.0,
+                "daywhssdl": 0.0,
+                "monthwhssdl": 0.0,
+                "yearwhssdl": 0.0,
+                "dayxnssdl": 0.0,
+                "monthxnssdl": 1.0,
+                "yearxnssdl": 0.0,
+                "daygzsj": 6.23,
+                "monthgzsj": 0.0,
+                "yeargzsj": 0.0,
+                "daywhsj": 0.0,
+                "monthwhsj": 0.0,
+                "yearwhsj": 0.0,
+                "dayyxsj": 149.04,
+                "monthyxsj": 0.0,
+                "yearyxsj": 0.0,
+                "daytjsj": 6.23,
+                "monthtjsj": 0.0,
+                "yeartjsj": 0.0,
+                "daylyxs": 61.93,
+                "monthlyxs": 3.0,
+                "yearlyxs": 9.0,
+                "daynhyd": 57.0,
+                "monthnhyd": 24.0,
+                "yearnhyd": 3.0,
+                "daysbklyl": 97.12,
+                "monthsbklyl": 15.0,
+                "yearsbklyl": 5.0,
+                "daydxkyxs": 97.12,
+                "monthdxkyxs": 15.0,
+                "yeardxkyxs": 5.0,
+                "dayyxfss": 209.77,
+                "monthyxfss": 15.0,
+                "yearyxfss": 5.0,
+                "dayxfqr": 3.72,
+                "monthxfqr": 28.0,
+                "yearxfqr": 2.0,
+                "dayjfpl": 3.65,
+                "monthjfpl": 6.0,
+                "yearjfpl": 8.18,
+                "dayglyzxxs": 100.0,
+                "monthglyzxxs": 1.0,
+                "yearglyzxxs": 0.0,
+                "types": 2,
+                "dayRank": 10,
+                "monthRank": null,
+                "yearRank": null,
+                "year": 2024,
+                "month": 1,
+                "dayScore": 66.0,
+                "monthScore": null,
+                "yearScore": null,
+                "dayLevel": "BB",
+                "yearLevel": null,
+                "monthLevel": null
+            },
+            {
+                "id": "1810950421485781058",
+                "windpowerstationId": "SXJ_KGDL_XWT_FDC_STA",
+                "projectId": "SXJ_KGDL_XWTF01_EG",
+                "lineId": "SXJ_KGDL_XWTF01_LN",
+                "windturbineId": "SXJ_KGDL_XWT_F_WT_0001_EQ",
+                "nemCode": "#1",
+                "recordDate": "2024-08-08",
+                "dayfdl": 74491.0,
+                "monthfdl": 0.0,
+                "yearfdl": 0.0,
+                "dayllfdl": 98641.07,
+                "monthllfdl": 0.0,
+                "yearllfdl": 0.0,
+                "dayfs": 9.34,
+                "monthfs": 1.0,
+                "yearfs": 10.0,
+                "daygl": 641.61,
+                "monthgl": 0.0,
+                "yeargl": 0.0,
+                "daygzssdl": 13119.64,
+                "monthgzssdl": 0.0,
+                "yeargzssdl": 0.0,
+                "dayxdssdl": 0.0,
+                "monthxdssdl": 0.0,
+                "yearxdssdl": 0.0,
+                "daywhssdl": 0.0,
+                "monthwhssdl": 0.0,
+                "yearwhssdl": 0.0,
+                "dayxnssdl": 0.0,
+                "monthxnssdl": 1.0,
+                "yearxnssdl": 0.0,
+                "daygzsj": 6.23,
+                "monthgzsj": 0.0,
+                "yeargzsj": 0.0,
+                "daywhsj": 0.0,
+                "monthwhsj": 0.0,
+                "yearwhsj": 0.0,
+                "dayyxsj": 133.49,
+                "monthyxsj": 0.0,
+                "yearyxsj": 0.0,
+                "daytjsj": 6.23,
+                "monthtjsj": 0.0,
+                "yeartjsj": 0.0,
+                "daylyxs": 59.59,
+                "monthlyxs": 3.0,
+                "yearlyxs": 9.0,
+                "daynhyd": 33.0,
+                "monthnhyd": 14.0,
+                "yearnhyd": 6.0,
+                "daysbklyl": 96.76,
+                "monthsbklyl": 15.0,
+                "yearsbklyl": 5.0,
+                "daydxkyxs": 96.76,
+                "monthdxkyxs": 15.0,
+                "yeardxkyxs": 5.0,
+                "dayyxfss": 185.95,
+                "monthyxfss": 17.0,
+                "yearyxfss": 5.0,
+                "dayxfqr": 3.8,
+                "monthxfqr": 30.0,
+                "yearxfqr": 1.0,
+                "dayjfpl": 0.74,
+                "monthjfpl": 9.0,
+                "yearjfpl": 7.27,
+                "dayglyzxxs": 100.0,
+                "monthglyzxxs": 1.0,
+                "yearglyzxxs": 0.0,
+                "types": 2,
+                "dayRank": 10,
+                "monthRank": null,
+                "yearRank": null,
+                "year": 2024,
+                "month": 1,
+                "dayScore": 68.0,
+                "monthScore": null,
+                "yearScore": null,
+                "dayLevel": "BB",
+                "yearLevel": null,
+                "monthLevel": null
+            },
+            {
+                "id": "1810950395091025980",
+                "windpowerstationId": "SXJ_KGDL_XWT_FDC_STA",
+                "projectId": "SXJ_KGDL_XWTF01_EG",
+                "lineId": "SXJ_KGDL_XWTF01_LN",
+                "windturbineId": "SXJ_KGDL_XWT_F_WT_0001_EQ",
+                "nemCode": "#1",
+                "recordDate": "2024-08-07",
+                "dayfdl": 59392.0,
+                "monthfdl": 0.0,
+                "yearfdl": 0.0,
+                "dayllfdl": 83072.28,
+                "monthllfdl": 0.0,
+                "yearllfdl": 0.0,
+                "dayfs": 6.87,
+                "monthfs": 2.0,
+                "yearfs": 9.0,
+                "daygl": 322.45,
+                "monthgl": 0.0,
+                "yeargl": 0.0,
+                "daygzssdl": 13067.16,
+                "monthgzssdl": 0.0,
+                "yeargzssdl": 0.0,
+                "dayxdssdl": 0.0,
+                "monthxdssdl": 0.0,
+                "yearxdssdl": 0.0,
+                "daywhssdl": 0.0,
+                "monthwhssdl": 0.0,
+                "yearwhssdl": 0.0,
+                "dayxnssdl": 0.0,
+                "monthxnssdl": 1.0,
+                "yearxnssdl": 0.0,
+                "daygzsj": 6.05,
+                "monthgzsj": 0.0,
+                "yeargzsj": 0.0,
+                "daywhsj": 0.0,
+                "monthwhsj": 0.0,
+                "yearwhsj": 0.0,
+                "dayyxsj": 109.7,
+                "monthyxsj": 0.0,
+                "yearyxsj": 0.0,
+                "daytjsj": 6.05,
+                "monthtjsj": 0.0,
+                "yeartjsj": 0.0,
+                "daylyxs": 47.51,
+                "monthlyxs": 3.0,
+                "yearlyxs": 9.0,
+                "daynhyd": 36.0,
+                "monthnhyd": 18.0,
+                "yearnhyd": 5.0,
+                "daysbklyl": 96.4,
+                "monthsbklyl": 17.0,
+                "yearsbklyl": 5.0,
+                "daydxkyxs": 96.4,
+                "monthdxkyxs": 17.0,
+                "yeardxkyxs": 5.0,
+                "dayyxfss": 161.95,
+                "monthyxfss": 18.0,
+                "yearyxfss": 5.0,
+                "dayxfqr": 3.8,
+                "monthxfqr": 30.0,
+                "yearxfqr": 1.0,
+                "dayjfpl": 0.85,
+                "monthjfpl": 9.0,
+                "yearjfpl": 7.27,
+                "dayglyzxxs": 100.0,
+                "monthglyzxxs": 1.0,
+                "yearglyzxxs": 0.0,
+                "types": 2,
+                "dayRank": 12,
+                "monthRank": null,
+                "yearRank": null,
+                "year": 2024,
+                "month": 1,
+                "dayScore": 66.0,
+                "monthScore": null,
+                "yearScore": null,
+                "dayLevel": "BB",
+                "yearLevel": null,
+                "monthLevel": null
+            },
+            {
+                "id": "1810950563114844167",
+                "windpowerstationId": "SXJ_KGDL_XWT_FDC_STA",
+                "projectId": "SXJ_KGDL_XWTF01_EG",
+                "lineId": "SXJ_KGDL_XWTF01_LN",
+                "windturbineId": "SXJ_KGDL_XWT_F_WT_0001_EQ",
+                "nemCode": "#1",
+                "recordDate": "2024-08-13",
+                "dayfdl": 124912.0,
+                "monthfdl": 0.0,
+                "yearfdl": 0.0,
+                "dayllfdl": 127431.53,
+                "monthllfdl": 0.0,
+                "yearllfdl": 0.0,
+                "dayfs": 7.86,
+                "monthfs": 4.0,
+                "yearfs": 9.0,
+                "daygl": 444.15,
+                "monthgl": 0.0,
+                "yeargl": 0.0,
+                "daygzssdl": 45.08,
+                "monthgzssdl": 0.0,
+                "yeargzssdl": 0.0,
+                "dayxdssdl": 0.0,
+                "monthxdssdl": 0.0,
+                "yearxdssdl": 0.0,
+                "daywhssdl": 0.0,
+                "monthwhssdl": 0.0,
+                "yearwhssdl": 0.0,
+                "dayxnssdl": 0.0,
+                "monthxnssdl": 1.0,
+                "yearxnssdl": 0.0,
+                "daygzsj": 6.31,
+                "monthgzsj": 0.0,
+                "yeargzsj": 0.0,
+                "daywhsj": 0.0,
+                "monthwhsj": 0.0,
+                "yearwhsj": 0.0,
+                "dayyxsj": 243.42,
+                "monthyxsj": 0.0,
+                "yearyxsj": 0.0,
+                "daytjsj": 6.31,
+                "monthtjsj": 0.0,
+                "yeartjsj": 0.0,
+                "daylyxs": 99.93,
+                "monthlyxs": 2.0,
+                "yearlyxs": 9.0,
+                "daynhyd": 42.0,
+                "monthnhyd": 17.0,
+                "yearnhyd": 5.0,
+                "daysbklyl": 97.98,
+                "monthsbklyl": 12.0,
+                "yearsbklyl": 6.0,
+                "daydxkyxs": 97.98,
+                "monthdxkyxs": 12.0,
+                "yeardxkyxs": 6.0,
+                "dayyxfss": 305.77,
+                "monthyxfss": 13.0,
+                "yearyxfss": 6.0,
+                "dayxfqr": 3.72,
+                "monthxfqr": 29.0,
+                "yearxfqr": 1.0,
+                "dayjfpl": 0.12,
+                "monthjfpl": 5.0,
+                "yearjfpl": 8.48,
+                "dayglyzxxs": 100.0,
+                "monthglyzxxs": 2.0,
+                "yearglyzxxs": 0.0,
+                "types": 2,
+                "dayRank": 6,
+                "monthRank": null,
+                "yearRank": null,
+                "year": 2024,
+                "month": 1,
+                "dayScore": 70.0,
+                "monthScore": null,
+                "yearScore": null,
+                "dayLevel": "BB",
+                "yearLevel": null,
+                "monthLevel": null
+            },
+            {
+                "id": "1810950539136008205",
+                "windpowerstationId": "SXJ_KGDL_XWT_FDC_STA",
+                "projectId": "SXJ_KGDL_XWTF01_EG",
+                "lineId": "SXJ_KGDL_XWTF01_LN",
+                "windturbineId": "SXJ_KGDL_XWT_F_WT_0001_EQ",
+                "nemCode": "#1",
+                "recordDate": "2024-08-12",
+                "dayfdl": 115331.0,
+                "monthfdl": 0.0,
+                "yearfdl": 0.0,
+                "dayllfdl": 117501.7,
+                "monthllfdl": 0.0,
+                "yearllfdl": 0.0,
+                "dayfs": 7.65,
+                "monthfs": 1.0,
+                "yearfs": 10.0,
+                "daygl": 398.01,
+                "monthgl": 0.0,
+                "yeargl": 0.0,
+                "daygzssdl": 0.0,
+                "monthgzssdl": 0.0,
+                "yeargzssdl": 0.0,
+                "dayxdssdl": 0.0,
+                "monthxdssdl": 0.0,
+                "yearxdssdl": 0.0,
+                "daywhssdl": 0.0,
+                "monthwhssdl": 0.0,
+                "yearwhssdl": 0.0,
+                "dayxnssdl": 0.0,
+                "monthxnssdl": 1.0,
+                "yearxnssdl": 0.0,
+                "daygzsj": 6.23,
+                "monthgzsj": 0.0,
+                "yeargzsj": 0.0,
+                "daywhsj": 0.0,
+                "monthwhsj": 0.0,
+                "yearwhsj": 0.0,
+                "dayyxsj": 220.15,
+                "monthyxsj": 0.0,
+                "yearyxsj": 0.0,
+                "daytjsj": 6.23,
+                "monthtjsj": 0.0,
+                "yeartjsj": 0.0,
+                "daylyxs": 92.26,
+                "monthlyxs": 2.0,
+                "yearlyxs": 9.0,
+                "daynhyd": 62.0,
+                "monthnhyd": 25.0,
+                "yearnhyd": 2.0,
+                "daysbklyl": 97.84,
+                "monthsbklyl": 13.0,
+                "yearsbklyl": 6.0,
+                "daydxkyxs": 97.84,
+                "monthdxkyxs": 13.0,
+                "yeardxkyxs": 6.0,
+                "dayyxfss": 281.77,
+                "monthyxfss": 13.0,
+                "yearyxfss": 6.0,
+                "dayxfqr": 3.71,
+                "monthxfqr": 27.0,
+                "yearxfqr": 2.0,
+                "dayjfpl": 0.02,
+                "monthjfpl": 5.0,
+                "yearjfpl": 8.48,
+                "dayglyzxxs": 100.0,
+                "monthglyzxxs": 1.0,
+                "yearglyzxxs": 0.0,
+                "types": 2,
+                "dayRank": 5,
+                "monthRank": null,
+                "yearRank": null,
+                "year": 2024,
+                "month": 1,
+                "dayScore": 69.0,
+                "monthScore": null,
+                "yearScore": null,
+                "dayLevel": "BB",
+                "yearLevel": null,
+                "monthLevel": null
+            },
+            {
+                "id": "1810950476208865315",
+                "windpowerstationId": "SXJ_KGDL_XWT_FDC_STA",
+                "projectId": "SXJ_KGDL_XWTF01_EG",
+                "lineId": "SXJ_KGDL_XWTF01_LN",
+                "windturbineId": "SXJ_KGDL_XWT_F_WT_0001_EQ",
+                "nemCode": "#1",
+                "recordDate": "2024-08-10",
+                "dayfdl": 93350.0,
+                "monthfdl": 0.0,
+                "yearfdl": 0.0,
+                "dayllfdl": 94901.71,
+                "monthllfdl": 0.0,
+                "yearllfdl": 0.0,
+                "dayfs": 10.05,
+                "monthfs": 2.0,
+                "yearfs": 9.0,
+                "daygl": 666.83,
+                "monthgl": 0.0,
+                "yeargl": 0.0,
+                "daygzssdl": 0.0,
+                "monthgzssdl": 0.0,
+                "yeargzssdl": 0.0,
+                "dayxdssdl": 0.0,
+                "monthxdssdl": 0.0,
+                "yearxdssdl": 0.0,
+                "daywhssdl": 0.0,
+                "monthwhssdl": 0.0,
+                "yearwhssdl": 0.0,
+                "dayxnssdl": 0.0,
+                "monthxnssdl": 1.0,
+                "yearxnssdl": 0.0,
+                "daygzsj": 6.23,
+                "monthgzsj": 0.0,
+                "yeargzsj": 0.0,
+                "daywhsj": 0.0,
+                "monthwhsj": 0.0,
+                "yearwhsj": 0.0,
+                "dayyxsj": 172.94,
+                "monthyxsj": 0.0,
+                "yearyxsj": 0.0,
+                "daytjsj": 6.23,
+                "monthtjsj": 0.0,
+                "yeartjsj": 0.0,
+                "daylyxs": 74.68,
+                "monthlyxs": 2.0,
+                "yearlyxs": 9.0,
+                "daynhyd": 44.0,
+                "monthnhyd": 18.0,
+                "yearnhyd": 5.0,
+                "daysbklyl": 97.4,
+                "monthsbklyl": 13.0,
+                "yearsbklyl": 6.0,
+                "daydxkyxs": 97.4,
+                "monthdxkyxs": 13.0,
+                "yeardxkyxs": 6.0,
+                "dayyxfss": 24.0,
+                "monthyxfss": 1.0,
+                "yearyxfss": 10.0,
+                "dayxfqr": 3.58,
+                "monthxfqr": 24.0,
+                "yearxfqr": 3.0,
+                "dayjfpl": 0.0,
+                "monthjfpl": 1.0,
+                "yearjfpl": 0.0,
+                "dayglyzxxs": 100.0,
+                "monthglyzxxs": 1.0,
+                "yearglyzxxs": 0.0,
+                "types": 2,
+                "dayRank": 9,
+                "monthRank": null,
+                "yearRank": null,
+                "year": 2024,
+                "month": 1,
+                "dayScore": 68.0,
+                "monthScore": null,
+                "yearScore": null,
+                "dayLevel": "BB",
+                "yearLevel": null,
+                "monthLevel": null
+            },
+            {
+                "id": "1810950505195700244",
+                "windpowerstationId": "SXJ_KGDL_XWT_FDC_STA",
+                "projectId": "SXJ_KGDL_XWTF01_EG",
+                "lineId": "SXJ_KGDL_XWTF01_LN",
+                "windturbineId": "SXJ_KGDL_XWT_F_WT_0001_EQ",
+                "nemCode": "#1",
+                "recordDate": "2024-08-11",
+                "dayfdl": 105814.0,
+                "monthfdl": 0.0,
+                "yearfdl": 0.0,
+                "dayllfdl": 107732.99,
+                "monthllfdl": 0.0,
+                "yearllfdl": 0.0,
+                "dayfs": 8.64,
+                "monthfs": 1.0,
+                "yearfs": 10.0,
+                "daygl": 535.39,
+                "monthgl": 0.0,
+                "yeargl": 0.0,
+                "daygzssdl": 0.0,
+                "monthgzssdl": 0.0,
+                "yeargzssdl": 0.0,
+                "dayxdssdl": 0.0,
+                "monthxdssdl": 0.0,
+                "yearxdssdl": 0.0,
+                "daywhssdl": 0.0,
+                "monthwhssdl": 0.0,
+                "yearwhssdl": 0.0,
+                "dayxnssdl": 0.0,
+                "monthxnssdl": 1.0,
+                "yearxnssdl": 0.0,
+                "daygzsj": 6.23,
+                "monthgzsj": 0.0,
+                "yeargzsj": 0.0,
+                "daywhsj": 0.0,
+                "monthwhsj": 0.0,
+                "yearwhsj": 0.0,
+                "dayyxsj": 196.74,
+                "monthyxsj": 0.0,
+                "yearyxsj": 0.0,
+                "daytjsj": 6.23,
+                "monthtjsj": 0.0,
+                "yeartjsj": 0.0,
+                "daylyxs": 84.65,
+                "monthlyxs": 2.0,
+                "yearlyxs": 9.0,
+                "daynhyd": 34.0,
+                "monthnhyd": 6.0,
+                "yearnhyd": 8.0,
+                "daysbklyl": 97.64,
+                "monthsbklyl": 13.0,
+                "yearsbklyl": 6.0,
+                "daydxkyxs": 97.64,
+                "monthdxkyxs": 13.0,
+                "yeardxkyxs": 6.0,
+                "dayyxfss": 257.77,
+                "monthyxfss": 13.0,
+                "yearyxfss": 6.0,
+                "dayxfqr": 3.72,
+                "monthxfqr": 29.0,
+                "yearxfqr": 1.0,
+                "dayjfpl": 0.01,
+                "monthjfpl": 6.0,
+                "yearjfpl": 8.18,
+                "dayglyzxxs": 100.0,
+                "monthglyzxxs": 1.0,
+                "yearglyzxxs": 0.0,
+                "types": 2,
+                "dayRank": 5,
+                "monthRank": null,
+                "yearRank": null,
+                "year": 2024,
+                "month": 1,
+                "dayScore": 74.0,
+                "monthScore": null,
+                "yearScore": null,
+                "dayLevel": "BB",
+                "yearLevel": null,
+                "monthLevel": null
+            },
+            {
+                "id": "1810950593217364045",
+                "windpowerstationId": "SXJ_KGDL_XWT_FDC_STA",
+                "projectId": "SXJ_KGDL_XWTF01_EG",
+                "lineId": "SXJ_KGDL_XWTF01_LN",
+                "windturbineId": "SXJ_KGDL_XWT_F_WT_0001_EQ",
+                "nemCode": "#1",
+                "recordDate": "2024-08-14",
+                "dayfdl": 125319.0,
+                "monthfdl": 0.0,
+                "yearfdl": 0.0,
+                "dayllfdl": 127855.28,
+                "monthllfdl": 0.0,
+                "yearllfdl": 0.0,
+                "dayfs": 2.34,
+                "monthfs": 23.0,
+                "yearfs": 3.0,
+                "daygl": 6.96,
+                "monthgl": 0.0,
+                "yeargl": 0.0,
+                "daygzssdl": 45.08,
+                "monthgzssdl": 0.0,
+                "yeargzssdl": 0.0,
+                "dayxdssdl": 0.0,
+                "monthxdssdl": 0.0,
+                "yearxdssdl": 0.0,
+                "daywhssdl": 0.0,
+                "monthwhssdl": 0.0,
+                "yearwhssdl": 0.0,
+                "dayxnssdl": 0.0,
+                "monthxnssdl": 1.0,
+                "yearxnssdl": 0.0,
+                "daygzsj": 6.31,
+                "monthgzsj": 0.0,
+                "yeargzsj": 0.0,
+                "daywhsj": 0.0,
+                "monthwhsj": 0.0,
+                "yearwhsj": 0.0,
+                "dayyxsj": 245.62,
+                "monthyxsj": 0.0,
+                "yearyxsj": 0.0,
+                "daytjsj": 6.31,
+                "monthtjsj": 0.0,
+                "yeartjsj": 0.0,
+                "daylyxs": 100.26,
+                "monthlyxs": 2.0,
+                "yearlyxs": 9.0,
+                "daynhyd": 41.0,
+                "monthnhyd": 8.0,
+                "yearnhyd": 8.0,
+                "daysbklyl": 98.12,
+                "monthsbklyl": 11.0,
+                "yearsbklyl": 7.0,
+                "daydxkyxs": 98.12,
+                "monthdxkyxs": 11.0,
+                "yeardxkyxs": 7.0,
+                "dayyxfss": 329.69,
+                "monthyxfss": 12.0,
+                "yearyxfss": 6.0,
+                "dayxfqr": 3.74,
+                "monthxfqr": 31.0,
+                "yearxfqr": 1.0,
+                "dayjfpl": 6.26,
+                "monthjfpl": 14.0,
+                "yearjfpl": 5.76,
+                "dayglyzxxs": 100.0,
+                "monthglyzxxs": 1.0,
+                "yearglyzxxs": 0.0,
+                "types": 2,
+                "dayRank": 10,
+                "monthRank": null,
+                "yearRank": null,
+                "year": 2024,
+                "month": 1,
+                "dayScore": 67.0,
+                "monthScore": null,
+                "yearScore": null,
+                "dayLevel": "BB",
+                "yearLevel": null,
+                "monthLevel": null
+            },
+            {
+                "id": "1810950624175521822",
+                "windpowerstationId": "SXJ_KGDL_XWT_FDC_STA",
+                "projectId": "SXJ_KGDL_XWTF01_EG",
+                "lineId": "SXJ_KGDL_XWTF01_LN",
+                "windturbineId": "SXJ_KGDL_XWT_F_WT_0001_EQ",
+                "nemCode": "#1",
+                "recordDate": "2024-08-15",
+                "dayfdl": 126235.0,
+                "monthfdl": 0.0,
+                "yearfdl": 0.0,
+                "dayllfdl": 128810.19,
+                "monthllfdl": 0.0,
+                "yearllfdl": 0.0,
+                "dayfs": 3.81,
+                "monthfs": 4.0,
+                "yearfs": 9.0,
+                "daygl": 47.41,
+                "monthgl": 0.0,
+                "yeargl": 0.0,
+                "daygzssdl": 45.08,
+                "monthgzssdl": 0.0,
+                "yeargzssdl": 0.0,
+                "dayxdssdl": 0.0,
+                "monthxdssdl": 0.0,
+                "yearxdssdl": 0.0,
+                "daywhssdl": 0.0,
+                "monthwhssdl": 0.0,
+                "yearwhssdl": 0.0,
+                "dayxnssdl": 0.0,
+                "monthxnssdl": 1.0,
+                "yearxnssdl": 0.0,
+                "daygzsj": 6.31,
+                "monthgzsj": 0.0,
+                "yeargzsj": 0.0,
+                "daywhsj": 0.0,
+                "monthwhsj": 0.0,
+                "yearwhsj": 0.0,
+                "dayyxsj": 257.47,
+                "monthyxsj": 0.0,
+                "yearyxsj": 0.0,
+                "daytjsj": 6.31,
+                "monthtjsj": 0.0,
+                "yeartjsj": 0.0,
+                "daylyxs": 100.99,
+                "monthlyxs": 2.0,
+                "yearlyxs": 9.0,
+                "daynhyd": 45.0,
+                "monthnhyd": 28.0,
+                "yearnhyd": 2.0,
+                "daysbklyl": 98.25,
+                "monthsbklyl": 10.0,
+                "yearsbklyl": 7.0,
+                "daydxkyxs": 98.25,
+                "monthdxkyxs": 10.0,
+                "yeardxkyxs": 7.0,
+                "dayyxfss": 353.69,
+                "monthyxfss": 11.0,
+                "yearyxfss": 7.0,
+                "dayxfqr": 3.72,
+                "monthxfqr": 29.0,
+                "yearxfqr": 1.0,
+                "dayjfpl": 7.51,
+                "monthjfpl": 9.0,
+                "yearjfpl": 7.27,
+                "dayglyzxxs": 100.0,
+                "monthglyzxxs": 1.0,
+                "yearglyzxxs": 0.0,
+                "types": 2,
+                "dayRank": 4,
+                "monthRank": null,
+                "yearRank": null,
+                "year": 2024,
+                "month": 1,
+                "dayScore": 69.0,
+                "monthScore": null,
+                "yearScore": null,
+                "dayLevel": "BB",
+                "yearLevel": null,
+                "monthLevel": null
+            },
+            {
+                "id": "1810950653762142220",
+                "windpowerstationId": "SXJ_KGDL_XWT_FDC_STA",
+                "projectId": "SXJ_KGDL_XWTF01_EG",
+                "lineId": "SXJ_KGDL_XWTF01_LN",
+                "windturbineId": "SXJ_KGDL_XWT_F_WT_0001_EQ",
+                "nemCode": "#1",
+                "recordDate": "2024-08-16",
+                "dayfdl": 127383.0,
+                "monthfdl": 0.0,
+                "yearfdl": 0.0,
+                "dayllfdl": 129999.59,
+                "monthllfdl": 0.0,
+                "yearllfdl": 0.0,
+                "dayfs": 3.02,
+                "monthfs": 5.0,
+                "yearfs": 8.0,
+                "daygl": 40.73,
+                "monthgl": 0.0,
+                "yeargl": 0.0,
+                "daygzssdl": 45.08,
+                "monthgzssdl": 0.0,
+                "yeargzssdl": 0.0,
+                "dayxdssdl": 0.0,
+                "monthxdssdl": 0.0,
+                "yearxdssdl": 0.0,
+                "daywhssdl": 0.0,
+                "monthwhssdl": 0.0,
+                "yearwhssdl": 0.0,
+                "dayxnssdl": 0.0,
+                "monthxnssdl": 1.0,
+                "yearxnssdl": 0.0,
+                "daygzsj": 6.31,
+                "monthgzsj": 0.0,
+                "yeargzsj": 0.0,
+                "daywhsj": 0.0,
+                "monthwhsj": 0.0,
+                "yearwhsj": 0.0,
+                "dayyxsj": 267.0,
+                "monthyxsj": 0.0,
+                "yearyxsj": 0.0,
+                "daytjsj": 6.31,
+                "monthtjsj": 0.0,
+                "yeartjsj": 0.0,
+                "daylyxs": 101.91,
+                "monthlyxs": 2.0,
+                "yearlyxs": 9.0,
+                "daynhyd": 0.0,
+                "monthnhyd": 1.0,
+                "yearnhyd": 0.0,
+                "daysbklyl": 98.36,
+                "monthsbklyl": 10.0,
+                "yearsbklyl": 7.0,
+                "daydxkyxs": 98.36,
+                "monthdxkyxs": 10.0,
+                "yeardxkyxs": 7.0,
+                "dayyxfss": 377.69,
+                "monthyxfss": 10.0,
+                "yearyxfss": 7.0,
+                "dayxfqr": 3.71,
+                "monthxfqr": 29.0,
+                "yearxfqr": 1.0,
+                "dayjfpl": 11.05,
+                "monthjfpl": 8.0,
+                "yearjfpl": 7.58,
+                "dayglyzxxs": 100.0,
+                "monthglyzxxs": 1.0,
+                "yearglyzxxs": 0.0,
+                "types": 2,
+                "dayRank": 12,
+                "monthRank": null,
+                "yearRank": null,
+                "year": 2024,
+                "month": 1,
+                "dayScore": 67.0,
+                "monthScore": null,
+                "yearScore": null,
+                "dayLevel": "BB",
+                "yearLevel": null,
+                "monthLevel": null
+            }
+        ]
+    }
+}

src/views/economicsOperation/windAnalyse/djxxzl/dayDetailInfo.vue

@@ -0,0 +1,651 @@
+<template>
+  <div class="Evaluationinfo" v-if="!noData">
+    <div class="chart-name">
+      <div class="point point-left"></div>
+      <div class="point point-right"></div>
+    </div>
+    <div class="header">
+      <span class="herder-info" v-for="item of gridDatas" :key="item"
+        >风机编号：{{ item.nemCode }}</span
+      >
+      <span class="herder-info">基础指标</span>
+    </div>
+    <div class="Evaluationinfo_main">
+      <div class="mainleft">
+        <table class="table-form">
+          <tr>
+            <td class="white" v-for="item of gridDatas" :key="item">
+              量化评级：{{ item.dayLevel }}
+            </td>
+          </tr>
+          <tr>
+            <td class="white" v-for="item of gridDatas" :key="item">
+              综合排名：{{ item.dayRank }}
+            </td>
+          </tr>
+        </table>
+        <div class="chart-namess">
+          <div class="point point-left"></div>
+          <div class="point point-right"></div>
+        </div>
+        <div class="chart-body">
+          <normal-radar-chart :height="'500px'" :value="chartDatas" />
+        </div>
+      </div>
+      <div class="mainleft">
+        <table class="table-form">
+          <tr>
+            <td class="white">类型</td>
+            <td class="white">指标</td>
+            <td class="white" v-for="item of gridDatas" :key="item">
+              {{ item.nemCode }}
+            </td>
+            <td class="white" :colspan="gridDatas.length">排名</td>
+            <td class="white" colspan="2">评分</td>
+          </tr>
+          <tr v-for="item of tabEvent === -1 ? column : columnGf" :key="item">
+            <td class="white">{{ item.type }}</td>
+            <td class="white">{{ item.name }}</td>
+            <td class="white colorSty" v-for="row of gridDatas" :key="row">
+              {{ row[item.field] }}
+            </td>
+            <td class="white colorSty" v-for="row of gridDatas" :key="row">
+              {{ row[item.rank] }}
+            </td>
+            <td class="white colorSty" v-for="row of gridDatas" :key="row">
+              {{ row[item.score] }}
+            </td>
+          </tr>
+        </table>
+      </div>
+    </div>
+  </div>
+  <div v-else style="text-align: center">
+    <span style="color: #fff">暂无数据</span>
+  </div>
+</template>
+
+<script>
+import NormalRadarChart from "../../homePage/components/normal-radar-chart.vue";
+import dayjs from "dayjs";
+
+import { getApiequipmentinfoDayCompareList } from "@/api/monthlyPerformanceAnalysis";
+export default {
+  components: { NormalRadarChart },
+  props: {
+    chooseList: {
+      type: Array,
+      default: () => [],
+    },
+    tabEvent: {
+      type: Number,
+      default: -1,
+    },
+  },
+  data() {
+    return {
+      tabIndex: 0,
+      gridDatas: [],
+      chartDatas: [],
+      oidObj: {
+        name: "",
+        id: "",
+        charts: [],
+      },
+      tidObj: {
+        name: "",
+        id: "",
+        charts: [],
+      },
+      column: [
+        {
+          name: "发电量",
+          field: "dayfdl",
+          rank: "monthfdl",
+          score: "yearfdl",
+        },
+        {
+          name: "理论发电量",
+          field: "dayllfdl",
+          rank: "monthllfdl",
+          score: "yearllfdl",
+        },
+        {
+          name: "平均功率",
+          field: "daygl",
+          rank: "monthgl",
+          score: "yeargl",
+        },
+        {
+          name: "故障损失电量",
+          field: "daygzssdl",
+          rank: "monthgzssdl",
+          score: "yeargzssdl",
+        },
+        {
+          name: "限电损失电量",
+          field: "dayxdssdl",
+          rank: "monthxdssdl",
+          score: "yearxdssdl",
+        },
+        {
+          name: "检修损失电量",
+          field: "daywhssdl",
+          rank: "monthwhssdl",
+          score: "yearwhssdl",
+        },
+        {
+          name: "故障时间",
+          field: "daygzsj",
+          rank: "monthgzsj",
+          score: "yeargzsj",
+        },
+        {
+          name: "维护时间",
+          field: "daywhsj",
+          rank: "monthwhsj",
+          score: "yearwhsj",
+        },
+        {
+          name: "运行时间",
+          field: "dayyxsj",
+          rank: "monthyxsj",
+          score: "yearyxsj",
+        },
+        {
+          name: "停机时间",
+          field: "daytjsj",
+          rank: "monthtjsj",
+          score: "yeartjsj",
+        },
+        {
+          name: "平均切入风速",
+          field: "dayxfqr",
+          type: "性能",
+          rank: "monthxfqr",
+          score: "yearxfqr",
+        },
+        {
+          name: "性能损失电量",
+          field: "dayxnssdl",
+          type: "性能",
+          rank: "monthxnssdl",
+          score: "yearxnssdl",
+        },
+        {
+          name: "拟合优度",
+          field: "daynhyd",
+          type: "性能",
+          rank: "monthnhyd",
+          score: "yearnhyd",
+        },
+        {
+          name: "功率一致性系数",
+          field: "dayglyzxxs",
+          type: "性能",
+          rank: "monthglyzxxs",
+          score: "yearglyzxxs",
+        },
+        {
+          name: "利用小时",
+          field: "daylyxs",
+          type: "可靠性管理",
+          rank: "monthlyxs",
+          score: "yearlyxs",
+        },
+        {
+          name: "设备可利用率",
+          field: "daysbklyl",
+          type: "可靠性管理",
+          rank: "monthsbklyl",
+          score: "yearsbklyl",
+        },
+        {
+          name: "等效可利用率",
+          field: "daydxkyxs",
+          type: "可靠性管理",
+          rank: "monthdxkyxs",
+          score: "yeardxkyxs",
+        },
+        {
+          name: "有效风时数",
+          field: "dayyxfss",
+          type: "可靠性管理",
+          rank: "monthyxfss",
+          score: "yearyxfss",
+        },
+        {
+          name: "平均风速",
+          field: "dayfs",
+          type: "资源",
+          rank: "monthfs",
+          score: "yearfs",
+        },
+        {
+          name: "静风频率",
+          field: "dayjfpl",
+          type: "资源",
+          rank: "monthjfpl",
+          score: "yearjfpl",
+        },
+      ],
+      columnGf: [
+        {
+          name: "发电量",
+          field: "dayfdl",
+          rank: "monthfdl",
+          score: "yearfdl",
+        },
+        {
+          name: "理论发电量",
+          field: "dayllfdl",
+          rank: "monthllfdl",
+          score: "yearllfdl",
+        },
+        {
+          name: "平均功率",
+          field: "daygl",
+          rank: "monthgl",
+          score: "yeargl",
+        },
+        {
+          name: "故障损失电量",
+          field: "daygzssdl",
+          rank: "monthgzssdl",
+          score: "yeargzssdl",
+        },
+        {
+          name: "限电损失电量",
+          field: "dayxdssdl",
+          rank: "monthxdssdl",
+          score: "yearxdssdl",
+        },
+        {
+          name: "检修损失电量",
+          field: "daywhssdl",
+          rank: "monthwhssdl",
+          score: "yearwhssdl",
+        },
+        {
+          name: "故障时间",
+          field: "daygzsj",
+          rank: "monthgzsj",
+          score: "yeargzsj",
+        },
+        {
+          name: "维护时间",
+          field: "daywhsj",
+          rank: "monthwhsj",
+          score: "yearwhsj",
+        },
+        {
+          name: "运行时间",
+          field: "dayyxsj",
+          rank: "monthyxsj",
+          score: "yearyxsj",
+        },
+        {
+          name: "停机时间",
+          field: "daytjsj",
+          rank: "monthtjsj",
+          score: "yeartjsj",
+        },
+        {
+          name: "平均切入光照",
+          field: "dayxfqr",
+          type: "性能",
+          rank: "monthxfqr",
+          score: "yearxfqr",
+        },
+        {
+          name: "性能损失电量",
+          field: "dayxnssdl",
+          type: "性能",
+          rank: "monthxnssdl",
+          score: "yearxnssdl",
+        },
+        {
+          name: "拟合优度",
+          field: "daynhyd",
+          type: "性能",
+          rank: "monthnhyd",
+          score: "yearnhyd",
+        },
+        {
+          name: "功率一致性系数",
+          field: "dayglyzxxs",
+          type: "性能",
+          rank: "monthglyzxxs",
+          score: "yearglyzxxs",
+        },
+        {
+          name: "利用小时",
+          field: "daylyxs",
+          type: "可靠性管理",
+          rank: "monthlyxs",
+          score: "yearlyxs",
+        },
+        {
+          name: "设备可利用率",
+          field: "daysbklyl",
+          type: "可靠性管理",
+          rank: "monthsbklyl",
+          score: "yearsbklyl",
+        },
+        {
+          name: "等效可利用率",
+          field: "daydxkyxs",
+          type: "可靠性管理",
+          rank: "monthdxkyxs",
+          score: "yeardxkyxs",
+        },
+        {
+          name: "有效光时数",
+          field: "dayyxfss",
+          type: "可靠性管理",
+          rank: "monthyxfss",
+          score: "yearyxfss",
+        },
+        {
+          name: "平均光照",
+          field: "dayfs",
+          type: "资源",
+          rank: "monthfs",
+          score: "yearfs",
+        },
+        // {
+        //   name: "静风频率",
+        //   field: "dayjfpl",
+        //   type: "资源",
+        //   rank: "monthjfpl",
+        //   score: "yearjfpl",
+        // },
+      ],
+      noData: false,
+    };
+  },
+  methods: {
+    init() {
+      this.oidObj.name = this.chooseList?.[0]?.nemCode || "";
+      this.oidObj.id = this.chooseList?.[0]?.id || "";
+      this.oidObj.charts = [];
+      this.tidObj.name = this.chooseList?.[1]?.nemCode || "";
+      this.tidObj.id = this.chooseList?.[1]?.id || "";
+      this.tidObj.charts = [];
+      this.getDetailInfo();
+    },
+    showName(val) {
+      let str = "";
+      str = val.substring(val.indexOf("_F") + 3, val.length);
+      return str;
+    },
+    // 获取对比详情数据
+    async getDetailInfo() {
+      this.noData = false;
+      let gridDatas = [];
+      this.oidObj.name = "ddddddddd";
+      let arr = [
+        "平均切入风速",
+        "性能损失电量",
+        "拟合优度",
+        "功率一致性系数",
+        "利用小时",
+        "设备可利用率",
+        "等效可利用系数",
+        "有效风时数",
+        "平均风速",
+        "静风频率",
+      ];
+      for (let i = 0; i > -1; i--) {
+        gridDatas.push({
+          nemCode: `风机 # ${i + 1}`,
+          dayLevel: i + 1,
+          dayRank: i + 1,
+          type: "dd",
+          name: "cc",
+        });
+        // this.oidObj.charts.push(
+        //   dayjs()
+        //     .add(Number(`-${i}`), "day")
+        //     .format("YYYY-MM-DD")
+        // );
+      }
+      this.gridDatas = gridDatas;
+      console.log(111, this.oidObj);
+      console.log(222, this.tidObj);
+      return;
+
+      let params = {
+        oid: this.oidObj.id,
+        tid: this.tidObj.id,
+        types: this.tabIndex,
+      };
+      const { data: datas } = await getApiequipmentinfoDayCompareList(params);
+
+      if (datas && datas.data) {
+        if (datas.data.charts) {
+          if (
+            datas.data.charts[this.oidObj.name] &&
+            datas.data.charts[this.oidObj.name].length > 0
+          ) {
+            datas.data.charts[this.oidObj.name].forEach((it, index) => {
+              this.oidObj.charts.push(it);
+            });
+          }
+          if (
+            datas.data.charts[this.tidObj.name] &&
+            datas.data.charts[this.tidObj.name].length > 0
+          ) {
+            datas.data.charts[this.tidObj.name].forEach((it, index) => {
+              this.tidObj.charts.push(it);
+            });
+          }
+          this.changeChartsData();
+        } else {
+          this.noData = true;
+        }
+        if (datas.data.data.length > 0) {
+          this.gridDatas = datas.data.data;
+          // this.oidObj.datas = datas.data.data[0]
+          // this.tidObj.datas = datas.data.data[1]
+        } else {
+          this.noData = true;
+        }
+      }
+    },
+    //整理charts数据
+    changeChartsData() {
+      let valArr = [];
+      if (this.tabEvent == -1) {
+        valArr = [
+          "平均切入风速",
+          "性能损失电量",
+          "拟合优度",
+          "功率一致性系数",
+          "利用小时",
+          "设备可利用率",
+          "等效可利用系数",
+          "有效风时数",
+          "平均风速",
+          "静风频率",
+        ];
+      } else {
+        valArr = [
+          "平均切入光照",
+          "性能损失电量",
+          "拟合优度",
+          "功率一致性系数",
+          "利用小时",
+          "设备可利用率",
+          "等效可利用系数",
+          "有效光时数",
+          "平均光照",
+        ];
+      }
+      const service1 = {
+        name: this.oidObj.name,
+        value: [],
+      };
+      const service2 = {
+        name: this.tidObj.name,
+        value: [],
+      };
+      for (let i = 0; i < valArr.length; i++) {
+        let it = valArr[i];
+        for (let j = 0; j < this.oidObj.charts.length; j++) {
+          let ic = this.oidObj.charts[j];
+          if (it === ic.target) {
+            service1.value.push(ic.data);
+          }
+        }
+        for (let k = 0; k < this.tidObj.charts.length; k++) {
+          let iv = this.tidObj.charts[k];
+          if (it === iv.target) {
+            service2.value.push(iv.data);
+          }
+        }
+      }
+      const chartData = [
+        {
+          indicator: valArr,
+          data: [service1],
+        },
+        {
+          indicator: valArr,
+          data: [service2],
+        },
+      ];
+      this.chartDatas = chartData;
+    },
+  },
+};
+</script>
+
+<style lang="less">
+.Evaluationinfo {
+  .header {
+    display: flex;
+    width: 100%;
+    height: 40px;
+    line-height: 40px;
+    background: rgba(83, 89, 104, 0.3);
+    font-family: MicrosoftYaHei;
+    .herder-info {
+      flex: 1 0 50%;
+      color: #a5a3a3;
+      font-family: MicrosoftYaHei;
+      text-align: center;
+      font-size: 14px;
+      font-weight: 400;
+      &:last-child {
+        flex: 1 0 50%;
+      }
+    }
+  }
+  .Evaluationinfo_main {
+    display: flex;
+    .mainleft {
+      flex: 0 0 50%;
+      display: flex;
+      flex-direction: column;
+      .table-form {
+        width: 100%;
+        border-collapse: collapse;
+        tr {
+          background: transparent;
+          &:nth-child(2n) {
+            background: rgba(83, 89, 104, 0.1);
+          }
+          td {
+            padding: 10px;
+            border: 0px;
+            font-size: 12px;
+            text-align: center;
+            &.text {
+              min-width: 13vh;
+            }
+            &.value {
+              min-width: 6vh;
+            }
+            &.unit {
+              min-width: 40px;
+            }
+          }
+        }
+        .white {
+          color: #b3b3b3;
+          font-size: 14px;
+          font-family: MicrosoftYaHei;
+        }
+        .colorSty {
+          text-align: right;
+          color: #05bb4c;
+          font-size: 14px;
+          font-family: MicrosoftYaHei;
+        }
+      }
+      .chart-namess {
+        height: 1px;
+        margin-top: 10px;
+        border-bottom: 1px solid rgba(153, 153, 153, 1);
+        .point {
+          width: 6px;
+          height: 1px;
+          background-color: #ffffff;
+          position: absolute;
+          &.point-left {
+            left: 0;
+          }
+
+          &.point-right {
+            right: 50%;
+          }
+
+          &.top {
+            top: -1px;
+          }
+
+          &.bottom {
+            bottom: 0px;
+          }
+        }
+      }
+      .chart-body {
+        flex-grow: 1;
+        display: flex;
+        align-items: center;
+      }
+    }
+    .right {
+      flex: 0 0 50%;
+    }
+  }
+  .chart-name {
+    height: 1px;
+    margin-bottom: 10px;
+    border-bottom: 1px solid rgba(153, 153, 153, 0.5);
+    .point {
+      width: 6px;
+      height: 1px;
+      background-color: #ffffff;
+      position: absolute;
+
+      &.point-left {
+        left: 0;
+      }
+
+      &.point-right {
+        right: 1px;
+      }
+
+      &.top {
+        top: -1px;
+      }
+
+      &.bottom {
+        bottom: 0px;
+      }
+    }
+  }
+}
+</style>

src/views/economicsOperation/windAnalyse/djxxzl/historyDetail.vue

@@ -0,0 +1,195 @@
+<template>
+  <div class="historyEvaluation">
+    <div class="historyEvaluation_top">
+      <el-date-picker
+        style="width: 400px"
+        v-model="pickerTimer"
+        type="daterange"
+        range-separator="至"
+        start-placeholder="开始时间"
+        end-placeholder="结束时间"
+        size="mini"
+        format="YYYY/MM/DD"
+        value-format="YYYY-MM-DD"
+      />
+      <el-button round size="mini" class="buttons" @click="seachData"
+        >搜 索</el-button
+      >
+    </div>
+    <div class="economicTable1">
+      <el-table
+        :data="historyEvaluationData"
+        stripe
+        size="mini"
+        height="100%"
+        ref="historysingleTable"
+        style="width: 100%"
+      >
+        <el-table-column
+          align="center"
+          prop="nemCode"
+          label="设备编号"
+          width="150"
+        >
+        </el-table-column>
+        <el-table-column
+          align="center"
+          prop="recordDate"
+          label="日期"
+          width="150"
+        >
+        </el-table-column>
+        <el-table-column
+          v-for="(item, index) in tabEvent === -1 ? tableHeader : tableHeaderGf"
+          :key="index"
+          sortable
+          :prop="item.code"
+          :label="item.title"
+          align="right"
+          header-align="center"
+        >
+          <template #header="scope">
+            <div>
+              {{ scope.column.label.slice(0, scope.column.label.indexOf("(")) }}
+            </div>
+            <div>
+              {{ scope.column.label.slice(scope.column.label.indexOf("(")) }}
+            </div>
+          </template>
+        </el-table-column>
+      </el-table>
+    </div>
+  </div>
+</template>
+
+<script>
+import { getApiequipmentinfoDayHistoryList } from "@/api/monthlyPerformanceAnalysis";
+import dataJson from "./dataHistoryJson.json";
+export default {
+  data() {
+    return {
+      hiswindVal: "",
+      tabIndex: 0,
+      tabEvent: 0,
+      pickerTimer: [],
+      historyEvaluationData: [],
+      tableHeader: [
+        { title: "发电量(kWh)", code: "dayfdl" },
+        { title: "理论发电量(kWh)", code: "dayllfdl" },
+        { title: "平均风速(m/s)", code: "dayfs" },
+        { title: "平均功率(KW)", code: "daygl" },
+        { title: "故障损失(kWh)", code: "daygzssdl" },
+        { title: "限电损失(kWh)", code: "dayxdssdl" },
+        { title: "检修损失(kWh)", code: "daywhssdl" },
+        { title: "性能损失(kWh)", code: "dayxnssdl" },
+        { title: "利用小时数(h)", code: "daylyxs" },
+        { title: "拟合优度(%)", code: "daynhyd" },
+        { title: "可利用率(%)", code: "daysbklyl" },
+        { title: "可用系数(%)", code: "daydxkyxs" },
+        { title: "有效风时数(h)", code: "dayyxfss" },
+        { title: "平均切入(m/s)", code: "dayxfqr" },
+        { title: "静风频率(%)", code: "dayjfpl" },
+        { title: "功率一致性(%)", code: "dayglyzxxs" },
+      ],
+      tableHeaderGf: [
+        { title: "发电量(kWh)", code: "dayfdl" },
+        { title: "理论发电量(kWh)", code: "dayllfdl" },
+        { title: "光照强度(W/㎡)", code: "dayfs" },
+        { title: "平均功率(KW)", code: "daygl" },
+        { title: "故障损失(kWh)", code: "daygzssdl" },
+        { title: "限电损失(kWh)", code: "dayxdssdl" },
+        { title: "检修损失(kWh)", code: "daywhssdl" },
+        { title: "性能损失(kWh)", code: "dayxnssdl" },
+        { title: "利用小时数(h)", code: "daylyxs" },
+        { title: "拟合优度(%)", code: "daynhyd" },
+        { title: "可利用率(%)", code: "daysbklyl" },
+        { title: "可用系数(%)", code: "daydxkyxs" },
+        { title: "有效光时数(h)", code: "dayyxfss" },
+        { title: "功率一致性(%)", code: "dayglyzxxs" },
+      ],
+    };
+  },
+  methods: {
+    init(row) {
+      this.hiswindVal = row.windturbineId;
+      this.getTableData();
+    },
+    seachData() {
+      this.getTableData();
+    },
+    async getTableData() {
+      let params = {
+        beginDate: this.pickerTimer[0],
+        endDate: this.pickerTimer[1],
+        types: this.tabIndex,
+        wtId: this.hiswindVal,
+        type: this.tabEvent,
+      };
+      this.historyEvaluationData = dataJson.data.data;
+      const { data: datas } = await getApiequipmentinfoDayHistoryList(params);
+      this.historyEvaluationData = datas.data;
+    },
+    //转换时间
+    getchangeTime(date) {
+      var y = date.getFullYear();
+      var m = date.getMonth() + 1;
+      m = m < 10 ? "0" + m : m;
+      var d = date.getDate();
+      d = d < 10 ? "0" + d : d;
+      return y + "-" + m + "-" + d;
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.historyEvaluation {
+  height: 100%;
+  .historyEvaluation_top {
+    display: flex;
+    padding-bottom: 25px;
+
+    .buttons {
+      background-color: rgba(5, 187, 76, 0.2);
+      border: 1px solid #3b6c53;
+      color: #b3b3b3;
+      font-size: 14px;
+      margin-left: 10px;
+      &:hover {
+        background-color: rgba(5, 187, 76, 0.5);
+        color: #ffffff;
+      }
+    }
+    .el-date-editor--daterange ::v-deep {
+      background: transparent;
+      border: 1px solid #2a374f;
+      border-radius: 30px;
+      height: 25px;
+      .el-range-input {
+        background: transparent;
+        color: #fff;
+      }
+      .el-range-separator {
+        width: 10%;
+        color: #fff;
+        position: relative;
+      }
+    }
+  }
+  .economicTable1 {
+    height: calc(100% - 68px);
+    background: rgba(0, 0, 0, 0.4);
+  }
+}
+</style>
+<style lang="less">
+.el-overlay {
+  .el-overlay-dialog {
+    .EvaluationhistoryModel {
+      .el-dialog__body {
+        height: calc(100% - 65px);
+      }
+    }
+  }
+}
+</style>

src/views/economicsOperation/windAnalyse/djxxzl/index.vue

@@ -0,0 +1,663 @@
+<template>
+  <div class="comprehensiveEvaluation">
+    <div class="Evaluation_topall">
+      <div class="Evaluation_top">
+        <!-- <el-select
+          size="mini"
+          v-model="companyVal"
+          placeholder="请选择"
+          @change="changeCompan"
+        >
+          <el-option
+            v-for="item in companyOptions"
+            :key="item.id"
+            :label="item.aname"
+            :value="item.id"
+          >
+          </el-option>
+        </el-select> -->
+        <!-- <div class="tabCut">
+          <div
+            @click="changeBtn(val.id)"
+            :class="tabEvent === val.id ? 'active' : ''"
+            v-for="val in tabOptions"
+            :key="val.id"
+          >
+            <span>{{ val.name }}</span>
+          </div>
+        </div> -->
+        <div class="station">
+          场站：
+          <el-select
+            size="mini"
+            v-model="stationVal"
+            placeholder="请选择"
+            clearable
+            @change="changeStation"
+          >
+            <el-option
+              v-for="item in stationOptions"
+              :key="item.id"
+              :label="item.aname"
+              :value="item.id"
+            >
+            </el-option>
+          </el-select>
+        </div>
+        <div class="station">
+          日期:
+          <div class="">
+            <el-date-picker
+              size="mini"
+              v-model="pickerTimer"
+              type="date"
+              value-format="YYYY-MM-DD"
+              placeholder="选择日期"
+              popper-class="date-select"
+              @change="historyTimer = pickerTimer"
+            >
+            </el-date-picker>
+            <!-- <el-date-picker v-if="tabIndex == 0"
+              v-if="tabIndex == 1"
+              size="mini"
+              v-model="pickerTimer"
+              type="month"
+              value-format="YYYY-MM"
+              placeholder="选择月份"
+              popper-class="date-select"
+            >
+            </el-date-picker>
+            <el-date-picker
+              v-if="tabIndex == 2"
+              size="mini"
+              v-model="pickerTimer"
+              type="year"
+              value-format="YYYY"
+              placeholder="选择年份"
+              popper-class="date-select"
+            >
+            </el-date-picker> -->
+          </div>
+        </div>
+        <div class="but">
+          <el-button round size="mini" class="buttons" @click="seachData">
+            搜 索
+          </el-button>
+          <el-button round size="mini" class="buttons" @click="seachData">
+            导 出
+          </el-button>
+          <!-- <el-button
+            round
+            size="mini"
+            class="buttons"
+            @click="contrastFn"
+            :disabled="chooseList.length === 2 ? false : true"
+            >信息对比</el-button
+          > -->
+        </div>
+      </div>
+      <div class="selections">
+        <!-- <div
+          class="selections_btn"
+          @click="tabSelect(0)"
+          :class="{ active: tabIndex == 0 }"
+        >
+          日
+        </div> -->
+        <!-- <div
+          class="selections_btn"
+          @click="tabSelect(1)"
+          :class="{ active: tabIndex == 1 }"
+        >
+          月
+        </div> -->
+        <!-- <div
+          class="selections_btn"
+          @click="tabSelect(2)"
+          :class="{ active: tabIndex == 2 }"
+        >
+          年
+        </div> -->
+      </div>
+    </div>
+    <div
+      style="
+        background: rgba(0, 0, 0, 0.4);
+        height: calc(100% - 39px);
+        padding-bottom: 15px;
+      "
+    >
+      <div class="Evaluation_title clearfix">
+        <div class="leftContent" :data-type="$store.state.moreSty">
+          <span>单机信息总览</span>
+        </div>
+      </div>
+
+      <div class="economicTable1">
+        <el-table
+          :data="EvaluationData"
+          stripe
+          @selection-change="handleCurrentChange"
+          size="mini"
+          height="calc(100% - 40px)"
+          ref="Eval_table"
+          style="width: 100%"
+        >
+          <el-table-column prop="fc" label="风场" align="center">
+          </el-table-column>
+          <el-table-column prop="fj" label="风机" align="center">
+          </el-table-column>
+          <el-table-column prop="xh" label="型号" align="center">
+          </el-table-column>
+          <el-table-column
+            v-for="(item, index) in tabEvent === -1
+              ? tableHeader
+              : tableHeaderGf"
+            :key="index"
+            :sortable="item.sortable"
+            :prop="item.code"
+            :label="item.title"
+            align="center"
+            header-align="center"
+            show-overflow-tooltip
+          >
+            <template #header="scope">
+              <template v-if="/\)$/.test(scope.column.label)">
+                <div>
+                  {{
+                    scope.column.label.slice(0, scope.column.label.indexOf("("))
+                  }}
+                </div>
+                <div>
+                  {{
+                    scope.column.label.slice(scope.column.label.indexOf("("))
+                  }}
+                </div>
+              </template>
+              <template v-else>
+                <div>{{ scope.column.label }}</div>
+              </template>
+            </template>
+          </el-table-column>
+          <el-table-column label="操作" align="center">
+            <template #default="scope">
+              <span
+                @click="contrastFn(scope.row)"
+                style="cursor: pointer"
+                :style="`margin-right:8px;${
+                  $store.state.moreSty === 'greenSty'
+                    ? 'color: #05bb4c'
+                    : 'color: #67b9ff'
+                }`"
+                >详情</span
+              >
+              <span
+                @click="seachHistoryData(scope.row)"
+                style="cursor: pointer"
+                :style="
+                  $store.state.moreSty === 'greenSty'
+                    ? 'color: #05bb4c'
+                    : 'color: #67b9ff'
+                "
+                >历史</span
+              >
+            </template>
+          </el-table-column>
+        </el-table>
+        <div style="text-align: right">
+          <el-pagination
+            @current-change="handlePageChange"
+            :current-page="page.currentPage"
+            :page-size="page.pagesize"
+            @size-change="handleSizeChange"
+            :page-sizes="[21, 50, 100, 500]"
+            layout="total, sizes, prev, pager, next, jumper"
+            :total="page.total"
+          >
+          </el-pagination>
+        </div>
+      </div>
+    </div>
+    <el-dialog
+      v-model="dialogVisible"
+      width="100%"
+      custom-class="EvaluationhistoryModel"
+      :close-on-click-modal="false"
+      fullscreen
+    >
+      <template #title>
+        <div class="dialog-title">
+          <div class="title">{{ dialogTitle }}</div>
+        </div>
+      </template>
+      <div style="height: 100%">
+        <history-detail ref="windhistoryDetail"> </history-detail>
+      </div>
+    </el-dialog>
+    <el-dialog
+      v-model="contrastVisible"
+      width="90%"
+      top="50px"
+      custom-class="contrastModal"
+      :close-on-click-modal="false"
+      destroy-on-close
+    >
+      <template #title>
+        <div class="dialog-title">
+          <div class="title">信息对比</div>
+        </div>
+      </template>
+      <div class="dialog-body">
+        <img class="dialog-img" src="@assets/imgs/dialog.png" />
+        <DetailInfo />
+      </div>
+    </el-dialog>
+  </div>
+</template>
+
+<script>
+import {
+  getApicompanyslist,
+  getApiwpByCplistlist,
+  getApiequipmentinfoDayList,
+} from "@/api/monthlyPerformanceAnalysis";
+import historyDetail from "./historyDetail.vue";
+import dayDetailInfo from "./dayDetailInfo.vue";
+import DetailInfo from "./detailInfo.vue";
+import dayjs from "dayjs";
+import dataJson from "./dataJson.json";
+export default {
+  name: "PerformanceAssess",
+  components: {
+    historyDetail,
+    dayDetailInfo,
+    DetailInfo,
+  },
+  data() {
+    return {
+      tabIndex: 1,
+      companyVal: "",
+      companyOptions: [],
+      stationVal: "",
+      stationOptions: [],
+      pickerTimer: "",
+      EvaluationData: [],
+      tableHeader: [
+        { title: "日排行榜", code: "dayRank", sortable: true },
+        { title: "日拟合优度(%)", code: "daynhyd" },
+        { title: "日风速(m/s)", code: "dayfs" },
+        { title: "月排行榜", code: "monthRank", sortable: true },
+        { title: "月拟合优度(%)", code: "monthnhyd" },
+        { title: "月风速(m/s)", code: "monthfs" },
+        { title: "年排行榜", code: "yearRank", sortable: true },
+        { title: "年拟合优度(%)", code: "yearnhyd" },
+        { title: "年风速(m/s)", code: "yearfs" },
+      ],
+      tableHeaderGf: [
+        { title: "发电量(kWh)", code: "dayfdl" },
+        { title: "理论发电量(kWh)", code: "dayllfdl" },
+        { title: "光照强度(W/㎡)", code: "dayfs" },
+        { title: "平均功率(KW)", code: "daygl" },
+        { title: "故障损失(kWh)", code: "daygzssdl" },
+        { title: "限电损失(kWh)", code: "dayxdssdl" },
+        { title: "检修损失(kWh)", code: "daywhssdl" },
+        { title: "性能损失(kWh)", code: "dayxnssdl" },
+        { title: "利用小时数(h)", code: "daylyxs" },
+        { title: "拟合优度(%)", code: "daynhyd" },
+        { title: "可利用率(%)", code: "daysbklyl" },
+        { title: "等效可用系数(%)", code: "daydxkyxs" },
+        { title: "有效光时数(h)", code: "dayyxfss" },
+        { title: "功率一致性(%)", code: "dayglyzxxs" },
+      ],
+      dialogVisible: false,
+      dialogTitle: "",
+      chooseList: [],
+      contrastVisible: false,
+      tabEvent: -1,
+      tabOptions: [
+        { id: -1, name: "风电" },
+        { id: -2, name: "光伏" },
+      ],
+      page: {
+        currentPage: 1,
+        pagesize: 21,
+        total: 0,
+      },
+      historyTimer: "",
+    };
+  },
+  created() {
+    this.EvaluationData = dataJson.data.data.records;
+    this.page.total = dataJson.data.data.total;
+    this.getCompanyData();
+  },
+  computed: {
+    pageHeight() {
+      return {
+        height: document.documentElement.clientHeight - 130 + "px",
+      };
+    },
+  },
+  methods: {
+    handleSizeChange(val) {
+      this.page.currentPage = 1;
+      this.page.pagesize = val;
+      this.seachData();
+    },
+    handlePageChange(val) {
+      this.page.currentPage = val;
+      this.seachData();
+    },
+    // 切换tab
+    tabSelect(index) {
+      this.tabIndex = index;
+      //   if (this.tabIndex == 0) {
+      //   this.pickerTimer = dayjs().format("YYYY-MM-DD");
+      //   } else if (this.tabIndex == 1) {
+      //     this.pickerTimer = dayjs().format("YYYY-MM");
+      //   } else if (this.tabIndex == 2) {
+      //     this.pickerTimer = dayjs().format("YYYY");
+      //   }
+      //   this.historyTimer = dayjs().format("YYYY-MM-DD");
+      this.page.currentPage = 1;
+      this.seachData();
+    },
+    changeBtn(id) {
+      this.tabEvent = id;
+      this.stationVal = "";
+      this.stationOptions = [];
+      this.getStationData();
+      this.seachData();
+    },
+    // 获取公司列表
+    async getCompanyData() {
+      this.companyOptions = [];
+      this.pickerTimer = this.getchangeTime(new Date());
+      this.historyTimer = this.getchangeTime(new Date());
+      const { data: datas } = await getApicompanyslist();
+      this.companyOptions = datas.data;
+      this.companyVal = datas.data[0]?.id;
+      this.getStationData();
+    },
+    changeCompan(val) {
+      this.companyVal = val;
+      this.stationOptions = [];
+      this.stationVal = "";
+      this.getStationData();
+    },
+    // 获取场站列表
+    async getStationData() {
+      this.stationOptions = [];
+      let params = {
+        type: this.tabEvent,
+        companyid: this.companyVal,
+      };
+      const { data: datas } = await getApiwpByCplistlist(params);
+      this.stationOptions = datas.data;
+      this.stationVal = datas.data[0].id;
+      this.getTableData();
+    },
+    changeStation(val) {
+      this.stationVal = val;
+      this.getTableData();
+    },
+    seachData() {
+      this.getTableData();
+    },
+    async getTableData() {
+      let params = {
+        companyId: this.companyVal,
+        date: this.pickerTimer,
+        staType: -1,
+        types: this.tabIndex * 1 + 1,
+        wpId: this.stationVal,
+        type: this.tabEvent,
+        pageNum: this.page.currentPage,
+        pageSize: this.page.pagesize,
+      };
+      const { data: datas } = await getApiequipmentinfoDayList(params);
+      this.EvaluationData = datas.data.records;
+      this.page.total = datas.data.total;
+    },
+    handleCurrentChange(val) {
+      if (val.length > 2) {
+        let del_row = val.shift();
+        this.$refs.Eval_table.toggleRowSelection(del_row, false);
+      }
+      let arr = [];
+      val.forEach((item, index) => {
+        if (index < 2) {
+          arr.push(item);
+        }
+      });
+      this.chooseList = arr;
+    },
+    //转换时间
+    getchangeTime(date) {
+      var y = date.getFullYear();
+      var m = date.getMonth() + 1;
+      m = m < 10 ? "0" + m : m;
+      var d = date.getDate();
+      d = d < 10 ? "0" + d : d;
+      return y + "-" + m + "-" + d;
+    },
+
+    seachHistoryData(row) {
+      this.dialogTitle = "历史数据查询";
+      this.dialogVisible = true;
+      this.$nextTick(() => {
+        let startT =
+          new Date(this.historyTimer).getTime() - 10 * 24 * 60 * 60 * 1000;
+        this.$refs.windhistoryDetail.pickerTimer = [
+          this.getchangeTime(new Date(startT)),
+          this.historyTimer,
+        ];
+        this.$refs.windhistoryDetail.tabIndex = this.tabIndex * 1 + 1;
+        this.$refs.windhistoryDetail.tabEvent = this.tabEvent;
+        this.$refs.windhistoryDetail.init(row);
+      });
+    },
+
+    contrastFn() {
+      this.contrastVisible = true;
+    },
+  },
+};
+</script>
+
+<style lang="less" scoped>
+.comprehensiveEvaluation {
+  padding: 0 20px;
+  height: 100%;
+
+  .Evaluation_title {
+    .leftContent[data-type~="greenSty"] {
+      background: url("~@/assets/imgs/title_left_bg1.png") no-repeat;
+    }
+    .leftContent[data-type~="blueSty"] {
+      background: url("~@/assets/imgs/title_left_bg.png") no-repeat;
+    }
+    .leftContent {
+      width: 242px;
+      height: 41px;
+      line-height: 41px;
+      span {
+        font-size: 16px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #05bb4c;
+        margin-left: 25px;
+      }
+    }
+  }
+  .clearfix::after {
+    content: "";
+    clear: both;
+    height: 0;
+    line-height: 0;
+    visibility: hidden;
+    display: block;
+  }
+  .clearfix {
+    zoom: 1;
+  }
+  .Evaluation_topall {
+    display: flex;
+    justify-content: space-between;
+    .selections {
+      position: relative;
+      right: 120px;
+      display: flex;
+      margin-top: 10px;
+      .selections_btn {
+        flex: 0 0 55px;
+        text-align: center;
+        height: 33px;
+        line-height: 33px;
+        margin-right: 8px;
+        color: #b9b9b9;
+        font-size: 1.296vh;
+        background: fade(#606769, 20);
+        border: 1px solid fade(#606769, 20);
+        border-radius: 20px;
+        &:hover,
+        &.active {
+          background: fade(#05bb4c, 80);
+          border: 1px solid #05bb4c;
+          color: #fff;
+          cursor: pointer;
+        }
+      }
+    }
+    .Evaluation_top {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      padding-top: 10px;
+      padding-bottom: 10px;
+
+      .station {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        font-size: 14px;
+        font-family: Microsoft YaHei;
+        font-weight: 400;
+        color: #b3b3b3;
+        margin-right: 10px;
+        margin-left: 10px;
+      }
+
+      .search-input {
+        margin-left: 10px;
+        .el-input__inner {
+          width: 175px;
+        }
+        .el-input__suffix {
+          right: -50px;
+        }
+      }
+      .tabCut {
+        display: inline-block;
+        margin: 0 10px;
+
+        div {
+          display: inline-block;
+          width: 60px;
+          height: 27px;
+          border: 1px solid #274934;
+          text-align: center;
+          line-height: 25px;
+          cursor: pointer;
+        }
+
+        div:nth-child(1) {
+          border-radius: 13px 0px 0px 13px;
+          border-right-width: 0;
+        }
+
+        div:nth-child(2) {
+          border-radius: 0px 13px 13px 0px;
+        }
+
+        .active {
+          background-color: rgba(5, 187, 76, 0.9);
+          color: #fff;
+        }
+      }
+
+      .but {
+        display: flex;
+        flex-direction: row;
+        align-content: center;
+        margin-left: 20px;
+        .buttons {
+          background-color: rgba(5, 187, 76, 0.2);
+          border: 1px solid #3b6c53;
+          color: #b3b3b3;
+          font-size: 14px;
+
+          &:hover,
+          &.active {
+            background-color: rgba(5, 187, 76, 0.5);
+            color: #ffffff;
+          }
+        }
+      }
+    }
+  }
+  .economicTable1 {
+    height: calc(100% - 40px);
+    .el-table--mini ::v-deep {
+      .el-table__header-wrapper {
+        .el-checkbox {
+          display: none;
+        }
+      }
+      .el-table__body-wrapper {
+        .el-checkbox {
+          .el-checkbox__input {
+            display: block;
+          }
+        }
+      }
+    }
+
+    .historyBtn {
+      background: #43516b;
+      border-radius: 15px;
+      margin-top: 5px;
+      border: 1px solid #43516b;
+      span {
+        color: #fff;
+      }
+    }
+  }
+  .el-overlay {
+    .el-overlay-dialog {
+      overflow-y: hidden !important;
+      .EvaluationhistoryModel {
+        margin-top: 0 !important;
+        .el-dialog__body {
+          height: calc(100% - 51px - 50px);
+        }
+      }
+      .contrastModal {
+        .el-dialog__header {
+          border: none;
+        }
+        .el-dialog__body {
+          padding-top: 10px;
+        }
+      }
+    }
+  }
+
+  .el-picker__popper .el-date-range-picker__header .el-picker-panel__icon-btn {
+    color: #fff;
+  }
+  .el-picker__popper .el-date-table .in-range div {
+    background: #43516b;
+  }
+}
+</style>

src/views/layout/Header.vue

@@ -221,6 +221,8 @@ export default {
   methods: {
     commandDrop(value) {
       this.$emit("proStyle", value);
+      localStorage.setItem("themeName", value);
+      localStorage.setItem("moreSty", value);
       if (value === "blueSty") {
         document.body.classList.remove("blueStyle");
         if (!document.body.classList.contains("nsfStyle")) {
@@ -259,7 +261,7 @@ export default {
       } else if (data.path === "/generatingCap") {
         this.activeIndex = index;
         this.$router.replace(`${data.path}/dataFilter/prepare`);
-      }  else if (data.path === "/powerPrediction") {
+      } else if (data.path === "/powerPrediction") {
         this.activeIndex = index;
         this.$router.replace(`${data.path}/index`);
       } else if (data.path === "/sxReport") {
@@ -306,10 +308,10 @@ export default {
       let jiami = encrypt(getCookie("jiami")).replace(/\+/g, " ");
 
       // let url = `http://192.168.1.104:80/#/check?username=${getCookie(
-    //   let url = `http://10.81.3.127:8083/#/check?username=${getCookie(
-    //     "username"
-    //   )}&jiami=${jiami}`;
-    let url = "http://123.60.223.250:8000/login"
+      //   let url = `http://10.81.3.127:8083/#/check?username=${getCookie(
+      //     "username"
+      //   )}&jiami=${jiami}`;
+      let url = "http://123.60.223.250:8000/login";
       window.open(url);
     },
   },