refactor(雷达编辑): 优化家具编辑功能与类型定义

- 移除RadarView中不必要的z-index注释
- 扩展FurnitureIconType类型以包含雷达类型
- 更新FurnitureItem类型定义使用FurnitureIconType
- 添加disabled状态控制雷达编辑功能
- 优化家具微调逻辑使用CSS坐标
- 简化家具数据初始化逻辑
- 为RadarEditor添加禁用状态样式

src/components/EditableFurniture/index.vue

@@ -428,22 +428,22 @@ function startPanelDrag(e: MouseEvent) {
 
 // 微调
 function nudge(direction: 'left' | 'right' | 'up' | 'down'): void {
+  const step = nudgeStep.value
   switch (direction) {
     case 'left':
-      localItem.x! -= nudgeStep.value
+      centerCss.left -= step
       break
     case 'right':
-      localItem.x! += nudgeStep.value
+      centerCss.left += step
       break
     case 'up':
-      localItem.y! += nudgeStep.value
+      centerCss.top -= step
       break
     case 'down':
-      localItem.y! -= nudgeStep.value
+      centerCss.top += step
       break
   }
-  ;({ x: localItem.x, y: localItem.y } = normXY(localItem.x!, localItem.y!))
-  updateCssFromXY()
+  updateXYFromCss()
   emit('update', { ...localItem })
 }
 </script>

src/components/RadarEditor/index.vue

@@ -1,17 +1,19 @@
 <template>
-  <RadarView :coordinates="coordinates" :angle="angle">
-    <template #furnitures>
-      <EditableFurniture
-        v-for="item in localFurniture"
-        :key="item.nanoid"
-        :item="item"
-        :angle="angle"
-        :coordinates="coordinates"
-        @update="updateFurniture"
-        @delete="deleteFurniture"
-      />
-    </template>
-  </RadarView>
+  <div class="radarEditor" :class="{ disabled: props.disabled }">
+    <RadarView :coordinates="coordinates" :angle="angle">
+      <template #furnitures>
+        <EditableFurniture
+          v-for="item in localFurniture"
+          :key="item.nanoid"
+          :item="item"
+          :angle="angle"
+          :coordinates="coordinates"
+          @update="updateFurniture"
+          @delete="deleteFurniture"
+        />
+      </template>
+    </RadarView>
+  </div>
 </template>
 
 <script setup lang="ts">
@@ -26,6 +28,7 @@ interface Props {
   coordinates: [number, number, number, number]
   angle: number
   furnitureItems?: FurnitureItem[]
+  disabled?: boolean
 }
 const props = defineProps<Props>()
 const emit = defineEmits<{
@@ -62,4 +65,13 @@ function addFurniture(item: FurnitureItem) {
 defineExpose({ addFurniture })
 </script>
 
-<style scoped lang="less"></style>
+<style scoped lang="less">
+.radarEditor.disabled {
+  cursor: no-drop;
+  :deep(*) {
+    pointer-events: none;
+    user-select: none;
+    opacity: 0.85;
+  }
+}
+</style>

src/components/RadarView/index.vue

@@ -314,7 +314,7 @@ function getAxisDotStyle(axis: 'x' | 'y') {
     overflow: hidden;
     position: absolute;
     top: 0;
-    z-index: 1;
+    // z-index: 1;
   }
 
   // 点位层

src/types/furniture.ts

@@ -52,4 +52,9 @@ export type LivingRoomType =
  * @union DiningRoomType - 餐厅家具类型
  * @union LivingRoomType - 客厅家具类型
  */
-export type FurnitureIconType = BathroomType | BedroomType | DiningRoomType | LivingRoomType
+export type FurnitureIconType =
+  | BathroomType
+  | BedroomType
+  | DiningRoomType
+  | LivingRoomType
+  | 'radar'

src/types/radar.ts

@@ -1,9 +1,10 @@
+import type { FurnitureIconType } from '@/types/furniture'
 /**
  * 家具元素，用于在雷达区域中展示和编辑
  */
 export interface FurnitureItem {
   name: string // 家具名称（如：床、桌子）
-  type: string // 家具类型标识（如：'bed'、'table'）
+  type: FurnitureIconType // 家具类型标识（如：'bed'、'table'）
   width: number // 家具宽度（单位：px）
   length: number // 家具长度（单位：px）
   left: number // CSS 坐标系下的 left 值（用于定位）

src/views/device/detail/components/deviceAreaConfig/index.vue

@@ -47,6 +47,7 @@
         :coordinates="props.ranges"
         :angle="props.angle"
         :furnitureItems="furnitureItems"
+        :disabled="!isEditDraggable"
         @update:furnitureItems="mapCanvasList = $event"
       />
     </div>
@@ -410,7 +411,7 @@ const radarEditorRef = ref<InstanceType<typeof RadarEditor>>()
 
 // 画布上的家具列表
 const mapCanvasList = ref<CanvaseItem[]>([])
-const isEditDraggable = ref(true)
+const isEditDraggable = ref(false)
 // 家具列表添加
 const addHandler = (icon: FurnitureIconType) => {
   console.log('addHandler', icon)

src/views/device/detail/index.vue

@@ -337,18 +337,16 @@ const fetchRoomLayout = async () => {
     const { furnitures, roomId, subRegions } = res.data
     if (furnitures) {
       // 添加接口返回的家具数据
-      furnitures!.forEach((item) => {
-        furnitureItems.value.push({
-          ...item,
-          width: item.width || 45,
-          length: item.length || 45,
-          top: item.top || 0,
-          left: item.left || 0,
-          rotate: item.rotate || 0,
-          x: item.x || 0,
-          y: item.y || 0,
-        })
-      })
+      furnitureItems.value = furnitures!.map((item) => ({
+        ...item,
+        width: item.width || 45,
+        length: item.length || 45,
+        top: item.top || 0,
+        left: item.left || 0,
+        rotate: item.rotate || 0,
+        x: item.x || 0,
+        y: item.y || 0,
+      }))
     }
     deviceRoomId.value = roomId || ''
     subRegionItems.value = subRegions || []