diff --git a/src/components/common/select/QSelectBox.jsx b/src/components/common/select/QSelectBox.jsx index 75a17bc1..bd888ac3 100644 --- a/src/components/common/select/QSelectBox.jsx +++ b/src/components/common/select/QSelectBox.jsx @@ -59,8 +59,6 @@ export default function QSelectBox({ const ref = useRef(null) const handleClickSelectOption = (option) => { - console.log('๐Ÿš€ ~ handleClickSelectOption ~ option:', option) - setSelected(showKey !== '' ? option[showKey] : option.name) onChange?.(option, params) } diff --git a/src/components/floor-plan/modal/basic/step/Module.jsx b/src/components/floor-plan/modal/basic/step/Module.jsx index 73ee88b9..0d5a552c 100644 --- a/src/components/floor-plan/modal/basic/step/Module.jsx +++ b/src/components/floor-plan/modal/basic/step/Module.jsx @@ -1,13 +1,13 @@ import { useEffect, useState, useReducer } from 'react' import { useRecoilValue, useRecoilState } from 'recoil' import { addedRoofsState } from '@/store/settingAtom' -import { canvasSettingState, currentCanvasPlanState, pitchSelector } from '@/store/canvasAtom' +import { currentCanvasPlanState } from '@/store/canvasAtom' import { useMessage } from '@/hooks/useMessage' import QSelectBox from '@/components/common/select/QSelectBox' import { useModuleSelection } from '@/hooks/module/useModuleSelection' import ModuleTabContents from './ModuleTabContents' -import { useDebounceCallback, useDebounceValue } from 'usehooks-ts' -import { moduleSelectionDataPlanListState, moduleSelectionDataState } from '@/store/selectedModuleOptions' +import { useDebounceValue } from 'usehooks-ts' +import { moduleSelectionDataState } from '@/store/selectedModuleOptions' export default function Module({ setTabNum }) { const { getMessage } = useMessage() @@ -18,7 +18,6 @@ export default function Module({ setTabNum }) { const { moduleSelectionInitParams, selectedModules, - raftCodes, roughnessCodes, windSpeedCodes, managementState, @@ -39,12 +38,14 @@ export default function Module({ setTabNum }) { const [debouncedVerticalSnowCover] = useDebounceValue(inputVerticalSnowCover, 500) const [moduleSelectionData, setModuleSelectionData] = useRecoilState(moduleSelectionDataState) //๋‹ค์Œ์œผ๋กœ ๋„˜์–ด๊ฐ€๋Š” ์ตœ์ข… ๋ฐ์ดํ„ฐ - const [moduleSelectionDataPlanList, setModuleSelectionDataPlanList] = useRecoilState(moduleSelectionDataPlanListState) - const [tempModuleSelectionData, setTempModuleSelectionData] = useReducer((prevState, nextState) => { return { ...prevState, ...nextState } }, moduleSelectionData) + useEffect(() => { + setModuleSelectionData(tempModuleSelectionData) + }, [tempModuleSelectionData]) + useEffect(() => { handleChangeInstallHeight(debouncedInstallHeight) }, [debouncedInstallHeight]) @@ -53,11 +54,6 @@ export default function Module({ setTabNum }) { handleChangeVerticalSnowCover(debouncedVerticalSnowCover) }, [debouncedVerticalSnowCover]) - useEffect(() => { - setInputInstallHeight(installHeight) - setInputVerticalSnowCover(verticalSnowCover) - }, [installHeight, verticalSnowCover]) - const moduleData = { header: [ { name: getMessage('module'), width: 150, prop: 'module', type: 'color-box' }, @@ -231,10 +227,9 @@ export default function Module({ setTabNum }) { index={index} addRoof={roof} roofTab={index} - moduleConstructionSelectionData={moduleSelectionData?.roofConstructions[index]} tempModuleSelectionData={tempModuleSelectionData} setTempModuleSelectionData={setTempModuleSelectionData} - selectedModule={selectedModules} + moduleSelectionData={moduleSelectionData} setModuleSelectionData={setModuleSelectionData} /> diff --git a/src/components/floor-plan/modal/basic/step/ModuleTabContents.jsx b/src/components/floor-plan/modal/basic/step/ModuleTabContents.jsx index 90982086..28b32d5b 100644 --- a/src/components/floor-plan/modal/basic/step/ModuleTabContents.jsx +++ b/src/components/floor-plan/modal/basic/step/ModuleTabContents.jsx @@ -1,20 +1,19 @@ -import { useEffect, useState, useRef } from 'react' -import { useRecoilValue } from 'recoil' +import { useEffect, useState, useRef, useReducer } from 'react' +import { useRecoilValue, useRecoilState } from 'recoil' import { currentCanvasPlanState, pitchTextSelector } from '@/store/canvasAtom' import { useMessage } from '@/hooks/useMessage' import { useMasterController } from '@/hooks/common/useMasterController' import { useCommonCode } from '@/hooks/common/useCommonCode' -import { moduleSelectionInitParamsState } from '@/store/selectedModuleOptions' +import { moduleSelectionDataState, moduleSelectionInitParamsState, selectedModuleState } from '@/store/selectedModuleOptions' import { isObjectNotEmpty } from '@/util/common-utils' import QSelectBox from '@/components/common/select/QSelectBox' export default function ModuleTabContents({ addRoof, roofTab, - moduleConstructionSelectionData, tempModuleSelectionData, setTempModuleSelectionData, - selectedModule, + moduleSelectionData, setModuleSelectionData, }) { const { getMessage } = useMessage() @@ -24,6 +23,7 @@ export default function ModuleTabContents({ const { findCommonCode } = useCommonCode() const [raftCodes, setRaftCodes] = useState([]) //๊ฐ€๋Œ€ ๋ชฉ๋ก + const [trestleList, setTrestleList] = useState([]) const [constMthdList, setConstMthdList] = useState([]) const [roofBaseList, setRoofBaseList] = useState([]) @@ -53,12 +53,17 @@ export default function ModuleTabContents({ const [isExistData, setIsExistData] = useState(false) + const [selectedModules, setSelectedModules] = useRecoilState(selectedModuleState) //์„ ํƒ๋œ ๋ชจ๋“ˆ + const [moduleConstructionSelectionData, setModuleConstructionSelectionData] = useState() + + useEffect(() => { + setModuleConstructionSelectionData(moduleSelectionData.roofConstructions[roofTab]) + }, [moduleSelectionData]) + //์„œ๊นŒ๋ž˜๊ฐ„๊ฒฉ ๋ณ€๊ฒฝ const handleChangeRaftBase = (option) => { setSelectedRaftBase(option) - setTrestleParams({ ...trestleParams, raftBaseCd: option.clCode }) - - setTrestleList([]) //๊ฐ€๋Œ€๋ฉ”์ด์ปค + setTrestleParams({ ...trestleParams, raftBaseCd: option.clCode }) //๊ฐ€๋Œ€๋ฉ”์ด์ปค setConstMthdList([]) //๊ณต๋ฒ• ์ดˆ๊ธฐํ™” setRoofBaseList([]) //์ง€๋ถ•๋ฐ‘๋ฐ”ํƒ• ์ดˆ๊ธฐํ™” setConstructionList([]) //๊ณต๋ฒ• ์ดˆ๊ธฐํ™” @@ -77,6 +82,7 @@ export default function ModuleTabContents({ const handleChangeConstMthd = (option) => { setSelectedConstMthd(option) //์„ ํƒ๋œ๊ฐ’ ์ €์žฅ setRoofBaseParams({ ...trestleParams, trestleMkrCd: selectedTrestle.trestleMkrCd, constMthdCd: option.constMthdCd, roofBaseCd: '' }) + setRoofBaseList([]) //์ง€๋ถ•๋ฐ‘๋ฐ”ํƒ• ์ดˆ๊ธฐํ™” setConstructionList([]) //๊ณต๋ฒ• ์ดˆ๊ธฐํ™” } @@ -92,45 +98,6 @@ export default function ModuleTabContents({ setSelectedRoofBase(option) } - const getModuleOptionsListData = async (params) => { - const optionsList = await getTrestleList(params) - - if (optionsList.data.length > 0) { - if (optionsList.data[0].trestleMkrCd && optionsList.data[0].constMthdCd === null) { - setTrestleList(optionsList.data) - if (isExistData) { - setSelectedTrestle({ ...moduleConstructionSelectionData.trestle }) - } else { - setConstMthdList([]) - setRoofBaseList([]) - } - } - - if (optionsList.data[0].trestleMkrCd && optionsList.data[0].constMthdCd && optionsList.data[0].roofBaseCd === null) { - setConstMthdList(optionsList.data) - if (isExistData) { - setSelectedConstMthd({ ...moduleConstructionSelectionData.trestle }) - } else { - setRoofBaseList([]) - } - } - - if (optionsList.data[0].trestleMkrCd && optionsList.data[0].constMthdCd && optionsList.data[0].roofBaseCd) { - setRoofBaseList(optionsList.data) - if (isExistData) { - setSelectedRoofBase({ ...moduleConstructionSelectionData.trestle }) - } - } - } - } - - const getConstructionListData = async (params) => { - if (params.trestleMkrCd && params.constMthdCd && params.roofBaseCd) { - const optionsList = await getConstructionList(params) - setConstructionList(optionsList.data) - } - } - const handleConstruction = (index) => { if (index > -1) { const isPossibleIndex = constructionRef.current @@ -162,6 +129,53 @@ export default function ModuleTabContents({ } } + const handleCvrChecked = () => { + setCvrChecked(!cvrChecked) + } + + const handleSnowGdChecked = () => { + setSnowGdChecked(!snowGdChecked) + } + + const getModuleOptionsListData = async (params) => { + const optionsList = await getTrestleList(params) + + if (optionsList.data.length > 0) { + if (optionsList.data[0].trestleMkrCd && optionsList.data[0].constMthdCd === null) { + setTrestleList(optionsList.data) + if (isExistData) { + setSelectedTrestle({ ...moduleConstructionSelectionData?.trestle }) + } else { + setConstMthdList([]) + setRoofBaseList([]) + } + } + + if (optionsList.data[0].trestleMkrCd && optionsList.data[0].constMthdCd && optionsList.data[0].roofBaseCd === null) { + setConstMthdList(optionsList.data) + if (isExistData) { + setSelectedConstMthd({ ...moduleConstructionSelectionData?.trestle }) + } else { + setRoofBaseList([]) + } + } + + if (optionsList.data[0].trestleMkrCd && optionsList.data[0].constMthdCd && optionsList.data[0].roofBaseCd) { + setRoofBaseList(optionsList.data) + if (isExistData) { + setSelectedRoofBase({ ...moduleConstructionSelectionData?.trestle }) + } + } + } + } + + const getConstructionListData = async (params) => { + if (params.trestleMkrCd && params.constMthdCd && params.roofBaseCd) { + const optionsList = await getConstructionList(params) + setConstructionList(optionsList.data) + } + } + useEffect(() => { if (isObjectNotEmpty(selectedRoofBase) && isObjectNotEmpty(selectedConstruction)) { const newRoofConstructions = { @@ -186,14 +200,6 @@ export default function ModuleTabContents({ } }, [selectedConstruction]) - const handleCvrChecked = () => { - setCvrChecked(!cvrChecked) - } - - const handleSnowGdChecked = () => { - setSnowGdChecked(!snowGdChecked) - } - useEffect(() => { setSelectedConstruction({ ...selectedConstruction, setupCover: cvrChecked }) }, [cvrChecked]) @@ -216,7 +222,13 @@ export default function ModuleTabContents({ useEffect(() => { if (isExistData && constructionList.length > 0) { const selectedIndex = moduleConstructionSelectionData.construction.selectedIndex - handleConstruction(selectedIndex) + const construction = constructionList[selectedIndex] + + console.log('construction', construction) + + if (construction.constPossYn === 'Y') { + handleConstruction(selectedIndex) + } } }, [constructionList]) @@ -255,7 +267,7 @@ export default function ModuleTabContents({ } } - setTempModuleSelectionData({ common: moduleSelectionInitParams, module: selectedModule }) + setTempModuleSelectionData({ common: moduleSelectionInitParams, module: selectedModules }) }, [moduleSelectionInitParams]) useEffect(() => { @@ -284,7 +296,6 @@ export default function ModuleTabContents({ useEffect(() => { if (isObjectNotEmpty(tempModuleSelectionData)) { - // setModuleSelectionDataPlanList({ ...moduleSelectionDataPlanList, [currentCanvasPlan.id]: tempModuleSelectionData }) setModuleSelectionData(tempModuleSelectionData) } }, [tempModuleSelectionData]) diff --git a/src/components/floor-plan/modal/basic/step/Placement.jsx b/src/components/floor-plan/modal/basic/step/Placement.jsx index 613e96eb..ff1eeb35 100644 --- a/src/components/floor-plan/modal/basic/step/Placement.jsx +++ b/src/components/floor-plan/modal/basic/step/Placement.jsx @@ -3,7 +3,7 @@ import { useMessage } from '@/hooks/useMessage' import { useModuleBasicSetting } from '@/hooks/module/useModuleBasicSetting' import { checkedModuleState, currentCanvasPlanState } from '@/store/canvasAtom' import { useRecoilValue, useSetRecoilState } from 'recoil' -import { moduleSelectionDataPlanListState, moduleSelectionDataState } from '@/store/selectedModuleOptions' +import { moduleSelectionDataState } from '@/store/selectedModuleOptions' import { useModulePlace } from '@/hooks/module/useModulePlace' const Placement = forwardRef((props, refs) => { @@ -20,14 +20,12 @@ const Placement = forwardRef((props, refs) => { const { selectedModules } = useModulePlace() const setCheckedModules = useSetRecoilState(checkedModuleState) - const moduleSelectionDataPlanList = useRecoilValue(moduleSelectionDataPlanListState) const moduleSelectionData = useRecoilValue(moduleSelectionDataState) //๋ชจ๋“ˆ ๋ฐฐ์น˜๋ฉด ์ƒ์„ฑ useEffect(() => { makeModuleInstArea() - - if (moduleSelectionDataPlanList) { + if (moduleSelectionData) { //1๊ฐœ๋ผ๋„ ์น˜๋„๋ฆฌ ๋ถˆ๊ฐ€๊ฐ€ ์žˆ์œผ๋ฉด ์น˜๋„๋ฆฌ ๋ถˆ๊ฐ€ const isChidroriValue = moduleSelectionData.roofConstructions.some((item) => item.construction.plvrYn === 'N') if (isChidroriValue) { diff --git a/src/hooks/module/useModulePlace.js b/src/hooks/module/useModulePlace.js index bfbf76fb..b519f063 100644 --- a/src/hooks/module/useModulePlace.js +++ b/src/hooks/module/useModulePlace.js @@ -1,12 +1,11 @@ import { useEffect, useState } from 'react' import { useRecoilState, useRecoilValue } from 'recoil' -import { moduleSelectionDataPlanListState, moduleSelectionDataState, selectedModuleState } from '@/store/selectedModuleOptions' +import { moduleSelectionDataState, selectedModuleState } from '@/store/selectedModuleOptions' import { useMasterController } from '@/hooks/common/useMasterController' import { canvasState, currentCanvasPlanState } from '@/store/canvasAtom' export function useModulePlace() { const canvas = useRecoilValue(canvasState) - const moduleSelectionDataPlanList = useRecoilValue(moduleSelectionDataPlanListState) //๋‹ค์Œ์œผ๋กœ ๋„˜์–ด๊ฐ€๋Š” ์ตœ์ข… ๋ฐ์ดํ„ฐ const moduleSelectionData = useRecoilValue(moduleSelectionDataState) const currentCanvasPlan = useRecoilValue(currentCanvasPlanState) const [trestleDetailParams, setTrestleDetailParams] = useState([]) @@ -32,6 +31,7 @@ export function useModulePlace() { roofPitch: selectedModules.roofPchBase ? selectedModules.roofPchBase : null, inclCd: String(item.addRoof.pitch), roofIndex: item.addRoof.index, + workingWidth: item.addRoof.lenBase, } }) setTrestleDetailParams(listParams) @@ -70,8 +70,6 @@ export function useModulePlace() { }) } }) - - console.log('roof', roof) }) }, [trestleDetailList]) diff --git a/src/hooks/module/useModuleSelection.js b/src/hooks/module/useModuleSelection.js index b28e3d97..1b775fc6 100644 --- a/src/hooks/module/useModuleSelection.js +++ b/src/hooks/module/useModuleSelection.js @@ -5,11 +5,9 @@ import { useMasterController } from '@/hooks/common/useMasterController' import { useCommonCode } from '@/hooks/common/useCommonCode' import { selectedModuleState, moduleSelectionInitParamsState } from '@/store/selectedModuleOptions' -import { pitchSelector } from '@/store/canvasAtom' export function useModuleSelection(props) { const { managementState, setManagementState, managementStateLoaded } = useContext(GlobalDataContext) - const globalPitch = useRecoilValue(pitchSelector) //ํ”ผ์น˜ const [roughnessCodes, setRoughnessCodes] = useState([]) //๋ฉด์กฐ๋„ ๋ชฉ๋ก const [windSpeedCodes, setWindSpeedCodes] = useState([]) //๊ธฐ์ค€ํ’์† ๋ชฉ๋ก @@ -17,9 +15,9 @@ export function useModuleSelection(props) { const [selectedModules, setSelectedModules] = useRecoilState(selectedModuleState) //์„ ํƒ๋œ ๋ชจ๋“ˆ const [selectedSurfaceType, setSelectedSurfaceType] = useState({}) //์„ ํƒ๋œ ๋ฉด์กฐ๋„ - const [installHeight, setInstallHeight] = useState('0') //์„ค์น˜ ๋†’์ด + const [installHeight, setInstallHeight] = useState(managementState?.installHeight) //์„ค์น˜ ๋†’์ด const [standardWindSpeed, setStandardWindSpeed] = useState({}) //๊ธฐ์ค€ํ’์† - const [verticalSnowCover, setVerticalSnowCover] = useState('0') //์ˆ˜์ง์ ์„ค๋Ÿ‰ + const [verticalSnowCover, setVerticalSnowCover] = useState(managementState?.verticalSnowCover) //์ˆ˜์ง์ ์„ค๋Ÿ‰ const [moduleSelectionInitParams, setModuleSelectionInitParams] = useRecoilState(moduleSelectionInitParamsState) //๋ชจ๋“ˆ ๊ธฐ๋ณธ ๋ฐ์ดํ„ฐ ex) ๋ฉด์กฐ๋„, ๋†’์ด๋“ฑ๋“ฑ const { getModuleTypeItemList } = useMasterController() @@ -76,12 +74,14 @@ export function useModuleSelection(props) { const getModuleData = async (roofsIds) => { const list = await getModuleTypeItemList(roofsIds) - //selectbox์— ์ด๋ฆ„์„ ๋„ฃ๋Š”๋‹ค - list.data.forEach((item) => { - item.name = item.itemNm - }) - //์…€๋ ‰ํŠธ๋ฐ•์Šค ๋ฐ์ดํ„ฐ ์ดˆ๊ธฐํ™” - setModuleList(list.data) + if (list.data.length > 0) { + //selectbox์— ์ด๋ฆ„์„ ๋„ฃ๋Š”๋‹ค + list.data.forEach((item) => { + item.name = item.itemNm + }) + //์…€๋ ‰ํŠธ๋ฐ•์Šค ๋ฐ์ดํ„ฐ ์ดˆ๊ธฐํ™” + setModuleList(list.data) + } } const handleChangeModule = (option) => { @@ -112,7 +112,6 @@ export function useModuleSelection(props) { const handleChangeInstallHeight = (option) => { setInstallHeight(option) - setModuleSelectionInitParams({ ...moduleSelectionInitParams, instHt: option, diff --git a/src/hooks/option/useCanvasSetting.js b/src/hooks/option/useCanvasSetting.js index c8139893..f56fd3bd 100644 --- a/src/hooks/option/useCanvasSetting.js +++ b/src/hooks/option/useCanvasSetting.js @@ -120,6 +120,8 @@ export function useCanvasSetting() { const { closeAll } = usePopup() useEffect(() => { + console.log('correntObjectNo', correntObjectNo) + setFetchRoofMaterials(!fetchRoofMaterials) if (fetchRoofMaterials) { addRoofMaterials() @@ -165,11 +167,11 @@ export function useCanvasSetting() { useEffect(() => { //console.log('๐Ÿš€ ~ useEffect ~ roofMaterials 22 :', previousRoofMaterialsYn, roofMaterials.length , JSON.stringify(previousRoofMaterialsRef.current) !== JSON.stringify(roofMaterials)) // ์ง€๋ถ•์žฌ select ์ •๋ณด๊ฐ€ ์กด์žฌํ•ด์•ผ ๋ฐฐ์น˜๋ฉด์ดˆ๊ธฐ์„ค์ • DB ์ •๋ณด ๋น„๊ต ํ›„ ์ง€๋ถ•์žฌ ์ •๋ณด๋ฅผ ๊ฐ€์ ธ์˜ฌ ์ˆ˜ ์žˆ์Œ - if (!previousObjectNoRef.current && !correntObjectNo && previousObjectNoRef.current !== correntObjectNo - || roofMaterials.length !== 0 && JSON.stringify(previousRoofMaterialsRef.current) !== JSON.stringify(roofMaterials)) { - - // 1ํšŒ๋งŒ ์‹คํ–‰ - if (roofMaterials && previousRoofMaterialsYn === 'N') { + if ( + (!previousObjectNoRef.current && !correntObjectNo && previousObjectNoRef.current !== correntObjectNo) || + (roofMaterials.length !== 0 && JSON.stringify(previousRoofMaterialsRef.current) !== JSON.stringify(roofMaterials)) + ) { + if (roofMaterials) { fetchBasicSettings() previousRoofMaterialsYn = 'Y' } diff --git a/src/store/selectedModuleOptions.js b/src/store/selectedModuleOptions.js index b09c9294..faa979fd 100644 --- a/src/store/selectedModuleOptions.js +++ b/src/store/selectedModuleOptions.js @@ -85,9 +85,3 @@ export const moduleSelectionDataState = atom({ }, dangerouslyAllowMutability: true, }) - -export const moduleSelectionDataPlanListState = atom({ - key: 'moduleSelectionDataPlanListState', - default: {}, - dangerouslyAllowMutability: true, -})