도머 크기 변경 삭제 배치면 크기 변경 수정

src/components/floor-plan/modal/object/DormerOffset.jsx

@@ -32,10 +32,10 @@ export default function DormerOffset(props) {
 
     dormerOffset(arrow1, arrow2, length1, length2)
 
-    setArrow1(null)
+    // setArrow1(null)
-    setArrow2(null)
+    // setArrow2(null)
-    arrow1LengthRef.current.value = ''
+    // arrow1LengthRef.current.value = ''
-    arrow2LengthRef.current.value = ''
+    // arrow2LengthRef.current.value = ''
 
     // closePopup(id)
   }

src/components/floor-plan/modal/object/SizeSetting.jsx

@@ -32,12 +32,7 @@ export default function SizeSetting(props) {
     const width = widthRef.current.value
     const height = heightRef.current.value
 
-    if (
+    if (target.name === BATCH_TYPE.OPENING || target.name === BATCH_TYPE.SHADOW) {
-      target.name === BATCH_TYPE.OPENING ||
-      target.name === BATCH_TYPE.SHADOW ||
-      target.name === BATCH_TYPE.TRIANGLE_DORMER ||
-      target.name === BATCH_TYPE.PENTAGON_DORMER
-    ) {
       resizeObjectBatch(settingTarget, target, width, height)
     } else if (target.name === POLYGON_TYPE.ROOF) {
       resizeSurfaceShapeBatch(settingTarget, target, width, height)

src/hooks/object/useObjectBatch.js

@@ -1035,6 +1035,7 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
           initEvent()
 
           // dbClickEvent()
+          if (setIsHidden) setIsHidden(false)
         }
       })
     }
