중복코드 제거

- 추후에 제거 예정

src/components/floor-plan/modal/basic/BasicSetting.jsx

@@ -77,11 +77,13 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
   const [roofsStore, setRoofsStore] = useRecoilState(roofsState)
 
   // const { initEvent } = useContext(EventContext)
-  const { manualModuleSetup, autoModuleSetup, manualFlatroofModuleSetup, autoFlatroofModuleSetup, manualModuleLayoutSetup } =
+  const { manualModuleSetup, autoModuleSetup, manualFlatroofModuleSetup, autoFlatroofModuleSetup, manualModuleLayoutSetup, restoreModuleInstArea } =
     useModuleBasicSetting(tabNum)
   const { updateObjectDate } = useMasterController()
 
   useEffect(() => {
+    const moduleTabNum = basicSetting.roofSizeSet != 3 ? 3 : 2
+
     let hasModules = canvas
       .getObjects()
       .filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
@@ -89,7 +91,7 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
 
     if (hasModules) {
       orientationRef.current.handleNextStep()
-      setTabNum(3)
+      setTabNum(moduleTabNum)
     }
   }, [])
 
@@ -322,22 +324,19 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
 
         <div className="grid-btn-wrap">
           {/* {tabNum === 1 && <button className="btn-frame modal mr5">{getMessage('modal.common.save')}</button>} */}
