모듈 선택 db 연동
This commit is contained in:
parent
d9f782639f
commit
9a9b76482d
@ -42,17 +42,6 @@ export default function Module({ setTabNum }) {
|
||||
|
||||
const [moduleSelectionData, setModuleSelectionData] = useRecoilState(moduleSelectionDataState) //다음으로 넘어가는 최종 데이터
|
||||
|
||||
const dataRef = useRef({
|
||||
selectedSurfaceType,
|
||||
installHeight,
|
||||
standardWindSpeed,
|
||||
verticalSnowCover,
|
||||
})
|
||||
|
||||
useEffect(() => {
|
||||
console.log('dataRef', dataRef)
|
||||
}, [])
|
||||
|
||||
const [tempModuleSelectionData, setTempModuleSelectionData] = useReducer((prevState, nextState) => {
|
||||
return { ...prevState, ...nextState }
|
||||
}, moduleSelectionData)
|
||||
|
||||
@ -5,19 +5,11 @@ import { useMessage } from '@/hooks/useMessage'
|
||||
import { useMasterController } from '@/hooks/common/useMasterController'
|
||||
import { useCommonCode } from '@/hooks/common/useCommonCode'
|
||||
import { moduleSelectionDataState, moduleSelectionInitParamsState, selectedModuleState } from '@/store/selectedModuleOptions'
|
||||
import { isObjectNotEmpty } from '@/util/common-utils'
|
||||
import { isObjectNotEmpty, isEqualObjects } from '@/util/common-utils'
|
||||
import QSelectBox from '@/components/common/select/QSelectBox'
|
||||
import { addedRoofsState } from '@/store/settingAtom'
|
||||
|
||||
export default function ModuleTabContents({
|
||||
tabIndex,
|
||||
addRoof,
|
||||
setAddedRoofs,
|
||||
roofTab,
|
||||
tempModuleSelectionData,
|
||||
setTempModuleSelectionData,
|
||||
moduleSelectionInitParams,
|
||||
}) {
|
||||
export default function ModuleTabContents({ tabIndex, addRoof, setAddedRoofs, roofTab, tempModuleSelectionData, setTempModuleSelectionData }) {
|
||||
const { getMessage } = useMessage()
|
||||
const [roofMaterial, setRoofMaterial] = useState(addRoof) //지붕재`
|
||||
|
||||
@ -45,7 +37,8 @@ export default function ModuleTabContents({
|
||||
const [constructionParams, setConstructionParams] = useState({}) //공법 관련 api호출 파라메터
|
||||
const [roofBaseParams, setRoofBaseParams] = useState({}) //지붕밑바탕 관련 api호출 파라메터
|
||||
|
||||
// const moduleSelectionInitParams = useRecoilValue(moduleSelectionInitParamsState) //모듈 기본 데이터 ex) 면조도, 높이등등
|
||||
const moduleSelectionInitParams = useRecoilValue(moduleSelectionInitParamsState) //모듈 기본 데이터 ex) 면조도, 높이등등
|
||||
const moduleSelectionInitOriginData = useRef(moduleSelectionInitParams)
|
||||
|
||||
const { getTrestleList, getConstructionList } = useMasterController()
|
||||
|
||||
@ -69,8 +62,6 @@ export default function ModuleTabContents({
|
||||
const hajebichiRef = useRef()
|
||||
const lengthRef = useRef()
|
||||
|
||||
const originalModuleSelectionData = useRef(moduleSelectionData)
|
||||
|
||||
//서까래간격 변경
|
||||
const handleChangeRaftBase = (option) => {
|
||||
setSelectedRaftBase(option)
|
||||
@ -118,7 +109,7 @@ export default function ModuleTabContents({
|
||||
//리코일에 데이터가 담기는 시점에 시작
|
||||
useEffect(() => {
|
||||
if (
|
||||
moduleSelectionData.roofConstructions.length > 0 &&
|
||||
isObjectNotEmpty(moduleSelectionData.roofConstructions[tabIndex]) &&
|
||||
isObjectNotEmpty(moduleSelectionData.roofConstructions[tabIndex].trestle) &&
|
||||
isObjectNotEmpty(moduleSelectionData.roofConstructions[tabIndex].construction)
|
||||
) {
|
||||
@ -311,9 +302,6 @@ export default function ModuleTabContents({
|
||||
construction: selectedConstruction,
|
||||
}
|
||||
|
||||
console.log('newRoofConstructions', newRoofConstructions)
|
||||
console.log('roofTab', roofTab)
|
||||
|
||||
const index = tempModuleSelectionData.roofConstructions.findIndex((obj) => obj.roofIndex === tabIndex)
|
||||
|
||||
if (index > -1) {
|
||||
@ -341,7 +329,6 @@ export default function ModuleTabContents({
|
||||
if (type === 'trestle') {
|
||||
setTrestleList(optionsList.data)
|
||||
if (isExistData) {
|
||||
// setSelectedTrestle({ ...moduleConstructionSelectionData?.trestle })
|
||||
handleChangeTrestle(moduleConstructionSelectionData?.trestle)
|
||||
} else {
|
||||
setConstMthdList([])
|
||||
@ -364,17 +351,43 @@ export default function ModuleTabContents({
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
console.log('originalModuleSelectionData', originalModuleSelectionData)
|
||||
console.log('moduleSelectionInitParams', moduleSelectionInitParams)
|
||||
//모듈이 선택되어있을때
|
||||
if (moduleSelectionInitOriginData.current.moduleItemId && moduleSelectionInitOriginData.current.moduleTpCd) {
|
||||
//초기에 들어온 데이터가 수정된 데이터가 값이 다르다면`
|
||||
if (!isEqualObjects(moduleSelectionInitOriginData.current, moduleSelectionInitParams)) {
|
||||
// console.log('moduleSelectionInitParams', moduleSelectionInitParams)
|
||||
//가대 선택 초기화
|
||||
setSelectedTrestle({})
|
||||
//공법 선택 초기화
|
||||
setSelectedConstMthd({})
|
||||
//지붕밑바탕 선택 초기화
|
||||
setSelectedRoofBase({})
|
||||
//공법 리스트 초기화
|
||||
setConstructionList([])
|
||||
// 기본 정보 초기화
|
||||
setModuleSelectionData({
|
||||
...moduleSelectionData,
|
||||
roofConstructions: [],
|
||||
})
|
||||
// 선택 데이터 초 기화
|
||||
setModuleConstructionSelectionData({
|
||||
addRoof: addRoof,
|
||||
trestle: {},
|
||||
construction: {},
|
||||
})
|
||||
|
||||
// console.log('moduleSelectionInitParams', moduleSelectionInitParams)
|
||||
// setSelectedTrestle({})
|
||||
// setSelectedConstMthd({})
|
||||
// setSelectedRoofBase({})
|
||||
// setModuleSelectionData({
|
||||
// ...moduleSelectionData,
|
||||
// roofConstructions: [],
|
||||
// })
|
||||
setTempModuleSelectionData({
|
||||
...moduleSelectionData,
|
||||
roofConstructions: [],
|
||||
})
|
||||
|
||||
// 데이터 없음으로 변경
|
||||
setIsExistData(false)
|
||||
|
||||
//변경된 데이터를 ref에 저장
|
||||
moduleSelectionInitOriginData.current = moduleSelectionInitParams
|
||||
}
|
||||
}
|
||||
}, [moduleSelectionInitParams])
|
||||
|
||||
// useEffect(() => {
|
||||
@ -596,22 +609,22 @@ export default function ModuleTabContents({
|
||||
<div className="d-check-box pop">
|
||||
<input
|
||||
type="checkbox"
|
||||
id={`ch01_${roofTab}`}
|
||||
id={`ch01_${tabIndex}`}
|
||||
disabled={cvrYn === 'N' ? true : false}
|
||||
checked={cvrChecked}
|
||||
onChange={handleCvrChecked}
|
||||
/>
|
||||
<label htmlFor={`ch01_${roofTab}`}>{getMessage('modal.module.basic.setting.module.eaves.bar.fitting')}</label>
|
||||
<label htmlFor={`ch01_${tabIndex}`}>{getMessage('modal.module.basic.setting.module.eaves.bar.fitting')}</label>
|
||||
</div>
|
||||
<div className="d-check-box pop">
|
||||
<input
|
||||
type="checkbox"
|
||||
id={`ch02_${roofTab}`}
|
||||
id={`ch02_${tabIndex}`}
|
||||
disabled={snowGdPossYn === 'N' ? true : false}
|
||||
checked={snowGdChecked}
|
||||
onChange={handleSnowGdChecked}
|
||||
/>
|
||||
<label htmlFor={`ch02_${roofTab}`}>{getMessage('modal.module.basic.setting.module.blind.metal.fitting')}</label>
|
||||
<label htmlFor={`ch02_${tabIndex}`}>{getMessage('modal.module.basic.setting.module.blind.metal.fitting')}</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -153,3 +153,25 @@ export const unescapeString = (str) => {
|
||||
export const isNullOrUndefined = (value) => {
|
||||
return value === null || value === undefined
|
||||
}
|
||||
|
||||
export const isEqualObjects = (obj1, obj2) => {
|
||||
const keys1 = Object.keys(obj1)
|
||||
const keys2 = Object.keys(obj2)
|
||||
|
||||
if (keys1.length !== keys2.length) return false
|
||||
|
||||
for (let key of keys1) {
|
||||
const val1 = obj1[key]
|
||||
const val2 = obj2[key]
|
||||
const areObjects = isObject(val1) && isObject(val2)
|
||||
|
||||
if (areObjects && !deepEqual(val1, val2)) return false
|
||||
if (!areObjects && val1 !== val2) return false
|
||||
}
|
||||
|
||||
return true
|
||||
}
|
||||
|
||||
function isObject(value) {
|
||||
return value !== null && typeof value === 'object'
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user