qcast3/qcast-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

배치면 초기설정 우선 수정

Browse Source
This commit is contained in:
hyojun.choi 2025-01-15 20:17:07 +09:00
parent cbc97960da
commit de282fd969
7 changed files with 256 additions and 225 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/components/floor-plan/CanvasMenu.jsx
View File

@ -308,9 +308,10 @@ export default function CanvasMenu(props) {
} }
}, [type, globalLocale]) }, [type, globalLocale])
useEffect(() => { /*useEffect(() => {
if (!selectedRoofMaterial) return if (menuNumber === 1) {
//if (Object.keys(basicSetting).length === 0 || !basicSetting.roofSizeSet) return return
}
setMenuNumber(1) setMenuNumber(1)
// if ([2, 3].some((num) => num === canvasSetting?.roofSizeSet)) { // if ([2, 3].some((num) => num === canvasSetting?.roofSizeSet)) {
// setMenuNumber(3) // setMenuNumber(3)
@ -321,8 +322,8 @@ export default function CanvasMenu(props) {
// setType('outline') // setType('outline')
// setCurrentMenu(MENU.ROOF_COVERING.EXTERIOR_WALL_LINE) // setCurrentMenu(MENU.ROOF_COVERING.EXTERIOR_WALL_LINE)
// } // }
}, [selectedRoofMaterial]) }, [basicSetting])*/
const checkMenuState = (menu) => { const checkMenuState = (menu) => {
return (['2', '3'].includes(canvasSetting?.roofSizeSet) && menu.index === 2) || (menuNumber === 4 && menu.index === 2) return (['2', '3'].includes(canvasSetting?.roofSizeSet) && menu.index === 2) || (menuNumber === 4 && menu.index === 2)
} }

1
src/components/floor-plan/FloorPlan.jsx
View File

@ -25,6 +25,7 @@ export default function FloorPlan({ children }) {
useEffect(() => { useEffect(() => {
///setCorrentObjectNo(floorPlanState.objectNo) ///setCorrentObjectNo(floorPlanState.objectNo)
//console.log('FloorPlan objectNo ', floorPlanState.objectNo, correntObjectNo) //console.log('FloorPlan objectNo ', floorPlanState.objectNo, correntObjectNo)
setMenuNumber(1)
fetchSettings() fetchSettings()
return () => { return () => {
closeAll() closeAll()

65
src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx
View File

@ -8,8 +8,8 @@ import MaterialGuide from '@/components/floor-plan/modal/placementShape/Material
import WithDraggable from '@/components/common/draggable/WithDraggable' import WithDraggable from '@/components/common/draggable/WithDraggable'
import { useCanvasSetting } from '@/hooks/option/useCanvasSetting' import { useCanvasSetting } from '@/hooks/option/useCanvasSetting'
import { useRecoilValue } from 'recoil' import { useRecoilState, useRecoilValue } from 'recoil'
import { roofMaterialsAtom } from '@/store/settingAtom' import { addedRoofsState, roofMaterialsAtom } from '@/store/settingAtom'
import { useCommonCode } from '@/hooks/common/useCommonCode' import { useCommonCode } from '@/hooks/common/useCommonCode'
import QSelectBox from '@/components/common/select/QSelectBox' import QSelectBox from '@/components/common/select/QSelectBox'
import { globalLocaleStore } from '@/store/localeAtom' import { globalLocaleStore } from '@/store/localeAtom'
@ -28,10 +28,11 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
const roofMaterials = useRecoilValue(roofMaterialsAtom) const roofMaterials = useRecoilValue(roofMaterialsAtom)
const globalLocale = useRecoilValue(globalLocaleStore) const globalLocale = useRecoilValue(globalLocaleStore)
const { basicSetting, setBasicSettings, basicSettingSave, addedRoofs, setAddedRoofs } = useCanvasSetting() const { basicSetting, setBasicSettings, basicSettingSave } = useCanvasSetting()
const [addedRoofs, setAddedRoofs] = useRecoilState(addedRoofsState)
const { findCommonCode } = useCommonCode() const { findCommonCode } = useCommonCode()
const [raftCodes, setRaftCodes] = useState([]) // 서까래 정보 const [raftCodes, setRaftCodes] = useState([]) // 서까래 정보
const [currentRoof, setCurrentRoof] = useState(addedRoofs[0]) // 현재 선택된 지붕재 정보 const [currentRoof, setCurrentRoof] = useState(null) // 현재 선택된 지붕재 정보
const roofRef = { const roofRef = {
roofCd: useRef(null), roofCd: useRef(null),
@ -50,7 +51,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
//지붕각도 설정(경사/각도) //지붕각도 설정(경사/각도)
const roofAngleSetArray = [ const roofAngleSetArray = [
{ id: 'ra04', name: 'roofAngleSet', value: 'slope', message: 'modal.placement.initial.setting.roof.pitch'}, { id: 'ra04', name: 'roofAngleSet', value: 'slope', message: 'modal.placement.initial.setting.roof.pitch' },
{ id: 'ra05', name: 'roofAngleSet', value: 'flat', message: 'modal.placement.initial.setting.roof.angle' }, { id: 'ra05', name: 'roofAngleSet', value: 'flat', message: 'modal.placement.initial.setting.roof.angle' },
] ]
@ -59,7 +60,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
if (!basicSetting || !currentRoof || Object.keys(currentRoof).length === 0 || Object.keys(basicSetting).length === 0) return if (!basicSetting || !currentRoof || Object.keys(currentRoof).length === 0 || Object.keys(basicSetting).length === 0) return
const raftCodeList = findCommonCode('203800') const raftCodeList = findCommonCode('203800')
setRaftCodes(raftCodeList) setRaftCodes(raftCodeList)
if (addedRoofs[0].roofAngleSet && addedRoofs[0].roofAngleSet?.length > 0) { if (addedRoofs[0].roofAngleSet && addedRoofs[0].roofAngleSet?.length > 0) {
setCurrentRoof({ ...currentRoof, roofSizeSet: String(addedRoofs[0].roofSizeSet), roofAngleSet: addedRoofs[0].roofAngleSet }) setCurrentRoof({ ...currentRoof, roofSizeSet: String(addedRoofs[0].roofSizeSet), roofAngleSet: addedRoofs[0].roofAngleSet })
} else if (basicSetting.roofAngleSet && basicSetting.roofAngleSet?.length > 0) { } else if (basicSetting.roofAngleSet && basicSetting.roofAngleSet?.length > 0) {
@ -67,9 +68,15 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
} }
}, []) }, [])
useEffect(() => {
if (addedRoofs.length > 0) {
setCurrentRoof({ ...addedRoofs[0] })
}
}, [addedRoofs])
useEffect(() => { useEffect(() => {
console.log('🚀 ~ fetchBasicSettings ~ currentRoof :', currentRoof) console.log('🚀 ~ fetchBasicSettings ~ currentRoof :', currentRoof)
if(!currentRoof) return if (!currentRoof) return
setBasicSettings({ setBasicSettings({
...basicSetting, ...basicSetting,
roofSizeSet: String(currentRoof.roofSizeSet), roofSizeSet: String(currentRoof.roofSizeSet),
@ -196,42 +203,42 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
</div> </div>
</th> </th>
<td> <td>
<div className="pop-form-radio"> <div className="pop-form-radio">
{currentRoof && {currentRoof &&
roofSizeSetArray.map((item) => ( roofSizeSetArray.map((item) => (
<div className="d-check-radio pop" key={item.id}> <div className="d-check-radio pop" key={item.id}>
<input type="radio" <input
id={item.id} type="radio"
name={item.name} id={item.id}
value={item.value} name={item.name}
checked={currentRoof?.roofSizeSet === item.value} value={item.value}
onChange={(e) => setCurrentRoof({ ...currentRoof, roofSizeSet: e.target.value })} checked={currentRoof?.roofSizeSet === item.value}
/> onChange={(e) => setCurrentRoof({ ...currentRoof, roofSizeSet: e.target.value })}
<label htmlFor={item.id}>{getMessage(item.message)}</label> />
<label htmlFor={item.id}>{getMessage(item.message)}</label>
</div> </div>
)) ))}
}
</div> </div>
</td> </td>
</tr> </tr>
<tr> <tr>
<th>{getMessage('modal.placement.initial.setting.roof.angle.setting')}</th> <th>{getMessage('modal.placement.initial.setting.roof.angle.setting')}</th>
<td> <td>
<div className="pop-form-radio"> <div className="pop-form-radio">
{currentRoof && {currentRoof &&
roofAngleSetArray.map((item) => ( roofAngleSetArray.map((item) => (
<div className="d-check-radio pop" key={item.id}> <div className="d-check-radio pop" key={item.id}>
<input type="radio" <input
id={item.id} type="radio"
name={item.name} id={item.id}
value={item.value} name={item.name}
checked={currentRoof?.roofAngleSet === item.value} value={item.value}
onChange={(e) => setCurrentRoof({ ...currentRoof, roofAngleSet: e.target.value })} checked={currentRoof?.roofAngleSet === item.value}
/> onChange={(e) => setCurrentRoof({ ...currentRoof, roofAngleSet: e.target.value })}
<label htmlFor={item.id}>{getMessage(item.message)}</label> />
<label htmlFor={item.id}>{getMessage(item.message)}</label>
</div> </div>
)) ))}
}
</div> </div>
</td> </td>
</tr> </tr>

336
src/components/floor-plan/modal/roofAllocation/RoofAllocationSetting.jsx
View File

@ -47,190 +47,194 @@ export default function RoofAllocationSetting(props) {
return ( return (
<WithDraggable isShow={true} pos={pos}> <WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap lr mount`}> <div className={`modal-pop-wrap lr mount`}>
<div className="modal-head"> {currentRoofList && (
<h1 className="title">{getMessage('plan.menu.estimate.roof.alloc')}</h1> <>
<button className="modal-close" onClick={() => closePopup(id)}> <div className="modal-head">
닫기 <h1 className="title">{getMessage('plan.menu.estimate.roof.alloc')}</h1>
</button> <button className="modal-close" onClick={() => closePopup(id)}>
</div> 닫기
<div className="modal-body"> </button>
<div className="properties-guide">{getMessage('modal.roof.alloc.info')}</div>
<div className="allocation-select-wrap">
<span>{getMessage('modal.roof.alloc.select.roof.material')}</span>
<div className="grid-select">
<QSelectBox
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> </div>
<button <div className="modal-body">
className="allocation-edit" <div className="properties-guide">{getMessage('modal.roof.alloc.info')}</div>
onClick={() => { <div className="allocation-select-wrap">
onAddRoofMaterial() <span>{getMessage('modal.roof.alloc.select.roof.material')}</span>
}} <div className="grid-select">
> <QSelectBox
<i className="edit-ico"></i> options={roofMaterials}
{getMessage('modal.common.add')} value={roofMaterials[0]}
</button> onChange={(e) => {
</div> // const selected = roofMaterials.find((roofMaterial) => roofMaterial.roofMatlCd === e.id)
<div className="grid-option-overflow"> setCurrentRoofMaterial(e)
<div className="grid-option-wrap"> }}
{currentRoofList.map((roof, index) => { showKey={'roofMatlNm'}
return ( sourceKey={'roofMatlCd'}
<div className="grid-option-box" key={index}> targetKey={'roofMatlCd'}
<div className="d-check-radio pop no-text"> />
<input type="radio" name="radio01" checked={roof.selected && 'checked'} readOnly={true} /> </div>
<label <button
htmlFor="ra01" className="allocation-edit"
onClick={(e) => { onClick={() => {
handleDefaultRoofMaterial(index) onAddRoofMaterial()
}} }}
></label> >
</div> <i className="edit-ico"></i>
<div className="grid-option-block-form"> {getMessage('modal.common.add')}
<div className="block-box"> </button>
<div className="flex-ment"> </div>
<div className="grid-select" style={{ width: '248px' }}> <div className="grid-option-overflow">
<QSelectBox <div className="grid-option-wrap">
options={roofMaterials} {currentRoofList.map((roof, index) => {
value={roof} return (
showKey={'roofMatlNm'} <div className="grid-option-box" key={index}>
sourceKey={'roofMatlCd'} <div className="d-check-radio pop no-text">
targetKey={'roofMatlCd'} <input type="radio" name="radio01" checked={roof.selected && 'checked'} readOnly={true} />
onChange={(e) => handleChangeRoofMaterial(e, index)} <label
/> htmlFor="ra01"
</div> onClick={(e) => {
{index === 0 && <span className="dec">{getMessage('modal.roof.alloc.default.roof.material')}</span>} handleDefaultRoofMaterial(index)
{index !== 0 && <button className="delete" onClick={() => onDeleteRoofMaterial(index)}></button>} }}
></label>
</div> </div>
</div> <div className="grid-option-block-form">
<div className="block-box"> <div className="block-box">
<div className="flex-ment">
<span>{getMessage('slope')}</span>
<div className="input-grid" style={{ width: '214px' }}>
<input
type="text"
className="input-origin block"
onChange={(e) => {
handleChangeInput(e, currentAngleType === 'slope' ? 'pitch' : 'angle', index)
}}
defaultValue={currentAngleType === 'slope' ? roof.pitch : roof.angle}
/>
</div>
<span>{pitchText}</span>
</div>
</div>
{(roof.widAuth || roof.lenAuth) && (
<div className="block-box">
{roof.widAuth && (
<div className="flex-ment"> <div className="flex-ment">
<span>W</span> <div className="grid-select" style={{ width: '248px' }}>
<div className="input-grid" style={{ width: '100px' }}> <QSelectBox
options={roofMaterials}
value={roof}
showKey={'roofMatlNm'}
sourceKey={'roofMatlCd'}
targetKey={'roofMatlCd'}
onChange={(e) => handleChangeRoofMaterial(e, index)}
/>
</div>
{index === 0 && <span className="dec">{getMessage('modal.roof.alloc.default.roof.material')}</span>}
{index !== 0 && <button className="delete" onClick={() => onDeleteRoofMaterial(index)}></button>}
</div>
</div>
<div className="block-box">
<div className="flex-ment">
<span>{getMessage('slope')}</span>
<div className="input-grid" style={{ width: '214px' }}>
<input <input
type="text" type="text"
className="input-origin block" className="input-origin block"
defaultValue={roof.width} onChange={(e) => {
onChange={(e) => handleChangeInput(e, 'width', index)} handleChangeInput(e, currentAngleType === 'slope' ? 'pitch' : 'angle', index)
readOnly={roof.widAuth === 'R'} }}
defaultValue={currentAngleType === 'slope' ? roof.pitch : roof.angle}
/> />
</div> </div>
<span>{pitchText}</span>
</div> </div>
)} </div>
{roof.lenAuth && ( {(roof.widAuth || roof.lenAuth) && (
<div className="flex-ment">
<span>L</span>
<div className="input-grid" style={{ width: '100px' }}>
<input
type="text"
className="input-origin block"
defaultValue={roof.length}
onChange={(e) => handleChangeInput(e, 'length', index)}
readOnly={roof.lenAuth === 'R'}
/>
</div>
</div>
)}
</div>
)}
{(roof.raftAuth || roof.roofPchAuth) && (
<div className="block-box">
{roof.raftAuth && (
<div className="block-box"> <div className="block-box">
<div className="flex-ment"> {roof.widAuth && (
<span>{getMessage('modal.placement.initial.setting.rafter')}</span> <div className="flex-ment">
{raftCodes.length > 0 && ( <span>W</span>
<div className="grid-select" style={{ width: '160px' }}> <div className="input-grid" style={{ width: '100px' }}>
<QSelectBox <input
options={raftCodes} type="text"
value={roof} className="input-origin block"
showKey={'clCodeNm'} defaultValue={roof.width}
sourceKey={'clCode'} onChange={(e) => handleChangeInput(e, 'width', index)}
targetKey={roof.raft ? 'raft' : 'raftBaseCd'} readOnly={roof.widAuth === 'R'}
onChange={(e) => handleChangeRaft(e, index)}
/> />
</div> </div>
)}
</div>
</div>
)}
{roof.roofPchAuth && (
<div className="block-box">
<div className="flex-ment">
<span>{getMessage('hajebichi')}</span>
<div className="input-grid" style={{ width: '84px' }}>
<input
type="text"
className="input-origin block"
onChange={(e) => handleChangeInput(e, 'hajebichi', index)}
value={parseInt(roof.hajebichi)}
readOnly={roof.roofPchAuth === 'R'}
/>
</div> </div>
</div> )}
{roof.lenAuth && (
<div className="flex-ment">
<span>L</span>
<div className="input-grid" style={{ width: '100px' }}>
<input
type="text"
className="input-origin block"
defaultValue={roof.length}
onChange={(e) => handleChangeInput(e, 'length', index)}
readOnly={roof.lenAuth === 'R'}
/>
</div>
</div>
)}
</div> </div>
)} )}
</div> {(roof.raftAuth || roof.roofPchAuth) && (
)} <div className="block-box">
<div className="block-box"> {roof.raftAuth && (
<div className="icon-btn-wrap"> <div className="block-box">
<button <div className="flex-ment">
className={roof.layout === ROOF_MATERIAL_LAYOUT.PARALLEL ? 'act' : ''} <span>{getMessage('modal.placement.initial.setting.rafter')}</span>
onClick={() => { {raftCodes.length > 0 && (
handleChangeLayout(ROOF_MATERIAL_LAYOUT.PARALLEL, index) <div className="grid-select" style={{ width: '160px' }}>
}} <QSelectBox
> options={raftCodes}
{getMessage('modal.roof.alloc.select.parallel')} value={roof}
<i className="allocation01"></i> showKey={'clCodeNm'}
</button> sourceKey={'clCode'}
<button targetKey={roof.raft ? 'raft' : 'raftBaseCd'}
className={roof.layout === ROOF_MATERIAL_LAYOUT.STAIRS ? 'act' : ''} onChange={(e) => handleChangeRaft(e, index)}
onClick={() => { />
handleChangeLayout(ROOF_MATERIAL_LAYOUT.STAIRS, index) </div>
}} )}
> </div>
{getMessage('modal.roof.alloc.select.stairs')} <i className="allocation02"></i> </div>
</button> )}
{roof.roofPchAuth && (
<div className="block-box">
<div className="flex-ment">
<span>{getMessage('hajebichi')}</span>
<div className="input-grid" style={{ width: '84px' }}>
<input
type="text"
className="input-origin block"
onChange={(e) => handleChangeInput(e, 'hajebichi', index)}
value={parseInt(roof.hajebichi)}
readOnly={roof.roofPchAuth === 'R'}
/>
</div>
</div>
</div>
)}
</div>
)}
<div className="block-box">
<div className="icon-btn-wrap">
<button
className={roof.layout === ROOF_MATERIAL_LAYOUT.PARALLEL ? 'act' : ''}
onClick={() => {
handleChangeLayout(ROOF_MATERIAL_LAYOUT.PARALLEL, index)
}}
>
{getMessage('modal.roof.alloc.select.parallel')}
<i className="allocation01"></i>
</button>
<button
className={roof.layout === ROOF_MATERIAL_LAYOUT.STAIRS ? 'act' : ''}
onClick={() => {
handleChangeLayout(ROOF_MATERIAL_LAYOUT.STAIRS, index)
}}
>
{getMessage('modal.roof.alloc.select.stairs')} <i className="allocation02"></i>
</button>
</div>
</div>
</div> </div>
</div> </div>
</div> )
</div> })}
) </div>
})} </div>
<div className="grid-btn-wrap">
<button className="btn-frame modal act" onClick={handleSave}>
{getMessage('modal.roof.alloc.apply')}
</button>
</div>
</div> </div>
</div> </>
<div className="grid-btn-wrap"> )}
<button className="btn-frame modal act" onClick={handleSave}>
{getMessage('modal.roof.alloc.apply')}
</button>
</div>
</div>
</div> </div>
</WithDraggable> </WithDraggable>
) )

14
src/hooks/option/useCanvasSetting.js
View File

@ -23,6 +23,7 @@ import {
roofMaterialsAtom, roofMaterialsAtom,
selectedRoofMaterialSelector, selectedRoofMaterialSelector,
addedRoofsState, addedRoofsState,
fetchRoofMaterialsState,
} from '@/store/settingAtom' } from '@/store/settingAtom'
import { MENU, POLYGON_TYPE } from '@/common/common' import { MENU, POLYGON_TYPE } from '@/common/common'
import { globalFontAtom } from '@/store/fontAtom' import { globalFontAtom } from '@/store/fontAtom'
@ -77,6 +78,7 @@ export function useCanvasSetting() {
const [gridColor, setGridColor] = useRecoilState(gridColorState) const [gridColor, setGridColor] = useRecoilState(gridColorState)
const [color, setColor] = useColor(gridColor ?? '#FF0000') const [color, setColor] = useColor(gridColor ?? '#FF0000')
const { menuNumber, setMenuNumber } = useCanvasMenu() const { menuNumber, setMenuNumber } = useCanvasMenu()
const [settingsData, setSettingsData] = useState({ const [settingsData, setSettingsData] = useState({
...settingModalFirstOptions, ...settingModalFirstOptions,
...settingModalSecondOptions, ...settingModalSecondOptions,
@ -102,6 +104,7 @@ export function useCanvasSetting() {
const { getRoofMaterialList, getModuleTypeItemList } = useMasterController() const { getRoofMaterialList, getModuleTypeItemList } = useMasterController()
const [roofMaterials, setRoofMaterials] = useRecoilState(roofMaterialsAtom) const [roofMaterials, setRoofMaterials] = useRecoilState(roofMaterialsAtom)
const [addedRoofs, setAddedRoofs] = useRecoilState(addedRoofsState) const [addedRoofs, setAddedRoofs] = useRecoilState(addedRoofsState)
const [fetchRoofMaterials, setFetchRoofMaterials] = useRecoilState(fetchRoofMaterialsState)
const [type, setType] = useRecoilState(menuTypeState) const [type, setType] = useRecoilState(menuTypeState)
const setCurrentMenu = useSetRecoilState(currentMenuState) const setCurrentMenu = useSetRecoilState(currentMenuState)
const SelectOptions = [ const SelectOptions = [
@ -114,10 +117,10 @@ export function useCanvasSetting() {
const selectedRoofMaterial = useRecoilValue(selectedRoofMaterialSelector) const selectedRoofMaterial = useRecoilValue(selectedRoofMaterialSelector)
useEffect(() => { useEffect(() => {
if (roofMaterials.length !== 0) { setFetchRoofMaterials(!fetchRoofMaterials)
return if (fetchRoofMaterials) {
addRoofMaterials()
} }
addRoofMaterials()
}, []) }, [])
//지붕재 초기세팅 //지붕재 초기세팅
@ -326,7 +329,7 @@ export function useCanvasSetting() {
] ]
} }
// 데이터 설정 // 데이터 설정
const addRoofs = [] const addRoofs = []
for (let i = 0; i < roofsArray.length; i++) { for (let i = 0; i < roofsArray.length; i++) {
roofMaterials?.map((material) => { roofMaterials?.map((material) => {
@ -344,7 +347,7 @@ export function useCanvasSetting() {
roofAngleSet: roofsRow[i].roofAngleSet, roofAngleSet: roofsRow[i].roofAngleSet,
pitch: roofsArray[i].roofPitch, pitch: roofsArray[i].roofPitch,
angle: roofsArray[i].roofAngle, angle: roofsArray[i].roofAngle,
}) })
} }
}) })
} }
@ -404,7 +407,6 @@ export function useCanvasSetting() {
], ],
} }
await post({ url: `/api/canvas-management/canvas-basic-settings`, data: patternData }).then((res) => { await post({ url: `/api/canvas-management/canvas-basic-settings`, data: patternData }).then((res) => {
swalFire({ text: getMessage(res.returnMessage) }) swalFire({ text: getMessage(res.returnMessage) })
}) })

49
src/hooks/roofcover/useRoofAllocationSetting.js
View File

@ -33,7 +33,7 @@ export function useRoofAllocationSetting(id) {
const { drawDirectionArrow, addLengthText, splitPolygonWithLines, splitPolygonWithSeparate } = usePolygon() const { drawDirectionArrow, addLengthText, splitPolygonWithLines, splitPolygonWithSeparate } = usePolygon()
const [popupId, setPopupId] = useState(uuidv4()) const [popupId, setPopupId] = useState(uuidv4())
const { addPopup, closePopup, closeAll } = usePopup() const { addPopup, closePopup, closeAll } = usePopup()
const currentObject = useRecoilValue(currentObjectState) const currentObject = useRecoilValue(currentObjectState)
const { setMenuNumber } = useCanvasMenu() const { setMenuNumber } = useCanvasMenu()
const setMenuType = useSetRecoilState(menuTypeState) const setMenuType = useSetRecoilState(menuTypeState)
const roofMaterials = useRecoilValue(roofMaterialsSelector) const roofMaterials = useRecoilValue(roofMaterialsSelector)
@ -42,15 +42,20 @@ export function useRoofAllocationSetting(id) {
const [currentRoofMaterial, setCurrentRoofMaterial] = useState(roofMaterials[0]) // 팝업 내 기준 지붕재 const [currentRoofMaterial, setCurrentRoofMaterial] = useState(roofMaterials[0]) // 팝업 내 기준 지붕재
const [roofList, setRoofList] = useRecoilState(addedRoofsState) // 배치면 초기설정에서 선택한 지붕재 배열 const [roofList, setRoofList] = useRecoilState(addedRoofsState) // 배치면 초기설정에서 선택한 지붕재 배열
const [editingLines, setEditingLines] = useState([]) const [editingLines, setEditingLines] = useState([])
const [currentRoofList, setCurrentRoofList] = useState(roofList) const [currentRoofList, setCurrentRoofList] = useState(null)
const currentAngleType = useRecoilValue(currentAngleTypeSelector) const currentAngleType = useRecoilValue(currentAngleTypeSelector)
const globalLocaleState = useRecoilValue(globalLocaleStore) const globalLocaleState = useRecoilValue(globalLocaleStore)
const [basicInfo, setBasicInfo] = useState(null)
const { get, post } = useAxios(globalLocaleState) const { get, post } = useAxios(globalLocaleState)
const { getMessage } = useMessage() const { getMessage } = useMessage()
const { swalFire } = useSwal() const { swalFire } = useSwal()
const { setSurfaceShapePattern } = useRoofFn() const { setSurfaceShapePattern } = useRoofFn()
useEffect(() => {
setCurrentRoofList(roofList)
}, [])
useEffect(() => { useEffect(() => {
const roofBases = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.ROOF) // roofPolygon.innerLines const roofBases = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.ROOF) // roofPolygon.innerLines
@ -133,6 +138,8 @@ export function useRoofAllocationSetting(id) {
console.log('fetchBasicSettings roofsArray', roofsArray) console.log('fetchBasicSettings roofsArray', roofsArray)
console.log(roofsArray)
// 데이터 설정 // 데이터 설정
const selectRoofs = [] const selectRoofs = []
for (let i = 0; i < roofsArray.length; i++) { for (let i = 0; i < roofsArray.length; i++) {
@ -154,8 +161,8 @@ export function useRoofAllocationSetting(id) {
} }
}) })
} }
setCurrentRoofList(selectRoofs) // setCurrentRoofList(selectRoofs)
//setBasicSetting({ ...basicSetting, roofsData: roofsArray }) //setBasicSetting({ ...basicSetting, roofsData: roofsArray })
setBasicSetting({ setBasicSetting({
...basicSetting, ...basicSetting,
@ -163,6 +170,10 @@ export function useRoofAllocationSetting(id) {
roofAngleSet: res[0].roofAngleSet, roofAngleSet: res[0].roofAngleSet,
roofsData: roofsArray, roofsData: roofsArray,
}) })
setBasicInfo({
roofSizeSet: '' + res[0].roofSizeSet,
roofAngleSet: '' + res[0].roofAngleSet,
})
}) })
} catch (error) { } catch (error) {
console.error('Data fetching error:', error) console.error('Data fetching error:', error)
@ -173,10 +184,10 @@ export function useRoofAllocationSetting(id) {
const basicSettingSave = async () => { const basicSettingSave = async () => {
try { try {
const patternData = { const patternData = {
objectNo: correntObjectNo, objectNo: correntObjectNo,
roofSizeSet: Number(basicSetting.roofSizeSet), roofSizeSet: Number(basicSetting.roofSizeSet),
roofAngleSet: basicSetting.roofAngleSet, roofAngleSet: basicSetting.roofAngleSet,
roofAllocationList: currentRoofList.map((item, index) => ({ roofAllocationList: currentRoofList.map((item, index) => ({
roofApply: item.selected === null || item.selected === undefined ? 'true' : item.selected, roofApply: item.selected === null || item.selected === undefined ? 'true' : item.selected,
roofSeq: index, roofSeq: index,
roofMatlCd: item.roofMatlCd === null || item.roofMatlCd === undefined ? 'ROOF_ID_WA_53A' : item.roofMatlCd, roofMatlCd: item.roofMatlCd === null || item.roofMatlCd === undefined ? 'ROOF_ID_WA_53A' : item.roofMatlCd,
@ -190,19 +201,19 @@ export function useRoofAllocationSetting(id) {
})), })),
} }
console.log('🚀 ~ basicSettingSave ~ patternData >>>>>>>>>>>>> :', patternData) console.log('🚀 ~ basicSettingSave ~ patternData >>>>>>>>>>>>> :', patternData)
await post({ url: `/api/canvas-management/roof-allocation-settings`, data: patternData }).then((res) => { await post({ url: `/api/canvas-management/roof-allocation-settings`, data: patternData }).then((res) => {
console.log('roof-allocation-settings res ', res) console.log('roof-allocation-settings res ', res)
swalFire({ text: getMessage(res.returnMessage) }) swalFire({ text: getMessage(res.returnMessage) })
}) })
//Recoil 설정 //Recoil 설정
//setCanvasSetting({ ...basicSetting }) //setCanvasSetting({ ...basicSetting })
fetchBasicSettings() fetchBasicSettings()
} catch (error) { } catch (error) {
swalFire({ text: error.message, icon: 'error' }) swalFire({ text: error.message, icon: 'error' })
} }
} }
const onAddRoofMaterial = () => { const onAddRoofMaterial = () => {
@ -321,8 +332,9 @@ export function useRoofAllocationSetting(id) {
}) })
const newRoofList = currentRoofList.map((roof, idx) => { const newRoofList = currentRoofList.map((roof, idx) => {
return { ...roof, index: idx } return { ...roof, index: idx, ...basicInfo }
}) })
console.log('basicInfo', newRoofList)
setBasicSetting((prev) => { setBasicSetting((prev) => {
return { return {
@ -330,7 +342,6 @@ export function useRoofAllocationSetting(id) {
selectedRoofMaterial: newRoofList.find((roof) => roof.selected), selectedRoofMaterial: newRoofList.find((roof) => roof.selected),
} }
}) })
setRoofList(newRoofList) setRoofList(newRoofList)
const roofs = canvas.getObjects().filter((obj) => obj.name === 'roof') const roofs = canvas.getObjects().filter((obj) => obj.name === 'roof')

5
src/store/settingAtom.js
View File

@ -244,3 +244,8 @@ export const correntObjectNoState = atom({
key: 'correntObjectNoState', key: 'correntObjectNoState',
default: '', default: '',
}) })
export const fetchRoofMaterialsState = atom({
key: 'fetchRoofMaterialsState',
default: false,
})