diff --git a/ruoyi-ui/src/views/childRoom/RightPanel.vue b/ruoyi-ui/src/views/childRoom/RightPanel.vue index 2b32a52..4548af8 100644 --- a/ruoyi-ui/src/views/childRoom/RightPanel.vue +++ b/ruoyi-ui/src/views/childRoom/RightPanel.vue @@ -359,6 +359,7 @@ export default { this.$emit('hide') }, + // 新建航线事件 handleSelectPlan(plan) { this.$emit('select-plan', plan) }, diff --git a/ruoyi-ui/src/views/childRoom/index.vue b/ruoyi-ui/src/views/childRoom/index.vue index 333a82b..de860aa 100644 --- a/ruoyi-ui/src/views/childRoom/index.vue +++ b/ruoyi-ui/src/views/childRoom/index.vue @@ -569,7 +569,6 @@ export default { } }, /** 从数据库拉取最新的航线列表数据 */ - /** 从数据库拉取最新的数据 */ async getList() { try { // 1. 获取所有方案 @@ -618,21 +617,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; } - - // 2. 构造数据 + // 构造符合后端 Routes 实体类的数据结构 const routeData = { callSign: this.newRouteName, - scenarioId: currentScenarioId, + scenarioId: currentScenarioId || 1, // 使用当前选中的方案ID,默认1 platformId: 1, attributes: "{}", waypoints: this.tempMapPoints.map((p, index) => ({ @@ -645,55 +644,45 @@ export default { turnAngle: 0.0 })) }; - try { - const response = await addRoutes(routeData); - if (response.code === 200) { - this.$message.success('航线及其航点已成功保存至当前方案'); - - 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); - } + 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); } - }); - - // 4. 重置弹窗 UI - this.showNameDialog = false; - this.newRouteName = ''; - this.tempMapPoints = []; + // 更新当前详情,确保右侧下方航点列表立刻显示 + this.selectedRouteDetails = { + id: newRouteId, + name: this.newRouteName, + waypoints: routeData.waypoints + }; + //使用正式 ID 渲染点和线 + this.$refs.cesiumMap.renderRouteWaypoints(routeData.waypoints, newRouteId); + } } - } catch (error) { - console.error("保存失败:", error); + // 重置 UI 状态 + this.showNameDialog = false; + this.drawDom = false; + this.newRouteName = ''; + this.tempMapPoints = []; + // 重新拉取右侧航线列表以保持同步 + await this.getList(); } - }, + } catch (error) { + console.error("保存航线失败:", error); + this.$message.error('保存失败,请检查后端服务'); + } + }, // 航点编辑弹窗相关方法 openWaypointDialog(waypoint) { this.selectedWaypoint = waypoint; @@ -1374,23 +1363,23 @@ export default { } if (this.selectedRouteDetails && this.selectedRouteDetails.id === route.id) { if (this.activeRouteIds.length > 0) { - const lastId = this.activeRouteIds[this.activeRouteIds.length - 1]; - getRoutes(lastId).then(res => { - if (res.code === 200 && res.data) { - this.selectedRouteId = res.data.id; - this.selectedRouteDetails = { - id: res.data.id, - name: res.data.callSign, - waypoints: res.data.waypoints || [] - }; - } - }).catch(e => { - console.error("获取航线详情失败", e); - }); - } else { - this.selectedRouteId = null; - this.selectedRouteDetails = null; + const lastId = this.activeRouteIds[this.activeRouteIds.length - 1]; + getRoutes(lastId).then(res => { + if (res.code === 200 && res.data) { + this.selectedRouteId = res.data.id; + this.selectedRouteDetails = { + id: res.data.id, + name: res.data.callSign, + waypoints: res.data.waypoints || [] + }; } + }).catch(e => { + console.error("获取航线详情失败", e); + }); + } else { + this.selectedRouteId = null; + this.selectedRouteDetails = null; + } } this.$message.info(`已隐藏航线: ${route.name}`); } else {