.env.development

@@ -11,8 +11,8 @@ VUE_APP_TITLE = '页面标题'
 # 马力军
 # VUE_APP_LOGIN_URL = 'http://192.168.2.45:48080'
 # 王波
-VUE_APP_LOGIN_URL = 'http://172.16.12.102:48080'
-# VUE_APP_LOGIN_URL = 'http://172.16.12.102:8190'
+# VUE_APP_LOGIN_URL = 'http://172.16.12.101:48080'
+VUE_APP_LOGIN_URL = 'http://172.16.12.102:8190'
 
 # 发电能力分析
 # VUE_APP_GENERAT_URL = 'http://192.168.0.102:9002'

src/App.vue

@@ -794,6 +794,13 @@ export default {
           name: "对风偏差分析",
         },
         {
+          icon: "ScaleToOriginal",
+          index: "/generatingCap/dataAnalysis/cftRateAnalysis",
+          img: gener_dfpcfx,
+          svg: `<svg t="1711616084528" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="10256" width="25" height="25"><path d="M819.2 256h-102.4v460.8h102.4z m-256-102.4H460.8v563.2h102.4zM307.2 358.4H204.8v358.4h102.4z m-204.8 409.6v102.4h819.2v-102.4z" fill="" p-id="10257"></path></svg>`,
+          name: "测风塔对风偏差分析",
+        },
+        {
           icon: "Suitcase",
           index: "/generatingCap/dataAnalysis/angleAnalysis",
           img: gener_jjjfx,

src/router/index.js

@@ -291,6 +291,14 @@ const routes = [
         component: () => import("../views/generatingCapacity/dataAnalysis/rateAnalysis/index.vue"),
     },
     {
+        path: "/generatingCap/dataAnalysis/cftRateAnalysis",
+        name: "cftRateAnalysis",
+        meta: {
+            title: "测风塔对风偏差分析",
+        },
+        component: () => import("../views/generatingCapacity/dataAnalysis/cftRateAnalysis/index.vue"),
+    },
+    {
         path: "/generatingCap/dataAnalysis/lineAnalysis",
         name: "dataAnalysisLineAnalysis",
         meta: {

src/views/generatingCapacity/dataAnalysis/cftRateAnalysis/components/chart.vue

@@ -0,0 +1,222 @@
+<template>
+  <div
+    :id="chartId"
+    :style="{ height: props.height, width: props.width }"
+  ></div>
+</template>
+  
+<script setup>
+import util from "@tools/util";
+import chartTheme from "./../rateAnalysis.json";
+import { ref, toRaw, computed, onMounted, watch, nextTick } from "vue";
+import { useStore } from "vuex";
+import * as echarts from "echarts";
+const store = useStore();
+const chartId = "chart-" + util.newGUID(); //chartId
+const chartIns = ref(null); //chart 实例
+const props = defineProps({
+  xAxis: {
+    type: Object,
+    required: true,
+    default: () => ({}),
+  },
+  series: {
+    type: Array,
+    required: true,
+  },
+  height: {
+    type: String,
+    required: false,
+    default: "500px",
+  },
+  width: {
+    type: String,
+    required: false,
+    default: "500px",
+  },
+  title: {
+    type: String,
+    required: false,
+  },
+  subtext: {
+    type: String,
+    required: false,
+  },
+  // 是否为dialog中单表
+  isDiaAlone: {
+    type: Boolean,
+    default: false,
+  },
+  // 是否含雷达图
+  isRadar: {
+    type: Boolean,
+    default: false,
+  },
+  theme: {
+    type: Boolean,
+    default: false,
+  },
+  echartsTheme: {
+    type: String,
+    default: "",
+  },
+  count: {
+    type: Array,
+    default: () => {
+      return [];
+    },
+  },
+});
+
+/**定义option */
+const option = computed({
+  get() {
+    let radar = null;
+    if (props.isRadar && props.xAxis.data.length) {
+      radar = {
+        radius: "70%",
+        center: ["60%", "50%"],
+        indicator: props.xAxis.data.map((o) => {
+          return {
+            text: "",
+            max: 1000,
+          };
+        }),
+        splitArea: {
+          show: false,
+        },
+        splitLine: {
+          show: false,
+        },
+        axisLine: {
+          show: false,
+        },
+      };
+    }
+    return {
+      backgroundColor: "",
+      title: {
+        text: props.title || "",
+        subtext: props.subtext || "",
+        top: 10,
+        left: props.isDiaAlone ? "22%" : "5%",
+      },
+      angleAxis: props.xAxis || {},
+      radiusAxis: {},
+      polar: {
+        radius: "70%",
+        center:
+          props.subtext !== "风速风向玫瑰图" ? ["60%", "50%"] : ["50%", "50%"],
+      },
+      radar: radar,
+      tooltip: {
+        formatter: (params) => {
+          let str = "";
+          const seriesIndex = params.seriesIndex;
+          const dataIndex = params.dataIndex;
+          const pc = props.count?.[seriesIndex]?.[dataIndex];
+          if (params.componentSubType === "radar") {
+            str = `${params.marker}${params.seriesName}`;
+          } else if (props.subtext !== "风速风向玫瑰图") {
+            str = `${params.marker}${params.seriesName}m<br/>${
+              pc > 1 ? "频次：" + pc : ""
+            }`;
+          } else {
+            str = `${params.marker}${params.seriesName}<br/>${
+              "最大风速：" + pc
+            }m/s`;
+          }
+          return str;
+          // return params.componentSubType === "radar"
+          //   ? `${params.marker}${params.seriesName}`
+          //   : props.subtext !== "风速风向玫瑰图"
+          //   ? `${params.marker}${params.seriesName}m<br/>${
+          //       params.value > 1 ? "频次：" + params.value : ""
+          //     }`
+          //   : `${params.marker}${params.seriesName}<br/>${
+          //       "最大风速：" + params.value
+          //     }m/s`;
+        },
+        confine: true,
+      },
+      series: props.series || [],
+      legend: {
+        show: true,
+        orient: "vertical",
+        left: props.isDiaAlone ? "22%" : "5%",
+        itemWidth: 16,
+        itemHeight: 10,
+        textStyle: {
+          fontSize: util.vh(10),
+        },
+        top: "middle",
+        // data: ['0-2.5', '2.5-5', '5-7.5', '7.5-10', '10-12.5', '12.5-15', '15-17.5', '17.5-20',
+        //     '20-22.5', '22.5-25', '25-inf'
+        // ]
+        data: ["0-3", "3-5", "5-7", "7-9", "9-11", "11-20", "20-25", "25-∞"],
+      },
+    };
+  },
+  set(val) {},
+});
+watch(
+  () => option,
+  (newVal, oldVal) => {
+    if (chartIns.value) {
+      const echartIns = toRaw(chartIns.value);
+      echartIns.setOption(newVal.value);
+    }
+  },
+  {
+    deep: true,
+  }
+);
+
+watch([() => props.width, () => props.height], (newVal, oldVal) => {
+  if (chartIns.value) {
+    const echartIns = toRaw(chartIns.value);
+    nextTick(() => echartIns.resize());
+  }
+});
+const collapse = computed({
+  get() {
+    return store.state.collapse;
+  },
+  set(val) {},
+});
+watch(collapse, (val) => {
+  if (chartIns.value) {
+    setTimeout(() => {
+      chartIns.value.resize();
+    }, 300);
+  }
+});
+
+onMounted(() => {
+  nextTick(() => {
+    init();
+  });
+});
+
+watch(
+  () => props.echartsTheme,
+  (newVal, oldVal) => init()
+);
+
+const init = () => {
+  echarts.registerTheme("chartTheme", chartTheme);
+  const echartIns = echarts.init(
+    document.getElementById(chartId),
+    props.echartsTheme
+  );
+  document.getElementById(chartId).removeAttribute("_echarts_instance_")
+    ? document.getElementById(chartId).removeAttribute("_echarts_instance_")
+    : "";
+  chartIns.value = echartIns;
+  echartIns.setOption(option.value);
+
+  window.addEventListener("resize", () => {
+    echartIns.resize();
+  });
+};
+</script>

src/views/generatingCapacity/dataAnalysis/cftRateAnalysis/components/lineChart.vue

@@ -0,0 +1,233 @@
+<script setup>
+import util from "@tools/util";
+import chartTheme from "./../rateAnalysis.json";
+import { ref, toRaw, computed, onMounted, watch, nextTick } from "vue";
+import { useStore } from "vuex";
+import * as echarts from "echarts";
+const chartId = "chart-" + util.newGUID(); //chartId
+const chartIns = ref(null); //chart 实例
+const emits = defineEmits(["getSelected"]);
+const props = defineProps({
+  xAxis: {
+    type: Object,
+    required: true,
+    default: () => ({}),
+  },
+  yAxis: {
+    type: Array,
+    required: false,
+  },
+  series: {
+    type: Array,
+    required: true,
+  },
+  dataset: {
+    type: Array,
+    required: false,
+    default: () => [],
+  },
+  height: {
+    type: String,
+    required: false,
+    default: "500px",
+  },
+  width: {
+    type: String,
+    required: false,
+    default: "500px",
+  },
+  title: {
+    type: String,
+    required: false,
+  },
+  subtext: {
+    type: String,
+    required: false,
+  },
+  brush: {
+    type: Boolean,
+    required: false,
+    default: false,
+  },
+  theme: {
+    type: Boolean,
+    default: false,
+  },
+  echartsTheme: {
+    type: String,
+    default: "",
+  },
+});
+
+/**定义option */
+const option = computed({
+  get() {
+    return {
+      backgroundColor: "",
+      color: [
+        "#FF8700",
+        "#0098d980",
+        "#626c91",
+        "#a0a7e6",
+        "#c4ebad",
+        "#96dee8",
+      ],
+      title: {
+        text: props.title || "",
+        subtext: props.subtext || "",
+        top: 6,
+        left: "5%",
+      },
+      xAxis: props.xAxis || {},
+      yAxis: props.yAxis || {},
+      brush: {
+        seriesIndex: [1],
+        yAxisIndex: 0,
+        transformable: true,
+        throttleType: "debounce",
+        throttleDelay: 1000,
+        removeOnClick: true,
+        brushType: props.brush ? "polygon" : false,
+        brushMode: "multiple",
+        brushStyle: {
+          borderWidth: 1,
+          borderColor: "#ff2424",
+        },
+      },
+      toolbox: {
+        show: props.brush,
+      },
+      tooltip: {
+        confine: true,
+        axisPointer: {
+          type: "cross",
+        },
+      },
+      dataset: props.dataset || [],
+      series: props.series || [],
+      legend: {
+        right: "120",
+        top: "5",
+        itemWidth: 6,
+      },
+      grid: {
+        top: 80,
+        left: 40,
+        right: 40,
+        bottom: 40,
+      },
+      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），可以随时更改
+        },
+      ],
+    };
+  },
+  set(val) {},
+});
+watch(
+  () => option,
+  (newVal, oldVal) => {
+    if (chartIns.value) {
+      const echartIns = toRaw(chartIns.value);
+      echartIns.setOption(toRaw(newVal.value));
+    }
+  },
+  {
+    deep: true,
+  }
+);
+watch([() => props.width, () => props.height], (newVal, oldVal) => {
+  if (chartIns.value) {
+    const echartIns = toRaw(chartIns.value);
+    nextTick(() => echartIns.resize());
+  }
+});
+const store = useStore();
+const collapse = computed({
+  get() {
+    return store.state.collapse;
+  },
+  set(val) {},
+});
+watch(collapse, (val) => {
+  if (chartIns.value) {
+    setTimeout(() => {
+      chartIns.value.resize();
+    }, 300);
+  }
+});
+const funBrushChange = (flag) => {
+  const echartIns = toRaw(chartIns.value);
+  echartIns.dispatchAction({
+    type: "takeGlobalCursor",
+    // 如果想变为“可刷选状态”，必须设置。不设置则会关闭“可刷选状态”。
+    key: "brush",
+    brushOption: {
+      seriesIndex: [1],
+      yAxisIndex: 0,
+      transformable: true,
+      throttleType: "debounce",
+      throttleDelay: 1000,
+      removeOnClick: true,
+      brushType: flag ? "polygon" : false,
+      brushMode: "multiple",
+      brushStyle: {
+        borderWidth: 1,
+        color: "rgba(255,36,36,0.2)",
+        borderColor: "#ff2424",
+      },
+    },
+  });
+  echartIns.off("brushSelected");
+  echartIns.on("brushSelected", (params) => {
+    emits("getSelected", params.batch || []);
+  });
+};
+watch(
+  () => props.brush,
+  (newVal, oldVal) => funBrushChange(newVal)
+);
+
+onMounted(() => {
+  nextTick(() => {
+    init();
+  });
+});
+
+watch(
+  () => props.echartsTheme,
+  (newVal, oldVal) => init()
+);
+
+const init = () => {
+  echarts.registerTheme("chartTheme", chartTheme);
+  const echartIns = echarts.init(
+    document.getElementById(chartId),
+    props.echartsTheme
+  );
+  document.getElementById(chartId).removeAttribute("_echarts_instance_")
+    ? document.getElementById(chartId).removeAttribute("_echarts_instance_")
+    : "";
+  chartIns.value = echartIns;
+  echartIns.setOption(option.value);
+  funBrushChange(props.brush);
+  window.addEventListener("resize", () => {
+    echartIns.resize();
+  });
+};
+</script>
+<template>
+  <div :id="chartId" :style="{ height: '100%', width: props.width }"></div>
+</template>

src/views/generatingCapacity/dataAnalysis/cftRateAnalysis/components/scatterSingleChart.vue

@@ -0,0 +1,194 @@
+<script setup name="scatterSingleChart">
+import util from "@tools/util";
+import chartTheme from "./../rateAnalysis.json";
+import { ref, toRaw, computed, onMounted, watch, nextTick } from "vue";
+import { useStore } from "vuex";
+import * as echarts from "echarts";
+const chartId = "chart-" + util.newGUID(); //chartId
+const chartIns = ref(null); //chart 实例
+const props = defineProps({
+  xAxis: {
+    type: Array,
+    required: true,
+    default: () => [],
+  },
+  yAxis: {
+    type: Array,
+    required: true,
+    default: () => [],
+  },
+  series: {
+    type: Array,
+    required: false,
+    default: () => [],
+  },
+  height: {
+    type: String,
+    required: false,
+    default: "500px",
+  },
+  title: {
+    type: String,
+    required: false,
+    default: "",
+  },
+  subtext: {
+    type: String,
+    required: false,
+    default: "",
+  },
+  width: {
+    type: String,
+    required: false,
+    default: "500px",
+  },
+  theme: {
+    type: Boolean,
+    default: false,
+  },
+  echartsTheme: {
+    type: String,
+    default: "",
+  },
+  count: {
+    type: Array,
+    default: () => {
+      return [];
+    },
+  },
+});
+
+/**定义option */
+const option = computed({
+  get() {
+    return {
+      backgroundColor: "",
+      tooltip: {
+        position: "top",
+        formatter: function (params) {
+          if (params.componentType === "markLine") {
+            return params.name;
+          } else {
+            return (
+              "偏航：" +
+              params.value[0] +
+              "度<br/ >风速：" +
+              params.value[1] +
+              "m/s"
+            );
+          }
+        },
+      },
+      title: {
+        text: props.title || "",
+        subtext: props.subtext || "",
+        top: 6,
+        left: "5%",
+      },
+      grid: {
+        top: 80,
+        left: 40,
+        right: 40,
+        bottom: 40,
+      },
+      xAxis: props.xAxis || [],
+      //  {
+      // 	type: 'category',
+      // 	data: props.xAxis || [],
+      // 	boundaryGap: false,
+      // 	splitLine: {
+      // 		show: true
+      // 	},
+      // 	axisLine: {
+      // 		show: false
+      // 	}
+      // },
+      yAxis: props.yAxis || [],
+      // {
+      // 	type: 'category',
+      // 	data: props.yAxis,
+      // 	axisLine: {
+      // 		show: false
+      // 	}
+      // },
+      series: props.series || [],
+      // [
+      // 	{
+      // 		name: 'Punch Card',
+      // 		type: 'scatter',
+      // 		symbolSize: function (val) {
+      // 			return val[2] * 2;
+      // 		},
+      // 		data: props.data,
+      // 		animationDelay: function (idx) {
+      // 			return idx * 5;
+      // 		}
+      // 	}
+      // ]
+    };
+  },
+  set(val) {},
+});
+watch(
+  () => option,
+  (newVal, oldVal) => {
+    if (chartIns.value) {
+      // console.log(newVal)
+      const echartIns = toRaw(chartIns.value);
+      echartIns.setOption(toRaw(newVal.value));
+    }
+  },
+  {
+    deep: true,
+  }
+);
+watch([() => props.width, () => props.height], (newVal, oldVal) => {
+  if (chartIns.value) {
+    const echartIns = toRaw(chartIns.value);
+    nextTick(() => echartIns.resize());
+  }
+});
+const store = useStore();
+const collapse = computed({
+  get() {
+    return store.state.collapse;
+  },
+  set(val) {},
+});
+watch(collapse, (val) => {
+  if (chartIns.value) {
+    setTimeout(() => {
+      chartIns.value.resize();
+    }, 300);
+  }
+});
+onMounted(() => {
+  nextTick(() => {
+    init();
+  });
+});
+
+watch(
+  () => props.echartsTheme,
+  (newVal, oldVal) => init()
+);
+
+const init = () => {
+  echarts.registerTheme("chartTheme", chartTheme);
+  const echartIns = echarts.init(
+    document.getElementById(chartId),
+    props.echartsTheme
+  );
+  document.getElementById(chartId).removeAttribute("_echarts_instance_")
+    ? document.getElementById(chartId).removeAttribute("_echarts_instance_")
+    : "";
+  chartIns.value = echartIns;
+  echartIns.setOption(option.value);
+  window.addEventListener("resize", () => {
+    echartIns.resize();
+  });
+};
+</script>
+<template>
+  <div :id="chartId" :style="{ height: '100%', width: props.width }"></div>
+</template>

src/views/generatingCapacity/dataAnalysis/cftRateAnalysis/components/search.vue

@@ -0,0 +1,29 @@
+<script setup name="search">
+import SubmitBtn from '@com/SubmitBtn.vue'
+import { onMounted, reactive, ref } from 'vue'
+
+const queryForm = reactive({
+	mode: 0
+})
+/**执行 */
+const emits = defineEmits(['submit'])
+const funSubmit = async () => {
+	emits('submit', queryForm)
+}
+</script>
+<template>
+	<div class="pl-[20px] flex items-center h-[80px] relative">
+		<div class="absolute top-[-7px] left-[20px] text-[#838383] text-[14px]">操作面板</div>
+		<el-form class="whitespace-nowrap" :inline="true" :model="queryForm">
+			<el-form-item label="合并方式" class="!mb-0">
+				<el-select v-model="queryForm.mode">
+					<el-option :value="0" label="多表单台"></el-option>
+					<el-option :value="1" label="单表多台"></el-option>
+				</el-select>
+			</el-form-item>
+			<el-form-item class="!mb-0">
+				<submit-btn v-prevdbclick:5000="funSubmit" desc="执行"></submit-btn>
+			</el-form-item>
+		</el-form>
+	</div>
+</template>

src/views/generatingCapacity/dataAnalysis/cftRateAnalysis/rateAnalysis.json

@@ -0,0 +1,399 @@
+
+{
+	"color": [
+			"#626c91",
+			"#96dee8",
+			"#3fb1e3",
+			"#6be6c1",
+			"#a0a7e6",
+			"#c4ebad",
+			"rgb(126,254,123)",
+			"rgb(254,200,10)",
+			"rgb(224,103,2)",
+			"rgb(242,8,1)",
+			"rgb(127,0,1)"
+
+	],
+	"backgroundColor": "rgba(252,252,252,0)",
+	"textStyle": {},
+	"title": {
+			"textStyle": {
+					"color": "#000"
+			},
+			"subtextStyle": {
+					"color": "#000"
+			}
+	},
+	"line": {
+			"itemStyle": {
+					"borderWidth": "2"
+			},
+			"lineStyle": {
+					"width": "2"
+			},
+			"symbolSize": "8",
+			"symbol": "emptyCircle",
+			"smooth": true
+	},
+	"radar": {
+			"itemStyle": {
+					"borderWidth": "2"
+			},
+			"lineStyle": {
+					"width": "2"
+			},
+			"symbolSize": "8",
+			"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": "#e6a0d2",
+					"color0": "transparent",
+					"borderColor": "#e6a0d2",
+					"borderColor0": "#3fb1e3",
+					"borderWidth": "2"
+			}
+	},
+	"graph": {
+			"itemStyle": {
+					"borderWidth": 0,
+					"borderColor": "#ccc"
+			},
+			"lineStyle": {
+					"width": "1",
+					"color": "#cccccc"
+			},
+			"symbolSize": "8",
+			"symbol": "emptyCircle",
+			"smooth": false,
+			"color": [
+					"#3fb1e3",
+					"#6be6c1",
+					"#626c91",
+					"#a0a7e6",
+					"#c4ebad",
+					"#96dee8"
+			],
+			"label": {
+					"color": "#ffffff"
+			}
+	},
+	"map": {
+			"itemStyle": {
+					"areaColor": "#eeeeee",
+					"borderColor": "#aaaaaa",
+					"borderWidth": 0.5
+			},
+			"label": {
+					"color": "#ffffff"
+			},
+			"emphasis": {
+					"itemStyle": {
+							"areaColor": "rgba(63,177,227,0.25)",
+							"borderColor": "#3fb1e3",
+							"borderWidth": 1
+					},
+					"label": {
+							"color": "#3fb1e3"
+					}
+			}
+	},
+	"geo": {
+			"itemStyle": {
+					"areaColor": "#eeeeee",
+					"borderColor": "#aaaaaa",
+					"borderWidth": 0.5
+			},
+			"label": {
+					"color": "#ffffff"
+			},
+			"emphasis": {
+					"itemStyle": {
+							"areaColor": "rgba(63,177,227,0.25)",
+							"borderColor": "#3fb1e3",
+							"borderWidth": 1
+					},
+					"label": {
+							"color": "#3fb1e3"
+					}
+			}
+	},
+	"categoryAxis": {
+			"axisLine": {
+					"show": true,
+					"lineStyle": {
+							"color": "#838383"
+					}
+			},
+			"axisTick": {
+					"show": false,
+					"lineStyle": {
+							"color": "#838383"
+					}
+			},
+			"axisLabel": {
+					"show": true,
+					"color": "#838383"
+			},
+			"splitLine": {
+					"show": true,
+					"lineStyle": {
+							"color": [
+									"#838383"
+							]
+					}
+			},
+			"splitArea": {
+					"show": false,
+					"areaStyle": {
+							"color": [
+									"rgba(250,250,250,0.05)",
+									"rgba(200,200,200,0.02)"
+							]
+					}
+			}
+	},
+	"valueAxis": {
+			"axisLine": {
+					"show": true,
+					"lineStyle": {
+							"color": "#838383"
+					}
+			},
+			"axisTick": {
+					"show": false,
+					"lineStyle": {
+							"color": "#838383"
+					}
+			},
+			"axisLabel": {
+					"show": true,
+					"color": "#838383",
+					"fontSize": 10
+			},
+			"splitLine": {
+					"show": true,
+					"lineStyle": {
+							"color": [
+									"#838383"
+							]
+					}
+			},
+			"splitArea": {
+					"show": false,
+					"areaStyle": {
+							"color": [
+									"rgba(250,250,250,0.05)",
+									"rgba(200,200,200,0.02)"
+							]
+					}
+			}
+	},
+	"logAxis": {
+			"axisLine": {
+					"show": true,
+					"lineStyle": {
+							"color": "#cccccc"
+					}
+			},
+			"axisTick": {
+					"show": false,
+					"lineStyle": {
+							"color": "#333"
+					}
+			},
+			"axisLabel": {
+					"show": true,
+					"color": "#999999"
+			},
+			"splitLine": {
+					"show": true,
+					"lineStyle": {
+							"color": [
+									"#eeeeee"
+							]
+					}
+			},
+			"splitArea": {
+					"show": false,
+					"areaStyle": {
+							"color": [
+									"rgba(250,250,250,0.05)",
+									"rgba(200,200,200,0.02)"
+							]
+					}
+			}
+	},
+	"timeAxis": {
+			"axisLine": {
+					"show": true,
+					"lineStyle": {
+							"color": "#cccccc"
+					}
+			},
+			"axisTick": {
+					"show": false,
+					"lineStyle": {
+							"color": "#333"
+					}
+			},
+			"axisLabel": {
+					"show": true,
+					"color": "#999999"
+			},
+			"splitLine": {
+					"show": true,
+					"lineStyle": {
+							"color": [
+									"#eeeeee"
+							]
+					}
+			},
+			"splitArea": {
+					"show": false,
+					"areaStyle": {
+							"color": [
+									"rgba(250,250,250,0.05)",
+									"rgba(200,200,200,0.02)"
+							]
+					}
+			}
+	},
+	"toolbox": {
+			"iconStyle": {
+					"borderColor": "#999999"
+			},
+			"emphasis": {
+					"iconStyle": {
+							"borderColor": "#666666"
+					}
+			}
+	},
+	"legend": {
+			"textStyle": {
+					"color": "#999999"
+			}
+	},
+	"tooltip": {
+			"axisPointer": {
+					"lineStyle": {
+							"color": "#cccccc",
+							"width": 1
+					},
+					"crossStyle": {
+							"color": "#cccccc",
+							"width": 1
+					}
+			}
+	},
+	"timeline": {
+			"lineStyle": {
+					"color": "#626c91",
+					"width": 1
+			},
+			"itemStyle": {
+					"color": "#626c91",
+					"borderWidth": 1
+			},
+			"controlStyle": {
+					"color": "#626c91",
+					"borderColor": "#626c91",
+					"borderWidth": 0.5
+			},
+			"checkpointStyle": {
+					"color": "#3fb1e3",
+					"borderColor": "#3fb1e3"
+			},
+			"label": {
+					"color": "#626c91"
+			},
+			"emphasis": {
+					"itemStyle": {
+							"color": "#626c91"
+					},
+					"controlStyle": {
+							"color": "#626c91",
+							"borderColor": "#626c91",
+							"borderWidth": 0.5
+					},
+					"label": {
+							"color": "#626c91"
+					}
+			}
+	},
+	"visualMap": {
+			"color": [
+					"#2a99c9",
+					"#afe8ff"
+			]
+	},
+	"dataZoom": {
+			"backgroundColor": "rgba(255,255,255,0)",
+			"dataBackgroundColor": "rgba(222,222,222,1)",
+			"fillerColor": "rgba(114,230,212,0.25)",
+			"handleColor": "#cccccc",
+			"handleSize": "100%",
+			"textStyle": {
+					"color": "#999999"
+			}
+	},
+	"markPoint": {
+			"label": {
+					"color": "#ffffff"
+			},
+			"emphasis": {
+					"label": {
+							"color": "#ffffff"
+					}
+			}
+	}
+}

src/views/generatingCapacity/dataFilter/prepare/search.vue

@@ -8,6 +8,7 @@
           class="w-[150px]"
           @change="funStationChange"
         >
+          <el-option label="全区域" @click="getAllWt"> </el-option>
           <el-option
             v-for="item in stationList"
             :key="item.id"
@@ -169,6 +170,30 @@ export default {
         }
       });
     },
+
+    getAllWt() {
+      let windList = [];
+      let promiseList = [];
+      this.stationList.forEach((ele) => {
+        let promiseItem = new Promise((resolve, reject) => {
+          apiGetbaseWindturbine({
+            stationId: ele.id,
+          }).then((res) => {
+            resolve(res?.data || []);
+          });
+        });
+        promiseList.push(promiseItem);
+      });
+      Promise.all(promiseList).then((res) => {
+        res.forEach((ele) => {
+          windList = [].concat(windList, ele);
+        });
+        this.windList = windList;
+        this.queryForm.wtIds = windList.map((o) => o.id);
+        this.checkAll = true;
+      });
+    },
+
     funStationChange(stationId) {
       if (stationId) {
         this.funGetWind(stationId);