보조선 수동 작성 시 roofId 추가

src/components/floor-plan/modal/Slope.jsx

@@ -1,8 +1,13 @@
 import { useMessage } from '@/hooks/useMessage'
 import WithDraggable from '@/components/common/draggable/WithDraggable'
+import { globalPitchState } from '@/store/canvasAtom'
+import { useRecoilState } from 'recoil'
+import { useRef } from 'react'
 
 export default function Slope({ setShowSlopeSettingModal }) {
   const { getMessage } = useMessage()
+  const [globalPitch, setGlobalPitch] = useRecoilState(globalPitchState)
+  const inputRef = useRef()
   return (
     <WithDraggable isShow={true} pos={{ x: 50, y: -950 }}>
       <div className={`modal-pop-wrap xxxm`}>
@@ -19,13 +24,21 @@ export default function Slope({ setShowSlopeSettingModal }) {
                 {getMessage('slope')}
               </span>
               <div className="input-grid mr5">
-                <input type="text" className="input-origin block" defaultValue={300} />
+                <input type="text" className="input-origin block" defaultValue={globalPitch} ref={inputRef} />
               </div>
               <span className="thin">{getMessage('size.angle')}</span>
             </div>
           </div>
           <div className="grid-btn-wrap">
-            <button className="btn-frame modal act">{getMessage('modal.common.save')}</button>
+            <button
+              className="btn-frame modal act"
+              onClick={() => {
+                setGlobalPitch(inputRef.current.value)
+                setShowSlopeSettingModal(false)
+              }}
+            >
+              {getMessage('modal.common.save')}
+            </button>
           </div>
         </div>
       </div>

src/hooks/roofcover/useAuxiliaryDrawing.js

@@ -607,10 +607,15 @@ export function useAuxiliaryDrawing(setShowAuxiliaryModal) {
    * 일변전으로 돌아가기
    */
   const handleRollback = () => {
-    const lastLine = lineHistory.current.pop()
-    mousePointerArr.current = []
-    canvas.remove(...canvas.getObjects().filter((obj) => obj.name === 'innerPoint'))
+    const innerPoint = canvas.getObjects().find((obj) => obj.name === 'innerPoint')
+    if (innerPoint) {
+      mousePointerArr.current = []
+      canvas.remove(innerPoint)
+      canvas.renderAll()
+      return
+    }
 
+    const lastLine = lineHistory.current.pop()
     if (lastLine) {
       roofAdsorptionPoints.current = roofAdsorptionPoints.current.filter(
         (point) => point.x !== lastLine.intersectionPoint?.x && point.y !== lastLine.intersectionPoint?.y,
@@ -640,6 +645,7 @@ export function useAuxiliaryDrawing(setShowAuxiliaryModal) {
         const inPolygon2 = booleanPointInPolygon([line.x2, line.y2], turfPolygon)
 
         if (inPolygon1 && inPolygon2) {
+          line.attributes = { ...line.attributes, roofId: roofBase.id }
           return true
         }
       })

src/hooks/roofcover/useOuterLineWall.js

@@ -34,8 +34,14 @@ import { QLine } from '@/components/fabric/QLine'
 //외벽선 그리기
 export function useOuterLineWall(setShowOutlineModal) {
   const canvas = useRecoilValue(canvasState)
-  const { addCanvasMouseEventListener, addDocumentEventListener, removeAllMouseEventListeners, removeAllDocumentEventListeners, removeMouseEvent } =
-    useEvent()
+  const {
+    initEvent,
+    addCanvasMouseEventListener,
+    addDocumentEventListener,
+    removeAllMouseEventListeners,
+    removeAllDocumentEventListeners,
+    removeMouseEvent,
+  } = useEvent()
   const { getIntersectMousePoint } = useMouse()
   const { addLine, removeLine } = useLine()
   const { tempGridMode } = useTempGrid()
@@ -76,6 +82,9 @@ export function useOuterLineWall(setShowOutlineModal) {
 
     addCanvasMouseEventListener('mouse:down', mouseDown)
     clear()
+    return () => {
+      initEvent()
+    }
   }, [verticalHorizontalMode, points, adsorptionPointAddMode, adsorptionPointMode, adsorptionRange, interval, tempGridMode])
 
   useEffect(() => {

src/hooks/roofcover/useRoofShapePassivitySetting.js

@@ -209,10 +209,12 @@ export function useRoofShapePassivitySetting(setShowRoofShapePassivitySettingMod
 
     wall.lines = [...lines]
     // 기존 그려진 지붕이 없다면
-    if (roofBases.length === 0) {
-      return
+
+    if (isFix.current) {
+      // 완료 한 경우에는 지붕까지 그려줌
+      const roof = drawRoofPolygon(wall)
     }
-    const roof = drawRoofPolygon(wall)
+
     canvas.renderAll()
   }
 

src/store/canvasAtom.js

@@ -289,3 +289,8 @@ export const canGridOptionSeletor = selector({
     return points.length === 0 || outerLineFix
   },
 })
+
+export const globalPitchState = atom({
+  key: 'globalPitch',
+  default: 4,
+})