지붕덮개 - 지붕면 할당 list 버그 작업중

This commit is contained in:
hyojun.choi 2024-12-26 18:00:39 +09:00
parent f5ee816b19
commit 89102719a9
6 changed files with 55 additions and 29 deletions

View File

@ -123,6 +123,13 @@ export default function CanvasMenu(props) {
if (pathname !== '/floor-plan') router.push('/floor-plan')
}
useEffect(() => {
console.log('addedRoofs', addedRoofs)
}, [addedRoofs])
useEffect(() => {
console.log('selectedRoofMaterial', selectedRoofMaterial)
}, [selectedRoofMaterial])
const changeSelectedRoofMaterial = (e) => {
setBasicSetting({ ...basicSetting, selectedRoofMaterial: e })
}
@ -307,14 +314,16 @@ export default function CanvasMenu(props) {
<button className={`btn02 ${commonUtils.dimension ? 'active' : ''} `} onClick={() => commonFunctions('dimension')}></button>
<button className={`btn03 ${commonUtils.distance ? 'active' : ''} `} onClick={() => commonFunctions('distance')}></button>
</div>
{addedRoofs.length > 0 && (
{isObjectNotEmpty(selectedRoofMaterial) && addedRoofs.length > 0 && (
<div className="select-box">
{
<QSelectBox
title={selectedRoofMaterial?.roofMatlNm}
showKey={'roofMatlNm'}
options={addedRoofs}
value={selectedRoofMaterial}
onChange={changeSelectedRoofMaterial}
sourceKey={'index'}
targetKey={'index'}
/>
}
</div>

View File

@ -47,6 +47,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
fetchBasicSettings()
const raftCodeList = findCommonCode('203800')
setRaftCodes(raftCodeList)
console.log('raftCodeList', raftCodeList)
}, [])
useEffect(() => {
@ -78,9 +79,8 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
}
const handleRafterChange = (value) => {
console.log('🚀 ~ handleRafterChange ~ value:', value)
const selectedRafter = raftCodes.find((raft) => raft.clCode === value)
setCurrentRoofMaterial({ ...currentRoofMaterial, raft: selectedRafter })
setCurrentRoofMaterial({ ...currentRoofMaterial, raft: selectedRafter.clCode })
}
const handleSaveBtn = () => {
@ -93,12 +93,12 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
// raft: roofRef.rafter.current?.value,
selected: true,
layout: roofLayout,
index: 0,
}
const newAddedRoofs = [...addedRoofs]
if (addedRoofs.length === 1) {
newAddedRoofs[0] = roofInfo
newAddedRoofs[0] = { ...roofInfo }
setAddedRoofs(newAddedRoofs)
}
@ -244,6 +244,9 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
})}
value={currentRoofMaterial}
onChange={(e) => handleRoofTypeChange(e.roofMatlCd)}
sourceKey="id"
targetKey="id"
showKey="name"
/>
{/* <select
className="select-light dark"
@ -312,16 +315,17 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
{currentRoofMaterial && ['C', 'R'].includes(currentRoofMaterial.raftAuth) && (
<div className="flex-ment">
<span>{getMessage('modal.placement.initial.setting.rafter')}</span>
<div className="select-wrap" style={{ width: '160px' }}>
<QSelectBox
ref={roofRef.rafter}
options={raftCodes.map((raft, index) => {
return { ...raft, name: globalLocale === 'ko' ? raft.clCodeNm : raft.clCodeNmJp }
})}
value={raftCodes.find((r) => r.clCode === currentRoofMaterial.raftBaseCd)}
onChange={(e) => handleRafterChange(e.clCode)}
/>
{/* <select className="select-light dark" name="roofGap" ref={roofRef.rafter}>
{raftCodes.length > 0 && (
<div className="select-wrap" style={{ width: '160px' }}>
<QSelectBox
options={raftCodes}
value={currentRoofMaterial}
onChange={(e) => handleRafterChange(e.clCode)}
sourceKey="clCode"
targetKey={currentRoofMaterial.raft ? 'raft' : 'raftBaseCd'}
showKey="clCodeNm"
/>
{/* <select className="select-light dark" name="roofGap" ref={roofRef.rafter}>
{raftCodes.map((raft, index) => {
return (
<option key={index} value={raft.clCode} selected={currentRoofMaterial.raft === raft.clCode}>
@ -330,7 +334,8 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
)
})}
</select> */}
</div>
</div>
)}
</div>
)}
{currentRoofMaterial && ['C', 'R'].includes(currentRoofMaterial.roofPchAuth) && (

View File

@ -51,13 +51,15 @@ export default function RoofAllocationSetting(props) {
<span>{getMessage('modal.roof.alloc.select.roof.material')}</span>
<div className="grid-select">
<QSelectBox
title={roofMaterials[0]?.name}
options={roofMaterials}
value={roofMaterials[0]}
onChange={(e) => {
// const selected = roofMaterials.find((roofMaterial) => roofMaterial.roofMatlCd === e.id)
setCurrentRoofMaterial(e)
}}
showKey={'roofMatlNm'}
sourceKey={'roofMatlCd'}
targetKey={'roofMatlCd'}
/>
</div>
<button
@ -89,7 +91,10 @@ export default function RoofAllocationSetting(props) {
<div className="grid-select" style={{ width: '248px' }}>
<QSelectBox
options={roofMaterials}
title={roofMaterials.find((r) => r.id === roof.id).name}
value={roof}
showKey={'roofMatlNm'}
sourceKey={'roofMatlCd'}
targetKey={'roofMatlCd'}
onChange={(e) => handleChangeRoofMaterial(e, index)}
/>
</div>
@ -123,9 +128,17 @@ export default function RoofAllocationSetting(props) {
<div className="block-box">
<div className="flex-ment">
<span>{getMessage('modal.placement.initial.setting.rafter')}</span>
<div className="grid-select" style={{ width: '160px' }}>
<QSelectBox options={raftCodes} value={raftCodes.find((r) => r.clCode === roof.raftBaseCd)} />
</div>
{raftCodes.length > 0 && (
<div className="grid-select" style={{ width: '160px' }}>
<QSelectBox
options={raftCodes}
value={roof}
showKey={'clCodeNm'}
sourceKey={'clCode'}
targetKey={roof.raft ? 'raft' : 'raftBaseCd'}
/>
</div>
)}
</div>
</div>
)}

View File

@ -137,6 +137,7 @@ export function useCanvasSetting() {
id: item.roofMatlCd,
name: item.roofMatlNm,
selected: idx === 0,
index: idx,
nameJp: item.roofMatlNmJp,
length: item.lenBase && parseInt(item.lenBase),
width: item.widBase && parseInt(item.widBase),
@ -149,10 +150,10 @@ export function useCanvasSetting() {
if (addedRoofs.length === 0) {
const newAddedRoofs = []
newAddedRoofs.push({ ...selectedRoofMaterial, selected: true })
newAddedRoofs.push({ ...selectedRoofMaterial, selected: true, index: 0 })
setAddedRoofs(newAddedRoofs)
}
setBasicSettings({ ...basicSetting, roofMaterials: selectedRoofMaterial })
setBasicSettings({ ...basicSetting, selectedRoofMaterial: selectedRoofMaterial })
}
useEffect(() => {

View File

@ -169,11 +169,12 @@ export function useRoofAllocationSetting(id) {
setBasicSetting((prev) => {
return {
...prev,
roofs: roofList,
selectedRoofMaterial: roofList.find((roof) => roof.selected),
}
})
setRoofList(roofList)
const roofs = canvas.getObjects().filter((obj) => obj.name === 'roof')
roofs.forEach((roof) => {

View File

@ -225,11 +225,8 @@ export const selectedRoofMaterialSelector = selector({
key: 'selectedRoofMaterialSelector',
get: ({ get }) => {
const basicSetting = get(basicSettingState)
const addedRoofs = get(addedRoofsSelector)
// addedRoofs에서 selectedRoofMaterial을 찾아 index를 반환
const index = addedRoofs.findIndex((roof) => roof === basicSetting.selectedRoofMaterial)
return { ...basicSetting.selectedRoofMaterial, index }
return { ...basicSetting.selectedRoofMaterial }
},
})