diff --git a/ruoyi-ui/src/views/cesiumMap/index.vue b/ruoyi-ui/src/views/cesiumMap/index.vue index 7ce9d22..8ceb02d 100644 --- a/ruoyi-ui/src/views/cesiumMap/index.vue +++ b/ruoyi-ui/src/views/cesiumMap/index.vue @@ -738,15 +738,17 @@ export default { // 关键:使用 CallbackProperty 动态计算半径(半长轴和半短轴) semiMajorAxis: new Cesium.CallbackProperty(() => { if (centerPoint && activeCursorPosition) { - return Cesium.Cartesian3.distance(centerPoint, activeCursorPosition); + const distance = Cesium.Cartesian3.distance(centerPoint, activeCursorPosition); + return Math.max(distance, 1); // 最小半径为1米,避免0值错误 } - return 0; + return 1; }, false), semiMinorAxis: new Cesium.CallbackProperty(() => { if (centerPoint && activeCursorPosition) { - return Cesium.Cartesian3.distance(centerPoint, activeCursorPosition); + const distance = Cesium.Cartesian3.distance(centerPoint, activeCursorPosition); + return Math.max(distance, 1); // 最小半径为1米,避免0值错误 } - return 0; + return 1; }, false), // 样式设置 material: Cesium.Color.fromCssColorString(this.defaultStyles.polygon.color).withAlpha(0.5), @@ -779,7 +781,8 @@ export default { const centerPoint = this.drawingPoints[0]; // 1. 计算最终半径 - const radius = Cesium.Cartesian3.distance(centerPoint, edgePosition); + let radius = Cesium.Cartesian3.distance(centerPoint, edgePosition); + radius = Math.max(radius, 1); // 最小半径为1米,避免0值错误 // 2. 移除动态预览实体 if (this.tempEntity) { @@ -1422,11 +1425,12 @@ export default { case 'circle': // 检查半径是否有效 - const radius = entityData.data.radius || 1000 + let radius = entityData.data.radius || 1000 if (radius <= 0) { this.$message.error('圆形半径必须大于0') return } + radius = Math.max(radius, 1); // 最小半径为1米,避免0值错误 entity = this.viewer.entities.add({ position: Cesium.Cartesian3.fromDegrees(entityData.data.center.lng, entityData.data.center.lat), ellipse: { diff --git a/ruoyi-ui/src/views/childRoom/LeftMenu.vue b/ruoyi-ui/src/views/childRoom/LeftMenu.vue index 60706fe..6779418 100644 --- a/ruoyi-ui/src/views/childRoom/LeftMenu.vue +++ b/ruoyi-ui/src/views/childRoom/LeftMenu.vue @@ -28,6 +28,9 @@ :title="item.name" > +
+ +
@@ -124,6 +127,15 @@ export default { this.$emit('add') }, + quickDelete(item) { + const index = this.localMenuItems.findIndex(menuItem => menuItem.id === item.id) + if (index > -1) { + this.localMenuItems.splice(index, 1) + this.$emit('update:menuItems', this.localMenuItems) + this.$emit('delete', item) + } + }, + handleRightClick(item) { this.itemToDelete = item this.showDeleteDialog = true @@ -151,14 +163,14 @@ export default { position: absolute; top: 70px; left: 20px; - width: 36px; + width: 42px; background: rgba(255, 255, 255, 0.3); backdrop-filter: blur(10px); border: 1px solid rgba(0, 138, 255, 0.1); border-radius: 8px; z-index: 90; box-shadow: 0 4px 12px rgba(0, 138, 255, 0.2); - padding: 12px 2px; + padding: 12px 5px; transition: all 0.3s ease; overflow: hidden; opacity: 1; @@ -215,6 +227,37 @@ export default { box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } +.delete-icon { + position: absolute; + top: -6px; + right: -6px; + width: 16px; + height: 16px; + background: #F56C6C; + color: white; + border-radius: 50%; + display: flex; + justify-content: center; + align-items: center; + font-size: 10px; + cursor: pointer; + opacity: 0; + visibility: hidden; + transition: all 0.2s; + z-index: 10; + box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); +} + +.menu-item:hover .delete-icon { + opacity: 1; + visibility: visible; +} + +.delete-icon:hover { + background: #F78989; + transform: scale(1.1); +} + .menu-item:active { cursor: grabbing; }