新建分支

src/components/HeaderCom.vue

@@ -65,6 +65,25 @@
             </el-select>
           </div>
           <el-divider></el-divider>
+          <div class="cursor-pointer boxmini">
+            <p>图表主题：</p>
+            <el-select
+              size="mini"
+              v-model="color1"
+              @change="updateChartColor"
+              placeholder="选择配色方案"
+              style="width: 200px"
+            >
+              <el-option
+                v-for="(scheme, index) in colorSchemes"
+                :key="index"
+                :label="scheme.label"
+                :value="scheme.colors"
+                :style="getOptionStyle(scheme.colors)"
+              ></el-option>
+            </el-select>
+          </div>
+          <el-divider></el-divider>
           <div class="cursor-pointer boxmini" @click="skip(1)">
             <p class="logout">退出登录</p>
           </div>
@@ -76,9 +95,14 @@
 
 <script>
 import { userLogout } from "@/api/system";
+import { mapActions } from "vuex";
+import { colorSchemes } from "@/views/overview/js/colors";
 export default {
   data() {
     return {
+      color1: [], // 默认颜色
+      // 配色方案列表（每个方案是一个颜色数组）
+      colorSchemes: [...colorSchemes],
       currentDate: "",
       currentTheme: this.$store.state.themes.theme,
       colorData: [
@@ -105,6 +129,23 @@ export default {
   },
 
   methods: {
+    ...mapActions("themes", ["themeChange"]),
+    updateChartColor() {
+      // console.log("this.color1", this.color1);
+      this.themeChange(this.color1);
+    },
+    // 根据配色方案设置每个选项的样式
+    getOptionStyle(scheme) {
+      return {
+        background: `linear-gradient(to right, ${scheme
+          .slice(0, 8)
+          .join(", ")})`,
+        color: "#fff",
+        height: "30px",
+        lineHeight: "30px",
+        borderRadius: "0px",
+      };
+    },
     changeTheme(theme) {
       this.$store.dispatch("switchTheme", theme);
     },

src/components/map/index.vue

@@ -235,8 +235,8 @@ export default {
         new TileLayer({
           source: new XYZ({
             // url: "http://127.0.0.1:8010/tiles/{z}/{x}/{y}.png", //本地
-            // url: "http://192.168.50.235/tiles/{z}/{x}/{y}.png", //内网
-            url: "http://106.120.102.238:18000/tiles/{z}/{x}/{y}.png", //外网
+            url: "http://192.168.50.235/tiles/{z}/{x}/{y}.png", //内网
+            // url: "http://106.120.102.238:18000/tiles/{z}/{x}/{y}.png", //外网
             // url: "http://10.96.137.5:9080/tiles/{z}/{x}/{y}.png", //大～#@唐
           }),
         }),

src/views/overview/components/analysis_information/index.vue

@@ -48,7 +48,8 @@
           <span class="headerMessage">{{ fieldInfo.latitude }} </span>°
         </div>
         <div>
-          该风电场由{{ fieldInfo.companyName }}管理，风场总容量为
+          <!-- 该风电场由{{ fieldInfo.companyName }}管理， -->
+          风场总容量为
           <span class="headerMessage"
             >{{ fieldInfo.ratedCapacityNumber }} MW
           </span>

src/views/overview/components/power_scatter_2D/index.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2025-01-09 18:10:35
- * @LastEditTime: 2025-02-26 11:19:41
+ * @LastEditTime: 2025-02-28 11:07:08
  * @LastEditors: bogon
  * @Description: In User Settings Edit
  * @FilePath: /performance-test/src/views/overview/components/power_scatter_2D/index.vue
@@ -37,7 +37,7 @@
       <VirtualList
         :list="diagramRelationsDatas"
         keyField="fieldEngineCode"
-        :itemSize="452"
+        :itemSize="500"
         v-slot="{ item, index }"
       >
         <powerMarkers2DCharts

src/views/overview/index.vue

@@ -117,44 +117,7 @@
         </div>
       </el-tooltip>
     </div>
-    <div class="tousutiwen_box1">
-      <el-tooltip
-        class="item"
-        effect="dark"
-        content="图表主题设置"
-        placement="right"
-      >
-        <div class="tousutiwen_icon">
-          <el-popover placement="right" width="220" trigger="click">
-            <div style="margin-right: 20px; display: flex; align-items: center">
-              <el-select
-                size="small"
-                v-model="color1"
-                @change="updateChartColor"
-                placeholder="选择配色方案"
-                style="width: 200px"
-              >
-                <el-option
-                  v-for="(scheme, index) in colorSchemes"
-                  :key="index"
-                  :label="scheme.label"
-                  :value="scheme.colors"
-                  :style="getOptionStyle(scheme.colors)"
-                ></el-option>
-              </el-select>
-              <!-- <span style="margin-left: 10px">图表主题设置</span> -->
-            </div>
-            <template>
-              <svg-icon
-                icon-class="themes"
-                slot="reference"
-                style="width: 40px; height: 40px"
-              />
-            </template>
-          </el-popover>
-        </div>
-      </el-tooltip>
-    </div>
+
     <el-dialog
       :title="'分析主题：' + batchTitle"
       :visible="isShowComment"
@@ -184,17 +147,12 @@
 <script>
 import { queryAllAnalysisType } from "@/api/performance";
 import { getAnalysisCodeInfo } from "@/api/overview";
-import { colorSchemes } from "@/views/overview/js/colors";
-import { mapActions } from "vuex";
 export default {
   data() {
     return {
       loading: false,
       filterText: "",
       data: [],
-      color1: colorSchemes[0].colors, // 默认颜色
-      // 配色方案列表（每个方案是一个颜色数组）
-      colorSchemes: [...colorSchemes],
       isShow: false, //控制评论框是否显示
       isShowComment: false, //控制上一条、下一条是否显示
       // 用于控制是否展开/收起
@@ -249,23 +207,6 @@ export default {
   },
 
   methods: {
-    ...mapActions("themes", ["themeChange"]),
-    updateChartColor() {
-      // console.log("this.color1", this.color1);
-      this.themeChange(this.color1);
-    },
-    // 根据配色方案设置每个选项的样式
-    getOptionStyle(scheme) {
-      return {
-        background: `linear-gradient(to right, ${scheme
-          .slice(0, 8)
-          .join(", ")})`,
-        color: "#fff",
-        height: "30px",
-        lineHeight: "30px",
-        borderRadius: "0px",
-      };
-    },
     setIsShow() {
       this.isShow = false;
     },

src/views/performance/components/chartsCom/3DDrawingChart.vue

@@ -35,16 +35,12 @@
     </div>
 
     <!-- 图表展示区域 -->
-    <div style="height: 600px">
-      <div
-        :id="`plotly-3d-chart-` + index"
-        style="width: 100%; height: 600px"
-      ></div>
+    <div style="height: 500px">
       <div
         v-loading="loading"
         :id="`plotly-3d-chart-` + index"
         ref="plotlyChart"
-        style="height: 600px"
+        style="height: 500px; background-color: #e5ecf6"
       >
         <el-empty v-if="isError" description="请求失败"></el-empty>
       </div>
@@ -288,15 +284,7 @@ export default {
         layout.scene.zaxis.dtick = zChartSetUp.dtick;
         layout.scene.zaxis.range = [zChartSetUp.min, zChartSetUp.max];
       }
-      console.log(
-        xChartSetUp,
-        yChartSetUp,
-        zChartSetUp,
-        layout.scene.xaxis.title,
-        layout.scene.yaxis.title,
-        layout.scene.zaxis.title,
-        "layout.scene.zaxis.title"
-      );
+
       try {
         // 假设这里是 WebGL 的相关初始化代码
         Plotly.react(`plotly-3d-chart-` + this.index, traces, layout).catch(
@@ -334,6 +322,13 @@ export default {
 </script>
 
 <style scoped>
+#scene {
+  background: #e5ecf6 !important;
+}
+.js-plotly-plot .plotly,
+.js-plotly-plot .plotly div {
+  background: #e5ecf6 !important;
+}
 /* 样式可以根据需求自定义 */
 #plotly-3d-chart {
   width: 100%;

src/views/performance/components/chartsCom/BarChart.vue

@@ -1,8 +1,8 @@
 <!--
  * @Author: your name
  * @Date: 2024-09-11 14:30:17
- * @LastEditTime: 2025-02-27 10:22:31
- * @LastEditors: bogon
+ * @LastEditTime: 2025-02-28 09:23:52
+ * @LastEditors: milo-MacBook-Pro.local
  * @Description: In User Settings Edit
  * @FilePath: /performance-test/src/views/performance/components/chartsCom/BarChart.vue
 -->
@@ -144,7 +144,10 @@ export default {
         },
         autosize: true, // 开启自适应
       };
-      if (this.chartData.xaixs === "机组") {
+      if (
+        this.chartData.xaixs === "机组" ||
+        this.chartData.xaixs === "机组名称"
+      ) {
         layout.xaxis.tickvals = this.chartData.data[0].xData;
         layout.xaxis.ticktext = this.chartData.data[0].xData;
       }

src/views/performance/components/chartsCom/BoxLineCharts.vue

@@ -200,6 +200,13 @@ export default {
         yaxis: { title: this.chartData.yaixs },
         showlegend: true,
       };
+      if (
+        this.chartData.xaixs === "机组" ||
+        this.chartData.xaixs === "机组名称"
+      ) {
+        layout.xaxis.tickvals = [...new Set(filteredData.xData)];
+        layout.xaxis.ticktext = [...new Set(filteredData.xData)];
+      }
 
       const getChartSetUp = (axisTitle) => {
         return this.setUpImgData.find((item) => item.text.includes(axisTitle));

src/views/performance/components/chartsCom/Radar.vue

@@ -109,7 +109,8 @@ export default {
         this.chartData.Thi,
         this.chartData.Ws,
       ];
-
+      // 将中位值存入 window，确保 tooltip 访问
+      window.medianValues = this.medianValues;
       // 雷达图的指示器，使用最大值、最小值和中位值来动态设置
       const indicators = [
         {
@@ -137,8 +138,34 @@ export default {
           text: this.chartData.wind_turbine_name + "机组指标",
           left: "center",
         },
+
         tooltip: {
           trigger: "item",
+          formatter: (params) => {
+            const indicators = [
+              "风机能量利用率",
+              "风机可利用率",
+              "平均风速",
+              "利用小时",
+              "功率曲线一致性系数",
+            ];
+            // 获取当前鼠标悬停的数据
+            const values = params.value;
+            const medianValues = window.medianValues || [];
+            let content = `<strong>${params.seriesName}</strong><br/>`;
+
+            for (let i = 0; i < indicators.length; i++) {
+              // 判断是否是当前鼠标悬停的指标
+              if (params.encode && params.encode[`indicator_${i}`]) {
+                // 判断当前悬停的值是否与该指标匹配
+
+                // if (params.encode[`indicator_${i}`][0] === params.dataIndex) {
+                content += `${indicators[i]}: ${values[i]}<br/>中位值: ${medianValues[i]}<br/><br/>`;
+                // }
+              }
+            }
+            return content;
+          },
         },
         radar: {
           indicator: indicators,

src/views/performance/components/chartsCom/Time3DChart.vue

@@ -37,10 +37,8 @@
       v-loading="loading"
       :id="`plotly-3d-chart-` + index"
       ref="plotlyChart"
-      style="height: 600px"
-    >
-      <el-empty v-if="isError" description="请求失败"></el-empty>
-    </div>
+      style="height: 500px; background-color: #e5ecf6"
+    ></div>
   </div>
 </template>
 
@@ -236,6 +234,7 @@ export default {
           },
           plot_bgcolor: "#e5ecf6",
           gridcolor: "#fff",
+          backgroundcolor: "#e5ecf6", // 设置背景颜色为白色
           // camera: {
           //   center: { x: 0, y: 0, z: 0 },
           //   eye: { x: 0, y: 0, z: 2.5 },
@@ -281,6 +280,16 @@ export default {
       }
       console.log(zChartSetUp, yChartSetUp, xChartSetUp, "xChartSetUp");
       Plotly.newPlot(`plotly-3d-chart-` + this.index, traces, layout);
+      plotElement.on("plotly-3d-chart-", function (eventData) {
+        // 在每次布局变更时，打印当前相机视角
+        if (eventData["scene.camera"]) {
+          console.log(
+            "当前相机视角:",
+            eventData["scene.camera"],
+            eventData["scene.aspectratio"]
+          );
+        }
+      });
     },
 
     updateChartColor() {
@@ -313,4 +322,11 @@ export default {
 ::v-deep canvas {
   /* height: 400px !important; */
 }
+.js-plotly-plot .plotly,
+.js-plotly-plot .plotly div {
+  background: #e5ecf6 !important;
+}
+#scene {
+  background: #e5ecf6 !important;
+}
 </style>

src/views/performance/components/chartsCom/powerMarkers2DCharts.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2024-09-11 14:32:12
- * @LastEditTime: 2025-02-26 17:59:46
+ * @LastEditTime: 2025-02-28 11:13:02
  * @LastEditors: bogon
  * @Description: In User Settings Edit
  * @FilePath: /performance-test/src/views/performance/components/chartsCom/powerMarkers2DCharts.vue