Selaa lähdekoodia

fix: 调整家具子区域配置区域设置尺寸;

liujia 1 kuukausi sitten
vanhempi
commit
2d89b5c
1 muutettua tiedostoa jossa 43 lisäystä ja 75 poistoa
  1. 43 75
      src/views/device/detail/components/deviceAreaConfig/index.vue

+ 43 - 75
src/views/device/detail/components/deviceAreaConfig/index.vue

@@ -252,7 +252,10 @@
         </div>
 
         <div v-if="selectedBlock" class="mapConfig">
-          <div class="mapConfig-header">子区域属性</div>
+          <div class="mapConfig-header">
+            <span class="title">子区域属性</span>
+            <span class="close" @click="closeSubregionAttr"><CloseOutlined /></span>
+          </div>
           <div class="mapConfig-item">
             <div class="mapConfig-item-label">X范围:</div>
             <div class="mapConfig-item-content">
@@ -368,6 +371,7 @@ import {
   ArrowRightOutlined,
   DeleteOutlined,
   QuestionCircleOutlined,
+  CloseOutlined,
 } from '@ant-design/icons-vue'
 import { getOriginPosition } from '@/utils'
 
@@ -744,6 +748,14 @@ const deleteFurnitureIcon = (nanoid: string) => {
   }
 }
 
+// 关闭子区域属性
+const closeSubregionAttr = () => {
+  blocks.value.forEach((item) => {
+    item.isActice = false
+  })
+  selectedBlock.value = null
+}
+
 // 删除家具床
 const deleteFurnitureBed = (nanoid: string) => {
   console.log('deleteFurnitureBed', nanoid)
@@ -813,10 +825,10 @@ const getContainerRect = () => {
 const handleMouseDown = (e: MouseEvent) => {
   if (!isEditDraggable.value) return
   console.log('handleMouseDown', e)
-  blocks.value.forEach((item) => {
-    item.isActice = false
-  })
-  selectedBlock.value = null
+  // blocks.value.forEach((item) => {
+  //   item.isActice = false
+  // })
+  // selectedBlock.value = null
   if (!isCreating.value) return
 
   const rect = getContainerRect()
@@ -936,39 +948,6 @@ const selectBlock = (block: BlockItem) => {
   })
 }
 
-// 保存子区域配置
-// const saveBlockConfig = () => {
-//   const blockData = blocks.value.map((item) => {
-//     return {
-//       startXx: item.startXx,
-//       stopXx: item.stopXx,
-//       startYy: item.startYy,
-//       stopYy: item.stopYy,
-//       startZz: Number(item.startZz) || 0,
-//       stopZz: Number(item.stopZz) || 0,
-//       isLowSnr: item.isLowSnr,
-//       isDoor: item.isDoor,
-//       presenceEnterDuration: item.presenceEnterDuration,
-//       presenceExitDuration: item.presenceExitDuration,
-//       trackPresence: Number(item.isTracking),
-//       excludeFalling: Number(item.isFalling),
-//     }
-//   })
-//   console.log('当前所有区块配置:', blockData)
-//   try {
-//     const res = roomApi.saveRoomInfo({
-//       roomId: deviceRoomId.value,
-//       devId: props.devId,
-//       subRegions: blockData,
-//     })
-//     console.log('saveBlockConfig 保存成功', res)
-//     message.success('保存成功')
-//     emit('success')
-//   } catch (error) {
-//     console.error('saveBlockConfig 保存失败', error)
-//   }
-// }
-
 const { originX, originY, originOffsetX, originOffsetY, radarX, radarY } = getOriginPosition(
   props.ranges,
   [currentDragItem.value?.left as number, currentDragItem.value?.top as number]
@@ -1004,37 +983,6 @@ const initRadarIcon = () => {
   })
 }
 
-// 保存家具配置
-// const saveFurnitureMapConfig = () => {
-//   console.log('saveFurnitureMapConfig', mapCanvasList.value)
-//   try {
-//     const res = roomApi.saveRoomInfo({
-//       roomId: deviceRoomId.value,
-//       devId: props.devId,
-//       furnitures: mapCanvasList.value
-//         .filter((item) => item.type !== 'radar')
-//         .map((item) => {
-//           return {
-//             name: item.name,
-//             type: item.type as FurnitureType,
-//             width: item.width,
-//             length: item.height,
-//             top: item.top,
-//             left: item.left,
-//             rotate: item.rotate as 0 | 90 | 180 | 270,
-//             x: item?.x || 0,
-//             y: item?.y || 0,
-//           }
-//         }),
-//     })
-//     console.log('保存家具配置 成功', res)
-//     message.success('保存成功')
-//     emit('success')
-//   } catch (error) {
-//     console.error('保存家具配置 失败', error)
-//   }
-// }
-
 // 保存所有配置
 const saveAllConfig = () => {
   console.log('保存所有配置')
@@ -1117,13 +1065,16 @@ const startResize = (block: BlockItem, e: MouseEvent) => {
 }
 
 const blockInputPressEnter = (e: Event, el: BlockItem, attr: string) => {
+  console.log('blockInputPressEnter', e, el, attr)
+  if (!el) return
   if (attr === 'startXx') {
     el.startXx = Number(el[attr as keyof BlockItem])
     el.x = el.startXx + originX
   }
   if (attr === 'stopXx') {
     el.stopXx = Number(el[attr as keyof BlockItem])
-    el.width = el.stopXx + originX - el.width
+    // el.width = el.stopXx + originX - el.width
+    el.width = el.stopXx - el.startXx
   }
 
   if (attr === 'startYy') {
@@ -1132,19 +1083,22 @@ const blockInputPressEnter = (e: Event, el: BlockItem, attr: string) => {
   }
   if (attr === 'stopYy') {
     el.stopYy = Number(el[attr as keyof BlockItem])
-    el.height = el.stopYy + originY - el.height
+    // el.height = el.stopYy + originY - el.height
+    el.height = el.stopYy - el.startYy
   }
 }
 
 const blockInputBlur = (e: Event, el: BlockItem, attr: string) => {
   console.log('blockInputBlur', e, el, attr)
+  if (!el) return
   if (attr === 'startXx') {
     el.startXx = Number(el[attr as keyof BlockItem])
     el.x = el.startXx + originX
   }
   if (attr === 'stopXx') {
     el.stopXx = Number(el[attr as keyof BlockItem])
-    el.width = el.stopXx + originX - el.width
+    // el.width = el.stopXx + originX - el.width
+    el.width = el.stopXx - el.startXx
   }
 
   if (attr === 'startYy') {
@@ -1153,7 +1107,8 @@ const blockInputBlur = (e: Event, el: BlockItem, attr: string) => {
   }
   if (attr === 'stopYy') {
     el.stopYy = Number(el[attr as keyof BlockItem])
-    el.height = el.stopYy + originY - el.height
+    // el.height = el.stopYy + originY - el.height
+    el.height = el.stopYy - el.startYy
   }
 }
 
@@ -1222,9 +1177,22 @@ const deleteBlockArea = (id: string) => {
   border-radius: 10px;
   padding: 12px;
   &-header {
-    font-size: 14px;
     margin-bottom: 10px;
-    font-weight: 600;
+    display: flex;
+    justify-content: space-between;
+    align-items: center;
+    .title {
+      font-size: 14px;
+      font-weight: 600;
+      line-height: 24px;
+    }
+    .close {
+      font-size: 14px;
+      color: #666;
+      cursor: pointer;
+      position: relative;
+      top: -5px;
+    }
   }
 
   &-item {