-
-          {tabNum !== 1 && (
-            <button className="btn-frame modal mr5" onClick={() => setTabNum(tabNum - 1)}>
-              {getMessage('modal.module.basic.setting.prev')}
-            </button>
-          )}
-          {/*{tabNum !== 3 && <button className="btn-frame modal act mr5">{getMessage('modal.common.save')}</button>}*/}
-          {tabNum !== 3 && (
-            <button className="btn-frame modal" onClick={handleBtnNextStep}>
-              Next
-            </button>
-          )}
-
-          {tabNum === 3 && (
+          {basicSetting.roofSizeSet && basicSetting.roofSizeSet != '3' && (
             <>
-              {basicSetting.roofSizeSet && basicSetting.roofSizeSet != '3' && (
+              {tabNum !== 1 && (
+                <button className="btn-frame modal mr5" onClick={() => setTabNum(tabNum - 1)}>
+                  {getMessage('modal.module.basic.setting.prev')}
+                </button>
+              )}
+              {tabNum !== 3 && (
+                <button className="btn-frame modal" onClick={handleBtnNextStep}>
+                  Next
+                </button>
+              )}
+              {tabNum === 3 && (
                 <>
                   <button className={`btn-frame modal mr5 ${isManualModuleLayoutSetup ? 'act' : ''}`} onClick={handleManualModuleLayoutSetup}>
                     {getMessage('modal.module.basic.setting.row.batch')}
@@ -350,9 +349,20 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
                   </button>
                 </>
               )}
-              {basicSetting.roofSizeSet && basicSetting.roofSizeSet == '3' && (
+            </>
+          )}
+          {basicSetting.roofSizeSet && basicSetting.roofSizeSet == '3' && (
+            <>
+              {tabNum === 1 && (
+                <button className="btn-frame modal" onClick={handleBtnNextStep}>
+                  Next
+                </button>
+              )}
+              {tabNum === 2 && (
                 <>
-                  <button className="btn-frame modal mr5">{getMessage('modal.module.basic.setting.row.batch')}</button>
+                  <button className="btn-frame modal mr5" onClick={() => setTabNum(tabNum - 1)}>
+                    {getMessage('modal.module.basic.setting.prev')}
+                  </button>
                   <button className={`btn-frame modal mr5 ${isManualModuleSetup ? 'act' : ''}`} onClick={handleManualModuleSetup}>
                     {getMessage('modal.module.basic.setting.passivity.placement')}
                   </button>

src/components/floor-plan/modal/basic/step/Orientation.jsx

@@ -1,14 +1,12 @@
 import { forwardRef, use, useContext, useEffect, useImperativeHandle, useState } from 'react'
 import { useMessage } from '@/hooks/useMessage'
-import { useOrientation } from '@/hooks/module/useOrientation'
 import { getDegreeInOrientation } from '@/util/canvas-util'
 import { numberCheck } from '@/util/common-utils'
-import { useCanvasPopupStatusController } from '@/hooks/common/useCanvasPopupStatusController'
 import { addedRoofsState, basicSettingState } from '@/store/settingAtom'
 import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil'
 import QSelectBox from '@/components/common/select/QSelectBox'
-import { moduleSelectionDataState } from '@/store/selectedModuleOptions'
 import { roofsState } from '@/store/roofAtom'
+import { useModuleBasicSetting } from '@/hooks/module/useModuleBasicSetting'
 import Swal from 'sweetalert2'
 
 export const Orientation = forwardRef((props, ref) => {
@@ -55,6 +53,7 @@ export const Orientation = forwardRef((props, ref) => {
   const [inputVerticalSnowCover, setInputVerticalSnowCover] = useState('0')
   const [inputRoughness, setInputRoughness] = useState(selectedSurfaceType)
   const [inputStandardWindSpeed, setInputStandardWindSpeed] = useState(standardWindSpeed)
+  const { restoreModuleInstArea } = useModuleBasicSetting()
   const moduleData = {
     header: [
       { name: getMessage('module'), width: 150, prop: 'module', type: 'color-box' },
@@ -67,6 +66,12 @@ export const Orientation = forwardRef((props, ref) => {
     ],
   }
 
+  useEffect(() => {
+    if (basicSetting.roofSizeSet == '3') {
+      restoreModuleInstArea()
+    }
+  }, [])
+
   useEffect(() => {
     if (moduleSelectionData?.common) {
       setInputMargin(moduleSelectionData?.common?.margin)
@@ -108,7 +113,7 @@ export const Orientation = forwardRef((props, ref) => {
         illuminationTp: inputRoughness.clCode,
         illuminationTpNm: inputRoughness.clCodeNm,
         instHt: inputInstallHeight,
-        stdWindSpeed: inputStandardWindSpeed.clCode,
+        stdWindSpeed: inputStandardWindSpeed?.clCode,
         stdSnowLd: inputVerticalSnowCover,
         saleStoreNorthFlg: managementState?.saleStoreNorthFlg,
         moduleTpCd: selectedModules.itemTp,
@@ -125,7 +130,7 @@ export const Orientation = forwardRef((props, ref) => {
         ...managementState,
         installHeight: inputInstallHeight,
         verticalSnowCover: inputVerticalSnowCover,
-        standardWindSpeedId: inputStandardWindSpeed.clCode,
+        standardWindSpeedId: inputStandardWindSpeed?.clCode,
         surfaceType: inputRoughness.clCodeNm,
         surfaceTypeValue: inputRoughness.clCode,
       })
@@ -146,7 +151,7 @@ export const Orientation = forwardRef((props, ref) => {
       })
       updateObjectDataApi({
         objectNo: currentCanvasPlan.objectNo, //오브젝트_no
-        standardWindSpeedId: inputStandardWindSpeed.clCode, //기준풍속코드
+        standardWindSpeedId: inputStandardWindSpeed?.clCode, //기준풍속코드
         verticalSnowCover: inputVerticalSnowCover, //적설량
         surfaceType: inputRoughness.clCodeNm, //면조도구분
         installHeight: inputInstallHeight, //설치높이

src/components/floor-plan/modal/basic/step/Trestle.jsx

@@ -31,6 +31,10 @@ const Trestle = forwardRef((props, ref) => {
     setEavesMargin,
     setRidgeMargin,
     setKerabaMargin,
+    lengthBase,
+    setLengthBase,
+    hajebichi,
+    setHajebichi,
     cvrYn,
     cvrChecked,
     snowGdPossYn,
@@ -44,8 +48,6 @@ const Trestle = forwardRef((props, ref) => {
   })
   const selectedModules = useRecoilValue(selectedModuleState) //선택된 모듈
   // const [moduleSelectionData, setModuleSelectionData] = useRecoilState(moduleSelectionDataState)
-  const [lengthBase, setLengthBase] = useState(0)
-  const [hajebichi, setHajebichi] = useState(0)
   const [selectedRaftBase, setSelectedRaftBase] = useState(null)
   const [selectedTrestle, setSelectedTrestle] = useState(null)
   const [selectedConstMthd, setSelectedConstMthd] = useState(null)
@@ -75,11 +77,6 @@ const Trestle = forwardRef((props, ref) => {
 
   useEffect(() => {
     if (selectedRoof) {
-      setHajebichi(selectedRoof.hajebichi)
-      setEavesMargin(selectedRoof?.eavesMargin ?? 0)
-      setRidgeMargin(selectedRoof?.ridgeMargin ?? 0)
-      setKerabaMargin(selectedRoof?.kerabaMargin ?? 0)
-      setLengthBase(Math.round(selectedRoof?.lenBase ?? 0))
       if (moduleSelectionData?.roofConstructions?.length >= selectedRoof.index + 1) {
         const { construction, trestle, trestleDetail } = moduleSelectionData?.roofConstructions[selectedRoof.index]
         dispatch({
@@ -223,10 +220,10 @@ const Trestle = forwardRef((props, ref) => {
           inclCd: selectedRoof?.pitch ?? 0,
           roofPitch: Math.round(selectedRoof?.roofPchBase ?? 0),
           constTp: constructionList[index].constTp,
+          snowGdPossYn: constructionList[index].snowGdPossYn,
+          cvrYn: constructionList[index].cvrYn,
           mixMatlNo: selectedModules.mixMatlNo,
           workingWidth: selectedRoof?.length?.toString() ?? '',
-          // snowGdPossYn: constructionList[index].snowGdPossYn,
-          // cvrYn: constructionList[index].cvrYn,
         },
       })
 
@@ -247,6 +244,7 @@ const Trestle = forwardRef((props, ref) => {
           kerabaMargin,
           roofIndex: selectedRoof.index,
           trestle: {
+            hajebichi: hajebichi,
             lengthBase: lengthBase,
             ...selectedRaftBase,
             ...selectedTrestle,
@@ -255,6 +253,10 @@ const Trestle = forwardRef((props, ref) => {
           },
           construction: {
             ...constructionList.find((data) => data.constTp === trestleState.constTp),
+            cvrYn: cvrYn,
+            snowGdPossYn: snowGdPossYn,
+            cvrChecked: cvrChecked,
+            snowGdChecked: snowGdChecked,
           },
           trestleDetail: trestleDetail,
         }
@@ -278,6 +280,7 @@ const Trestle = forwardRef((props, ref) => {
           roofIndex: roof.index,
           trestle: {
             lengthBase: lengthBase,
+            hajebichi: hajebichi,
             ...selectedRaftBase,
             ...selectedTrestle,
             ...selectedConstMthd,
@@ -285,6 +288,10 @@ const Trestle = forwardRef((props, ref) => {
           },
           construction: {
             ...constructionList.find((data) => data.constTp === trestleState.constTp),
+            cvrYn,
+            snowGdPossYn,
+            cvrChecked,
+            snowGdChecked,
           },
           trestleDetail: trestleDetail,
         }
@@ -357,7 +364,8 @@ const Trestle = forwardRef((props, ref) => {
               raftBaseCd: roof.raftBaseCd,
             },
             construction: {
-              ...constructionList.find((construction) => newAddedRoofs[index].construction.constTp === construction.constTp),
+              // ...constructionList.find((construction) => newAddedRoofs[index].construction.constTp === construction.constTp),
+              ...roof.construction,
               roofIndex: roof.index,
               setupCover: roof.cvrYn === 'Y',
               setupSnowCover: roof.snowGdYn === 'Y',
@@ -380,8 +388,6 @@ const Trestle = forwardRef((props, ref) => {
     return false
   }
 
-  const getFlag = () => {}
-
   useImperativeHandle(ref, () => ({
     isComplete,
   }))
@@ -553,7 +559,7 @@ const Trestle = forwardRef((props, ref) => {
                   <input
                     type="checkbox"
                     id={`ch02`}
-                    disabled={!trestleState?.snowGdPossYn || trestleState?.snowGdPossYn === 'N'}
+                    disabled={!snowGdPossYn || snowGdPossYn === 'N'}
                     checked={snowGdChecked || false}
                     // onChange={() => dispatch({ type: 'SET_TRESTLE_DETAIL', roof: { ...trestleState, snowGdChecked: !trestleState.snowGdChecked } })}
                     onChange={() => setSnowGdChecked(!snowGdChecked)}

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

@@ -33,14 +33,6 @@ const PitchPlacement = forwardRef((props, refs) => {
     setSelectedItems({ ...selectedItems, [e.target.name]: e.target.checked })
   }
 
-  const moduleData = {
-    header: [
-      { type: 'check', name: '', prop: 'check', width: 70 },
-      { type: 'color-box', name: getMessage('module'), prop: 'module' },
-      { type: 'text', name: `${getMessage('output')} (W)`, prop: 'output', width: 70 },
-    ],
-  }
-
   //체크된 모듈 데이터
   useEffect(() => {
     const checkedModuleIds = Object.keys(selectedItems).filter((key) => selectedItems[key])
@@ -105,87 +97,91 @@ const PitchPlacement = forwardRef((props, refs) => {
 
   return (
     <>
-      <div className="module-table-box mb10">
-        <div className="module-table-inner">
-          <div className="roof-module-table">
-            <table>
-              <thead>
-                <tr>
-                  {moduleData.header.map((data) => (
-                    <th key={data.prop} style={{ width: data.width ? data.width : '' }}>
-                      {data.type === 'check' ? (
-                        <div className="d-check-box no-text pop">
-                          <input type="checkbox" id="ch01" disabled />
-                          <label htmlFor="ch01"></label>
-                        </div>
-                      ) : (
-                        data.name
-                      )}
+      <div className="hexagonal-flex-wrap">
+        <div className="module-table-box ">
+          <div className="module-table-inner">
+            <div className="roof-module-table">
+              <table>
+                <thead>
+                  <tr>
+                    <th style={{ width: '70px' }}>
+                      <div className="d-check-box no-text pop">
+                        <input type="checkbox" id="ch01" disabled />
+                        <label htmlFor="ch01"></label>
+                      </div>
                     </th>
-                  ))}
-                </tr>
-              </thead>
-              <tbody>
-                {selectedModules.itemList &&
-                  selectedModules.itemList.map((item, index) => (
-                    <tr key={index}>
-                      <td className="al-c">
-                        <div className="d-check-box no-text pop">
-                          <input
-                            type="checkbox"
-                            id={item.itemId}
-                            name={item.itemId}
-                            checked={selectedItems[item.itemId]}
-                            onChange={handleSelectedItem}
-                          />
-                          <label htmlFor={item.itemId}></label>
-                        </div>
-                      </td>
-                      <td>
-                        <div className="color-wrap">
-                          <span className="color-box" style={{ backgroundColor: item.color }}></span>
-                          <span className="name">{item.itemNm}</span>
-                        </div>
-                      </td>
-                      <td className="al-r">{item.wpOut}</td>
-                    </tr>
-                  ))}
-              </tbody>
-            </table>
+                    <th>{getMessage('module')}</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  {selectedModules.itemList &&
+                    selectedModules.itemList.map((item, index) => (
+                      <tr key={index}>
+                        <td className="al-c">
+                          <div className="d-check-box no-text pop">
+                            <input
+                              type="checkbox"
+                              id={item.itemId}
+                              name={item.itemId}
+                              checked={selectedItems[item.itemId]}
+                              onChange={handleSelectedItem}
+                            />
+                            <label htmlFor={item.itemId}></label>
+                          </div>
+                        </td>
+                        <td>
+                          <div className="color-wrap">
+                            <span className="color-box" style={{ backgroundColor: item.color }}></span>
+                            <span className="name">{item.itemNm}</span>
+                          </div>
+                        </td>
+                      </tr>
+                    ))}
+                </tbody>
+              </table>
+            </div>
           </div>
         </div>
-      </div>
-      <div className="module-table-box mb10">
-        <div className="module-table-inner">
-          <div className="hexagonal-wrap">
-            <div className="hexagonal-item">
-              <div className="bold-font">{getMessage('modal.module.basic.setting.pitch.module.placement.standard.setting')}</div>
-            </div>
-            <div className="hexagonal-item">
-              <div className="pop-form-radio">
-                <div className="d-check-radio pop">
-                  <input
-                    type="radio"
-                    name="radio01"
-                    id="ra01"
-                    value={'south'}
-                    defaultChecked={setupLocation === 'south'}
-                    onClick={handleSetupLocation}
-                  />
-                  <label htmlFor="ra01">{getMessage('modal.module.basic.setting.pitch.module.placement.standard.setting.south')}</label>
-                </div>
-                <div className="d-check-radio pop">
-                  <input
-                    type="radio"
-                    name="radio01"
-                    id="ra02"
-                    value={'excreta'}
-                    defaultChecked={setupLocation === 'excreta'}
-                    onClick={handleSetupLocation}
-                  />
-                  <label htmlFor="ra02">{getMessage('modal.module.basic.setting.pitch.module.placement.standard.setting.select')}</label>
-                </div>
-              </div>
+        <div className="module-table-box non-flex">
+          <div className="module-table-inner">
+            <div className="roof-module-table">
+              <table>
+                <thead>
+                  <tr>
+                    <th>{getMessage('modal.module.basic.setting.pitch.module.placement.standard.setting')}</th>
+                  </tr>
+                </thead>
+                <tbody>
+                  <tr>
+                    <td>
+                      <div className="hexagonal-radio-wrap">
+                        <div className="d-check-radio pop mb10">
+                          <input
+                            type="radio"
+                            name="radio01"
+                            id="ra01"
+                            value={'south'}
+                            defaultChecked={setupLocation === 'south'}
+                            onClick={handleSetupLocation}
+                          />
+                          <label htmlFor="ra01">{getMessage('modal.module.basic.setting.pitch.module.placement.standard.setting.south')}</label>
+                        </div>
+                        <div className="d-check-radio pop">
+                          <input
+                            type="radio"
+                            name="radio01"
+                            id="ra02"
+                            value={'excreta'}
+                            defaultChecked={setupLocation === 'excreta'}
+                            onClick={handleSetupLocation}
+                          />
+                          <label htmlFor="ra02">{getMessage('modal.module.basic.setting.pitch.module.placement.standard.setting.select')}</label>
+                        </div>
+                      </div>
+                    </td>
+                  </tr>
+                </tbody>
+              </table>
             </div>
           </div>
         </div>

src/hooks/module/useModuleBasicSetting.js

@@ -83,8 +83,6 @@ export function useModuleBasicSetting(tabNum) {
 
   //모듈 선택에서 선택된 값들 넘어옴
   const makeModuleInitArea = () => {
-    console.log('moduleSelectionData', moduleSelectionData)
-
     if (isObjectNotEmpty(moduleSelectionData) && tabNum === 3) {
       if (canvasSetting.roofSizeSet !== '3') {
         const common = moduleSelectionData.common
@@ -115,8 +113,6 @@ export function useModuleBasicSetting(tabNum) {
 
   //가대 상세 데이터 들어오면 실행
   useEffect(() => {
-    console.log('trestleDetailList', trestleDetailList)
-
     if (trestleDetailList.length > 0) {
       let rowColArray = []
       //지붕을 가져옴
@@ -258,8 +254,10 @@ export function useModuleBasicSetting(tabNum) {
         const allPointsOutside = result.every((point) => !originPolygon.inPolygon(point))
 
         if (canvasSetting.roofSizeSet == '3') {
+          const margin = moduleSelectionData.common.margin ? moduleSelectionData.common.margin : 200
+
           //육지붕일때는 그냥 하드코딩
-          offsetPoints = offsetPolygon(roof.points, -30) //육지붕일때
+          offsetPoints = offsetPolygon(roof.points, -Number(margin) / 10) //육지붕일때
         } else {
           //육지붕이 아닐때
           if (allPointsOutside) {
@@ -388,8 +386,6 @@ export function useModuleBasicSetting(tabNum) {
 
   //모듈,회로에서 다른메뉴 -> 배치면으로 갈 경수 초기화
   const restoreModuleInstArea = () => {
-    console.log('tabnum', tabNum)
-
     //설치면 삭제
     const setupArea = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE || obj.name === POLYGON_TYPE.OBJECT_SURFACE)
 
@@ -412,7 +408,7 @@ export function useModuleBasicSetting(tabNum) {
   }
 
   useEffect(() => {
-    if (canvasSetting.roofSizeSet !== '3') {
+    if (canvasSetting.roofSizeSet != '3') {
       if (isObjectNotEmpty(moduleSelectionData) && moduleSelectionData.common.saleStoreNorthFlg === '1') {
         setSaleStoreNorthFlg(true)
       }
@@ -2494,8 +2490,9 @@ export function useModuleBasicSetting(tabNum) {
         }
         return acc
       },
-      { x1: 0, y1: 0, index: -1 }, // 초기값: 무한대와 유효하지 않은 인덱스
+      { x1: -Infinity, y1: -Infinity, index: -1 },
     )
+
     flowArray.push(bottomFlow)
 
     const topFlow = surface.lines.reduce(
@@ -2505,8 +2502,9 @@ export function useModuleBasicSetting(tabNum) {
         }
         return acc
       },
-      { x1: Infinity, y1: Infinity, index: -1 }, // 초기값: 무한대와 유효하지 않은 인덱스
+      { x1: Infinity, y1: Infinity, index: -1 },
     )
+
     flowArray.push(topFlow)
 
     let rtnObjArray = []
@@ -2557,9 +2555,6 @@ export function useModuleBasicSetting(tabNum) {
 
       //디버깅
       const finalLine = new QLine([pointX1, pointY1, pointX2, pointY2], { stroke: 'red', strokeWidth: 1, selectable: true })
-
-      // console.log(`index ${index} : finalLine`, pointX1, pointY1, pointX2, pointY2)
-
       // canvas?.add(finalLine)
       // canvas?.renderAll()
 
@@ -2610,8 +2605,9 @@ export function useModuleBasicSetting(tabNum) {
         }
         return acc
       },
-      { x1: Infinity, y1: Infinity, index: -1 }, // 초기값: 무한대와 유효하지 않은 인덱스
+      { x1: Infinity, y1: Infinity, index: -1 },
     )
+
     flowArray.push(leftFlow)
 
     const rightFlow = surface.lines.reduce(
@@ -2621,8 +2617,9 @@ export function useModuleBasicSetting(tabNum) {
         }
         return acc
       },
-      { x1: 0, y1: 0, index: -1 }, // 초기값: 무한대와 유효하지 않은 인덱스
+      { x1: -Infinity, y1: -Infinity, index: -1 },
     )
+
     flowArray.push(rightFlow)
 
     let rtnObjArray = []
@@ -2834,7 +2831,7 @@ export function useModuleBasicSetting(tabNum) {
 
               targetRoof.fire('modified')
               targetSurface.fire('modified')
-              drawDirectionArrow(targetRoof)
+              // drawDirectionArrow(targetRoof)
             }
             canvas.remove(obj)
           })
@@ -2846,7 +2843,7 @@ export function useModuleBasicSetting(tabNum) {
 
             targetRoof.fire('modified')
             surface.fire('modified')
-            drawDirectionArrow(targetRoof)
+            // drawDirectionArrow(targetRoof)
           })
         }
         canvas.renderAll()
@@ -3082,6 +3079,17 @@ export function useModuleBasicSetting(tabNum) {
 
         addCanvasMouseEventListener('mouse:up', (e) => {
           let isIntersection = true
+
+          if (trestlePolygon.modules.length > 0) {
+            //이미 설치된 모듈중에 한개만 가져옴
+            const mixAsgYn = trestlePolygon.modules[0].moduleInfo.mixAsgYn
+            //현재 체크된 모듈기준으로 혼합가능인지 확인 Y === Y, N === N 일때만 설치 가능
+            if (checkedModule[0].mixAsgYn !== mixAsgYn) {
+              swalFire({ text: getMessage('modal.module.basic.setting.module.placement.mix.asg.yn.error') })
+              return
+            }
+          }
+
           if (!inside) return
           if (tempModule) {
             const rectPoints = [
@@ -3155,6 +3163,16 @@ export function useModuleBasicSetting(tabNum) {
   const autoFlatroofModuleSetup = (placementFlatRef) => {
     initEvent() //마우스 이벤트 초기화
 
+    //혼합 가능 모듈과 혼합 불가능 모듈을 선택했을때 카운트를 해서 확인
+    const mixAsgY = checkedModule.filter((obj) => obj.mixAsgYn === 'Y')
+    const mixAsgN = checkedModule.filter((obj) => obj.mixAsgYn === 'N')
+
+    //Y인 모듈과 N인 모듈이 둘다 존재하면 설치 불가
+    if (mixAsgY.length > 0 && mixAsgN.length > 0) {
+      swalFire({ text: getMessage('modal.module.basic.setting.module.placement.mix.asg.yn.error') })
+      return
+    }
+
     const moduleSetupSurfaces = moduleSetupSurface //선택 설치면
     const notSelectedTrestlePolygons = canvas
       ?.getObjects()
@@ -3220,7 +3238,7 @@ export function useModuleBasicSetting(tabNum) {
           targetRoof.setCoords()
           targetSurface.setCoords()
           moduleSetupSurfaces.push(targetSurface)
-          drawDirectionArrow(targetSurface)
+          // drawDirectionArrow(targetSurface)
         }
         canvas.remove(obj)
       })
@@ -3232,7 +3250,7 @@ export function useModuleBasicSetting(tabNum) {
 
         targetRoof.fire('modified')
         surface.fire('modified')
-        drawDirectionArrow(surface)
+        // drawDirectionArrow(surface)
       })
     }
     canvas.renderAll()

src/hooks/module/useModuleTrestle.js

@@ -54,6 +54,9 @@ export function useModuleTrestle(props) {
   const [roofBaseList, setRoofBaseList] = useState([])
   const [constructionList, setConstructionList] = useState([])
   const { getTrestleList, getConstructionList, getTrestleDetailList } = useMasterController()
+
+  const [lengthBase, setLengthBase] = useState(0)
+  const [hajebichi, setHajebichi] = useState(0)
   const [cvrYn, setCvrYn] = useState('N')
   const [cvrChecked, setCvrChecked] = useState(false)
   const [snowGdPossYn, setSnowGdPossYn] = useState('N')
@@ -76,6 +79,12 @@ export function useModuleTrestle(props) {
     // setEavesMargin(selectedRoof?.addRoof?.eavesMargin ?? 0)
     // setRidgeMargin(selectedRoof?.addRoof?.ridgeMargin ?? 0)
     // setKerabaMargin(selectedRoof?.addRoof?.kerabaMargin ?? 0)
+
+    setHajebichi(selectedRoof?.trestle?.hajebichi ?? 0)
+    setEavesMargin(selectedRoof?.eavesMargin ?? 0)
+    setRidgeMargin(selectedRoof?.ridgeMargin ?? 0)
+    setKerabaMargin(selectedRoof?.kerabaMargin ?? 0)
+    setLengthBase(Math.round(selectedRoof?.trestle?.lengthBase ?? 0))
     setCvrYn(selectedRoof?.construction?.cvrYn ?? 'N')
     setCvrChecked(selectedRoof?.construction?.cvrChecked ?? false)
     setSnowGdPossYn(selectedRoof?.construction?.snowGdPossYn ?? 'N')
@@ -224,6 +233,7 @@ export function useModuleTrestle(props) {
           setRidgeMargin(res[0].data.ridgeIntvl)
           setKerabaMargin(res[0].data.kerabaIntvl)
           setTrestleDetail(res[0].data)
+
           // dispatch({
           //   type: 'SET_TRESTLE_DETAIL',
           //   roof: {
@@ -255,16 +265,20 @@ export function useModuleTrestle(props) {
     handleSetRoofBaseList,
     handleSetConstructionList,
     handleSetTrestleDetailData,
+    lengthBase,
+    setLengthBase,
+    hajebichi,
+    setHajebichi,
+    cvrYn,
+    cvrChecked,
+    snowGdPossYn,
+    snowGdChecked,
     eavesMargin,
     ridgeMargin,
     kerabaMargin,
     setEavesMargin,
     setRidgeMargin,
     setKerabaMargin,
-    cvrYn,
-    cvrChecked,
-    snowGdPossYn,
-    snowGdChecked,
     setCvrYn,
     setCvrChecked,
     setSnowGdPossYn,

src/hooks/module/useTrestle.js

@@ -1049,9 +1049,7 @@ export const useTrestle = () => {
     if (!rackInfos) {
       const maxRows = surface.trestleDetail.moduleMaxRows
       const maxCols = surface.trestleDetail.moduleMaxCols
-      const msg = `選択した家で設置可能
-モジュールの最大段数は${maxRows}、最大列数は${maxCols}です。
-上限より上部に取り付けたモジュールを削除してください。`
+      const msg = `段数の上限は${maxRows}段です。 上限より上の段には設置できません`
       swalFire({ title: msg, type: 'alert' })
       throw new Error('rackInfos is null')
     }

src/hooks/roofcover/useOuterLineWall.js

@@ -32,6 +32,7 @@ import { outlineDisplaySelector } from '@/store/settingAtom'
 import { usePopup } from '@/hooks/usePopup'
 import PropertiesSetting from '@/components/floor-plan/modal/outerlinesetting/PropertiesSetting'
 import Big from 'big.js'
+import RoofShapeSetting from '@/components/floor-plan/modal/roofShape/RoofShapeSetting'
 
 //외벽선 그리기
 export function useOuterLineWall(id, propertiesId) {
@@ -256,7 +257,7 @@ export function useOuterLineWall(id, propertiesId) {
         canvas?.renderAll()
         setOuterLineFix(true)
         closePopup(id)
-        addPopup(propertiesId, 1, <PropertiesSetting id={propertiesId} pos={{ x: 50, y: 230 }} />)
+        addPopup(propertiesId, 1, <RoofShapeSetting id={propertiesId} pos={{ x: 50, y: 230 }} />)
       }
 
       if (points.length < 3) {

src/locales/ja.json

@@ -128,9 +128,9 @@
   "modal.module.basic.setting.module.placement.arrangement.standard.eaves": "軒の側",
   "modal.module.basic.setting.module.placement.arrangement.standard.ridge": "龍丸側",
   "modal.module.basic.setting.module.placement.maximum": "最大配置",
-  "modal.module.basic.setting.pitch.module.placement.standard.setting": "配置基準設定",
-  "modal.module.basic.setting.pitch.module.placement.standard.setting.south": "南向き設置",
-  "modal.module.basic.setting.pitch.module.placement.standard.setting.select": "指定した辺を基準に設置",
+  "modal.module.basic.setting.pitch.module.placement.standard.setting": "配置基準の設定",
+  "modal.module.basic.setting.pitch.module.placement.standard.setting.south": "南向きに設置す",
+  "modal.module.basic.setting.pitch.module.placement.standard.setting.select": "指定した辺を基準に設置する",
   "modal.module.basic.setting.pitch.module.allocation.setting": "割り当て設定",
   "modal.module.basic.setting.pitch.module.allocation.setting.info": "※配置パネルの種類が1種類の場合のみ使用できます。",
   "modal.module.basic.setting.pitch.module.row.amount": "単数",

startscript-3000.js

@@ -0,0 +1,2 @@
+var exec = require('child_process').exec
+exec('yarn dev -p 3000', { windowsHide: true })