diff --git a/public/static/images/canvas/roof_warning_correct.png b/public/static/images/canvas/roof_warning_correct.png new file mode 100644 index 00000000..4f9741a5 Binary files /dev/null and b/public/static/images/canvas/roof_warning_correct.png differ diff --git a/public/static/images/canvas/roof_warning_wrong.png b/public/static/images/canvas/roof_warning_wrong.png new file mode 100644 index 00000000..3a245d51 Binary files /dev/null and b/public/static/images/canvas/roof_warning_wrong.png differ diff --git a/src/components/floor-plan/modal/basic/step/Placement.jsx b/src/components/floor-plan/modal/basic/step/Placement.jsx index 29ea0d10..aaab0add 100644 --- a/src/components/floor-plan/modal/basic/step/Placement.jsx +++ b/src/components/floor-plan/modal/basic/step/Placement.jsx @@ -12,10 +12,12 @@ import { import { useRecoilState, useRecoilValue, useResetRecoilState, useSetRecoilState } from 'recoil' import { moduleSelectionDataState, selectedModuleState } from '@/store/selectedModuleOptions' import { isObjectNotEmpty } from '@/util/common-utils' +import Image from 'next/image' const Placement = forwardRef((props, refs) => { const { getMessage } = useMessage() const [useTab, setUseTab] = useState(true) + const [guideType, setGuideType] = useState('batch') const [isChidoriNotAble, setIsChidoriNotAble] = useState(false) @@ -317,62 +319,91 @@ const Placement = forwardRef((props, refs) => { -
-
setUseTab(!useTab)}> - {getMessage('modal.module.basic.setting.module.placement.max.size.check')} - +
+
+ {getMessage('modal.module.basic.setting.module.placement.info')} +
-
-
-
-
- - - - - {selectedModules && - selectedModules.itemList?.map((item) => ( - // - ))} - {colspan > 1 && } - - - {selectedModules && - selectedModules.itemList?.map((item) => ( - <> - - {/* {colspan > 1 && } */} - - ))} - - - - {moduleSelectionData.roofConstructions.map((item, index) => ( - - - {moduleRowColArray[index]?.map((item, index2) => ( - <> - - {/* {colspan > 1 && } */} - {colspan > 1 && index2 === moduleRowColArray[index].length - 1 && } - - ))} - - ))} - -
- -
- - {item.itemNm} -
-
{getMessage('modal.module.basic.setting.module.placement.max.rows.multiple')}
{getMessage('modal.module.basic.setting.module.placement.max.row')}{getMessage('modal.module.basic.setting.module.placement.max.rows.multiple')}
-
- - {item.addRoof?.roofMatlNmJp} -
-
{item.moduleMaxRows}{item.mixModuleMaxRows}{item.maxRow}
+
+
+ +
+ {guideType === 'batch' && ( +
+
+ {getMessage('modal.module.basic.setting.module.placement.info.batch.content1')} +
+ {getMessage('modal.module.basic.setting.module.placement.info.batch.content2')} +
+
+
+ +
+
+ +
+
+
+ )} + {guideType === 'module' && ( +
+
+
+ + + + + {selectedModules && + selectedModules.itemList?.map((item) => ( + // + ))} + {colspan > 1 && } + + + {selectedModules && + selectedModules.itemList?.map((item) => ( + <> + + {/* {colspan > 1 && } */} + + ))} + + + + {moduleSelectionData.roofConstructions.map((item, index) => ( + + + {moduleRowColArray[index]?.map((item, index2) => ( + <> + + {/* {colspan > 1 && } */} + {colspan > 1 && index2 === moduleRowColArray[index].length - 1 && } + + ))} + + ))} + +
+ +
+ + {item.itemNm} +
+
{getMessage('modal.module.basic.setting.module.placement.max.rows.multiple')}
{getMessage('modal.module.basic.setting.module.placement.max.row')}{getMessage('modal.module.basic.setting.module.placement.max.rows.multiple')}
+
+ + {item.addRoof?.roofMatlNmJp} +
+
{item.moduleMaxRows}{item.mixModuleMaxRows}{item.maxRow}
+
+
+
+ )}
diff --git a/src/locales/ja.json b/src/locales/ja.json index 0882c1d7..4ce9156b 100644 --- a/src/locales/ja.json +++ b/src/locales/ja.json @@ -1105,6 +1105,11 @@ "module.layout.setup.max.count": "モジュールの単体での最大段数は{0}、最大列数は{1}です。 (JA)", "module.layout.setup.max.count.multiple": "モジュール{0}の単体での最大段数は{1}、最大列数は{2}です。 (JA)", "roofAllocation.not.found": "割り当てる屋根がありません。 (JA)", + "modal.module.basic.setting.module.placement.info": "モジュール配置案内", + "modal.module.basic.setting.module.placement.info.batch": "千鳥配置を手動で行う際の注意事項", + "modal.module.basic.setting.module.placement.info.batch.content1": "千鳥配置する時に図のような配置ができてしまいますが、正常な積算ができません。", + "modal.module.basic.setting.module.placement.info.batch.content2": "千鳥で配置する時は、千鳥配置を「する」にして、モジュールが吸着されるようにして下さい。", + "modal.module.basic.setting.module.placement.info.module": "屋根材別 単一・混合モジュールの最大段数", "modal.module.basic.setting.module.placement.max.size.check": "屋根材別モジュールの単体の単体での最大段数、2種混合の段数を確認して下さい", "modal.module.basic.setting.module.placement.max.row": "単体で\rの最大段数", "modal.module.basic.setting.module.placement.max.rows.multiple": "2種混合時\rの最大段数", diff --git a/src/locales/ko.json b/src/locales/ko.json index 67176ee8..11bc85c9 100644 --- a/src/locales/ko.json +++ b/src/locales/ko.json @@ -1105,6 +1105,11 @@ "module.layout.setup.max.count": "모듈의 최대 단수는 {0}, 최대 열수는 {1} 입니다.", "module.layout.setup.max.count.multiple": "모듈 {0}번의 최대 단수는 {1}, 최대 열수는 {2} 입니다.", "roofAllocation.not.found": "할당할 지붕이 없습니다.", + "modal.module.basic.setting.module.placement.info": "모듈 배치 안내", + "modal.module.basic.setting.module.placement.info.batch": "치도리 수동 배치 시 유의사항", + "modal.module.basic.setting.module.placement.info.batch.content1": "치조 배치할 때 그림과 같은 배치가 되어 버립니다만, 정상적인 적산을 할 수 없습니다.", + "modal.module.basic.setting.module.placement.info.batch.content2": "치조로 배치할 때는, 치조 배치를 「한다」로 하고, 모듈이 흡착되도록 해 주세요.", + "modal.module.basic.setting.module.placement.info.module": "지붕재별 단일·혼합 모듈 최대 단수", "modal.module.basic.setting.module.placement.max.size.check": "지붕재별 모듈 단체의 최대 단수, 2종 혼합 단수를 확인하십시오.", "modal.module.basic.setting.module.placement.max.row": "최대 단수", "modal.module.basic.setting.module.placement.max.rows.multiple": "2종 혼합 최대단수", diff --git a/src/styles/_modal.scss b/src/styles/_modal.scss index 30c18715..c90372bf 100644 --- a/src/styles/_modal.scss +++ b/src/styles/_modal.scss @@ -2457,3 +2457,22 @@ $alert-color: #101010; } } } + +// 2025-05-30 지붕 모듈 +.roof-warning-img-wrap{ + display: flex; + align-items: center; + gap: 15px; + justify-content: center; +} + +.roof-content-tab-wrap{ + display: flex; + padding-top: 10px; +} +.hide-tab-contents{ + &.hide{ + height: 0; + overflow: hidden; + } +} \ No newline at end of file