常规上传

src/views/cesiumComponents/windMap2D.vue

@@ -70,8 +70,10 @@
       v-if="showWindDetail"
       @coverOnChange="coverOnChange"
       :currentHeight="currentHeight"
+      :fjLonLatJsonArr="fjLonLatJsonArr.data"
       @showDetail="menuComTSty"
       @backStations="backStations"
+      @resetChangeWind="resetChangeWind"
       @initView="resetWindViewport"
     />
   </div>
@@ -163,6 +165,7 @@ export default {
           name: "JNSMS",
         },
       ],
+      fjLonLatJsonArr: [],
       viewer: null,
       windLayer: null, // 风场图
       windLayerTimmer: null, // 风场图计时器
@@ -314,6 +317,22 @@ export default {
       // this.initCesium();
       // this.showAllStation(this.viewer)
     },
+    resetChangeWind(data) {
+      let that = this;
+      that.viewer.camera.flyTo({
+        destination: Cesium.Cartesian3.fromDegrees(
+          data.longitude,
+          data.latitude,
+          1000
+        ),
+        orientation: {
+          heading: Cesium.Math.toRadians(0),
+          pitch: Cesium.Math.toRadians(-90),
+          roll: 0.0,
+        },
+        duration: 3.0,
+      });
+    },
     // 展示所有风场
     showAllStation(viewer) {
       allStationJson.station.forEach((e, index) => {
@@ -373,6 +392,7 @@ export default {
     showWindFromStation(viewer) {
       let stationName = this.$route.query.nameEn;
       let fjLonLatJson = [];
+      this.fjLonLatJsonArr = []
       if (stationName === "MYFDC") {
         fjLonLatJson = fjMYLonLatJson;
       } else if (stationName === "JNWHZ") {
@@ -382,6 +402,7 @@ export default {
       } else if (stationName === "JNSMS") {
         fjLonLatJson = fjSMSLonLatJson;
       }
+      this.fjLonLatJsonArr = fjLonLatJson
       fjLonLatJson.data.forEach((e, index) => {
         if (e.status) {
           if (e.status === 1) {

src/views/cesiumComponents/windMap3D.vue

@@ -71,8 +71,10 @@
       :cesiumViewer="viewer"
       @coverOnChange="coverOnChange"
       :currentHeight="currentHeight"
+      :fjLonLatJsonArr="fjLonLatJsonArr.data"
       @showDetail="menuComTSty"
       @backStations="backStations"
+      @resetChangeWind="resetChangeWind"
       @initView="resetWindViewport"
     />
   </div>
@@ -149,6 +151,7 @@ export default {
           name: "JNSMS",
         },
       ],
+      fjLonLatJsonArr: [],
       loading: true,
       viewer: null,
       windLayer: null, // 风场图
@@ -401,6 +404,22 @@ export default {
       // this.initCesium();
       this.showAllStation(this.viewer);
     },
+    resetChangeWind(data) {
+      let that = this;
+      that.viewer.camera.flyTo({
+        destination: Cesium.Cartesian3.fromDegrees(
+          data.longitude,
+          data.latitude-0.02,
+          1000
+        ),
+        orientation: {
+          heading: Cesium.Math.toRadians(0),
+          pitch: Cesium.Math.toRadians(-30),
+          roll: 0.0,
+        },
+        duration: 3.0,
+      });
+    },
     // 展示所有风场
     showAllStation(viewer) {
       allStationJson.station.forEach((e, index) => {
@@ -460,6 +479,7 @@ export default {
     showWindFromStation(viewer) {
       let stationName = this.$route.query.nameEn;
       let fjLonLatJson = [];
+      this.fjLonLatJsonArr = []
       if (stationName === "MYFDC") {
         fjLonLatJson = fjMYLonLatJson;
       } else if (stationName === "JNWHZ") {
@@ -469,6 +489,7 @@ export default {
       } else if (stationName === "JNSMS") {
         fjLonLatJson = fjSMSLonLatJson;
       }
+      this.fjLonLatJsonArr = fjLonLatJson
       fjLonLatJson.data.forEach((e, index) => {
         this.showStatuswind(viewer, e);
       });

src/views/cesiumComponents/windView.vue

@@ -7,20 +7,45 @@
         </div>
       </aside>
       <aside class="sidebar-left-top btnms2">
-        <div class="stat-block-lefttop" @click="showMessages">
-          <p class="label" v-if="showMessagesB">隐藏详情</p>
-          <p class="label" v-else>查看详情</p>
+        <div class="stat-block-lefttop" @click="showWeatherMes">
+          <p class="label" v-if="showWeatherDB">隐藏天气详情</p>
+          <p class="label" v-else>查看天气详情</p>
         </div>
       </aside>
       <aside class="sidebar-left-top btnms3">
-        <div class="stat-block-lefttop" @click="initView">
-          <p class="label">初始化</p>
+        <div class="stat-block-lefttop" @click="showWindMes">
+          <p class="label" v-if="showWindDB">隐藏风机详情</p>
+          <p class="label" v-else>查看风机详情</p>
         </div>
       </aside>
     </div>
+    <div class="btnms">
+        <aside class="sidebar-left-top btnms4">
+            <!-- <div class="stat-block-lefttop" @click="initView">
+            <p class="label">初始化</p>
+            </div> -->
+            <el-select
+                class="windSty"
+                v-model="windvalue"
+                filterable
+                clearable
+                placeholder="选择风机"
+                size="small"
+                style="width: 250px"
+                @change="switchWind"
+            >
+                <el-option
+                v-for="(item, index) in fjLonLatJsonArr"
+                :key="index"
+                :label="item.name"
+                :value="index"
+                />
+            </el-select>
+        </aside>
+    </div>
 
     <!-- Left Sidebar -->
-    <aside class="sidebar-left panel" v-if="showMessagesB">
+    <aside class="sidebar-left panel" v-if="showWindDB">
       <div class="stat-block">
         <p class="label">总装机容量：</p>
         <p class="value">
@@ -74,7 +99,7 @@
         <p class="value">1258天</p>
       </div>
     </aside>
-    <aside class="sidebar-left2 panel" v-if="showMessagesB">
+    <aside class="sidebar-left2 panel" v-if="showWeatherDB">
       <div class="stat-block2">
         <span class="labels">数据 </span>
         <span class="values"
@@ -210,7 +235,7 @@
         </div>
       </div>
     </aside>
-    <aside class="sidebar-right panel" v-if="showMessagesB">
+    <aside class="sidebar-right panel" v-if="showWindDB">
       <div class="info-section">
         <h3>风场信息</h3>
         <div class="info-item">
@@ -503,7 +528,7 @@
             </div> -->
     </aside>
     <!-- Bottom Bar -->
-    <div class="bottom-bar" v-if="showWindDetail && showMessagesB">
+    <div class="bottom-bar" v-if="showWindDetail">
       <!-- 损失电量 -->
       <div class="panel">
         <div class="indicator-title">
@@ -798,6 +823,12 @@ export default {
       type: Number,
       default: 0,
     },
+    fjLonLatJsonArr: {
+        type: Array,
+        default: () => {
+            return []
+        },
+    },
     cesiumViewer: {
       type: Object,
       default: () => {
@@ -832,7 +863,9 @@ export default {
       xd,
       lx,
       sl,
-      showMessagesB: true,
+      windvalue: "",
+      showWindDB: true,
+      showWeatherDB:true,
       progressHeight: 0,
       progressPoint: 0,
       windmodelArr: [
@@ -966,6 +999,10 @@ export default {
   },
 
   methods: {
+    switchWind(value) {
+        let data = this.fjLonLatJsonArr[value]
+        this.$emit("resetChangeWind", data)
+    },
     getViewerClock() {
       let currentTime = 0;
       if (this?.viewer?.clock?.currentTime) {
@@ -1056,8 +1093,11 @@ export default {
         path: "/",
       });
     },
-    showMessages() {
-      this.showMessagesB = !this.showMessagesB;
+    showWeatherMes() {
+      this.showWeatherDB = !this.showWeatherDB;
+    },
+    showWindMes() {
+      this.showWindDB = !this.showWindDB;
     },
     initView() {
         this.$emit("initView")
@@ -1300,16 +1340,23 @@ export default {
 }
 .btnms1 {
   left: 20px;
+  top: 80px;
 }
 .btnms2 {
-  left: 90px;
+  left: 75px;
+  top: 80px;
 }
 .btnms3{
-    left: 192px;
+    left: 186px;
+    top: 80px;
+}
+.btnms4{
+    left: 20px;
+    top: 120px;
+    
 }
 .sidebar-left-top {
-  top: 110px;
-  padding: 5px 15px;
+  padding: 3px 10px;
   border-radius: 8px;
   backdrop-filter: blur(10px);
   border: 1px solid rgba(255, 255, 255, 0.2);
@@ -1324,7 +1371,7 @@ export default {
   text-align: center;
   cursor: pointer;
   .label {
-    font-size: 16px;
+    font-size: 14px;
     color: #fff;
   }
 }
@@ -1699,6 +1746,19 @@ export default {
 }
 </style>
 <style lang="less">
+.windSty{
+    .el-select__wrapper{
+        background: transparent !important;
+        box-shadow: none;
+    }
+    .is-hovering:not(.is-focused){
+        background: transparent !important;
+        box-shadow: none;
+    }
+    .el-select__placeholder {
+        color: #fff !important;
+    }
+}
 .currentSlider {
   .el-slider__runway {
     background: linear-gradient(