Merge branch 'dev' of https://git.jetbrains.space/nalpari/q-cast-iii/qcast-front into dev

src/components/floor-plan/CanvasMenu.jsx

@@ -199,6 +199,8 @@ export default function CanvasMenu(props) {
                 return
               },
             })
+          } else {
+            setType('surface')
           }
         } else {
           setType('surface')

src/components/floor-plan/modal/basic/step/pitch/PitchPlacement.jsx

@@ -17,6 +17,13 @@ const PitchPlacement = forwardRef((props, refs) => {
   const setCheckedModules = useSetRecoilState(checkedModuleState)
   const moduleSelectionData = useRecoilValue(moduleSelectionDataState) //다음으로 넘어가는 최종 데이터
   const [selectedItems, setSelectedItems] = useState({})
+  const { makeModuleInitArea } = useModuleBasicSetting(3)
+
+  useEffect(() => {
+    if (moduleSelectionData) {
+      makeModuleInitArea(moduleSelectionData)
+    }
+  }, [])
 
   useEffect(() => {
     handleChangeSetupLocation()

src/hooks/module/useModuleBasicSetting.js

@@ -440,7 +440,7 @@ export function useModuleBasicSetting(tabNum) {
             turfPolygon = polygonToTurfPolygon(moduleSetupSurfaces[i])
             trestlePolygon = moduleSetupSurfaces[i]
             manualDrawModules = moduleSetupSurfaces[i].modules // 앞에서 자동으로 했을때 추가됨
-            flowDirection = moduleSetupSurfaces[i].flowDirection //도형의 방향
+            flowDirection = moduleSetupSurfaces[i].direction //도형의 방향
 
             const moduleWidth = Number(checkedModule[0].longAxis) / 10
             const moduleHeight = Number(checkedModule[0].shortAxis) / 10
@@ -878,9 +878,9 @@ export function useModuleBasicSetting(tabNum) {
           }
         }
         //밑에가 평면이면 좌측으로 붙여서 배치
-        if (flowLines.bottom.type === 'flat' && flowLines.left.type === 'curve') {
+        // if (flowLines.bottom.type === 'flat' && flowLines.left.type === 'curve') {
-          startPoint = flowLines.left
+        //   startPoint = flowLines.left
-        }
+        // }
 
         const maxLeftEndPoint = surfaceMaxLines.left.x1 //최 좌측
         const maxRightEndPoint = surfaceMaxLines.right.x1 //최 우측
@@ -968,11 +968,20 @@ export function useModuleBasicSetting(tabNum) {
 
       checkedModule.forEach((module, index) => {
         const { width, height } = getModuleWidthHeight(maxLengthLine, moduleSetupSurface, module)
-        const flowLines = getFlowLines(moduleSetupSurface, width)
+        let flowLines = getFlowLines(moduleSetupSurface, width)
         //육지붕이 아닐때만 넣는다 육지붕일땐 클릭 이벤트에 별도로 넣어놓음
         let startPoint = flowLines.left
         const moduleArray = []
 
+        // if (flowLines.left.type === 'flat') {
+        //   const tempPoint = { ...flowLines.top }
+        //   startPoint = { ...flowLines.top, x1: tempPoint.x2, x2: tempPoint.x1 }
+        // } else {
+        //   flowLines = getFlowLines(moduleSetupSurface, height)
+        //   const tempPoint = { ...flowLines.left }
+        //   startPoint = { ...flowLines.left, x1: tempPoint.x1 + 5, x2: tempPoint.x2, y1: tempPoint.y1 - 5 }
+        // }
+
         //중앙배치일 경우에는 계산한다
         if (isCenter) {
           if (flowLines.left.type === 'flat' && flowLines.bottom.type === 'flat' && flowLines.top.type === 'flat') {
@@ -989,12 +998,6 @@ export function useModuleBasicSetting(tabNum) {
           }
         }
 
-        console.log('flowLines.top', flowLines.top)
-
-        if (flowLines.left.type === 'flat') {
-          startPoint = flowLines.top
-        }
-
         const maxRightEndPoint = surfaceMaxLines.right.x1 //최 우측
         const maxTopEndPoint = surfaceMaxLines.top.y1 //최 상단
         const maxBottomEndPoint = surfaceMaxLines.bottom.y1 //최하단
@@ -1082,6 +1085,11 @@ export function useModuleBasicSetting(tabNum) {
         const { width, height } = getModuleWidthHeight(maxLengthLine, moduleSetupSurface, module)
         const flowLines = getFlowLines(moduleSetupSurface, height)
         let startPoint = flowLines.top
+
+        // if (flowLines.top.type === 'flat' && flowLines.right.type === 'curve') {
+        //   startPoint = flowLines.right
+        // }
+
         const moduleArray = []
 
         if (isCenter) {
@@ -1199,8 +1207,20 @@ export function useModuleBasicSetting(tabNum) {
 
       checkedModule.forEach((module, index) => {
         const { width, height } = getModuleWidthHeight(maxLengthLine, moduleSetupSurface, module)
-        const flowLines = getFlowLines(moduleSetupSurface, width)
+        let flowLines = getFlowLines(moduleSetupSurface, width)
         let startPoint = flowLines.right
+
+        // if (flowLines.right.type === 'flat') {
+        //   const tempPoint = { ...flowLines.bottom }
+        //   startPoint = { ...flowLines.bottom, x1: tempPoint.x2, x2: tempPoint.x1 }
+        // } else {
+        //   flowLines = getFlowLines(moduleSetupSurface, height)
+        //   const tempPoint = { ...flowLines.right }
+        //   startPoint = { ...flowLines.right, x1: tempPoint.x1 - 5, x2: tempPoint.x2, y1: tempPoint.y1 + 5 }
+        // }
+
+        // console.log('startPoint', startPoint)
+
         const moduleArray = []
 
         if (isCenter) {
@@ -1227,7 +1247,9 @@ export function useModuleBasicSetting(tabNum) {
         let diffTopEndPoint = Math.abs(totalTopEndPoint / height)
         let totalHeight = Math.ceil(Math.abs(maxBottomEndPoint - maxTopEndPoint) / height)
         let totalWidth = Math.abs(startPoint.x1 - maxLeftEndPoint) / width
-        let startRowPoint = startPoint.y1 - height * Math.ceil(diffTopEndPoint) - 3 // -3으로 위치살짝 보정
+        let startRowPoint = startPoint.y1 - height * Math.ceil(diffTopEndPoint) // -3으로 위치살짝 보정1
+
+        console.log('startRowPoint', startRowPoint)
 
         let tempMaxHeight = isMaxSetup ? height / 2 : height //최대배치인지 확인하려고 넣음
         if (isMaxSetup) totalHeight = totalHeight * 2 //최대배치시 2배로 늘려서 반씩 검사
@@ -1303,7 +1325,7 @@ export function useModuleBasicSetting(tabNum) {
         return acc.length > cur.length ? acc : cur
       })
 
-      const flowDirection = moduleSetupSurface.flowDirection
+      const flowDirection = moduleSetupSurface.direction
 
       let intvHor =
         flowDirection === 'south' || flowDirection === 'north'
@@ -1317,44 +1339,44 @@ export function useModuleBasicSetting(tabNum) {
       //처마면 배치
       if (setupLocation === 'eaves') {
         // 흐름방향이 남쪽일때
-        if (moduleSetupSurface.flowDirection === 'south') {
+        if (moduleSetupSurface.direction === 'south') {
           downFlowSetupModule(surfaceMaxLines, maxLengthLine, moduleSetupArray, moduleSetupSurface, containsBatchObjects, false, intvHor, intvVer)
         }
-        if (moduleSetupSurface.flowDirection === 'west') {
+        if (moduleSetupSurface.direction === 'west') {
           leftFlowSetupModule(surfaceMaxLines, maxLengthLine, moduleSetupArray, moduleSetupSurface, containsBatchObjects, false, intvHor, intvVer)
         }
-        if (moduleSetupSurface.flowDirection === 'east') {
+        if (moduleSetupSurface.direction === 'east') {
           rightFlowSetupModule(surfaceMaxLines, maxLengthLine, moduleSetupArray, moduleSetupSurface, containsBatchObjects, false, intvHor, intvVer)
         }
-        if (moduleSetupSurface.flowDirection === 'north') {
+        if (moduleSetupSurface.direction === 'north') {
           topFlowSetupModule(surfaceMaxLines, maxLengthLine, moduleSetupArray, moduleSetupSurface, containsBatchObjects, false, intvHor, intvVer)
         }
       } else if (setupLocation === 'ridge') {
         //용마루
-        if (moduleSetupSurface.flowDirection === 'south') {
+        if (moduleSetupSurface.direction === 'south') {
           topFlowSetupModule(surfaceMaxLines, maxLengthLine, moduleSetupArray, moduleSetupSurface, containsBatchObjects, false, intvHor, intvVer)
         }
-        if (moduleSetupSurface.flowDirection === 'west') {
+        if (moduleSetupSurface.direction === 'west') {
           rightFlowSetupModule(surfaceMaxLines, maxLengthLine, moduleSetupArray, moduleSetupSurface, containsBatchObjects, false, intvHor, intvVer)
         }
-        if (moduleSetupSurface.flowDirection === 'east') {
+        if (moduleSetupSurface.direction === 'east') {
           leftFlowSetupModule(surfaceMaxLines, maxLengthLine, moduleSetupArray, moduleSetupSurface, containsBatchObjects, false, intvHor, intvVer)
         }
-        if (moduleSetupSurface.flowDirection === 'north') {
+        if (moduleSetupSurface.direction === 'north') {
           downFlowSetupModule(surfaceMaxLines, maxLengthLine, moduleSetupArray, moduleSetupSurface, containsBatchObjects, false, intvHor, intvVer)
         }
       } else if (setupLocation === 'center') {
         //중가면
-        if (moduleSetupSurface.flowDirection === 'south') {
+        if (moduleSetupSurface.direction === 'south') {
           downFlowSetupModule(surfaceMaxLines, maxLengthLine, moduleSetupArray, moduleSetupSurface, containsBatchObjects, true, intvHor, intvVer)
         }
-        if (moduleSetupSurface.flowDirection === 'west') {
+        if (moduleSetupSurface.direction === 'west') {
           leftFlowSetupModule(surfaceMaxLines, maxLengthLine, moduleSetupArray, moduleSetupSurface, containsBatchObjects, true, intvHor, intvVer)
         }
-        if (moduleSetupSurface.flowDirection === 'east') {
+        if (moduleSetupSurface.direction === 'east') {
           rightFlowSetupModule(surfaceMaxLines, maxLengthLine, moduleSetupArray, moduleSetupSurface, containsBatchObjects, true, intvHor, intvVer)
         }
-        if (moduleSetupSurface.flowDirection === 'north') {
+        if (moduleSetupSurface.direction === 'north') {
           topFlowSetupModule(surfaceMaxLines, maxLengthLine, moduleSetupArray, moduleSetupSurface, containsBatchObjects, true, intvHor, intvVer)
         }
       }
@@ -1802,7 +1824,7 @@ export function useModuleBasicSetting(tabNum) {
             turfPolygon = polygonToTurfPolygon(moduleSetupSurfaces[i], true)
             trestlePolygon = moduleSetupSurfaces[i]
             manualDrawModules = moduleSetupSurfaces[i].modules // 앞에서 자동으로 했을때 추가됨
-            flowDirection = moduleSetupSurfaces[i].flowDirection //도형의 방향
+            flowDirection = moduleSetupSurfaces[i].direction //도형의 방향
 
             const moduleWidth = Number(checkedModule[0].longAxis) / 10
             const moduleHeight = Number(checkedModule[0].shortAxis) / 10
@@ -2588,19 +2610,17 @@ export function useModuleBasicSetting(tabNum) {
       (maxLengthLine.flowDirection === 'east' || maxLengthLine.flowDirection === 'west' ? Number(module.shortAxis) : Number(module.longAxis)) / 10
 
     //배치면때는 방향쪽으로 패널이 넓게 누워져야함
-    if (moduleSetupSurface.flowDirection !== undefined) {
+    if (moduleSetupSurface.direction !== undefined) {
       tmpWidth =
-        (moduleSetupSurface.flowDirection === 'south' || moduleSetupSurface.flowDirection === 'north'
+        (moduleSetupSurface.direction === 'south' || moduleSetupSurface.direction === 'north' ? Number(module.longAxis) : Number(module.shortAxis)) /
-          ? Number(module.longAxis)
+        10
-          : Number(module.shortAxis)) / 10
       tmpHeight =
-        (moduleSetupSurface.flowDirection === 'south' || moduleSetupSurface.flowDirection === 'north'
+        (moduleSetupSurface.direction === 'south' || moduleSetupSurface.direction === 'north' ? Number(module.shortAxis) : Number(module.longAxis)) /
-          ? Number(module.shortAxis)
+        10
-          : Number(module.longAxis)) / 10
     }
 
     return canvasSetting.roofSizeSet === '1'
-      ? calculateVisibleModuleHeight(tmpWidth, tmpHeight, getDegreeByChon(moduleSetupSurface.roofMaterial.pitch), moduleSetupSurface.flowDirection)
+      ? calculateVisibleModuleHeight(tmpWidth, tmpHeight, getDegreeByChon(moduleSetupSurface.roofMaterial.pitch), moduleSetupSurface.direction)
       : { width: tmpWidth, height: tmpHeight }
   }
 

src/hooks/module/useModuleSelection.js

@@ -92,7 +92,7 @@ export function useModuleSelection(props) {
     //해당 메뉴 이동시 배치면 삭제
     const moduleSurfacesArray = canvas
       .getObjects()
-      .filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE || obj.name === POLYGON_TYPE.MODULE)
+      .filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE || obj.name === POLYGON_TYPE.MODULE || obj.name === POLYGON_TYPE.OBJECT_SURFACE)
     if (moduleSurfacesArray.length > 0) {
       moduleSurfacesArray.forEach((moduleSurface) => {
         canvas.remove(moduleSurface)

src/hooks/module/useModuleTabContents.js

@@ -57,12 +57,12 @@ export function useModuleTabContents({ tabIndex, addRoof, setAddedRoofs, roofTab
 
   //서까래간격 변경
   const handleChangeRaftBase = (option) => {
-    setSelectedRaftBase(option)
+    setSelectedRaftBase({ raftBaseCd: option.clCode, clCode: option.clCode })
+    resetSelected(1)
     setTrestleParams({ ...trestleParams, raftBaseCd: option.clCode }) //가대메이커
     // setConstMthdList([]) //공법 초기화
     // setRoofBaseList([]) //지붕밑바탕 초기화
     // setConstructionList([]) //공법 초기화
-    resetSelected(1)
   }
 
   //처마력바 체크
@@ -78,7 +78,15 @@ export function useModuleTabContents({ tabIndex, addRoof, setAddedRoofs, roofTab
   }
 
   const getConstructionListData = async (params) => {
-    if (params.trestleMkrCd && params.constMthdCd && params.roofBaseCd) {
+    if (
+      params.trestleMkrCd &&
+      params.constMthdCd &&
+      params.roofBaseCd &&
+      params.illuminationTp &&
+      params.stdWindSpeed &&
+      params.instHt &&
+      params.stdSnowLd
+    ) {
       const optionsList = await getConstructionList(params)
       setConstructionList(optionsList.data)
     }
@@ -97,13 +105,24 @@ export function useModuleTabContents({ tabIndex, addRoof, setAddedRoofs, roofTab
     })
     setRaftCodes(raftCodeList)
 
-    if (addRoof.raft) {
+    // if (addRoof.raft) {
+    if (moduleSelectionData.roofConstructions.length > 0 && moduleSelectionData.roofConstructions[tabIndex].trestle.raftBaseCd) {
+      //서까래 선택 데이터가 있으면 선택된걸로
       setSelectedRaftBase({
         ...selectedRaftBase,
-        raftBaseCd: addRoof.raft,
+        raftBaseCd: moduleSelectionData.roofConstructions[tabIndex].trestle.raftBaseCd,
-        clCode: addRoof.raft,
+        clCode: moduleSelectionData.roofConstructions[tabIndex].trestle.raftBaseCd,
       })
+    } else {
+      //없으면 기본값으로 넣는다
+      if (addRoof.raft) {
+        setSelectedRaftBase({
+          raftBaseCd: addRoof.raft,
+          clCode: addRoof.raft,
+        })
+      }
     }
+    // }
   }, [])
 
   //리코일에 데이터가 담기는 시점에 시작
@@ -131,7 +150,7 @@ export function useModuleTabContents({ tabIndex, addRoof, setAddedRoofs, roofTab
       setTrestleParams({
         moduleTpCd: selectedModules.itemTp,
         roofMatlCd: addRoof.roofMatlCd,
-        raftBaseCd: selectedRaftBase.raftBaseCd ? selectedRaftBase.raftBaseCd : '',
+        raftBaseCd: selectedRaftBase.clCode ? selectedRaftBase.clCode : '',
         workingWidth: lengthBase,
       })
     }
@@ -140,12 +159,12 @@ export function useModuleTabContents({ tabIndex, addRoof, setAddedRoofs, roofTab
   useEffect(() => {
     if (isExistData) {
       setConstructionListParams({
-        ...moduleSelectionInitParams,
+        ...moduleSelectionData.common,
         ...roofBaseParams,
         roofBaseCd: selectedRoofBase.roofBaseCd,
         inclCd: addRoof.pitch,
         roofPitch: hajebichiRef.current ? hajebichiRef.current.value : 0,
-        raftBaseCd: selectedRaftBase.raftBaseCd ? selectedRaftBase.raftBaseCd : '',
+        raftBaseCd: selectedRaftBase.clCode ? selectedRaftBase.clCode : '',
       })
     }
   }, [selectedRoofBase])
@@ -175,7 +194,7 @@ export function useModuleTabContents({ tabIndex, addRoof, setAddedRoofs, roofTab
       setTrestleParams({
         moduleTpCd: selectedModules.itemTp,
         roofMatlCd: addRoof.roofMatlCd,
-        raftBaseCd: selectedRaftBase.raftBaseCd ? selectedRaftBase.raftBaseCd : '',
+        raftBaseCd: selectedRaftBase.clCode ? selectedRaftBase.clCode : '',
         workingWidth: lengthBase,
       })
     }
@@ -191,7 +210,7 @@ export function useModuleTabContents({ tabIndex, addRoof, setAddedRoofs, roofTab
   //가대메이커 변경 함수
   const handleChangeTrestle = (option) => {
     if (isObjectNotEmpty(option)) {
-      option.raftBaseCd = selectedRaftBase.raftBaseCd
+      option.raftBaseCd = selectedRaftBase.clCode
       setSelectedTrestle(option) //선택값  저장
       setConstructionParams({ ...trestleParams, trestleMkrCd: option.trestleMkrCd, constMthdCd: '', roofBaseCd: '' })
     }
@@ -234,6 +253,7 @@ export function useModuleTabContents({ tabIndex, addRoof, setAddedRoofs, roofTab
         raftBaseCd: selectedRaftBase.clCode ? selectedRaftBase.clCode : '',
         roofMatlCd: addRoof.roofMatlCd,
       })
+      option.raftBaseCd = selectedRaftBase.raftBaseCd
       setSelectedRoofBase(option)
     }
   }
@@ -412,10 +432,12 @@ export function useModuleTabContents({ tabIndex, addRoof, setAddedRoofs, roofTab
       construction: {},
     })
 
+    const tempRoofConstructions = tempModuleSelectionData.roofConstructions.filter((item) => item.roofIndex !== tabIndex)
+
     //임시 데이터 초기화
     setTempModuleSelectionData({
       ...moduleSelectionData,
-      roofConstructions: [],
+      roofConstructions: tempRoofConstructions,
     })
 
     //처마커버 해제

src/hooks/object/useObjectBatch.js

@@ -3,7 +3,7 @@ import { useEffect } from 'react'
 import { useMessage } from '@/hooks/useMessage'
 import { useRecoilValue } from 'recoil'
 import { canvasState } from '@/store/canvasAtom'
-import { BATCH_TYPE, INPUT_TYPE } from '@/common/common'
+import { BATCH_TYPE, INPUT_TYPE, POLYGON_TYPE } from '@/common/common'
 import { useEvent } from '@/hooks/useEvent'
 import { pointsToTurfPolygon, polygonToTurfPolygon, rectToPolygon, triangleToPolygon } from '@/util/canvas-util'
 import { useSwal } from '@/hooks/useSwal'
@@ -955,8 +955,8 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
       })
       reGroupObjects.push(newObj)
       canvas.remove(obj)
-      if (obj.direction) {
+      if (newObj.direction) {
-        drawDirectionArrow(obj)
+        drawDirectionArrow(newObj)
       }
       newObj.fire('modified')
     })
@@ -977,6 +977,7 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
 
   const moveObjectBatch = () => {
     const obj = canvas.getActiveObject()
+    const parentSurface = canvas?.getObjects().filter((item) => item.name === POLYGON_TYPE.ROOF && item.id === obj.parentId)[0]
 
     if (obj) {
       obj.set({
@@ -984,14 +985,42 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
         lockMovementY: false,
       })
 
+      const originObj = { ...obj }
       addCanvasMouseEventListener('mouse:up', (e) => {
-        obj.set({
+        //개구, 그림자 타입일 경우 폴리곤 타입 변경
-          lockMovementX: true,
+        if (BATCH_TYPE.OPENING === obj.name || BATCH_TYPE.SHADOW === obj.name) {
-          lockMovementY: true,
+          obj.set({
-        })
+            points: rectToPolygon(obj),
+          })
+
+          const turfSurface = pointsToTurfPolygon(parentSurface.points)
+          const turfObject = pointsToTurfPolygon(obj.points)
+
+          if (turf.booleanWithin(turfObject, turfSurface)) {
+            obj.set({
+              lockMovementX: true,
+              lockMovementY: true,
+            })
+
+            obj.setCoords()
+          } else {
+            swalFire({
+              title: getMessage('batch.object.outside.roof'),
+              icon: 'warning',
+            })
+            obj.set({ ...originObj, lockMovementX: true, lockMovementY: true })
+          }
+        } else {
+          obj.set({
+            lockMovementX: true,
+            lockMovementY: true,
+          })
+
+          if (obj.type === 'group') reGroupObject(obj)
+          obj.setCoords()
+        }
+        canvas.discardActiveObject()
         initEvent()
-        obj.setCoords()
-        if (obj.type === 'group') reGroupObject(obj)
       })
     }
   }

src/hooks/useContextMenu.js

@@ -464,7 +464,7 @@ export function useContextMenu() {
                 id: 'openingMove',
                 shortcut: ['m', 'M'],
                 name: `${getMessage('contextmenu.move')}(M)`,
-                fn: () => moveObject(),
+                fn: () => moveObjectBatch(),
               },
               {
                 id: 'openingCopy',
@@ -667,7 +667,7 @@ export function useContextMenu() {
                 id: 'move',
                 shortcut: ['m', 'M'],
                 name: `${getMessage('contextmenu.move')}(M)`,
-                fn: () => moveObject(),
+                fn: () => moveObjectBatch(),
               },
               {
                 id: 'copy',