From ad320708cff20a5af26fcdf224fdfaf3d95f1e68 Mon Sep 17 00:00:00 2001 From: changkyu choi Date: Mon, 3 Feb 2025 20:55:52 +0900 Subject: [PATCH 1/2] =?UTF-8?q?=ED=9A=8C=EB=A1=9C=ED=95=A0=EB=8B=B9(?= =?UTF-8?q?=EC=8A=B9=EC=95=95=EC=84=A4=EC=A0=95)=20=EC=A0=80=EC=9E=A5=20?= =?UTF-8?q?=EC=8B=9C=20Canvas=20Object=20=EC=A0=80=EC=9E=A5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../circuitTrestle/CircuitTrestleSetting.jsx | 89 +++++-------- .../modal/circuitTrestle/step/StepUp.jsx | 117 +++++------------- 2 files changed, 66 insertions(+), 140 deletions(-) diff --git a/src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx b/src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx index 3783e033..cd204c15 100644 --- a/src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx +++ b/src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx @@ -51,7 +51,9 @@ export default function CircuitTrestleSetting({ id }) { const [selectedStepUpValues, setSelectedStepUpValues] = useState({}) const [getStepUpSelections, setGetStepUpSelections] = useState(null) - const [stepUpListData, setStepUpListData] = useRecoilState(stepUpListDataState) + // const [stepUpListData, setStepUpListData] = useRecoilState(stepUpListDataState) + const [stepUpListData, setStepUpListData] = useState([]) + const [seletedOption, setSeletedOption] = useState(null) useEffect(() => { if (!managementState) { @@ -67,10 +69,6 @@ export default function CircuitTrestleSetting({ id }) { } }, [tabNum]) - useEffect(() => { - console.log('stepUpListData >>> ', stepUpListData) - }, [stepUpListData]) - const onAutoRecommend = () => { if (series.filter((s) => s.selected).length === 0) { swalFire({ @@ -358,60 +356,16 @@ export default function CircuitTrestleSetting({ id }) { setGetStepUpSelections(() => getCurrentSelections) } - // apply 함수 수정 + // 회로할당(승압설정) 저장 버튼 클릭 시 const onApply = () => { - // 현재 선택된 값들 가져오기 - const currentSelections = getStepUpSelections ? getStepUpSelections() : {} - - console.log('currentSelections >>> ', currentSelections) - - // 실제 선택된 값이 있는지 더 정확하게 확인 - const hasSelections = Object.values(currentSelections).some((stepUpConfig) => Object.values(stepUpConfig).length > 0) - - console.log('hasSelections >>> ', hasSelections) - - if (!hasSelections) { - swalFire({ - title: '승압 설정값을 선택해주세요.1', - type: 'alert', + canvas + .getObjects() + .filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE) + .map((obj) => { + obj.pcses = getStepUpListData() }) - return - } - // 선택된 값들 로그 - console.log('Applying StepUp configurations:', currentSelections) - - // StepUp 컴포넌트로부터 stepUpListData 받아오기 - //const stepUpData = getStepUpSelections().stepUpListData - //console.log('stepUpData >>> ', stepUpData) - // stepUpListData를 Recoil state에 저장 - // setStepUpListData(stepUpData) - - // 선택된 값들을 배열로 변환하여 처리 - const configurations = Object.values(currentSelections) - .map((stepUpConfig) => { - const firstConfig = Object.values(stepUpConfig)[0] // 첫 번째 설정만 사용 - return { - pcsInfo: firstConfig.pcsInfo, - allocation: firstConfig.allocation, - } - }) - .filter((config) => config.pcsInfo && config.allocation) // 유효한 설정만 필터링 - - console.log('Processed configurations:', configurations) - - // stepUpListData를 Recoil state에 저장 - setStepUpListData(configurations) - - // 기존 apply 로직 실행 전에 필요한 데이터가 모두 있는지 확인 - if (configurations.length > 0) { - apply() - } else { - swalFire({ - title: '승압 설정값을 선택해주세요.2', - type: 'alert', - }) - } + console.log(canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)) } const onClickPrev = () => { @@ -474,6 +428,29 @@ export default function CircuitTrestleSetting({ id }) { getRoofSurfaceList, // 지붕면 목록 getPcsItemList, // PCS 아이템 목록 onValuesSelected: handleStepUpValuesSelected, // 선택된 값들을 처리하는 함수 + stepUpListData, + setStepUpListData, + seletedOption, + setSeletedOption, + } + + const getStepUpListData = () => { + return stepUpListData[0].pcsItemList.map((item) => { + return item.serQtyList + .filter((serQty) => serQty.selected) + .map((serQty) => { + return { + pcsMkrCd: item.pcsMkrCd, + pcsSerCd: item.pcsSerCd, + pcsItemId: item.itemId, + pcsOptCd: seletedOption.code, + paralQty: serQty.paralQty, + connections: { + connItemId: item.connList[0].itemId, + }, + } + })[0] + }) } return ( diff --git a/src/components/floor-plan/modal/circuitTrestle/step/StepUp.jsx b/src/components/floor-plan/modal/circuitTrestle/step/StepUp.jsx index d5b19b77..f92eb3ef 100644 --- a/src/components/floor-plan/modal/circuitTrestle/step/StepUp.jsx +++ b/src/components/floor-plan/modal/circuitTrestle/step/StepUp.jsx @@ -12,6 +12,7 @@ import { useMasterController } from '@/hooks/common/useMasterController' import { v4 as uuidv4 } from 'uuid' export default function StepUp(props) { + const { stepUpListData, setStepUpListData, seletedOption, setSeletedOption } = props const { getMessage } = useMessage() const [moduleTab, setModuleTab] = useState(1) const [moduleTabs, setModuleTabs] = useState({}) @@ -22,7 +23,6 @@ export default function StepUp(props) { const { managementState, setManagementState, managementStateLoaded } = useContext(GlobalDataContext) const canvas = useRecoilValue(canvasState) const selectedModules = useRecoilValue(selectedModuleState) - const [stepUpListData, setStepUpListData] = useState([]) const [optCodes, setOptCodes] = useState([]) const [selectedRows, setSelectedRows] = useState({}) @@ -65,6 +65,7 @@ export default function StepUp(props) { // PCS 옵션 조회 const formattedOptCodes = formatOptionCodes(res.data.optionList) setOptCodes(formattedOptCodes) + setSeletedOption(formattedOptCodes[0].code) } } catch (error) { console.error('Error fetching step up data:', error) @@ -80,16 +81,6 @@ export default function StepUp(props) { })) } - // // PCS 승압설정 정보 포맷 - // const formatStepUpListData = (dataArray = []) => { - // return dataArray?.map((stepUps) => ({ - // ...stepUps, - // optionList: formatOptionList(stepUps.optionList), - // pcsItemList: formatPcsItemList(stepUps.pcsItemList), - // selectedPcsItem: formatPcsItemList(stepUps.pcsItemList), - // })) - // } - // PCS 승압설정 정보 포맷 후 추천 값 저장 const formatStepUpListData = (dataArray = []) => { const formattedData = dataArray?.map((stepUps) => ({ @@ -98,12 +89,12 @@ export default function StepUp(props) { pcsItemList: formatPcsItemList(stepUps.pcsItemList), selectedPcsItem: formatPcsItemList(stepUps.pcsItemList), })) - console.log('🚀 ~ formatStepUpListData ~ formattedData:', formattedData) + // 초기 추천 값들을 selectedValues에 저장 const initialSelectedValues = {} formattedData.forEach((stepUp) => { stepUp.pcsItemList.forEach((pcsItem, pcsIdx) => { - const pcsKey = `${stepUp.id}_${pcsIdx}` + const pcsKey = `${pcsItem.goodsNo}_${pcsIdx}` // 추천 값(rmdYn === 'Y') 찾기 const recommendedRow = pcsItem.serQtyList.find((item) => item.rmdYn === 'Y') @@ -122,8 +113,8 @@ export default function StepUp(props) { }, } - initialSelectedValues[stepUp.id] = { - ...initialSelectedValues[stepUp.id], + initialSelectedValues[pcsItem.goodsNo] = { + ...initialSelectedValues[pcsItem.goodsNo], [pcsKey]: selectionData, } } @@ -212,12 +203,7 @@ export default function StepUp(props) { } // 행 선택 핸들러 함수 추가 - // const handleRowClick = (goodsNo, pcsIdx, serQtyIdx, serQty, paralQty) => { const handleRowClick = (mainIdx, subIdx) => { - // const rowKey = `${goodsNo}_${pcsIdx}_${serQtyIdx}` - // const pcsKey = `${goodsNo}_${pcsIdx}` - // setSelectedRow(rowKey) - // item.selected = !item.selected\ let tempStepUpListData = [...stepUpListData] let selectedData = {} tempStepUpListData[0].pcsItemList[mainIdx].serQtyList.forEach((item, index) => { @@ -227,6 +213,7 @@ export default function StepUp(props) { item.selected = index === subIdx }) setStepUpListData(tempStepUpListData) + console.log('🚀 ~ handleRowClick ~ tempStepUpListData:', tempStepUpListData) console.log('🚀 ~ handleRowClick ~ selectedData:', selectedData) @@ -235,19 +222,16 @@ export default function StepUp(props) { const moduleIds = targetSurface.modules.map((module) => { return module.id }) - console.log(moduleIds) + canvas .getObjects() .filter((obj) => moduleIds.includes(obj.parentId)) .map((text) => { - console.log('🚀 ~ handleRowClick ~ text:', text) canvas.remove(text) }) canvas.renderAll() roofSurface.moduleList.forEach((module) => { - console.log('🚀 ~ handleRowClick ~ module:', module.uniqueId) - const targetModule = canvas.getObjects().filter((obj) => obj.id === module.uniqueId)[0] const moduleCircuitText = new fabric.Text(module.circuit, { left: targetModule.left + targetModule.width / 2, @@ -270,69 +254,26 @@ export default function StepUp(props) { }) canvas.renderAll() - // console.log('goodsNo >> ', goodsNo, serQty, paralQty) - // 현재 선택된 PCS 아이템 정보 가져오기 - // const pcsItem = stepUpListData.find((stepUp) => stepUp.pcsItemList.find((item) => item.goodsNo === goodsNo))?.pcsItemList[pcsIdx] - - // 선택된 값들 업데이트 - 더 자세한 정보 포함 - // const selectionData = { - // goodsNo: tempStepUpListData[mainIdx].pcsItemList[subIdx].goodsNo, - // pcsInfo: { - // itemId: tempStepUpListData[mainIdx].pcsItemList[subIdx].itemId, - // goodsNo: tempStepUpListData[mainIdx].pcsItemList[subIdx].goodsNo, - // pcsMkrCd: tempStepUpListData[mainIdx].pcsItemList[subIdx].pcsMkrCd, - // pcsSerCd: tempStepUpListData[mainIdx].pcsItemList[subIdx].pcsSerCd, - // }, - // allocation: { - // serQty: tempStepUpListData[mainIdx].pcsItemList[subIdx].serQtyList[subIdx].serQty, - // paralQty: tempStepUpListData[mainIdx].pcsItemList[subIdx].serQtyList[subIdx]. paralQty, - // }, - // } - - // // 선택된 값들 업데이트 - // setSelectedValues((prev) => ({ - // ...prev, - // [tempStepUpListData[mainIdx].pcsItemList[subIdx].goodsNo]: { - // ...prev[tempStepUpListData[mainIdx].pcsItemList[subIdx].goodsNo], - // [pcsKey]: selectionData, - // }, - // })) - - // // 부모 컴포넌트에 선택된 값들 전달 - // if (props.onValuesSelected) { - // props.onValuesSelected(selectionData) - // } - - // setSelectedRows((prev) => { - // // 현재 stepUpId에 대한 선택 상태가 없으면 빈 객체로 초기화 - // const currentStepUpSelections = prev[goodsNo] || {} - - // // 이미 선택된 행을 다시 클릭하는 경우, 선택을 해제하지 않음 - // if (currentStepUpSelections[pcsKey] === rowKey) { - // return prev - // } - - // return { - // ...prev, - // [goodsNo]: { - // ...currentStepUpSelections, - // [pcsKey]: rowKey, - // }, - // } - // }) - - // // 수동 선택 상태를 업데이트하되, 기존 추천 선택은 유지 - // setIsManualSelection((prev) => ({ - // ...prev, - // [goodsNo]: { - // ...prev[goodsNo], - // [pcsKey]: true, - // }, - // })) } // 현재 선택된 값들을 가져오는 함수 추가 const getCurrentSelections = () => { + const selectedValues = stepUpListData[0].pcsItemList.forEach((item) => { + item.serQtyList.filter((serQty) => serQty.selected) + return item.serQtyList.map((serQty) => { + return { + pcsMkrCd: serQty.pcsMkrCd, + pcsSerCd: serQty.pcsSerCd, + pcsItemId: serQty.itemId, + pcsOptCd: seletedOption, + paralQty: serQty.paralQty, + connections: { + connItemId: item.connList[0].itemId, + }, + } + }) + }) + return selectedValues } @@ -472,7 +413,15 @@ export default function StepUp(props) { {optCodes.length > 0 && (
{/* */} - + setSeletedOption(e)} + />
)} From 3b8234b5a2528536292486a7a60cfcbf709fccc3 Mon Sep 17 00:00:00 2001 From: "hyojun.choi" Date: Mon, 3 Feb 2025 21:19:37 +0900 Subject: [PATCH 2/2] =?UTF-8?q?=EA=B2=AC=EC=A0=81=EC=84=9C=20=EC=95=84?= =?UTF-8?q?=EC=9D=B4=ED=85=9C=20=EB=AA=A9=EB=A1=9D=20=EC=A1=B0=ED=9A=8C=20?= =?UTF-8?q?=EC=9E=91=EC=97=85=EC=A4=91?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../modal/circuitTrestle/CircuitTrestleSetting.jsx | 12 ++++++++---- .../floor-plan/modal/circuitTrestle/step/StepUp.jsx | 2 +- src/hooks/module/useTrestle.js | 7 +++---- 3 files changed, 12 insertions(+), 9 deletions(-) diff --git a/src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx b/src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx index cd204c15..4ec0c08a 100644 --- a/src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx +++ b/src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx @@ -366,6 +366,7 @@ export default function CircuitTrestleSetting({ id }) { }) console.log(canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)) + apply() } const onClickPrev = () => { @@ -443,11 +444,14 @@ export default function CircuitTrestleSetting({ id }) { pcsMkrCd: item.pcsMkrCd, pcsSerCd: item.pcsSerCd, pcsItemId: item.itemId, - pcsOptCd: seletedOption.code, + pscOptCd: seletedOption.code, + // pcsOptCd: 'CLC_RMC', paralQty: serQty.paralQty, - connections: { - connItemId: item.connList[0].itemId, - }, + connections: [ + { + connItemId: item.connList[0].itemId, + }, + ], } })[0] }) diff --git a/src/components/floor-plan/modal/circuitTrestle/step/StepUp.jsx b/src/components/floor-plan/modal/circuitTrestle/step/StepUp.jsx index f92eb3ef..9f558f16 100644 --- a/src/components/floor-plan/modal/circuitTrestle/step/StepUp.jsx +++ b/src/components/floor-plan/modal/circuitTrestle/step/StepUp.jsx @@ -65,7 +65,7 @@ export default function StepUp(props) { // PCS 옵션 조회 const formattedOptCodes = formatOptionCodes(res.data.optionList) setOptCodes(formattedOptCodes) - setSeletedOption(formattedOptCodes[0].code) + setSeletedOption(formattedOptCodes[0]) } } catch (error) { console.error('Error fetching step up data:', error) diff --git a/src/hooks/module/useTrestle.js b/src/hooks/module/useTrestle.js index f9aa1de0..8f1ed94c 100644 --- a/src/hooks/module/useTrestle.js +++ b/src/hooks/module/useTrestle.js @@ -194,7 +194,6 @@ export const useTrestle = () => { height = Math.floor(height) let { x: startX, y: startY } = { ...module.getCenterPoint() } let { x, y } = { ...module.getCenterPoint() } - //TODO : 방향별로 가대 설치해야함 let leftRows = 1 let rightRows = 1 @@ -446,9 +445,9 @@ export const useTrestle = () => { const getQuoationItems = () => { const surfaces = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE) - const params = { trestles: surfaces.map((surface) => surface.quotationParam), pcses: [] } + const params = { trestles: surfaces.map((surface) => surface.quotationParam), pcses: surfaces[0].pcses ?? [] } getQuotationItem(params).then((res) => { - console.log(res) + console.log('res', res) }) } @@ -1884,7 +1883,7 @@ export const useTrestle = () => { const clear = () => { canvas.getObjects().forEach((obj) => { - if (obj.name === 'eaveBar' || obj.name === 'rack' || obj.name === 'halfEaveBar' || obj.name === 'smartRack') { + if (obj.name === 'eaveBar' || obj.name === 'rack' || obj.name === 'halfEaveBar' || obj.name === 'smartRack' || obj.name === 'bracket') { canvas.remove(obj) } })