From 0dbc8ccb227a5082f19d689444cc3c57809200f5 Mon Sep 17 00:00:00 2001 From: menghao <1584479611@qq.com> Date: Mon, 26 Jan 2026 19:52:33 +0800 Subject: [PATCH] =?UTF-8?q?1=E5=88=AB=E6=8B=89?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- ruoyi-ui/src/views/cesiumMap/index.vue | 7 ++- ruoyi-ui/src/views/childRoom/index.vue | 88 +++++++++++++++++++--------------- ruoyi-ui/vue.config.js | 2 +- 3 files changed, 56 insertions(+), 41 deletions(-) diff --git a/ruoyi-ui/src/views/cesiumMap/index.vue b/ruoyi-ui/src/views/cesiumMap/index.vue index 21e7bc9..735b177 100644 --- a/ruoyi-ui/src/views/cesiumMap/index.vue +++ b/ruoyi-ui/src/views/cesiumMap/index.vue @@ -241,13 +241,18 @@ export default { }, renderRouteWaypoints(waypoints, routeId = 'default') { + console.log('renderRouteWaypoints被调用，航点数据:', waypoints); + console.log('航点数量:', waypoints ? waypoints.length : 0); if (!waypoints || waypoints.length < 1) return; const positions = []; // 1. 遍历并绘制航点标记 waypoints.forEach((wp, index) => { + console.log(`处理航点${index}:`, wp); + console.log(`航点${index}的字段:`, Object.keys(wp)); const lon = parseFloat(wp.lng); const lat = parseFloat(wp.lat); - const pos = Cesium.Cartesian3.fromDegrees(lon, lat, parseFloat(wp.alt || 500)); + console.log(`航点${index}坐标:`, {lon, lat, alt: wp.altitude || wp.alt}); + const pos = Cesium.Cartesian3.fromDegrees(lon, lat, parseFloat(wp.altitude || wp.alt || 500)); positions.push(pos); this.viewer.entities.add({ diff --git a/ruoyi-ui/src/views/childRoom/index.vue b/ruoyi-ui/src/views/childRoom/index.vue index eae1084..333a82b 100644 --- a/ruoyi-ui/src/views/childRoom/index.vue +++ b/ruoyi-ui/src/views/childRoom/index.vue @@ -618,21 +618,21 @@ export default { }, /** 弹窗点击“确定”：正式将数据保存到后端数据库 */ async confirmSaveNewRoute() { - // 严格校验起名逻辑 + // 1. 严格校验 if (!this.newRouteName || this.newRouteName.trim() === '') { this.$message.error('新增航线未命名，请输入名称后保存！'); return; } - // 获取当前选中的方案 ID const currentScenarioId = this.selectedPlanId; if (!currentScenarioId) { this.$message.warning('请先在左侧选择一个方案，再保存航线！'); return; } - // 构造符合后端 Routes 实体类的数据结构 + + // 2. 构造数据 const routeData = { callSign: this.newRouteName, - scenarioId: currentScenarioId || 1, // 使用当前选中的方案ID，默认1 + scenarioId: currentScenarioId, platformId: 1, attributes: "{}", waypoints: this.tempMapPoints.map((p, index) => ({ @@ -645,45 +645,55 @@ export default { turnAngle: 0.0 })) }; + try { + const response = await addRoutes(routeData); + if (response.code === 200) { + this.$message.success('航线及其航点已成功保存至当前方案'); - try { - // 调用后端 API 保存到数据库 - const response = await addRoutes(routeData); - if (response.code === 200) { - this.$message.success('航线及其航点已成功保存至当前方案'); - // 获取后端生成的正式 ID - const savedRoute = response.data; - const newRouteId = savedRoute ? savedRoute.id : null; - if (this.$refs.cesiumMap) { - this.$refs.cesiumMap.clearRoute(); - // 如果拿到了正式 ID，则按照“正式航线”的规则渲染一次 - if (newRouteId) { - if (!this.activeRouteIds.includes(savedRoute.id)) { - this.activeRouteIds.push(savedRoute.id); - } - // 更新当前详情，确保右侧下方航点列表立刻显示 - this.selectedRouteDetails = { - id: newRouteId, - name: this.newRouteName, - waypoints: routeData.waypoints - }; - //使用正式 ID 渲染点和线 - this.$refs.cesiumMap.renderRouteWaypoints(routeData.waypoints, newRouteId); + const savedRoute = response.data; + const newRouteId = savedRoute ? savedRoute.id : null; + + // 1. 立即停止绘制并清除临时线（不要用 clearRoute） + if (this.$refs.cesiumMap) { + this.drawDom = false; + if (this.$refs.cesiumMap.clearTempRoute) this.$refs.cesiumMap.clearTempRoute(); } + + // 2. 先执行刷新列表，同步后端数据库状态 + await this.getList(); + + // 3. 在列表刷新后的“下一帧”执行选中和渲染逻辑 + this.$nextTick(async () => { + if (newRouteId) { + // 确保新 ID 在激活列表中（触发右侧勾选 UI） + if (!this.activeRouteIds.includes(newRouteId)) { + this.activeRouteIds.push(newRouteId); + } + + // 重新锁定选中详情，防止被 getList 重置为空 + this.selectedRouteId = newRouteId; + this.selectedRouteDetails = { + id: newRouteId, + name: this.newRouteName, + waypoints: routeData.waypoints + }; + + // 显式执行连线渲染 + if (this.$refs.cesiumMap) { + this.$refs.cesiumMap.renderRouteWaypoints(routeData.waypoints, newRouteId); + } + } + }); + + // 4. 重置弹窗 UI + this.showNameDialog = false; + this.newRouteName = ''; + this.tempMapPoints = []; } - // 重置 UI 状态 - this.showNameDialog = false; - this.drawDom = false; - this.newRouteName = ''; - this.tempMapPoints = []; - // 重新拉取右侧航线列表以保持同步 - await this.getList(); + } catch (error) { + console.error("保存失败:", error); } - } catch (error) { - console.error("保存航线失败:", error); - this.$message.error('保存失败，请检查后端服务'); - } - }, + }, // 航点编辑弹窗相关方法 openWaypointDialog(waypoint) { this.selectedWaypoint = waypoint; diff --git a/ruoyi-ui/vue.config.js b/ruoyi-ui/vue.config.js index 0488a18..25854e2 100644 --- a/ruoyi-ui/vue.config.js +++ b/ruoyi-ui/vue.config.js @@ -10,7 +10,7 @@ const CompressionPlugin = require('compression-webpack-plugin') const CopyWebpackPlugin = require('copy-webpack-plugin') const name = process.env.VUE_APP_TITLE || '若依管理系统' // 网页标题 -const baseUrl = 'http://192.168.50.145:8080' // 后端接口 +const baseUrl = 'http://127.0.0.1:8080' // 后端接口 const port = process.env.port || process.env.npm_config_port || 80 // 端口 // 定义 Cesium 源码路径