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

src/components/floor-plan/CanvasMenu.jsx

@@ -308,9 +308,10 @@ export default function CanvasMenu(props) {
     }
   }, [type, globalLocale])
 
-  useEffect(() => {
+  /*useEffect(() => {
-    if (!selectedRoofMaterial) return
+    if (menuNumber === 1) {
-    //if (Object.keys(basicSetting).length === 0 || !basicSetting.roofSizeSet) return
+      return
+    }
     setMenuNumber(1)
     // if ([2, 3].some((num) => num === canvasSetting?.roofSizeSet)) {
     //   setMenuNumber(3)
@@ -321,7 +322,7 @@ export default function CanvasMenu(props) {
     //   setType('outline')
     //   setCurrentMenu(MENU.ROOF_COVERING.EXTERIOR_WALL_LINE)
     // }
-  }, [selectedRoofMaterial])
+  }, [basicSetting])*/
 
   const checkMenuState = (menu) => {
     return (['2', '3'].includes(canvasSetting?.roofSizeSet) && menu.index === 2) || (menuNumber === 4 && menu.index === 2)

src/components/floor-plan/FloorPlan.jsx

@@ -25,6 +25,7 @@ export default function FloorPlan({ children }) {
   useEffect(() => {
     ///setCorrentObjectNo(floorPlanState.objectNo)
     //console.log('FloorPlan objectNo ', floorPlanState.objectNo, correntObjectNo)
+    setMenuNumber(1)
     fetchSettings()
     return () => {
       closeAll()

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

@@ -8,8 +8,8 @@ import MaterialGuide from '@/components/floor-plan/modal/placementShape/Material
 import WithDraggable from '@/components/common/draggable/WithDraggable'
 
 import { useCanvasSetting } from '@/hooks/option/useCanvasSetting'
-import { useRecoilValue } from 'recoil'
+import { useRecoilState, useRecoilValue } from 'recoil'
-import { roofMaterialsAtom } from '@/store/settingAtom'
+import { addedRoofsState, roofMaterialsAtom } from '@/store/settingAtom'
 import { useCommonCode } from '@/hooks/common/useCommonCode'
 import QSelectBox from '@/components/common/select/QSelectBox'
 import { globalLocaleStore } from '@/store/localeAtom'
@@ -28,10 +28,11 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
   const roofMaterials = useRecoilValue(roofMaterialsAtom)
 
   const globalLocale = useRecoilValue(globalLocaleStore)
-  const { basicSetting, setBasicSettings, basicSettingSave, addedRoofs, setAddedRoofs } = useCanvasSetting()
+  const { basicSetting, setBasicSettings, basicSettingSave } = useCanvasSetting()
+  const [addedRoofs, setAddedRoofs] = useRecoilState(addedRoofsState)
   const { findCommonCode } = useCommonCode()
   const [raftCodes, setRaftCodes] = useState([]) // 서까래 정보
-  const [currentRoof, setCurrentRoof] = useState(addedRoofs[0]) // 현재 선택된 지붕재 정보
+  const [currentRoof, setCurrentRoof] = useState(null) // 현재 선택된 지붕재 정보
 
   const roofRef = {
     roofCd: useRef(null),
@@ -67,6 +68,12 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
     }
   }, [])
 
+  useEffect(() => {
+    if (addedRoofs.length > 0) {
+      setCurrentRoof({ ...addedRoofs[0] })
+    }
+  }, [addedRoofs])
+
   useEffect(() => {
     console.log('🚀 ~ fetchBasicSettings ~ currentRoof :', currentRoof)
     if (!currentRoof) return
@@ -200,7 +207,8 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
                       {currentRoof &&
                         roofSizeSetArray.map((item) => (
                           <div className="d-check-radio pop" key={item.id}>
-                          <input type="radio" 
+                            <input
+                              type="radio"
                               id={item.id}
                               name={item.name}
                               value={item.value}
@@ -209,8 +217,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
                             />
                             <label htmlFor={item.id}>{getMessage(item.message)}</label>
                           </div>
-                        ))
+                        ))}
-                      }
                     </div>
                   </td>
                 </tr>
@@ -221,7 +228,8 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
                       {currentRoof &&
                         roofAngleSetArray.map((item) => (
                           <div className="d-check-radio pop" key={item.id}>
-                          <input type="radio"
+                            <input
+                              type="radio"
                               id={item.id}
                               name={item.name}
                               value={item.value}
@@ -230,8 +238,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
                             />
                             <label htmlFor={item.id}>{getMessage(item.message)}</label>
                           </div>
-                        ))
+                        ))}
-                      }
                     </div>
                   </td>
                 </tr>

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

@@ -47,6 +47,8 @@ export default function RoofAllocationSetting(props) {
   return (
     <WithDraggable isShow={true} pos={pos}>
       <div className={`modal-pop-wrap lr mount`}>
+        {currentRoofList && (
+          <>
             <div className="modal-head">
               <h1 className="title">{getMessage('plan.menu.estimate.roof.alloc')}</h1>
               <button className="modal-close" onClick={() => closePopup(id)}>
@@ -231,6 +233,8 @@ export default function RoofAllocationSetting(props) {
                 </button>
               </div>
             </div>
+          </>
+        )}
       </div>
     </WithDraggable>
   )

src/hooks/option/useCanvasSetting.js

@@ -23,6 +23,7 @@ import {
   roofMaterialsAtom,
   selectedRoofMaterialSelector,
   addedRoofsState,
+  fetchRoofMaterialsState,
 } from '@/store/settingAtom'
 import { MENU, POLYGON_TYPE } from '@/common/common'
 import { globalFontAtom } from '@/store/fontAtom'
@@ -77,6 +78,7 @@ export function useCanvasSetting() {
   const [gridColor, setGridColor] = useRecoilState(gridColorState)
   const [color, setColor] = useColor(gridColor ?? '#FF0000')
   const { menuNumber, setMenuNumber } = useCanvasMenu()
+
   const [settingsData, setSettingsData] = useState({
     ...settingModalFirstOptions,
     ...settingModalSecondOptions,
@@ -102,6 +104,7 @@ export function useCanvasSetting() {
   const { getRoofMaterialList, getModuleTypeItemList } = useMasterController()
   const [roofMaterials, setRoofMaterials] = useRecoilState(roofMaterialsAtom)
   const [addedRoofs, setAddedRoofs] = useRecoilState(addedRoofsState)
+  const [fetchRoofMaterials, setFetchRoofMaterials] = useRecoilState(fetchRoofMaterialsState)
   const [type, setType] = useRecoilState(menuTypeState)
   const setCurrentMenu = useSetRecoilState(currentMenuState)
   const SelectOptions = [
@@ -114,10 +117,10 @@ export function useCanvasSetting() {
   const selectedRoofMaterial = useRecoilValue(selectedRoofMaterialSelector)
 
   useEffect(() => {
-    if (roofMaterials.length !== 0) {
+    setFetchRoofMaterials(!fetchRoofMaterials)
-      return
+    if (fetchRoofMaterials) {
-    }
       addRoofMaterials()
+    }
   }, [])
 
   //지붕재 초기세팅
@@ -404,7 +407,6 @@ export function useCanvasSetting() {
         ],
       }
 
-
       await post({ url: `/api/canvas-management/canvas-basic-settings`, data: patternData }).then((res) => {
         swalFire({ text: getMessage(res.returnMessage) })
       })

src/hooks/roofcover/useRoofAllocationSetting.js

@@ -42,15 +42,20 @@ export function useRoofAllocationSetting(id) {
   const [currentRoofMaterial, setCurrentRoofMaterial] = useState(roofMaterials[0]) // 팝업 내 기준 지붕재
   const [roofList, setRoofList] = useRecoilState(addedRoofsState) // 배치면 초기설정에서 선택한 지붕재 배열
   const [editingLines, setEditingLines] = useState([])
-  const [currentRoofList, setCurrentRoofList] = useState(roofList)
+  const [currentRoofList, setCurrentRoofList] = useState(null)
   const currentAngleType = useRecoilValue(currentAngleTypeSelector)
   const globalLocaleState = useRecoilValue(globalLocaleStore)
+  const [basicInfo, setBasicInfo] = useState(null)
   const { get, post } = useAxios(globalLocaleState)
   const { getMessage } = useMessage()
   const { swalFire } = useSwal()
 
   const { setSurfaceShapePattern } = useRoofFn()
 
+  useEffect(() => {
+    setCurrentRoofList(roofList)
+  }, [])
+
   useEffect(() => {
     const roofBases = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.ROOF) // roofPolygon.innerLines
 
@@ -133,6 +138,8 @@ export function useRoofAllocationSetting(id) {
 
         console.log('fetchBasicSettings roofsArray', roofsArray)
 
+        console.log(roofsArray)
+
         // 데이터 설정
         const selectRoofs = []
         for (let i = 0; i < roofsArray.length; i++) {
@@ -155,7 +162,7 @@ export function useRoofAllocationSetting(id) {
           })
         }
 
-        setCurrentRoofList(selectRoofs)
+        // setCurrentRoofList(selectRoofs)
         //setBasicSetting({ ...basicSetting, roofsData: roofsArray })
         setBasicSetting({
           ...basicSetting,
@@ -163,6 +170,10 @@ export function useRoofAllocationSetting(id) {
           roofAngleSet: res[0].roofAngleSet,
           roofsData: roofsArray,
         })
+        setBasicInfo({
+          roofSizeSet: '' + res[0].roofSizeSet,
+          roofAngleSet: '' + res[0].roofAngleSet,
+        })
       })
     } catch (error) {
       console.error('Data fetching error:', error)
@@ -321,8 +332,9 @@ export function useRoofAllocationSetting(id) {
     })
 
     const newRoofList = currentRoofList.map((roof, idx) => {
-      return { ...roof, index: idx }
+      return { ...roof, index: idx, ...basicInfo }
     })
+    console.log('basicInfo', newRoofList)
 
     setBasicSetting((prev) => {
       return {
@@ -330,7 +342,6 @@ export function useRoofAllocationSetting(id) {
         selectedRoofMaterial: newRoofList.find((roof) => roof.selected),
       }
     })
-
     setRoofList(newRoofList)
 
     const roofs = canvas.getObjects().filter((obj) => obj.name === 'roof')

src/store/settingAtom.js

@@ -244,3 +244,8 @@ export const correntObjectNoState = atom({
   key: 'correntObjectNoState',
   default: '',
 })
+
+export const fetchRoofMaterialsState = atom({
+  key: 'fetchRoofMaterialsState',
+  default: false,
+})