航点定位

ruoyi-ui/src/views/cesiumMap/index.vue

@@ -60,6 +60,9 @@ import ContextMenu from './ContextMenu.vue'
 import axios from 'axios'
 import request from '@/utils/request'
 import { getToken } from '@/utils/auth'
+import { listScenario } from '@/api/system/scenario'
+import { listRoutes } from '@/api/system/routes'
+import { listWaypoints } from '@/api/system/waypoints'
 export default {
   name: 'CesiumMap',
   props: {
@@ -138,7 +141,14 @@ export default {
       coordinatesText: '经度: --, 纬度: --',
       // 比例尺（高德风格）
       scaleBarText: '--',
-      scaleBarWidthPx: 80
+      scaleBarWidthPx: 80,
+      // 定位相关
+      scenarioList: [],
+      routeList: [],
+      waypointList: [],
+      selectedScenario: null,
+      selectedRoute: null,
+      selectedWaypoint: null
     }
   },
   components: {
@@ -2706,12 +2716,187 @@ export default {
         })
       }
     },
-    handleLocate() {
+    async handleLocate() {
       const h = this.$createElement
+      
+      // 每次打开弹窗时重置所有状态
+      this.scenarioList = []
+      this.routeList = []
+      this.waypointList = []
+      this.selectedScenario = null
+      this.selectedRoute = null
+      this.selectedWaypoint = null
+      
+      try {
+        const scenarioRes = await listScenario({})
+        this.scenarioList = scenarioRes.rows || []
+      } catch (error) {
+        console.error('加载方案列表失败:', error)
+      }
+      
+      const getSelectByClass = (className) => {
+        return document.querySelector(`.${className}`)
+      }
+      
+      const resetSelects = () => {
+        const scenarioSelect = getSelectByClass('scenario-select')
+        const routeSelect = getSelectByClass('route-select')
+        const waypointSelect = getSelectByClass('waypoint-select')
+        
+        if (scenarioSelect) scenarioSelect.value = ''
+        if (routeSelect) {
+          routeSelect.disabled = true
+          routeSelect.innerHTML = '<option value="">请选择航线</option>'
+        }
+        if (waypointSelect) {
+          waypointSelect.disabled = true
+          waypointSelect.innerHTML = '<option value="">请选择航点</option>'
+        }
+      }
+      
+      const handleScenarioChange = async (e) => {
+        const value = parseInt(e.target.value)
+        console.log('方案变化:', value)
+        this.selectedScenario = value
+        this.selectedRoute = null
+        this.selectedWaypoint = null
+        this.routeList = []
+        this.waypointList = []
+        
+        const routeSelect = getSelectByClass('route-select')
+        const waypointSelect = getSelectByClass('waypoint-select')
+        
+        if (routeSelect) {
+          routeSelect.disabled = true
+          routeSelect.innerHTML = '<option value="">请选择航线</option>'
+        }
+        
+        if (waypointSelect) {
+          waypointSelect.disabled = true
+          waypointSelect.innerHTML = '<option value="">请选择航点</option>'
+        }
+        
+        if (value) {
+          try {
+            const routeRes = await listRoutes({ scenarioId: value })
+            this.routeList = routeRes.rows || []
+            console.log('航线列表:', this.routeList)
+            
+            if (routeSelect) {
+              routeSelect.disabled = false
+              routeSelect.innerHTML = '<option value="">请选择航线</option>'
+              this.routeList.forEach(item => {
+                const option = document.createElement('option')
+                option.value = item.id
+                option.textContent = item.callSign
+                routeSelect.appendChild(option)
+              })
+            }
+          } catch (error) {
+            console.error('加载航线列表失败:', error)
+          }
+        }
+      }
+      
+      const handleRouteChange = async (e) => {
+        const value = parseInt(e.target.value)
+        console.log('航线变化:', value)
+        this.selectedRoute = value
+        this.selectedWaypoint = null
+        this.waypointList = []
+        
+        const waypointSelect = getSelectByClass('waypoint-select')
+        
+        if (waypointSelect) {
+          waypointSelect.disabled = true
+          waypointSelect.innerHTML = '<option value="">请选择航点</option>'
+        }
+        
+        if (value) {
+          try {
+            const waypointRes = await listWaypoints({ routeId: value })
+            this.waypointList = waypointRes.rows || []
+            console.log('航点列表:', this.waypointList)
+            
+            if (waypointSelect) {
+              waypointSelect.disabled = false
+              waypointSelect.innerHTML = '<option value="">请选择航点</option>'
+              this.waypointList.forEach(item => {
+                const option = document.createElement('option')
+                option.value = item.id
+                option.textContent = `${item.name} (${item.lng}, ${item.lat})`
+                waypointSelect.appendChild(option)
+              })
+            }
+          } catch (error) {
+            console.error('加载航点列表失败:', error)
+          }
+        }
+      }
+      
+      const handleWaypointChange = (e) => {
+        const value = parseInt(e.target.value)
+        console.log('航点变化:', value)
+        this.selectedWaypoint = value
+        const waypoint = this.waypointList.find(w => w.id === value)
+        if (waypoint) {
+          const lngInput = document.querySelector('input[placeholder="例如 116.40"]')
+          const latInput = document.querySelector('input[placeholder="例如 39.90"]')
+          if (lngInput) lngInput.value = waypoint.lng
+          if (latInput) latInput.value = waypoint.lat
+          console.log('填充经纬度:', waypoint.lng, waypoint.lat)
+        }
+      }
+      
       this.$msgbox({
         title: '定位',
         message: h('div', {style: 'padding: 10px 0;'}, [
           h('div', {style: 'margin-bottom: 15px;'}, [
+            h('label', {style: 'display: block; margin-bottom: 5px; color: #606266;'}, '方案：'),
+            h('select', {
+              attrs: {
+                class: 'scenario-select',
+                style: 'width: 100%; padding: 8px; border: 1px solid #dcdfe6; border-radius: 4px; box-sizing: border-box;'
+              },
+              on: {
+                change: handleScenarioChange
+              }
+            }, [
+              h('option', { attrs: { value: '' } }, '请选择方案'),
+              ...this.scenarioList.map(item => h('option', { attrs: { value: item.id } }, item.name))
+            ])
+          ]),
+          h('div', {style: 'margin-bottom: 15px;'}, [
+            h('label', {style: 'display: block; margin-bottom: 5px; color: #606266;'}, '航线：'),
+            h('select', {
+              attrs: {
+                class: 'route-select',
+                disabled: true,
+                style: 'width: 100%; padding: 8px; border: 1px solid #dcdfe6; border-radius: 4px; box-sizing: border-box;'
+              },
+              on: {
+                change: handleRouteChange
+              }
+            }, [
+              h('option', { attrs: { value: '' } }, '请选择航线')
+            ])
+          ]),
+          h('div', {style: 'margin-bottom: 15px;'}, [
+            h('label', {style: 'display: block; margin-bottom: 5px; color: #606266;'}, '航点：'),
+            h('select', {
+              attrs: {
+                class: 'waypoint-select',
+                disabled: true,
+                style: 'width: 100%; padding: 8px; border: 1px solid #dcdfe6; border-radius: 4px; box-sizing: border-box;'
+              },
+              on: {
+                change: handleWaypointChange
+              }
+            }, [
+              h('option', { attrs: { value: '' } }, '请选择航点')
+            ])
+          ]),
+          h('div', {style: 'margin-bottom: 15px;'}, [
             h('label', {style: 'display: block; margin-bottom: 5px; color: #606266;'}, '经度：'),
             h('input', {
               attrs: {
@@ -2757,7 +2942,7 @@ export default {
             }
             if (this.viewer) {
               this.viewer.camera.flyTo({
-                destination: Cesium.Cartesian3.fromDegrees(lng, lat, 5000),
+                destination: Cesium.Cartesian3.fromDegrees(lng, lat, 100000),
                 orientation: {
                   heading: Cesium.Math.toRadians(0.0),
                   pitch: Cesium.Math.toRadians(-90.0),
@@ -2773,9 +2958,35 @@ export default {
             done()
           }
         }
+      }).then(() => {
+        // 弹窗关闭后重置所有选择状态
+        resetSelects()
       }).catch(() => {
         this.$message.info('已取消定位')
+        // 弹窗关闭后重置所有选择状态
+        resetSelects()
+      })
+    },
+    updateSelectOptions(refName, dataList, labelField) {
+      const select = document.querySelector(`select[ref="${refName}"]`)
+      if (!select) return
+      
+      const currentValue = select.value
+      select.innerHTML = ''
+      
+      const defaultOption = document.createElement('option')
+      defaultOption.value = ''
+      defaultOption.textContent = refName === 'routeSelect' ? '请选择航线' : '请选择航点'
+      select.appendChild(defaultOption)
+      
+      dataList.forEach(item => {
+        const option = document.createElement('option')
+        option.value = item.id
+        option.textContent = typeof labelField === 'function' ? labelField(item) : item[labelField]
+        select.appendChild(option)
       })
+      
+      select.value = currentValue
     },
     initScaleBar() {
       const that = this