From f27ca082eb0a839449dd50c49007b58e5ed6946f Mon Sep 17 00:00:00 2001
From: 罗广辉 <guanghui.luo@foxmail.com>
Date: Thu, 19 Jun 2025 19:08:01 +0800
Subject: [PATCH] feat: 服务名修改
---
src/pages/page-web/projects/components/route-edit/index.vue | 128 +++++++++++++++++++++++++++++++++++-------
1 files changed, 105 insertions(+), 23 deletions(-)
diff --git a/src/pages/page-web/projects/components/route-edit/index.vue b/src/pages/page-web/projects/components/route-edit/index.vue
index b9955d6..f82f8d4 100644
--- a/src/pages/page-web/projects/components/route-edit/index.vue
+++ b/src/pages/page-web/projects/components/route-edit/index.vue
@@ -59,18 +59,28 @@
</a-tooltip>
<contextMenu :menu="[{ title: '删除航点', value: { index, item } }]">
<div class="graph-right">
- <div v-for="(event, index) in item.eventList" :key="index" class="s-event-icon">
+ <div
+ v-for="(event, eIndex) in item.eventList"
+ :key="eIndex"
+ :class="[
+ 's-event-icon',
+ selectedPointAndAction.selectedPoint === index &&
+ selectedPointAndAction.selectedAction === event?.key &&
+ 'active-event',
+ ]"
+ @click="selectionEvent(event, index)">
<a-tooltip placement="top">
<template #title>
- {{ event.name }}
+ {{ event?.name }}
</template>
- <img :src="event.icon" alt="icon" />
+ <img :src="event?.icon" alt="icon" />
</a-tooltip>
</div>
</div>
</contextMenu>
</li>
</ul>
+ <startPointTips v-if="xmlTemplate.missionConfig?.takeOffRefPoint['#text'] === ''" />
</div>
</template>
@@ -85,6 +95,7 @@
import { useMyStore } from '/@/store'
import useMapDraw, { kmlEntities as globalEntities, selectPointIndex as pointIdx } from '/@/utils/cesium/use-map-draw'
import contextMenu from './components/content-menu.vue'
+import startPointTips from './components/setting-point-tip.vue'
const store = useMyStore()
const { appContext }: any = getCurrentInstance()
const global = appContext.config.globalProperties
@@ -175,7 +186,9 @@
deep: true,
},
)
-
+ store.commit('SET_WAYLINE_INFO', {
+ isShow: true,
+ })
kmlEntities.value = entities.value
if (!mouseRightClickEvent) {
// 添加右键事件
@@ -186,8 +199,27 @@
// 新建航线初始化
const initCreateRoute = () => {
mapDraw = useMapDraw('', [], '', global)
- const xml = kmzUtils.generateXML(xmlTemplate.value)
- mapDraw.drawWayline([], xml)
+ const { drawWayline, waylineDetails: details, waylinePointsEvent, kmlEntities: entities, clearWaylineData } = mapDraw
+ clearWaylineData()
+ drawWayline()
+ waylineDetails.value = details
+ tragetPointArr.value = waylinePointsEvent.value
+ watch(
+ () => waylinePointsEvent.value,
+ (val) => {
+ tragetPointArr.value = val
+ },
+ {
+ deep: true,
+ },
+ )
+ kmlEntities.value = entities.value
+ // const xml = kmzUtils.generateXML(xmlTemplate.value)
+ // mapDraw.drawWayline([], xml)
+ if (!mouseRightClickEvent) {
+ // 添加右键事件
+ addMapPointEvent()
+ }
}
// 创建广告牌
@@ -217,17 +249,18 @@
const selectPointIndex = ref<string | number | any>(null)
const pointSelect = (value: tragetPoint, index: number) => {
removeCesiumChildDom(popupDom)
- if (selectPointIndex.value === index) {
- global.$viewer.entities.remove(prevPointEntity)
- global.$viewer.entities.remove(nextPointEntity)
- kmlEntities.value.forEach((entity: Cesium.Entity | any, i: number) => {
- entity.billboard.image = createBillboard(i + 1, '#61d396')
- entity.label.show = false
- })
- selectPointIndex.value = null
- pointIdx.value = null
- return
- }
+ // if (selectPointIndex.value === index) {
+ // global.$viewer.entities.remove(prevPointEntity)
+ // global.$viewer.entities.remove(nextPointEntity)
+ // kmlEntities.value.forEach((entity: Cesium.Entity | any, i: number) => {
+ // entity.billboard.image = createBillboard(i + 1, '#61d396')
+ // entity.label.show = false
+ // })
+ // selectPointIndex.value = null
+ // pointIdx.value = null
+ // store.commit('SET_WAYLINE_INFO', {})
+ // return
+ // }
if (prevPointEntity) {
global.$viewer.entities.remove(prevPointEntity)
}
@@ -273,6 +306,15 @@
entity.label.show = false
}
})
+ // 默认选中第一个事件
+ // if (selectPointIndex.value !== index) {
+ // store.commit('SET_WAYLINE_INFO', {
+ // selectedPoint: index,
+ // // 默认选中第一个
+ // selectedAction: value.eventList[0],
+ // })
+ // selectionEvent(value.eventList[0], index)
+ // }
selectPointIndex.value = index
pointIdx.value = index
}
@@ -287,6 +329,7 @@
removeCesiumChildDom(popupDom)
const { position } = click
const { x, y } = position
+ const createTakeOffPointEvent = [{ class: 'start-point', title: '设置参考起飞点' }]
const pointEvents = [
{
class: 'add-prev-point',
@@ -298,7 +341,12 @@
},
]
const defaultEvents = [{ class: 'finally-point', title: '在最后航点新增航点' }]
- const events = selectPointIndex.value !== null ? [...defaultEvents, ...pointEvents] : defaultEvents
+ let events = []
+ if (xmlTemplate.value.missionConfig?.takeOffRefPoint['#text'] === '') {
+ events = createTakeOffPointEvent
+ } else {
+ events = selectPointIndex.value !== null ? [...defaultEvents, ...pointEvents] : defaultEvents
+ }
popupDom = createPointPopupDom(events)
global.$viewer.container.appendChild(popupDom)
popupDom.style.transform = `translate3d(${x}px, ${y}px, 0)`
@@ -398,6 +446,14 @@
},
isRisky: { '#text': 0 },
}
+ // 添加参考点
+ if (className === 'start-point') {
+ // 默认高度为6
+ const height = 6
+ const takeOffPoint = [latitude, longitude, height]
+ xmlTemplate.value.missionConfig.takeOffRefPoint['#text'] = takeOffPoint.join(',')
+ }
+ // 添加航点
if (className === 'finally-point') {
globalEntities.value.push(entity)
xmlTemplate.value.Folder.Placemark.push(setting)
@@ -495,10 +551,27 @@
},
)
+// 选中事件
+const selectedPointAndAction = reactive<{
+ selectedPoint: number | null
+ selectedAction: any | null
+}>({
+ selectedPoint: null,
+ selectedAction: null,
+})
+const selectionEvent = (action: any, index: number) => {
+ const params = {
+ selectedPoint: index,
+ selectedAction: action,
+ }
+ selectedPointAndAction.selectedPoint = index
+ selectedPointAndAction.selectedAction = action.key
+ store.commit('SET_WAYLINE_INFO', params)
+}
+
onMounted(() => {
// 清空画布
clearCesiumMap()
- console.log(!!filePath.value)
if (filePath.value) {
initDrawRoute()
} else {
@@ -513,8 +586,6 @@
clearCesiumMap()
store.commit('SET_WAYLINE_INFO', {
isShow: false,
- wayline: {},
- position: null,
})
})
</script>
@@ -655,16 +726,27 @@
align-items: center;
.s-event-icon {
- width: 25px;
- height: 25px;
+ width: 20px;
+ height: 20px;
display: flex;
justify-content: center;
align-items: center;
+ border-radius: 2px;
+ margin-right: 3px;
+ overflow: hidden;
+
+ &:hover {
+ background-color: #409eff;
+ }
img {
width: 70%;
}
}
+
+ .active-event {
+ background-color: #409eff;
+ }
}
&:hover {
--
Gitblit v1.9.3