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

지붕면 할당 => 지붕재 추가 시 관리 atom addedRoofs로 수정

Browse Source
This commit is contained in:
hyojun.choi 2024-12-26 13:45:23 +09:00
parent 49b49ef076
commit 7cebd22047
6 changed files with 149 additions and 90 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -18,6 +18,7 @@ import { outerLinePointsState } from '@/store/outerLineAtom'
import { appMessageStore, globalLocaleStore } from '@/store/localeAtom'
import {
addedRoofsSelector,
addedRoofsState,
basicSettingState,
roofMaterialsSelector,
selectedRoofMaterialSelector,
@ -85,8 +86,9 @@ export default function CanvasMenu(props) {
const { floorPlanState, setFloorPlanState } = useContext(FloorPlanContext)
const { restoreModuleInstArea } = useModuleBasicSetting()
const addedRoofs = useRecoilValue(addedRoofsSelector)
const addedRoofs = useRecoilValue(addedRoofsState)
const [basicSetting, setBasicSetting] = useRecoilState(basicSettingState)
const selectedRoofMaterial = useRecoilValue(selectedRoofMaterialSelector)
//견적서버튼 노출용
const [buttonStyle, setButtonStyle] = useState('')
@ -307,7 +309,14 @@ export default function CanvasMenu(props) {
</div>
{addedRoofs.length > 0 && (
<div className="select-box">
{<QSelectBox value={addedRoofs.find((roof) => roof.selected)} options={addedRoofs} onChange={changeSelectedRoofMaterial} />}
{
<QSelectBox
title={selectedRoofMaterial?.roofMatlNm}
showKey={'roofMatlNm'}
options={addedRoofs}
onChange={changeSelectedRoofMaterial}
/>
}
</div>
)}
<div className="btn-from">

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

@ -25,12 +25,14 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
const { closePopup } = usePopup()
const { getMessage } = useMessage()
const roofMaterials = useRecoilValue(roofMaterialsAtom)
const { basicSetting, setBasicSettings, fetchBasicSettings, basicSettingSave } = useCanvasSetting()
const globalLocale = useRecoilValue(globalLocaleStore)
const { basicSetting, setBasicSettings, fetchBasicSettings, basicSettingSave, addedRoofs, setAddedRoofs } = useCanvasSetting()
const { findCommonCode } = useCommonCode()
const [raftCodes, setRaftCodes] = useState([])
const [currentRoofMaterial, setCurrentRoofMaterial] = useState(basicSetting.selectedRoofMaterial)
const globalLocale = useRecoilValue(globalLocaleStore)
const [roofLayout, setRoofLayout] = useState(basicSetting.selectedRoofMaterial.layout)
//const [currentRoofMaterial, setCurrentRoofMaterial] = useState(basicSetting.selectedRoofMaterial)
const [currentRoofMaterial, setCurrentRoofMaterial] = useState(addedRoofs[0]) // 지붕재 정보
const [roofLayout, setRoofLayout] = useState(addedRoofs[0].layout) // 지붕 레이아웃
const roofRef = {
roofCd: useRef(null),
@ -47,6 +49,28 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
setRaftCodes(raftCodeList)
}, [])
useEffect(() => {
//console.log('currentRoofMaterial >>>>>>>>>>>>>>>>>>> ', currentRoofMaterial)
console.log(' basicSetting.roofs[0] >>>>>>>>>>>>>>>>>>> ', basicSetting.roofs[0])
//console.log('basicSetting >>>>>>>>>>>>>>>>>>> ', basicSetting)
console.log('roofLayout >>>>>>>>>>>>>>>>>>> ', roofLayout)
setBasicSettings({
...basicSetting,
roofsData: {
roofApply: true,
roofSeq: 1,
roofMatlCd: currentRoofMaterial.roofMatlCd === null ? 'ROOF_ID_WA_53A' : currentRoofMaterial.roofMatlCd,
roofWidth: currentRoofMaterial.width === null ? 0 : currentRoofMaterial.width,
roofHeight: currentRoofMaterial.length === null ? 0 : currentRoofMaterial.length,
roofHajebichi: currentRoofMaterial.hajebichi === null ? 0 : currentRoofMaterial.hajebichi,
roofGap: currentRoofMaterial.raftBaseCd === null ? 'HEI_455' : currentRoofMaterial.raftBaseCd,
roofLayout: roofLayout,
},
})
}, [currentRoofMaterial, roofLayout, basicSetting.roofSizeSet, basicSetting.roofAngleSet])
// Function to update the roofType and corresponding values
const handleRoofTypeChange = (value) => {
const selectedRoofMaterial = roofMaterials.find((roof) => roof.roofMatlCd === value)
@ -71,8 +95,12 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
layout: roofLayout,
}
const addedRoofs = []
addedRoofs.push(roofInfo)
const newAddedRoofs = [...addedRoofs]
if (addedRoofs.length === 1) {
newAddedRoofs[0] = roofInfo
setAddedRoofs(newAddedRoofs)
}
console.log('save Info', {
...basicSetting,
@ -80,7 +108,6 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
// 선택된 지붕재 정보
roofInfo,
},
roofs: addedRoofs,
roofsData: {
roofApply: true,
roofSeq: 1,
@ -92,6 +119,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
roofLayout: roofLayout,
},
})
setBasicSettings({
...basicSetting,
selectedRoofMaterial: {
@ -100,6 +128,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
},
roofs: addedRoofs,
})
basicSettingSave()
}

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

