From 1a87cadb084ab43c170d183bb7ea365175d8e853 Mon Sep 17 00:00:00 2001 From: djhk <2424552363@qq.com> Date: Wed, 15 Oct 2025 17:49:29 +0800 Subject: [PATCH] =?UTF-8?q?cesium=E5=9C=B0=E5=9B=BE=E6=B7=BB=E5=8A=A0?= =?UTF-8?q?=E7=94=BB=E7=A9=BA=E5=9F=9F=E7=9A=84=E5=B7=A5=E5=85=B7=E7=9A=84?= =?UTF-8?q?=E7=BC=96=E8=BE=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/views/cesiums/CesiumViewer.vue | 20 +- src/views/cesiums/DrawingToolPanel.vue | 395 +++++++++++++++++- .../cesiums/components/AirspaceEditor.ts | 388 +++++++++++++++++ src/views/cesiums/components/DrawingTool.ts | 53 +++ .../cesiums/components/useDrawingManager.ts | 65 ++- 5 files changed, 910 insertions(+), 11 deletions(-) create mode 100644 src/views/cesiums/components/AirspaceEditor.ts diff --git a/src/views/cesiums/CesiumViewer.vue b/src/views/cesiums/CesiumViewer.vue index b689b06..156123d 100644 --- a/src/views/cesiums/CesiumViewer.vue +++ b/src/views/cesiums/CesiumViewer.vue @@ -177,7 +177,12 @@ const { importAirspaceData, importFromFile, importFromGeoJSON, - getImportStatistics + getImportStatistics, + isEditing, + editingDrawing, + startEditing, + finishEditing, + cancelEditing, } = useDrawingManager(drawingTool); @@ -300,6 +305,19 @@ const showMessage = (message: string, type: 'success' | 'error' | 'info' = 'info }; onMounted(() => { + const handleKeyDown = (event: KeyboardEvent) => { + if (event.key === 'Escape') { + if (isEditing.value) { + cancelEditing(); + } + } + }; + + document.addEventListener('keydown', handleKeyDown); + + onUnmounted(() => { + document.removeEventListener('keydown', handleKeyDown); + }); // 开始跟踪相机信息 setTimeout(() => { startCameraTracking(); diff --git a/src/views/cesiums/DrawingToolPanel.vue b/src/views/cesiums/DrawingToolPanel.vue index e6a3ae4..89c3e5e 100644 --- a/src/views/cesiums/DrawingToolPanel.vue +++ b/src/views/cesiums/DrawingToolPanel.vue @@ -6,6 +6,29 @@
{{ getDrawingStatus() }}
+
+ ✏️ 编辑模式中 +
+ + + +
+

✏️ 编辑控制

+
+ + +
+

操作说明:

+

• 拖动控制点调整空域形状

+

• 圆形: 拖动红点移动圆心,蓝点调整半径

+

• 多边形: 拖动红点移动顶点

+

• 按 ESC 键取消编辑

+
+
@@ -41,7 +64,7 @@

绘制工具

-
+ +
+ + +
@@ -94,6 +140,9 @@ + @@ -103,15 +152,18 @@
- {{ drawing.type === 'circle' ? '⭕' : '🔷' }} - {{ drawing.type === 'circle' ? '圆形空域' : '多边形空域' }} + {{ drawing.type === 'circle' ? '⭕' : '🔷' }} + {{ drawing.type === 'circle' ? '圆形' : '多边形' }} + + 编辑中 +
-
+
半径: {{ (getCircleRadius(drawing) / 1000).toFixed(2) }}km @@ -121,7 +173,16 @@
+ +
@@ -291,6 +352,19 @@ const props = defineProps<{ drawingOptions: any; getDrawingStatus: () => string; getDrawingInfoText: () => string; + isEditing: boolean; + editingDrawing: any; + startCircleDrawing: () => void; + startPolygonDrawing: () => void; + cancelDrawing: () => void; + startEditing: (id: string) => void; + finishEditing: () => void; + cancelEditing: () => void; + selectDrawing: (id: string) => void; + removeDrawing: (id: string) => void; + flyToDrawing: (id: string) => void; + exportAllToJSON: () => void; + clearAllDrawings: () => void; }>(); const emit = defineEmits<{ @@ -310,6 +384,10 @@ const emit = defineEmits<{ 'print-all-drawings-info': []; 'print-drawing-info': [id: string]; 'export-drawing-info': [id: string]; + 'export-drawing': [id: string]; + 'start-editing': [id: string]; + 'finish-editing': []; + 'cancel-editing': []; }>(); const activeTab = ref<'circle' | 'polygon'>('circle'); @@ -327,9 +405,9 @@ const cancelDrawing = () => { emit('cancel-drawing'); }; -const selectDrawing = (id: string) => { - emit('select-drawing', id); -}; +// const selectDrawing = (id: string) => { +// emit('select-drawing', id); +// }; const removeDrawing = (id: string) => { emit('remove-drawing', id); @@ -342,7 +420,9 @@ const clearAllDrawings = () => { // 方法实现 const flyToDrawing = (id: string) => { console.log('点击飞向空域按钮:', id); - emit('fly-to-drawing', id); + // emit('fly-to-drawing', id); + console.log('点击飞向选中空域按钮'); + emit('fly-to-selected-drawing',id); }; @@ -385,6 +465,59 @@ const flyToSelectedDrawing = () => { emit('fly-to-selected-drawing'); }; +// 添加编辑控制方法 +const finishEditing = () => { + emit('finish-editing'); +}; + +const cancelEditing = () => { + emit('cancel-editing'); +}; + +// 修改所有编辑相关方法 +const toggleEdit = (id: string) => { + if (props.isEditing && props.editingDrawing?.id === id) { + emit('finish-editing'); + } else { + emit('start-editing', id); + } +}; + +const selectDrawing = (id: string) => { + if (props.isEditing) { + if (props.editingDrawing?.id !== id) { + emit('start-editing', id); + } + } else { + emit('select-drawing', id); + } +}; +// // 切换编辑状态 +// const toggleEdit = (id: string) => { +// if (props.isEditing && props.editingDrawing?.id === id) { +// props.finishEditing(); +// } else { +// props.startEditing(id); +// } +// }; + +// // 选择空域 +// const selectDrawing = (id: string) => { +// if (props.isEditing) { +// // 在编辑模式下,选择空域即开始编辑 +// if (props.editingDrawing?.id !== id) { +// props.startEditing(id); +// } +// } else { +// props.selectDrawing(id); +// } +// }; + +// 导出单个空域 +const exportDrawing = (id: string) => { + emit('export-drawing', id); +}; + // 工具函数 const getCircleRadius = (drawing: DrawingResult): number => { if (drawing.type !== 'circle' || drawing.positions.length < 2) return 0; @@ -593,5 +726,249 @@ const hexToColor = (hex: string): Cesium.Color => { border: 1px solid rgba(255, 255, 255, 0.1); } + +.drawing-tool-panel { + position: absolute; + top: 20px; + left: 20px; + background: rgba(42, 42, 42, 0.95); + color: white; + padding: 15px; + border-radius: 10px; + min-width: 280px; + max-height: 80vh; + overflow-y: auto; + backdrop-filter: blur(10px); + border: 1px solid rgba(255, 255, 255, 0.1); +} + +.status-indicators { + display: flex; + flex-direction: column; + gap: 5px; +} + +.drawing-status, .editing-status { + padding: 4px 8px; + border-radius: 12px; + font-size: 11px; + text-align: center; +} + +.drawing-status { + background: rgba(255, 255, 255, 0.1); + color: #ccc; +} + +.drawing-status.active { + background: rgba(24, 144, 255, 0.3); + color: #1890ff; +} + +.editing-status { + background: rgba(255, 152, 0, 0.3); + color: #ff9800; +} + +.edit-controls { + display: flex; + flex-direction: column; + gap: 10px; +} + +.edit-btn { + padding: 8px 12px; + border: 1px solid rgba(255, 255, 255, 0.2); + border-radius: 6px; + color: white; + cursor: pointer; + font-size: 12px; +} + +.save-btn { + background: rgba(76, 175, 80, 0.3); +} + +.save-btn:hover { + background: rgba(76, 175, 80, 0.5); +} + +.cancel-btn { + background: rgba(244, 67, 54, 0.3); +} + +.cancel-btn:hover { + background: rgba(244, 67, 54, 0.5); +} + +.edit-instructions { + background: rgba(255, 255, 255, 0.05); + padding: 10px; + border-radius: 6px; + font-size: 11px; + line-height: 1.4; +} + +.edit-instructions p { + margin: 5px 0; +} + +.section-header { + display: flex; + justify-content: space-between; + align-items: center; + margin-bottom: 10px; +} + +.icon-btn { + background: none; + border: none; + color: white; + cursor: pointer; + padding: 4px; + border-radius: 4px; + font-size: 14px; +} + +.icon-btn:hover { + background: rgba(255, 255, 255, 0.1); +} + +.drawings-list { + max-height: 300px; + overflow-y: auto; +} + +.drawing-item { + display: flex; + justify-content: space-between; + align-items: center; + padding: 8px; + margin-bottom: 5px; + background: rgba(255, 255, 255, 0.05); + border-radius: 6px; + cursor: pointer; + transition: all 0.2s ease; +} + +.drawing-item:hover { + background: rgba(255, 255, 255, 0.1); +} + +.drawing-item.active { + background: rgba(24, 144, 255, 0.2); + border: 1px solid #1890ff; +} + +.drawing-item.editing { + background: rgba(255, 152, 0, 0.2); + border: 1px solid #ff9800; +} + +.drawing-info { + flex: 1; +} + +.drawing-type { + display: flex; + align-items: center; + gap: 8px; + font-size: 12px; + font-weight: bold; + margin-bottom: 4px; +} + +.drawing-type .icon { + font-size: 14px; +} + +.editing-badge { + background: #ff9800; + color: white; + padding: 2px 6px; + border-radius: 8px; + font-size: 10px; +} + +.drawing-details { + font-size: 11px; + color: #ccc; +} + +.drawing-actions { + display: flex; + gap: 4px; +} + +.action-btn { + background: none; + border: none; + color: white; + cursor: pointer; + padding: 4px; + border-radius: 4px; + font-size: 12px; +} + +.action-btn:hover { + background: rgba(255, 255, 255, 0.1); +} + +.action-btn.edit-btn.active { + background: rgba(255, 152, 0, 0.3); +} + +.action-btn.delete-btn:hover { + background: rgba(244, 67, 54, 0.2); +} + +.drawing-tools { + display: flex; + flex-direction: column; + gap: 8px; +} + +.tool-btn { + padding: 10px 12px; + border: 1px solid rgba(255, 255, 255, 0.2); + border-radius: 6px; + color: white; + cursor: pointer; + font-size: 12px; + transition: all 0.2s ease; +} + +.tool-btn:disabled { + opacity: 0.5; + cursor: not-allowed; +} + +.tool-btn:not(:disabled):hover { + transform: translateY(-1px); +} + +.circle-btn { + background: rgba(255, 193, 7, 0.3); +} + +.circle-btn:not(:disabled):hover { + background: rgba(255, 193, 7, 0.5); +} + +.polygon-btn { + background: rgba(0, 188, 212, 0.3); +} + +.polygon-btn:not(:disabled):hover { + background: rgba(0, 188, 212, 0.5); +} + +.cancel-btn { + background: rgba(244, 67, 54, 0.3); +} + +.cancel-btn:not(:disabled):hover { + background: rgba(244, 67, 54, 0.5); +} /* ... 其他样式代码保持不变 ... */ \ No newline at end of file diff --git a/src/views/cesiums/components/AirspaceEditor.ts b/src/views/cesiums/components/AirspaceEditor.ts new file mode 100644 index 0000000..0986d63 --- /dev/null +++ b/src/views/cesiums/components/AirspaceEditor.ts @@ -0,0 +1,388 @@ +// src/utils/cesium/AirspaceEditor.ts +import * as Cesium from 'cesium'; + +export interface EditHandle { + id: string; + type: 'vertex' | 'center' | 'radius'; + position: Cesium.Cartesian3; + entity: Cesium.Entity; + index?: number; +} + +export class AirspaceEditor { + private viewer: Cesium.Viewer; + private handler: Cesium.ScreenSpaceEventHandler; + + private isEditing: boolean = false; + private currentDrawing: any = null; + private editHandles: EditHandle[] = []; + private originalPositions: Cesium.Cartesian3[] = []; + + constructor(viewer: Cesium.Viewer) { + this.viewer = viewer; + this.handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas); + } + + /** + * 开始编辑空域 + */ + startEditing(drawing: any): void { + console.log('开始编辑空域:', drawing); + + if (this.isEditing) { + this.finishEditing(); + } + + this.isEditing = true; + this.currentDrawing = drawing; + this.originalPositions = [...drawing.positions]; + + // 创建编辑控制点 + this.createEditHandles(drawing); + + // 设置事件监听 + this.setupEventListeners(); + + // 高亮显示编辑中的空域 + this.highlightDrawing(true); + } + + /** + * 创建编辑控制点 + */ + private createEditHandles(drawing: any): void { + this.clearEditHandles(); + + if (drawing.type === 'circle') { + this.createCircleHandles(drawing); + } else if (drawing.type === 'polygon') { + this.createPolygonHandles(drawing); + } + } + + /** + * 创建圆形控制点 + */ + private createCircleHandles(drawing: any): void { + const center = drawing.positions[0]; + + // 圆心控制点 + const centerHandle = this.createHandle(center, 'center', 'red', 15); + this.editHandles.push(centerHandle); + + // 半径控制点 + if (drawing.positions.length > 1) { + const radiusPoint = drawing.positions[1]; + const radiusHandle = this.createHandle(radiusPoint, 'radius', 'blue', 12); + this.editHandles.push(radiusHandle); + } else { + // 如果没有半径点,创建一个默认的 + const radius = drawing.properties?.radius || 1000; + const radiusPoint = this.calculateRadiusPoint(center, radius); + const radiusHandle = this.createHandle(radiusPoint, 'radius', 'blue', 12); + this.editHandles.push(radiusHandle); + drawing.positions[1] = radiusPoint; + } + } + + /** + * 创建多边形控制点 + */ + private createPolygonHandles(drawing: any): void { + drawing.positions.forEach((position: Cesium.Cartesian3, index: number) => { + const handle = this.createHandle(position, 'vertex', 'red', 12, index); + this.editHandles.push(handle); + }); + } + + /** + * 创建控制点实体 + */ + private createHandle( + position: Cesium.Cartesian3, + type: 'vertex' | 'center' | 'radius', + color: string, + size: number, + index?: number + ): EditHandle { + const id = `handle_${type}_${Date.now()}_${Math.random()}`; + + const entity = this.viewer.entities.add({ + id: id, + position: position, + point: { + pixelSize: size, + color: Cesium.Color.fromCssColorString(color), + outlineColor: Cesium.Color.WHITE, + outlineWidth: 2, + heightReference: Cesium.HeightReference.CLAMP_TO_GROUND, + disableDepthTestDistance: Number.POSITIVE_INFINITY + } + }); + + return { + id, + type, + position, + entity, + index + }; + } + + /** + * 计算圆形半径点 + */ + private calculateRadiusPoint(center: Cesium.Cartesian3, radius: number): Cesium.Cartesian3 { + const cartographic = Cesium.Cartographic.fromCartesian(center); + const newLat = cartographic.latitude + (radius / 6371000.0); + + return Cesium.Cartesian3.fromRadians( + cartographic.longitude, + newLat, + cartographic.height + ); + } + + /** + * 设置事件监听 + */ + private setupEventListeners(): void { + let draggedHandle: EditHandle | null = null; + + // 鼠标按下 + this.handler.setInputAction((event: any) => { + const pickedObject = this.viewer.scene.pick(event.position); + if (!pickedObject?.id) return; + + // 检查是否点击了控制点 + const handle = this.editHandles.find(h => h.entity === pickedObject.id); + if (handle) { + draggedHandle = handle; + this.viewer.scene.screenSpaceCameraController.enableInputs = false; + } + }, Cesium.ScreenSpaceEventType.LEFT_DOWN); + + // 鼠标移动 + this.handler.setInputAction((event: any) => { + if (!draggedHandle) return; + + const newPosition = this.viewer.scene.pickPosition(event.endPosition); + if (!newPosition) return; + + // 更新控制点位置 + draggedHandle.position = newPosition; + draggedHandle.entity.position = newPosition; + + // 更新空域几何 + this.updateDrawingGeometry(draggedHandle, newPosition); + }, Cesium.ScreenSpaceEventType.MOUSE_MOVE); + + // 鼠标释放 + this.handler.setInputAction(() => { + if (draggedHandle) { + this.viewer.scene.screenSpaceCameraController.enableInputs = true; + draggedHandle = null; + } + }, Cesium.ScreenSpaceEventType.LEFT_UP); + + // ESC键取消 + const escapeHandler = (event: KeyboardEvent) => { + if (event.key === 'Escape') { + this.cancelEditing(); + } + }; + document.addEventListener('keydown', escapeHandler); + } + + /** + * 更新空域几何 + */ + private updateDrawingGeometry(handle: EditHandle, newPosition: Cesium.Cartesian3): void { + if (!this.currentDrawing) return; + + if (this.currentDrawing.type === 'circle') { + this.updateCircleGeometry(handle, newPosition); + } else if (this.currentDrawing.type === 'polygon') { + this.updatePolygonGeometry(handle, newPosition); + } + + // 更新空域实体 + this.updateDrawingEntity(); + } + + /** + * 更新圆形几何 + */ + private updateCircleGeometry(handle: EditHandle, newPosition: Cesium.Cartesian3): void { + if (handle.type === 'center') { + // 移动圆心 + this.currentDrawing.positions[0] = newPosition; + } else if (handle.type === 'radius') { + // 更新半径点 + this.currentDrawing.positions[1] = newPosition; + } + } + + /** + * 更新多边形几何 + */ + private updatePolygonGeometry(handle: EditHandle, newPosition: Cesium.Cartesian3): void { + if (handle.type === 'vertex' && handle.index !== undefined) { + this.currentDrawing.positions[handle.index] = newPosition; + } + } + + /** + * 更新空域实体 + */ + private updateDrawingEntity(): void { + if (!this.currentDrawing?.entity) return; + + if (this.currentDrawing.type === 'circle') { + this.updateCircleEntity(); + } else if (this.currentDrawing.type === 'polygon') { + this.updatePolygonEntity(); + } + } + + /** + * 更新圆形实体 + */ + private updateCircleEntity(): void { + const center = this.currentDrawing.positions[0]; + let radius = 1000; + + if (this.currentDrawing.positions.length > 1) { + radius = Cesium.Cartesian3.distance(center, this.currentDrawing.positions[1]); + } + + this.currentDrawing.entity.position = center; + + if (this.currentDrawing.entity.ellipse) { + this.currentDrawing.entity.ellipse.semiMinorAxis = radius; + this.currentDrawing.entity.ellipse.semiMajorAxis = radius; + } + + // 更新标签 + if (this.currentDrawing.entity.label) { + this.currentDrawing.entity.label.text = `圆形空域\n半径: ${(radius / 1000).toFixed(2)}km`; + } + } + + /** + * 更新多边形实体 + */ + private updatePolygonEntity(): void { + if (this.currentDrawing.entity.polygon) { + this.currentDrawing.entity.polygon.hierarchy = new Cesium.PolygonHierarchy( + this.currentDrawing.positions + ); + } + } + + /** + * 高亮显示编辑中的空域 + */ + private highlightDrawing(highlight: boolean): void { + if (!this.currentDrawing?.entity) return; + + const color = highlight ? Cesium.Color.RED : Cesium.Color.YELLOW; + + if (this.currentDrawing.entity.ellipse) { + this.currentDrawing.entity.ellipse.outlineColor = color; + this.currentDrawing.entity.ellipse.outlineWidth = highlight ? 4 : 2; + } else if (this.currentDrawing.entity.polygon) { + this.currentDrawing.entity.polygon.outlineColor = color; + this.currentDrawing.entity.polygon.outlineWidth = highlight ? 4 : 2; + } + } + + /** + * 完成编辑 + */ + finishEditing(): void { + if (!this.isEditing) return; + + console.log('完成编辑'); + this.cleanup(); + } + + /** + * 取消编辑 + */ + cancelEditing(): void { + if (!this.isEditing) return; + + console.log('取消编辑'); + + // 恢复原始位置 + if (this.currentDrawing) { + this.currentDrawing.positions = [...this.originalPositions]; + this.updateDrawingEntity(); + } + + this.cleanup(); + } + + /** + * 清理资源 + */ + private cleanup(): void { + this.clearEditHandles(); + this.removeEventListeners(); + this.highlightDrawing(false); + + this.isEditing = false; + this.currentDrawing = null; + this.originalPositions = []; + } + + /** + * 清除编辑控制点 + */ + private clearEditHandles(): void { + this.editHandles.forEach(handle => { + this.viewer.entities.remove(handle.entity); + }); + this.editHandles = []; + } + + /** + * 移除事件监听 + */ + private removeEventListeners(): void { + this.handler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_DOWN); + this.handler.removeInputAction(Cesium.ScreenSpaceEventType.MOUSE_MOVE); + this.handler.removeInputAction(Cesium.ScreenSpaceEventType.LEFT_UP); + + // 移除ESC键监听 + document.removeEventListener('keydown', this.escapeHandler); + } + + /** + * ESC键处理函数 + */ + private escapeHandler = (event: KeyboardEvent) => { + if (event.key === 'Escape') { + this.cancelEditing(); + } + }; + + /** + * 获取编辑状态 + */ + getEditingState(): { isEditing: boolean; currentDrawing: any } { + return { + isEditing: this.isEditing, + currentDrawing: this.currentDrawing + }; + } + + /** + * 销毁编辑器 + */ + destroy(): void { + this.cleanup(); + this.handler.destroy(); + } +} \ No newline at end of file diff --git a/src/views/cesiums/components/DrawingTool.ts b/src/views/cesiums/components/DrawingTool.ts index 2016909..bad0529 100644 --- a/src/views/cesiums/components/DrawingTool.ts +++ b/src/views/cesiums/components/DrawingTool.ts @@ -50,7 +50,10 @@ export interface DrawingResult { info: DrawingInfo; // 新增信息字段 } +import { AirspaceEditor } from './AirspaceEditor'; + export class DrawingTool { + private airspaceEditor: AirspaceEditor; private viewer: Cesium.Viewer; private handler: Cesium.ScreenSpaceEventHandler; private entities: Cesium.EntityCollection; @@ -83,6 +86,7 @@ export class DrawingTool { this.viewer = viewer; this.handler = new Cesium.ScreenSpaceEventHandler(viewer.scene.canvas); this.entities = viewer.entities; + this.airspaceEditor = new AirspaceEditor(viewer); // 初始化点击事件监听 this.initClickHandler(); @@ -262,6 +266,55 @@ export class DrawingTool { return perimeter; } + /** + * 开始编辑空域 + */ + startEditing(drawingId: string): void { + console.log('开始编辑空域:', drawingId); + + const drawing = this.drawingEntities.get(drawingId); + if (!drawing) { + console.error('未找到空域:', drawingId); + return; + } + + this.airspaceEditor.startEditing(drawing); + } + + /** + * 完成编辑 + */ + finishEditing(): void { + this.airspaceEditor.finishEditing(); + } + + /** + * 取消编辑 + */ + cancelEditing(): void { + this.airspaceEditor.cancelEditing(); + } + + /** + * 获取编辑状态 + */ + getEditingState(): { isEditing: boolean; currentDrawing: any } { + return this.airspaceEditor.getEditingState(); + } + + /** + * 是否正在编辑 + */ + isEditing(): boolean { + return this.airspaceEditor.getEditingState().isEditing; + } + + /** + * 获取当前编辑的空域 + */ + getCurrentEditingDrawing(): any { + return this.airspaceEditor.getEditingState().currentDrawing; + } diff --git a/src/views/cesiums/components/useDrawingManager.ts b/src/views/cesiums/components/useDrawingManager.ts index b6b15eb..1bfb52f 100644 --- a/src/views/cesiums/components/useDrawingManager.ts +++ b/src/views/cesiums/components/useDrawingManager.ts @@ -8,6 +8,63 @@ export function useDrawingManager(drawingTool: any) { // 修改参数类型为 a const drawings = reactive(new Map()); const selectedDrawing = ref(null); const drawingInfo = ref(null); + const isEditing = ref(false); + const editingDrawing = ref(null); + + /** + * 开始编辑空域 + */ + const startEditing = (drawingId: string): void => { + console.log('开始编辑:', drawingId); + + const tool = getTool(); + if (!tool) { + console.error('绘图工具未初始化'); + return; + } + + tool.startEditing(drawingId); + + // 更新状态 + const editingState = tool.getEditingState(); + isEditing.value = editingState.isEditing; + editingDrawing.value = editingState.currentDrawing; + }; + + /** + * 完成编辑 + */ + const finishEditing = (): void => { + const tool = getTool(); + if (tool) { + tool.finishEditing(); + isEditing.value = false; + editingDrawing.value = null; + } + }; + + /** + * 取消编辑 + */ + const cancelEditing = (): void => { + const tool = getTool(); + if (tool) { + tool.cancelEditing(); + isEditing.value = false; + editingDrawing.value = null; + } + }; + + /** + * 获取编辑状态 + */ + const getEditingState = () => { + const tool = getTool(); + if (tool) { + return tool.getEditingState(); + } + return { isEditing: false, currentDrawing: null }; + }; // 绘图选项 const drawingOptions = reactive<{ @@ -571,6 +628,12 @@ export function useDrawingManager(drawingTool: any) { // 修改参数类型为 a importAirspaceData, importFromGeoJSON, importFromFile, - getImportStatistics + getImportStatistics, + isEditing, + editingDrawing, + startEditing, + finishEditing, + cancelEditing, + getEditingState }; } \ No newline at end of file