@@ -1270,8 +1271,10 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
   const resizeObjectBatch = (side, target, width, height) => {
     const objectWidth = target.width
     const objectHeight = target.height
-    const changeWidth = (width / 10 / objectWidth).toFixed(2)
+
-    const changeHeight = (height / 10 / objectHeight).toFixed(2)
+    const changeWidth = toFixedWithoutRounding(width / 10 / objectWidth, 1)
+    const changeHeight = toFixedWithoutRounding(height / 10 / objectHeight, 1)
+
     let sideX = 'left'
     let sideY = 'top'
 
@@ -1303,24 +1306,19 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
     target.scaleX = changeWidth || 1
     target.scaleY = changeHeight || 1
 
+    canvas?.renderAll() //변경 좌표를 한번 적용
+
     //크기 변경후 좌표를 재 적용
-    const changedCoords = target.getPointByOrigin('center', 'center')
+    const changedCoords = target.getPointByOrigin(target.originX, target.originY)
 
     target.set({
       ...target,
-      originX: 'center',
+      originX: target.originX,
-      originY: 'center',
+      originY: target.originY,
       left: changedCoords.x,
       top: changedCoords.y,
-      width: width / 10,
-      height: height / 10,
     })
 
-    //얘는 일단 도머에 적용함
-    if (target.type === 'group') {
-      target._objects.forEach((obj) => setSurfaceShapePattern(obj))
-    }
-
     // target.setCoords()
     canvas.renderAll()
     if (target.type === 'group') reGroupObject(target)
@@ -1329,8 +1327,6 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
   const reGroupObject = (groupObj) => {
     groupObj._restoreObjectsState() //이건 실행만 되도 그룹이 변경됨
 
-    console.log('groupObj', groupObj)
-
     const reGroupObjects = []
     groupObj._objects.forEach((obj) => {
       const newObj = addPolygon(
@@ -1390,7 +1386,7 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
       })
 
       const originObj = { ...obj }
-      const turfSurface = pointsToTurfPolygon(parentSurface.points)
+      const turfSurface = pointsToTurfPolygon(parentSurface.getCurrentPoints())
       const originLeft = obj.left
       const originTop = obj.top
 
@@ -1528,26 +1524,6 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
     }
   }
 
-  const dormerPlacement = {
-    widthRef: useRef(null),
-    heightRef: useRef(null),
-    pitchRef: useRef(null),
-    offsetRef: useRef(null),
-    offsetWidthRef: useRef(null),
-    directionRef: useRef(null),
-  }
-
-  const copyOjbectDormer = () => {
-    const obj = canvas.getActiveObject()
-    if (obj) {
-      if (obj.name === 'triangleDormer') {
-        const offset = obj._objects.filter((item) => item.name === 'triangleDormerOffset')
-      } else {
-        //오각도머
-      }
-    }
-  }
-
   const dormerOffsetKeyEvent = (setArrow1, setArrow2) => {
     addDocumentEventListener('keydown', document, (e) => {
       if (e.key === 'ArrowDown' || e.key === 'ArrowUp') {
@@ -1565,6 +1541,8 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
     length2 = parseInt(length2) / 10
 
     const dormer = canvas.getActiveObject()
+    const { left, top } = dormer
+
     if (length1) {
       if (!arrow1) {
         swalFire({
@@ -1587,7 +1565,40 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
       }
     }
 
+    const parentSurface = canvas?.getObjects().filter((item) => item.name === POLYGON_TYPE.ROOF && item.id === dormer.parentId)[0]
+    const turfSurface = pointsToTurfPolygon(parentSurface.getCurrentPoints())
+
+    let turfDormer = pointsToTurfPolygon(rectToPolygon(dormer))
+    let currentPoints = []
+    if (dormer.name === BATCH_TYPE.TRIANGLE_DORMER || dormer.name === BATCH_TYPE.PENTAGON_DORMER) {
+      const calcLeft = dormer.left - left
+      const calcTop = dormer.top - top
+
+      currentPoints = dormer.groupPoints.map((item) => {
+        return {
+          x: item.x + calcLeft,
+          y: item.y + calcTop,
+        }
+      })
+
+      turfDormer = pointsToTurfPolygon(currentPoints)
+    }
+
+    if (!turf.booleanWithin(turfDormer, turfSurface)) {
+      swalFire({
+        title: getMessage('batch.object.outside.roof'),
+        icon: 'warning',
+      })
+
+      //위치 원복`
+      dormer.left = left
+      dormer.top = top
+
+      return
+    }
+
     if (dormer.type === 'group') {
+      dormer.set({ groupPoints: currentPoints })
       const newDormer = reGroupObject(dormer)
       canvas?.setActiveObject(newDormer)
     }

src/hooks/surface/useSurfaceShapeBatch.js

@@ -4,7 +4,7 @@ import { useEffect } from 'react'
 import { useRecoilState, useRecoilValue, useResetRecoilState } from 'recoil'
 import { canvasSettingState, canvasState, currentCanvasPlanState, globalPitchState } from '@/store/canvasAtom'
 import { MENU, POLYGON_TYPE } from '@/common/common'
-import { getIntersectionPoint } from '@/util/canvas-util'
+import { getIntersectionPoint, toFixedWithoutRounding } from '@/util/canvas-util'
 import { degreesToRadians } from '@turf/turf'
 import { QPolygon } from '@/components/fabric/QPolygon'
 import { useSwal } from '@/hooks/useSwal'
@@ -908,6 +908,8 @@ export function useSurfaceShapeBatch({ isHidden, setIsHidden }) {
   }
 
   const resizeSurfaceShapeBatch = (side, target, width, height) => {
+    const originTarget = { ...target }
+
     const objectWidth = target.width
     const objectHeight = target.height
     const changeWidth = width / 10 / objectWidth
@@ -945,25 +947,27 @@ export function useSurfaceShapeBatch({ isHidden, setIsHidden }) {
     target.set({
       scaleX: 1,
       scaleY: 1,
-      width: parseInt((width / 10).toFixed(0)),
+      width: toFixedWithoutRounding(width / 10, 1),
-      height: parseInt((height / 10).toFixed(0)),
+      height: toFixedWithoutRounding(height / 10, 1),
     })
     //크기 변경후 좌표를 재 적용
-    const changedCoords = target.getPointByOrigin('center', 'center')
+    const changedCoords = target.getPointByOrigin(originTarget.originX, originTarget.originY)
 
     target.set({
-      originX: 'center',
+      originX: originTarget.originX,
-      originY: 'center',
+      originY: originTarget.originY,
       left: changedCoords.x,
       top: changedCoords.y,
     })
+    canvas.renderAll()
 
     //면형상 리사이즈시에만
     target.fire('polygonMoved')
     target.points = currentPoints
     target.fire('modified')
 
-    setSurfaceShapePattern(target, roofDisplay.column)
+    setSurfaceShapePattern(target, roofDisplay.column, false, target.roofMaterial, true)
+
     if (target.direction) {
       drawDirectionArrow(target)
     }
@@ -1108,7 +1112,6 @@ export function useSurfaceShapeBatch({ isHidden, setIsHidden }) {
     deleteAllSurfacesAndObjects,
     moveSurfaceShapeBatch,
     resizeSurfaceShapeBatch,
-
     changeSurfaceLinePropertyEvent,
     changeSurfaceLineProperty,
     changeSurfaceLinePropertyReset,