@ -51,6 +51,7 @@ 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) => {
@ -88,7 +89,7 @@ export default function RoofAllocationSetting(props) {
<div className="grid-select" style={{ width: '248px' }}>
<QSelectBox
options={roofMaterials}
value={roofMaterials.find((r) => r.id === roof.id)}
title={roofMaterials.find((r) => r.id === roof.id).name}
onChange={(e) => handleChangeRoofMaterial(e, index)}
/>
</div>

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

@ -22,6 +22,7 @@ import {
settingsState,
roofMaterialsAtom,
selectedRoofMaterialSelector,
addedRoofsState,
} from '@/store/settingAtom'
import { POLYGON_TYPE } from '@/common/common'
import { globalFontAtom } from '@/store/fontAtom'
@ -97,6 +98,7 @@ export function useCanvasSetting() {
const [basicSetting, setBasicSettings] = useRecoilState(basicSettingState)
const { getRoofMaterialList, getModuleTypeItemList } = useMasterController()
const [roofMaterials, setRoofMaterials] = useRecoilState(roofMaterialsAtom)
const [addedRoofs, setAddedRoofs] = useRecoilState(addedRoofsState)
const SelectOptions = [
{ id: 1, name: getMessage('modal.canvas.setting.grid.dot.line.setting.line.origin'), value: 1 },
@ -129,7 +131,7 @@ export function useCanvasSetting() {
return
}
const { data } = await getRoofMaterialList()
const roofLists = data.map((item, idx) => ({
...item,
id: item.roofMatlCd,
@ -144,9 +146,13 @@ export function useCanvasSetting() {
}))
setRoofMaterials(roofLists)
const selectedRoofMaterial = roofLists[0]
const addRoofs = []
addRoofs.push({ ...selectedRoofMaterial, selected: true })
setBasicSettings({ ...basicSetting, roofMaterials: selectedRoofMaterial, roofs: addRoofs })
if (addedRoofs.length === 0) {
const newAddedRoofs = []
newAddedRoofs.push({ ...selectedRoofMaterial, selected: true })
setAddedRoofs(newAddedRoofs)
}
setBasicSettings({ ...basicSetting, roofMaterials: selectedRoofMaterial })
}
useEffect(() => {
@ -262,73 +268,78 @@ export function useCanvasSetting() {
console.log('fetchBasicSettings res ', res)
//if (res.length == 0) return
let roofsRow = {}
let roofsArray = {}
let roofsRow = {}
let roofsArray = {}
if (res.length > 0) {
roofsRow = res.map((item) => {
return {
roofSizeSet: item.roofSizeSet,
roofAngleSet: item.roofAngleSet,
if (res.length > 0) {
roofsRow = res.map((item) => {
return {
roofSizeSet: item.roofSizeSet,
roofAngleSet: item.roofAngleSet,
}
roofsArray = {
roofApply: true,
roofSeq: 1,
roofMatlCd: 'ROOF_ID_WA_53A',
roofWidth: 265,
roofHeight: 235,
roofHajebichi: 0,
roofGap: 'HEI_455',
roofLayout: 'P',
}
})
} else {
roofsRow = [
{
roofSizeSet: 1,
roofAngleSet: 'slope',
},
]
roofsArray = [
{
roofApply: true,
roofSeq: 1,
roofMatlCd: 'ROOF_ID_WA_53A',
roofWidth: 265,
roofHeight: 235,
roofHajebichi: 0,
roofGap: 'HEI_455',
roofLayout: 'P',
},
]
}
// 나머지 데이터와 함께 'roofs' 배열을 patternData에 넣음
const patternData = {
roofSizeSet: roofsRow[0].roofSizeSet,
roofAngleSet: roofsRow[0].roofAngleSet,
roofs: roofsArray, // 만들어진 roofs 배열
}
console.log('patternData', patternData)
// 데이터 설정
//setBasicSettings({ ...basicSetting, roofSizeSet: roofsRow[0].roofSizeSet, roofAngleSet: roofsRow[0].roofAngleSet, roofsData: roofsArray})
const addRoofs = []
roofMaterials.map((material) => {
if (material.id === roofsArray[0].roofMatlCd) {
//setRoofMaterials({ ...roofMaterials, layout: roofsArray[0].roofLayout })
addRoofs.push({ ...material, selected: true, layout: roofsArray[0].roofLayout })
setBasicSettings({
...basicSetting,
roofMaterials: material,
roofs: addRoofs,
roofSizeSet: roofsRow[0].roofSizeSet,
roofAngleSet: roofsRow[0].roofAngleSet,
roofsData: roofsArray,
})
}
})
roofsArray = res.map((item) => {
return {
roofApply: item.roofApply === '' || item.roofApply === false ? false : true,
roofSeq: item.roofSeq,
roofMatlCd: item.roofMatlCd,
roofWidth: item.roofWidth,
roofHeight: item.roofHeight,
roofHajebichi: item.roofHajebichi,
roofGap: item.roofGap,
roofLayout: item.roofLayout,
}
})
} else {
roofsRow = [{
roofSizeSet: 1,
roofAngleSet: 'slope',
}]
roofsArray = [{
roofApply: true,
roofSeq: 1,
roofMatlCd: 'ROOF_ID_WA_53A',
roofWidth: 265,
roofHeight: 235,
roofHajebichi: 0,
roofGap: 'HEI_455',
roofLayout: 'P',
}]
}
// 나머지 데이터와 함께 'roofs' 배열을 patternData에 넣음
const patternData = {
roofSizeSet: roofsRow[0].roofSizeSet,
roofAngleSet: roofsRow[0].roofAngleSet,
roofs: roofsArray, // 만들어진 roofs 배열
}
console.log('patternData', patternData)
// 데이터 설정
//setBasicSettings({ ...basicSetting, roofSizeSet: roofsRow[0].roofSizeSet, roofAngleSet: roofsRow[0].roofAngleSet, roofsData: roofsArray})
const addRoofs = []
roofMaterials.map((material) => {
if (material.id === roofsArray[0].roofMatlCd) {
//setRoofMaterials({ ...roofMaterials, layout: roofsArray[0].roofLayout })
addRoofs.push({ ...material, selected: true, layout: roofsArray[0].roofLayout })
setBasicSettings({ ...basicSetting, roofMaterials: material
, roofs: addRoofs
, roofSizeSet: roofsRow[0].roofSizeSet
, roofAngleSet: roofsRow[0].roofAngleSet
, roofsData: roofsArray })
}
})
// 데이터 설정
setBasicSettings({ ...basicSetting, roofSizeSet: roofsRow[0].roofSizeSet, roofAngleSet: roofsRow[0].roofAngleSet, roofsData: roofsArray })
})
} catch (error) {
console.error('Data fetching error:', error)
@ -347,22 +358,24 @@ export function useCanvasSetting() {
objectNo: correntObjectNo,
roofSizeSet: basicSetting.roofSizeSet,
roofAngleSet: basicSetting.roofAngleSet,
roofMaterialsAddList: [{
roofApply: true,
roofSeq: 1,
roofMatlCd: basicSetting.roofsData.roofMatlCd === null ? 'ROOF_ID_WA_53A' : basicSetting.roofsData.roofMatlCd,
roofWidth: basicSetting.roofsData.roofWidth === null ? 0 : basicSetting.roofsData.roofWidth,
roofHeight: basicSetting.roofsData.roofHeight === null ? 0 : basicSetting.roofsData.roofHeight,
roofHajebichi: basicSetting.roofsData.roofHajebichi === null ? 0 : basicSetting.roofsData.roofHajebichi,
roofGap: basicSetting.roofsData.roofGap === null ? 'HEI_455' : basicSetting.roofsData.roofGap,
roofLayout: basicSetting.roofsData.roofLayout,
}],
roofMaterialsAddList: [
{
roofApply: true,
roofSeq: 1,
roofMatlCd: basicSetting.roofsData.roofMatlCd === null ? 'ROOF_ID_WA_53A' : basicSetting.roofsData.roofMatlCd,
roofWidth: basicSetting.roofsData.roofWidth === null ? 0 : basicSetting.roofsData.roofWidth,
roofHeight: basicSetting.roofsData.roofHeight === null ? 0 : basicSetting.roofsData.roofHeight,
roofHajebichi: basicSetting.roofsData.roofHajebichi === null ? 0 : basicSetting.roofsData.roofHajebichi,
roofGap: basicSetting.roofsData.roofGap === null ? 'HEI_455' : basicSetting.roofsData.roofGap,
roofLayout: basicSetting.roofsData.roofLayout,
},
],
}
console.log('patternData 55', patternData)
await post({ url: `/api/canvas-management/canvas-basic-settings`, data: patternData }).then((res) => {
swalFire({ text: getMessage(res.returnMessage) })
swalFire({ text: getMessage(res.returnMessage) })
})
//Recoil 설정
@ -746,5 +759,7 @@ export function useCanvasSetting() {
setSettingsData,
settingsDataSave,
setSettingsDataSave,
addedRoofs,
setAddedRoofs,
}
}

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

@ -3,7 +3,7 @@ import { canvasState, currentMenuState, currentObjectState } from '@/store/canva
import { useEffect, useRef, useState } from 'react'
import { useSwal } from '@/hooks/useSwal'
import { usePolygon } from '@/hooks/usePolygon'
import { basicSettingState, roofDisplaySelector, roofMaterialsSelector, selectedRoofMaterialSelector } from '@/store/settingAtom'
import { addedRoofsState, basicSettingState, roofDisplaySelector, roofMaterialsSelector, selectedRoofMaterialSelector } from '@/store/settingAtom'
import { usePopup } from '@/hooks/usePopup'
import { POLYGON_TYPE } from '@/common/common'
import { v4 as uuidv4 } from 'uuid'
@ -30,7 +30,7 @@ export function useRoofAllocationSetting(id) {
const selectedRoofMaterial = useRecoilValue(selectedRoofMaterialSelector)
const [basicSetting, setBasicSetting] = useRecoilState(basicSettingState)
const [currentRoofMaterial, setCurrentRoofMaterial] = useState(roofMaterials[0]) // 팝업 내 기준 지붕재
const [roofList, setRoofList] = useState(basicSetting.roofs) // 배치면 초기설정에서 선택한 지붕재 배열
const [roofList, setRoofList] = useRecoilState(addedRoofsState) // 배치면 초기설정에서 선택한 지붕재 배열
const [editingLines, setEditingLines] = useState([])
const isFirstRef = useRef(0)

5
src/store/settingAtom.js
View File

@ -209,6 +209,11 @@ export const basicSettingState = atom({
dangerouslyAllowMutability: true,
})
export const addedRoofsState = atom({
key: 'addedRoofsState',
default: [],
})
// db에 등록된 지붕재 목록
export const roofMaterialsAtom = atom({
key: 'roofMaterialState',