contextmenu 모듈 기능 구현 중

src/common/common.js

@@ -112,6 +112,7 @@ export const POLYGON_TYPE = {
   WALL: 'wall',
   TRESTLE: 'trestle',
   MODULE_SETUP_SURFACE: 'moduleSetupSurface',
+  MODULE: 'module',
 }
 
 export const SAVE_KEY = [

src/components/floor-plan/modal/eavesGable/type/Eaves.jsx

@@ -20,7 +20,7 @@ export default function Eaves({ pitchRef, offsetRef, widthRef, radioTypeRef, pit
             {getMessage('slope')}
           </span>
           <div className="input-grid mr5" style={{ width: '100px' }}>
-            <input type="number" className="input-origin block" defaultValue={currentAngleType === ANGLE_TYPE.SLOPE ? 4 : 21.8} ref={pitchRef} />
+            <input type="text" className="input-origin block" defaultValue={currentAngleType === ANGLE_TYPE.SLOPE ? 4 : 21.8} ref={pitchRef} />
           </div>
           <span className="thin">{pitchText}</span>
         </div>
@@ -29,7 +29,7 @@ export default function Eaves({ pitchRef, offsetRef, widthRef, radioTypeRef, pit
             {getMessage('offset')}
           </span>
           <div className="input-grid mr5" style={{ width: '100px' }}>
-            <input type="number" className="input-origin block" defaultValue={500} ref={offsetRef} />
+            <input type="text" className="input-origin block" defaultValue={500} ref={offsetRef} />
           </div>
           <span className="thin">mm</span>
         </div>

src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx

@@ -72,7 +72,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
       width: roofRef.width.current?.value,
       length: roofRef.length.current?.value,
       hajebichi: roofRef.hajebichi.current?.value,
-      raft: roofRef.rafter.current?.value,
+      // raft: roofRef.rafter.current?.value,
       selected: true,
       layout: roofLayout,
     }
@@ -80,7 +80,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
     const addedRoofs = []
     addedRoofs.push(roofInfo)
 
-    setBasicSettings({
+    console.log('save Info', {
       ...basicSetting,
       selectedRoofMaterial: {
         // 선택된 지붕재 정보
@@ -88,6 +88,14 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
       },
       roofs: addedRoofs,
     })
+    setBasicSettings({
+      ...basicSetting,
+      selectedRoofMaterial: {
+        // 선택된 지붕재 정보
+        ...roofInfo,
+      },
+      roofs: addedRoofs,
+    })
     basicSettingSave()
   }
 
@@ -277,7 +285,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
                               options={raftCodes.map((raft, index) => {
                                 return { ...raft, name: globalLocale === 'ko' ? raft.clCodeNm : raft.clCodeNmJp }
                               })}
-                              value={currentRoofMaterial}
+                              value={raftCodes.find((r) => r.clCode === currentRoofMaterial.raftBaseCd)}
                               onChange={(e) => handleRafterChange(e.clCode)}
                             />
                             {/* <select className="select-light dark" name="roofGap" ref={roofRef.rafter}>

src/components/floor-plan/modal/roofAllocation/RoofAllocationSetting.jsx

@@ -33,7 +33,7 @@ export default function RoofAllocationSetting(props) {
   const globalLocale = useRecoilValue(globalLocaleStore)
   useEffect(() => {
     const raftCodeList = findCommonCode('203800')
-    setRaftCodes(raftCodeList.map((raft) => ({ ...raft, value: raft.clCode, name: raft.clCodeNm })))
+    setRaftCodes(raftCodeList.map((raft) => ({ ...raft, name: raft.clCodeNm })))
   }, [])
 
   return (
@@ -52,9 +52,10 @@ export default function RoofAllocationSetting(props) {
             <div className="grid-select">
               <QSelectBox
                 options={roofMaterials}
+                value={roofMaterials[0]}
                 onChange={(e) => {
-                  const selected = roofMaterials.find((roofMaterial) => roofMaterial.roofMatlCd === e.id)
+                  // const selected = roofMaterials.find((roofMaterial) => roofMaterial.roofMatlCd === e.id)
-                  setCurrentRoofMaterial(selected)
+                  setCurrentRoofMaterial(e)
                 }}
               />
             </div>
@@ -122,10 +123,7 @@ export default function RoofAllocationSetting(props) {
                             <div className="flex-ment">
                               <span>{getMessage('modal.placement.initial.setting.rafter')}</span>
                               <div className="grid-select" style={{ width: '160px' }}>
-                                <QSelectBox
+                                <QSelectBox options={raftCodes} value={raftCodes.find((r) => r.clCode === roof.raftBaseCd)} />
-                                  options={raftCodes.map((raft) => ({ ...raft, name: globalLocale === 'ko' ? raft.clCodeNm : raft.clCodeNmJp }))}
-                                  value={raftCodes.find((r) => r.id === roof.id)}
-                                />
                               </div>
                             </div>
                           </div>

src/hooks/roofcover/useRoofAllocationSetting.js

@@ -117,16 +117,18 @@ export function useRoofAllocationSetting(id) {
     let result = false
 
     roofBases.forEach((roof) => {
-      roof.innerLines.forEach((line) => {
+      if (roof.separatePolygon.length === 0) {
-        if (!line.attributes.actualSize || line.attributes?.actualSize === 0) {
+        roof.innerLines.forEach((line) => {
-          line.set({
+          if (!line.attributes.actualSize || line.attributes?.actualSize === 0) {
-            strokeWidth: 4,
+            line.set({
-            stroke: 'black',
+              strokeWidth: 4,
-            selectable: true,
+              stroke: 'black',
-          })
+              selectable: true,
-          result = true
+            })
-        }
+            result = true
-      })
+          }
+        })
+      }
     })
     if (result) canvas?.renderAll()
 

src/hooks/useContextMenu.js

@@ -620,12 +620,12 @@ export function useContextMenu() {
               {
                 id: 'columnMove',
                 name: getMessage('contextmenu.column.move'),
-                component: <PanelEdit id={popupId} type={'move'} />,
+                component: <PanelEdit id={popupId} type={'columnMove'} />,
               },
               {
                 id: 'columnCopy',
                 name: getMessage('contextmenu.column.copy'),
-                component: <PanelEdit id={popupId} type={'copy'} />,
+                component: <PanelEdit id={popupId} type={'columnCopy'} />,
               },
               {
                 id: 'columnRemove',
@@ -642,12 +642,12 @@ export function useContextMenu() {
               {
                 id: 'rowMove',
                 name: getMessage('contextmenu.row.move'),
-                component: <PanelEdit id={popupId} type={'move'} />,
+                component: <PanelEdit id={popupId} type={'rowMove'} />,
               },
               {
                 id: 'rowCopy',
                 name: getMessage('contextmenu.row.copy'),
-                component: <PanelEdit id={popupId} type={'copy'} />,
+                component: <PanelEdit id={popupId} type={'rowCopy'} />,
               },
               {
                 id: 'rowRemove',

src/util/canvas-util.js

@@ -751,6 +751,10 @@ export const pointsToTurfPolygon = (points) => {
   return turf.polygon([coordinates])
 }
 
+export function isOverlap(polygon1, polygon2) {
+  return turf.booleanOverlap(polygon1, polygon2)
+}
+
 export const triangleToPolygon = (triangle) => {
   const points = []
   const halfWidth = triangle.width / 2