分析有功功率内容展示

package-lock.json

@@ -19,6 +19,7 @@
         "element-ui": "^2.15.14",
         "happypack": "^5.0.1",
         "ol": "^9.2.3",
+        "plotly.js-dist": "^2.34.0",
         "qs": "^6.12.0",
         "quill": "^2.0.2",
         "svg-sprite-loader": "^6.0.11",
@@ -10961,6 +10962,12 @@
         "node": ">=8"
       }
     },
+    "node_modules/plotly.js-dist": {
+      "version": "2.34.0",
+      "resolved": "https://repo.huaweicloud.com/repository/npm/plotly.js-dist/-/plotly.js-dist-2.34.0.tgz",
+      "integrity": "sha512-FZR9QT60vtE1ocdSIfop+zDIJEoy1lejwOvAjTSy+AmE4GZ//rW1nnIXwCRv4o9ejfzWq++lQMu6FJf9G+NtFg==",
+      "license": "MIT"
+    },
     "node_modules/portfinder": {
       "version": "1.0.32",
       "resolved": "https://registry.npmjs.org/portfinder/-/portfinder-1.0.32.tgz",

package.json

@@ -19,6 +19,7 @@
     "element-ui": "^2.15.14",
     "happypack": "^5.0.1",
     "ol": "^9.2.3",
+    "plotly.js-dist": "^2.34.0",
     "qs": "^6.12.0",
     "quill": "^2.0.2",
     "svg-sprite-loader": "^6.0.11",

src/api/performance.js

@@ -1,12 +1,20 @@
 /*
  * @Author: your name
  * @Date: 2024-06-03 09:29:50
- * @LastEditTime: 2024-07-17 09:55:52
+ * @LastEditTime: 2024-08-02 10:59:48
  * @LastEditors: bogon
  * @Description: In User Settings Edit
  * @FilePath: /performance-test/src/api/performance。.js
  */
 import request from "@/utils/request";
+//分析选择某个图表类型
+export function queryAnalysisTypeConfig(data) {
+  return request({
+    url: "/energy-manage-service/analysis/queryAnalysisTypeConfig",
+    method: "get",
+    params: data,
+  });
+}
 //转换数据时间
 export function queryDataTime(data) {
   return request({

src/views/performance/assetssDetail.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2024-05-27 09:25:45
- * @LastEditTime: 2024-07-29 10:34:39
+ * @LastEditTime: 2024-08-05 09:52:56
  * @LastEditors: bogon
  * @Description: In User Settings Edit
  * @FilePath: /performance-test/src/views/performance/assetssDetail.vue
@@ -15,7 +15,8 @@
           style="font-size: 20px"
           icon="el-icon-arrow-left"
           @click="() => $router.push('/home/performance/assetssMag')"
-          >返回
+        >
+          返回
         </el-button>
       </el-col>
       <el-col :span="8">
@@ -83,9 +84,9 @@
     <div v-else>
       <el-card class="box-card analysisType" v-if="generalFiles.length > 0">
         <div slot="header" class="clearfix">
-          <span style="font-weight: 700; font-size: 16px"
-            >分析总图{{ fileCheckResult1 }}</span
-          >
+          <span style="font-weight: 700; font-size: 16px">
+            分析总图{{ fileCheckResult1 }}
+          </span>
         </div>
         <el-row class="assetssConent">
           <!-- :span="getSpan(index, 'generalFiles')" -->
@@ -111,37 +112,14 @@
               width="100%"
               height="100%"
             ></iframe>
-            <!-- <img
-              v-if="getFileType(file.fileAddr) === 'image'"
-              alt="加载图片"
-              @load="imageLoad(index)"
-              @error="imageError(index)"
-              v-lazy-load="{
-                src: file.fileAddr,
-                errorImageSrc: require('../../assets/img/loadingErrorFx.webp'),
-              }"
-            /> -->
-            <!-- <el-skeleton
-              v-if="loadings[index] && getFileType(file.fileAddr) === 'image'"
-              animated
-              style="width: 100%; height: 100%"
-              class="gjp"
-            >
-              <template slot="template">
-                <el-skeleton-item
-                  variant="image"
-                  style="width: 100%; height: 100%"
-                />
-              </template>
-            </el-skeleton> -->
           </el-col>
         </el-row>
       </el-card>
       <el-card class="box-card analysisType" v-if="diagramRelations.length > 0">
         <div slot="header" class="clearfix">
-          <span style="font-weight: 700; font-size: 16px"
-            >分析分图 {{ fileCheckResult1 }}</span
-          >
+          <span style="font-weight: 700; font-size: 16px">
+            分析分图 {{ fileCheckResult1 }}
+          </span>
         </div>
         <el-row class="assetssConent">
           <el-col
@@ -162,32 +140,6 @@
               height="100%"
               @load="iframeLoad(index + diagramRelations.length)"
             ></iframe>
-            <!-- <img
-              v-if="getFileType(file.fileAddr) === 'image'"
-              alt="加载图片"
-              @load="imageLoad(index + generalFiles.length)"
-              @error="imageError(index + generalFiles.length)"
-              v-lazy-load="{
-                src: file.fileAddr,
-                errorImageSrc: require('../../assets/img/loadingErrorFx.webp'),
-              }"
-            /> -->
-            <!-- <el-skeleton
-              v-if="
-                loadings[index + generalFiles.length] &&
-                getFileType(file.fileAddr) === 'image'
-              "
-              animated
-              style="width: 100%; height: 100%"
-              class="gjp"
-            >
-              <template slot="template">
-                <el-skeleton-item
-                  variant="image"
-                  style="width: 100%; height: 100%"
-                />
-              </template>
-            </el-skeleton> -->
           </el-col>
         </el-row>
       </el-card>
@@ -213,8 +165,8 @@ import {
   analysisDetail,
   queryAnalysisedType,
   queryAnalysisedEngine,
+  queryAnalysisTypeConfig,
 } from "@/api/performance";
-import axios from "axios";
 
 export default {
   data() {
@@ -242,8 +194,13 @@ export default {
   },
   mounted() {
     // this.initializeLoading();
+    this.chartsTypeConfig();
   },
   methods: {
+    async chartsTypeConfig() {
+      const result = await queryAnalysisTypeConfig();
+      console.log(result.data, "result");
+    },
     iframeLoad(index) {
       this.$set(this.loadings, index, false);
     },
@@ -254,16 +211,6 @@ export default {
       // 初始化 loadings 数组，全部设置为 true，表示加载状态
       this.loadings = new Array(totalFiles).fill(true);
     },
-    async fileAddrFn(file) {
-      try {
-        const res = await axios.get(file);
-        this.fileCheckResult = true;
-        return true;
-      } catch (e) {
-        console.error(file, e, "失败1111");
-        this.fileCheckResult = false;
-      }
-    },
     // 查询
     onSubmit() {
       this.getDetailInfo();
@@ -288,16 +235,19 @@ export default {
         } else {
           this.flage = false;
         }
+        this.generalFiles = [];
         this.generalFiles =
           (response.data &&
             response.data.length > 0 &&
             response.data[0].generalFiles) ||
           [];
+        this.diagramRelations = [];
         this.diagramRelations =
           (response.data &&
             response.data.length > 0 &&
             response.data[0].diagramRelations) ||
           [];
+        console.log(this.diagramRelations, "this.diagramRelations");
         this.commentDescriptionVos =
           (response.data &&
             response.data.length > 0 &&

src/views/performance/components/EditAnalysis.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2024-05-29 09:14:23
- * @LastEditTime: 2024-08-02 10:45:45
+ * @LastEditTime: 2024-08-06 10:03:06
  * @LastEditors: bogon
  * @Description: In User Settings Edit
  * @FilePath: /performance-test/src/views/performance/components/EditAnalysis.vue
@@ -43,13 +43,17 @@
                     :label="item.engineName"
                     :value="item.engineCode"
                   ></el-option>
-                </el-select> </el-form-item
-            ></el-col>
+                </el-select>
+              </el-form-item>
+            </el-col>
             <el-col :span="5">
               <el-form-item class="searchFrom">
                 <el-button type="primary" @click="onSubmit" size="small"
                   >查询</el-button
                 >
+                <el-button type="primary" @click="" size="small"
+                  >一键下载分析结果</el-button
+                >
               </el-form-item>
             </el-col>
           </el-row>
@@ -62,30 +66,134 @@
     ></el-empty>
     <el-card v-if="!noData" shadow="always" class="box-card">
       <el-row>
-        <el-col :span="12"
+        <el-col
+          :span="12"
+          v-if="
+            form.configAnalysis === 'power_curve'
+            // ||
+            // form.configAnalysis === 'cp'
+          "
           ><div class="left">
-            <h4>风场信息概览</h4>
             <el-table
               :data="tableData"
               border
               style="width: 100%"
               align="center"
             >
-              <el-table-column prop="date" label="风机名称" width="180">
-              </el-table-column>
-              <el-table-column prop="name" label="额定容量/KW" width="180">
+              <el-table-column prop="date" label="风机名称"> </el-table-column>
+              <el-table-column prop="name" label="风机机型"> </el-table-column>
+              <el-table-column prop="address" label="风速"> </el-table-column>
+              <el-table-column prop="address" label="合同功率">
               </el-table-column>
-              <el-table-column prop="address" label="经度"> </el-table-column>
-              <el-table-column prop="address" label="纬度"> </el-table-column>
-              <el-table-column prop="address" label="是否标杆">
+              <el-table-column prop="address" label="实际功率">
               </el-table-column>
             </el-table>
           </div>
         </el-col>
-        <el-col :span="12" v-loading="htmlLoading">
+        <el-col :span="24" v-if="form.configAnalysis === 'yaw_error'"
+          ><div class="left">
+            <el-table
+              :data="tableData"
+              border
+              style="width: 100%"
+              align="center"
+            >
+              <el-table-column prop="date" label="风机名称"> </el-table-column>
+              <el-table-column prop="name" label="误差值"> </el-table-column>
+            </el-table>
+          </div>
+        </el-col>
+        <el-col
+          v-loading="htmlLoading"
+          v-if="form.configAnalysis === 'power_curve'"
+          :span="12"
+        >
           <div class="right">
-            <h4>XX风机标准功率曲线展示图</h4>
-            <!-- <iframe
+            <PlotlyCharts></PlotlyCharts>
+          </div>
+        </el-col>
+        <!-- <el-col v-loading="htmlLoading" v-else :span="24">
+          <div class="right">
+            <PlotlyCharts></PlotlyCharts>
+          </div>
+        </el-col> -->
+        <el-col
+          :span="12"
+          v-if="
+            form.configAnalysis !== 'power_curve' ||
+            form.configAnalysis === 'yaw_error'
+          "
+          ><div class="left">
+            <div>
+              <span>机组名称：</span>
+              <el-select
+                v-model="engineCode"
+                placeholder="请选择机组名称"
+                size="small"
+                clearable
+                @change="handleEngineCode"
+              >
+                <el-option
+                  v-for="item in windEngineGroupList"
+                  :key="item.engineCode"
+                  :label="item.engineName"
+                  :value="item.engineCode"
+                ></el-option>
+              </el-select>
+            </div>
+            <div>
+              1.额定容量：{{
+                windDetail.ratedCapacity ? windDetail.ratedCapacity : 0
+              }}
+              <span> (kW)</span>
+            </div>
+            <div>2.风机编号:{{ windDetail.engineCode }}</div>
+            <div>3.经度（Longitude）：{{ windDetail.longitude }}</div>
+            <div>4.维度（Dimensionality）：{{ windDetail.latitude }}</div>
+            <div>
+              5.海拔高度（Altitude）：{{
+                windDetail.elevationHeight ? windDetail.elevationHeight : 0
+              }}
+              <span>(米)</span>
+            </div>
+            <div>6.风机名称：{{ windDetail.engineName }}</div>
+            <div>
+              7.是否标杆（Benchmarking or not）：{{
+                windDetail.sightcing == 1 ? "是" : "否"
+              }}
+            </div>
+            <div>8.风场编号：{{ windDetail.fieldCode }}</div>
+            <div>
+              9.轮毂高度：{{ windDetail.hubHeight ? windDetail.hubHeight : 0 }}
+              <span>(米)</span>
+            </div>
+            <div>10.机型编号：{{ windDetail.millTypeCode }}</div>
+            <div>
+              11.切入风速：{{
+                windDetail.ratedCutInWindspeed
+                  ? windDetail.ratedCutInWindspeed
+                  : 0
+              }}<span>(m/s)</span>
+            </div>
+            <div>
+              12.切出风速：{{
+                windDetail.ratedCutOutWindspeed
+                  ? windDetail.ratedCutOutWindspeed
+                  : 0
+              }}<span>(m/s)</span>
+            </div>
+          </div>
+        </el-col>
+        <el-col
+          :span="12"
+          v-loading="htmlLoading"
+          v-if="
+            form.configAnalysis !== 'power_curve' ||
+            form.configAnalysis === 'yaw_error'
+          "
+        >
+          <div class="right">
+            <iframe
               v-if="htmlLoading"
               :src="windDetail.elevationHeight"
               frameborder="0"
@@ -98,7 +206,7 @@
               style="width: 100%"
               src="../../../assets/img/loadingError.webp"
               alt=""
-            /> -->
+            />
           </div>
         </el-col>
       </el-row>
@@ -173,15 +281,17 @@ import {
 } from "@/api/performance";
 import { getWindEngineGroup } from "@/api/ledger";
 import TinymceEditor from "@/components/Tinymce.vue";
+import PlotlyCharts from "./PlotlyCharts.vue";
 export default {
   components: {
     TinymceEditor,
+    PlotlyCharts,
   },
   data() {
     return {
       tableData: [],
       noData: false,
-      htmlLoading: true,
+      htmlLoading: false,
       loading: false,
       engineCode: null, //台账机组编号
       windDetail: {},
@@ -514,6 +624,9 @@ export default {
 ::v-deep.el-input--small .el-input__inner {
   width: 200px !important;
 }
+::v-deep .el-table th.el-table__cell > .cell {
+  display: block !important;
+}
 .demo-input-suffix {
   display: flex !important;
 }

src/views/performance/components/PlotlyCharts.vue

@@ -0,0 +1,74 @@
+<!--
+ * @Author: your name
+ * @Date: 2024-08-05 17:19:47
+ * @LastEditTime: 2024-08-05 17:27:32
+ * @LastEditors: bogon
+ * @Description: In User Settings Edit
+ * @FilePath: /performance-test/src/views/performance/components/plotlyCharts.vue
+-->
+<template>
+  <div id="plotly-chart"></div>
+</template>
+
+<script>
+import Plotly from "plotly.js-dist";
+
+export default {
+  name: "PowerCurvePlot",
+  mounted() {
+    const data = {
+      analysisTypeCode: "power_curve",
+      graphType: "scatter",
+      data: [
+        {
+          engineName: "#1",
+          windSpeed: [
+            3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18, 19, 20,
+          ],
+          power: [
+            6.06, 76.54, 184.1, 345.94, 574.4, 879.9, 1274.73, 1664.94, 1942.96,
+            2004.78, 2004.78, 2004.78, 2004.78, 2004.78, 2004.78, 2004.78,
+            2004.78, 2004.78,
+          ],
+        },
+        {
+          engineName: "#2",
+          windSpeed: [
+            2, 2.5, 3, 3.5, 4, 4.5, 5, 5.5, 6, 6.5, 7, 7.5, 8, 8.5, 9, 9.5, 10,
+            10.5, 11, 11.5, 12, 12.5, 13, 13.5, 14, 14.5, 15, 15.5, 16, 16.5,
+          ],
+          power: [
+            2, 9.23, 100.12, 155.51, 230.09, 400.15, 500.95, 689.55, 961.09,
+            1257.53, 1346.02, 1479.78, 1528.01, 1618.52, 1789.09, 1819.35,
+            1920.29, 2053.52, 2053.52, 2053.52, 2053.52, 2053.52, 2053.52,
+            2053.52, 2053.52, 2053.52, 2053.52, 2053.52, 2053.52, 2053.52,
+            2053.52,
+          ],
+        },
+      ],
+    };
+
+    const plotlyData = data.data.map((engine) => ({
+      x: engine.windSpeed,
+      y: engine.power,
+      mode: "lines",
+      name: engine.engineName,
+    }));
+
+    const layout = {
+      title: "Power Curve",
+      xaxis: { title: "Wind Speed (m/s)" },
+      yaxis: { title: "Power (kW)" },
+    };
+
+    Plotly.newPlot("plotly-chart", plotlyData, layout);
+  },
+};
+</script>
+
+<style scoped>
+#plotly-chart {
+  width: 100%;
+  height: 100%;
+}
+</style>

src/views/performance/components/analysisEvent.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2024-05-29 09:13:51
- * @LastEditTime: 2024-07-30 10:33:56
+ * @LastEditTime: 2024-08-05 16:04:48
  * @LastEditors: bogon
  * @Description: In User Settings Edit
  * @FilePath: /performance-test/src/views/performance/components/analysisEvent.vue
@@ -551,98 +551,44 @@
     </el-form>
     <el-card shadow="always" class="box-card">
       <el-row>
-        <el-col :span="12"
-          ><div class="left">
-            <div>
-              <span>机组名称：</span>
-              <el-select
-                v-model="engineCode"
-                placeholder="请选择机组名称"
-                size="small"
-                clearable
-                @change="handleEngineCode"
+        <div class="filedView">风场信息概览</div>
+      </el-row>
+      <el-row>
+        <el-col :span="12">
+          <div class="left">
+            <el-table :data="batchList" border>
+              <el-table-column prop="engineName" label="风机名称">
+              </el-table-column>
+              <el-table-column prop="ratedCapacity" label="额定容量/KW">
+              </el-table-column>
+              <el-table-column prop="longitude" label="经度"> </el-table-column>
+              <el-table-column prop="latitude" label="纬度"> </el-table-column>
+              <el-table-column prop="sightcing" label="是否标杆">
+                <template slot-scope="{ row }">
+                  {{ row.sightcing == 1 ? "是" : "否" }}
+                </template>
+              </el-table-column>
+            </el-table>
+            <div class="pagination-container">
+              <el-pagination
+                @current-change="handleCurrentChange"
+                :current-page.sync="formInline.pageNum"
+                layout="total, prev, pager, next"
+                :page-size="formInline.pageSize"
+                :total="formInline.totalSize"
               >
-                <el-option
-                  v-for="item in windEngineGroupList"
-                  :key="item.engineCode"
-                  :label="item.engineName"
-                  :value="item.engineCode"
-                ></el-option>
-              </el-select>
-            </div>
-            <div>
-              1.额定容量：{{
-                windDetail.ratedCapacity ? windDetail.ratedCapacity : 0
-              }}
-              <span> (kW)</span>
-            </div>
-            <!-- <div>2.发电机类型（Generator Type）:{{}}</div> -->
-            <div>2.风机编号:{{ windDetail.engineCode }}</div>
-            <div>3.经度（Longitude）：{{ windDetail.longitude }}</div>
-            <div>4.维度（Dimensionality）：{{ windDetail.latitude }}</div>
-            <div>
-              5.海拔高度（Altitude）：{{
-                windDetail.elevationHeight ? windDetail.elevationHeight : 0
-              }}
-              <span>(米)</span>
-            </div>
-            <div>6.风机名称：{{ windDetail.engineName }}</div>
-            <div>
-              7.是否标杆（Benchmarking or not）：{{
-                windDetail.sightcing == 1 ? "是" : "否"
-              }}
+              </el-pagination>
             </div>
-            <div>8.风场编号：{{ windDetail.fieldCode }}</div>
-            <div>
-              9.轮毂高度：{{ windDetail.hubHeight ? windDetail.hubHeight : 0 }}
-              <span> (米)</span>
-            </div>
-            <div>10.机型编号：{{ windDetail.millTypeCode }}</div>
-            <div>
-              11.切入风速：{{
-                windDetail.ratedCutInWindspeed
-                  ? windDetail.ratedCutInWindspeed
-                  : 0
-              }}<span> (m/s)</span>
-            </div>
-            <div>
-              12.切出风速：{{
-                windDetail.ratedCutOutWindspeed
-                  ? windDetail.ratedCutOutWindspeed
-                  : 0
-              }}<span> (m/s)</span>
-            </div>
-            <!-- <div>8.地理位置（Location）：不同地理位置的气候条件{{}}</div>
-            <div>
-              9.供应商信息（Manufacturer
-              Information）：制造商的信誉、技术水平和售后
-            </div>
-            <div>
-              10.维护需求（Maintenance Requirements）：风力发电机组需要定期
-            </div>
-            <div>11.预期寿命（Expected Lifetime）：风力发电机组的设计寿命</div> -->
           </div>
         </el-col>
         <el-col :span="12" v-loading="htmlLoading">
           <div class="right">
-            <iframe
-              v-if="htmlLoading"
-              :src="windDetail.elevationHeight"
-              frameborder="0"
-              @load="iframeLoad"
-              width="100%"
-              height="100%"
-            ></iframe>
-            <img
-              v-else
-              style="width: 100%"
-              src="../../../assets/img/loadingError.webp"
-              alt=""
-            />
+            <Map></Map>
           </div>
         </el-col>
       </el-row>
     </el-card>
+
     <el-drawer
       title="偏好设置"
       :visible.sync="drawer"
@@ -718,13 +664,24 @@
 </template>
 <script>
 import { analysisEditQuery, analysis, queryDataTime } from "@/api/performance";
-import { getWindEngineGroup } from "@/api/ledger";
+import { getWindEngineGroup, windEngineGrouPage } from "@/api/ledger";
+import Map from "./map.vue";
+
 export default {
+  components: {
+    Map,
+  },
   data() {
     return {
+      formInline: {
+        pageNum: 1,
+        pageSize: 10,
+        totalSize: 0,
+      },
+      batchList: [],
       checkedTurbines: false,
       checked: false,
-      htmlLoading: true,
+      htmlLoading: false,
       engineCode: null, //台账机组编号
       picker: [],
       dataMinTime: null,
@@ -781,8 +738,24 @@ export default {
     //获取分析 分析类型、机组编号 列表
     this.getWindCodeList();
     this.getQueryDataTime();
+    this.getFengjiList();
   },
   methods: {
+    getFengjiList() {
+      windEngineGrouPage({
+        fieldCode: this.$route.query.fieldEngineCode,
+        ...this.formInline,
+        totalSize: undefined,
+      }).then((res) => {
+        this.batchList = res.data.list;
+        this.formInline.totalSize = res.data.totalSize;
+      });
+    },
+    //分页数据切换
+    handleCurrentChange(val) {
+      this.formInline.pageNum = val;
+      this.getFengjiList();
+    },
     disabledDate(time) {
       if (!this.dataMinTime || !this.dataMaxTime) {
         return false;
@@ -832,9 +805,7 @@ export default {
         this.form.configAnalysis = [];
       }
     },
-    iframeLoad() {
-      this.htmlLoading = false;
-    },
+
     ensureMinValue(field, index) {
       if (field[index] < 1) {
         field[index] = 1;
@@ -1034,15 +1005,37 @@ export default {
   margin: 10px 0;
   width: 100%;
   font-size: 14px;
+  height: 100%;
+  .filedView {
+    height: 60px;
+    line-height: 60px;
+    background-color: #fff;
+    color: #303133;
+    cursor: pointer;
+    border-bottom: 1px solid #ebeef5;
+    font-size: 16px;
+    text-align: center;
+    font-weight: 500;
+    margin-bottom: 10px;
+  }
   .el-card__body {
     width: 100%;
+    height: 100% !important;
     .left {
       > div {
         line-height: 3;
       }
     }
+    .el-row {
+      height: 100%;
+      width: 100%;
+    }
+    .el-col {
+      min-height: 500px;
+    }
+
     .right {
-      height: 450px;
+      height: 500px;
       width: 100%;
       iframe {
         width: 100%;
@@ -1147,4 +1140,7 @@ export default {
 .abalysisType {
   margin-top: 30px;
 }
+::v-deep .el-table th.el-table__cell > .cell {
+  display: block !important;
+}
 </style>

src/views/performance/components/map.vue

@@ -0,0 +1,139 @@
+<template>
+  <div class="map-ditu">
+    <Tmap
+      ref="map"
+      :windEngineGroupByFieldCodeDetail="windEngineGroupByFieldCodeDetail"
+    ></Tmap>
+  </div>
+</template>
+
+<script>
+import {
+  getWindEngineGroupByFieldCode,
+  getWindEngineGroupListByFieldCode,
+} from "@/api/ledger.js";
+import Tmap from "@/components/map";
+
+export default {
+  name: "Index",
+  components: {
+    Tmap,
+  },
+  data() {
+    return {
+      fieldCode: "",
+      batchCode: "",
+      windEngineGroupByFieldCodeDetail: {},
+    };
+  },
+  mounted() {
+    this.fieldCode = this.$route.query.fieldEngineCode;
+    this.batchCode = this.$route.query.batchCode;
+    // this.addMarkersAndZoom();
+  },
+  watch: {
+    fieldCode(newVal) {
+      if (newVal) {
+        this.GETfengji();
+      }
+    },
+  },
+
+  methods: {
+    GETfengji() {
+      let dataArr = {
+        fieldCode: this.fieldCode,
+        batchCode: this.batchCode,
+      };
+      getWindEngineGroupByFieldCode(dataArr).then((res) => {
+        const result = res.data;
+        this.windEngineGroupByFieldCodeDetail = result;
+        if (result !== null && result.anemometerTowerList) {
+          this.addMarkersAndZoom(result.anemometerTowerList, "5");
+        }
+        if (this.$route.query.fieldEngineCode) {
+          getWindEngineGroupListByFieldCode({
+            fieldCode: this.$route.query.fieldEngineCode,
+          }).then((windRes) => {
+            if (windRes.data) {
+              // 定义两个数组来存放不同errorState的元素
+              const errorStateFalse = [];
+              const errorStateTrue = [];
+              // 遍历数组并根据errorState的值将元素放入不同的数组中
+              windRes.data.forEach((item) => {
+                errorStateFalse.push({
+                  ...item,
+                  longitudeAndLatitudeString: `${item.longitude}00,${item.latitude}00`,
+                });
+              });
+
+              // 调用this.addMarkersAndZoom方法
+              if (errorStateFalse.length > 0) {
+                this.addMarkersAndZoom(errorStateFalse, "4");
+              }
+
+              if (errorStateTrue.length > 0) {
+                this.addMarkersAndZoom(errorStateTrue, "6");
+              }
+            }
+          });
+        }
+      });
+    },
+    parseCoordinates(input) {
+      if (input && typeof input === "string") {
+        return input.split(",").map(Number);
+      }
+      return [];
+    },
+    addMarkersAndZoom(data, type) {
+      console.log(data, type);
+      const dataMapList = data;
+      dataMapList.forEach((element) => {
+        console.log(element);
+        if (
+          this.parseCoordinates(element.longitudeAndLatitudeString).length > 0
+        ) {
+          this.$refs.map.addMarker({
+            point: this.parseCoordinates(element.longitudeAndLatitudeString),
+            val: type,
+            ...element,
+          });
+          // this.$refs.map.moveAndZoom({
+          //   point: this.parseCoordinates(element.longitudeAndLatitudeString),
+          //   zoom: 15,
+          // });
+          return;
+        }
+        this.$refs.map.clearMarkers();
+      });
+      // const points = [
+      //   { point: [120.2, 30.35], val: "4" },
+      //   { point: [120.21, 30.35], val: "5" },
+      // ];
+
+      // // Add markers to the map
+      // points.forEach((point) => {
+      //   this.$refs.map.addMarker(point);
+      // });
+
+      // // Zoom to a specific point
+      const zoomPoint = {
+        point: this.parseCoordinates(
+          this.windEngineGroupByFieldCodeDetail.windEngineGroupVoList[0]
+            .longitudeAndLatitudeString
+        ),
+        zoom: 15,
+      };
+      this.$refs.map.moveAndZoom(zoomPoint);
+    },
+  },
+};
+</script>
+
+<style lang="scss" scoped>
+.map-ditu {
+  height: 93vh;
+  position: relative;
+}
+</style>

src/views/performance/editAssets.vue

@@ -1,7 +1,7 @@
 <!--
  * @Author: your name
  * @Date: 2024-05-27 09:26:31
- * @LastEditTime: 2024-07-15 13:35:47
+ * @LastEditTime: 2024-08-05 09:59:55
  * @LastEditors: bogon
  * @Description: In User Settings Edit
  * @FilePath: /performance-test/src/views/performance/editAssets.vue