diff --git a/src/components/floor-plan/modal/basic/step/Orientation.jsx b/src/components/floor-plan/modal/basic/step/Orientation.jsx index 14618a20..c5427d3b 100644 --- a/src/components/floor-plan/modal/basic/step/Orientation.jsx +++ b/src/components/floor-plan/modal/basic/step/Orientation.jsx @@ -7,16 +7,21 @@ import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil' import QSelectBox from '@/components/common/select/QSelectBox' import { roofsState } from '@/store/roofAtom' import { useModuleBasicSetting } from '@/hooks/module/useModuleBasicSetting' +import { useCommonCode } from '@/hooks/common/useCommonCode' import Swal from 'sweetalert2' import { normalizeDecimal} from '@/util/input-utils' export const Orientation = forwardRef((props, ref) => { const { getMessage } = useMessage() + const { findCommonCode } = useCommonCode() const [hasAnglePassivity, setHasAnglePassivity] = useState(false) const basicSetting = useRecoilValue(basicSettingState) const [addedRoofs, setAddedRoofs] = useRecoilState(addedRoofsState) //지붕재 선택 const [roofsStore, setRoofsStore] = useRecoilState(roofsState) const [roofTab, setRoofTab] = useState(0) //지붕재 탭 + const [selectedModuleSeries, setSelectedModuleSeries] = useState(null) + const [moduleSeriesList, setModuleSeriesList] = useState([]) + const [filteredModuleList, setFilteredModuleList] = useState([]) const { roofs, setRoofs, @@ -80,9 +85,20 @@ export const Orientation = forwardRef((props, ref) => { useEffect(() => { if (selectedModules) { - setSelectedModules(moduleList.find((module) => module.itemId === selectedModules.itemId)) + const foundModule = moduleList.find((module) => module.itemId === selectedModules.itemId) + if (foundModule) { + setSelectedModules(foundModule) + + // 선택된 모듈의 시리즈로 업데이트 (시리즈 목록이 있는 경우에만) + if (moduleSeriesList.length > 0 && foundModule.moduleSerCd) { + const currentSeries = moduleSeriesList.find(series => series.moduleSerCd === foundModule.moduleSerCd) + if (currentSeries && (!selectedModuleSeries || selectedModuleSeries.moduleSerCd !== currentSeries.moduleSerCd)) { + setSelectedModuleSeries(currentSeries) + } + } + } } - }, [selectedModules]) + }, [selectedModules, moduleList, moduleSeriesList]) useEffect(() => { if (selectedSurfaceType) { @@ -206,6 +222,31 @@ export const Orientation = forwardRef((props, ref) => { return true } + const handleChangeModuleSeries = (e) => { + resetRoofs() + setSelectedModuleSeries(e) + + // 선택된 시리즈에 맞는 모듈 목록 필터링 및 첫 번째 모듈 선택 + if (e && moduleList.length > 0) { + let filtered + + if (e.moduleSerCd === 'ALL') { + // "전체" 선택 시 모든 모듈 표시 + filtered = moduleList + } else { + // 특정 시리즈 선택 시 해당 시리즈 모듈만 표시 + filtered = moduleList.filter(module => module.moduleSerCd === e.moduleSerCd) + } + + setFilteredModuleList(filtered) + + // 필터링된 목록의 첫 번째 모듈을 자동 선택 + if (filtered.length > 0) { + setSelectedModules(filtered[0]) + } + } + } + const handleChangeModule = (e) => { resetRoofs() setSelectedModules(e) @@ -264,12 +305,69 @@ export const Orientation = forwardRef((props, ref) => { setRoofsStore(newRoofs) } + // 모듈시리즈 목록 생성 및 commonCode와 매핑 useEffect(() => { - // 컴포넌트가 마운트될 때 selectedModules가 없으면 handleChangeModule 호출 - if (moduleList.length > 0 && (!selectedModules || !selectedModules.itemId)) { - handleChangeModule(moduleList[0]); + if (moduleList.length > 0 && moduleSeriesList.length === 0) { + const moduleSeriesCodes = findCommonCode(207100) || [] + + // moduleList에서 고유한 moduleSerCd 추출 + const uniqueSeriesCd = [...new Set(moduleList.map(module => module.moduleSerCd).filter(Boolean))] + + if (uniqueSeriesCd.length > 0) { + // moduleSerCd와 commonCode를 매핑하여 기본 moduleSeriesList 생성 + const mappedSeries = uniqueSeriesCd.map(serCd => { + const matchedCode = moduleSeriesCodes.find(code => code.clCode === serCd) + return { + moduleSerCd: serCd, + moduleSerNm: matchedCode ? matchedCode.clCodeNm : serCd + } + }) + + // "전체" 옵션을 맨 앞에 추가 + const allOption = { + moduleSerCd: 'ALL', + moduleSerNm: getMessage("board.sub.total") || 'ALL' + } + + const seriesList = [allOption, ...mappedSeries] + setModuleSeriesList(seriesList) + + // 현재 선택된 모듈이 있으면 해당 모듈의 시리즈를 찾아서 선택 + if (selectedModules && selectedModules.moduleSerCd) { + const currentSeries = seriesList.find(series => series.moduleSerCd === selectedModules.moduleSerCd) + if (currentSeries) { + setSelectedModuleSeries(currentSeries) + } else { + setSelectedModuleSeries(allOption) + } + } else { + // 선택된 모듈이 없으면 "전체"를 기본 선택 + setSelectedModuleSeries(allOption) + } + } } - }, [moduleList]); // 빈 의존성 배열로 마운트 시 한 번만 실행 + }, [moduleList, selectedModules]) + + // 초기 로딩 시에만 필터링된 모듈 목록 설정 + useEffect(() => { + if (moduleList.length > 0 && filteredModuleList.length === 0 && selectedModuleSeries) { + let filtered + + if (selectedModuleSeries.moduleSerCd === 'ALL') { + // "전체" 선택 시 모든 모듈 표시 + filtered = moduleList + } else { + // 특정 시리즈 선택 시 해당 시리즈 모듈만 표시 + filtered = moduleList.filter(module => module.moduleSerCd === selectedModuleSeries.moduleSerCd) + } + + setFilteredModuleList(filtered) + + if (filtered.length > 0 && !selectedModules) { + setSelectedModules(filtered[0]) + } + } + }, [moduleList, selectedModuleSeries]); return ( <>