From be217754112611421e64382ba904ef66c111cf1b Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EA=B9=80=EB=AF=BC=EC=8B=9D?=
<43837214+Minsiki@users.noreply.github.com>
Date: Fri, 7 Mar 2025 14:24:18 +0900
Subject: [PATCH 1/2] =?UTF-8?q?module=20=EA=B4=80=EB=A0=A8=20contextmenu?=
=?UTF-8?q?=20=EA=B8=B0=EB=8A=A5=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
.../circuitTrestle/CircuitTrestleSetting.jsx | 13 +-
.../floor-plan/modal/module/PanelEdit.jsx | 1 -
src/hooks/module/useModule.js | 111 +++++----
src/hooks/module/useTrestle.js | 8 +-
src/hooks/useCirCuitTrestle.js | 10 +-
src/hooks/useContextMenu.js | 223 +++++++++++++-----
6 files changed, 243 insertions(+), 123 deletions(-)
diff --git a/src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx b/src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx
index f9f97833..8d737c2d 100644
--- a/src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx
+++ b/src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx
@@ -52,7 +52,7 @@ export default function CircuitTrestleSetting({ id }) {
// const [stepUpListData, setStepUpListData] = useRecoilState(stepUpListDataState)
const [stepUpListData, setStepUpListData] = useState([])
const [seletedOption, setSeletedOption] = useState(null)
- const { setModuleStatisticsData } = useCircuitTrestle()
+ const { setModuleStatisticsData, resetCircuits } = useCircuitTrestle()
const { handleCanvasToPng } = useImgLoader()
const passivityCircuitAllocationRef = useRef()
@@ -92,6 +92,17 @@ export default function CircuitTrestleSetting({ id }) {
// selectedModels,
// pcsCheck,
// })
+
+ return () => {
+ if (
+ canvas
+ .getObjects()
+ .filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
+ .some((surface) => !surface.isComplete)
+ ) {
+ resetCircuits()
+ }
+ }
}, [])
// 수동할당 시 모듈 삭제
diff --git a/src/components/floor-plan/modal/module/PanelEdit.jsx b/src/components/floor-plan/modal/module/PanelEdit.jsx
index eafe159a..fa5c7ef7 100644
--- a/src/components/floor-plan/modal/module/PanelEdit.jsx
+++ b/src/components/floor-plan/modal/module/PanelEdit.jsx
@@ -34,7 +34,6 @@ export default function PanelEdit(props) {
const canvas = useRecoilValue(canvasState)
const { swalFire } = useSwal()
const { moduleMove, moduleCopy, moduleMultiMove, moduleMultiCopy, moduleMoveAll, moduleCopyAll } = useModule()
-
useEffect(() => {
if (!canvas) {
const isSetupModules = canvas.getObjects().filter((obj) => obj.name === 'module') // selectedObj에 없는 객체만 필터링
diff --git a/src/hooks/module/useModule.js b/src/hooks/module/useModule.js
index 24cd9ae8..4b0b9160 100644
--- a/src/hooks/module/useModule.js
+++ b/src/hooks/module/useModule.js
@@ -108,13 +108,18 @@ export function useModule() {
return
}
const activeModule = canvas.getObjects().find((obj) => canvas.getActiveObjects()[0].id === obj.id)
+ const surfaces = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
if (activeModule.circuit) {
- swalFire({
- title: getMessage('can.not.move.module'),
- icon: 'error',
- type: 'alert',
- })
- return
+ if (surfaces.some((surface) => surface.isComplete)) {
+ swalFire({
+ title: getMessage('can.not.move.module'),
+ icon: 'error',
+ type: 'alert',
+ })
+ return
+ }
+
+ removeTrestleMaterials()
}
const modules = type === 'row' ? getRowModules(activeModule) : getColumnModules(activeModule)
const otherModules = getOtherModules(modules)
@@ -224,7 +229,7 @@ export function useModule() {
}
modules.forEach((module) => {
- const { top, left } = getPosotion(module, direction, Number(length) + Number(moduleLength), true)
+ const { top, left } = getPosotion(module, direction, Number(length) + Number(moduleLength) * 10, false)
module.clone((obj) => {
obj.set({
parentId: module.parentId,
@@ -263,8 +268,12 @@ export function useModule() {
canvas.renderAll()
},
})
+ } else {
+ surface.set({ modules: [...surface.modules, ...copyModules] })
}
})
+
+ setModuleStatisticsData()
}
const moduleCopy = (length, direction) => {
@@ -342,12 +351,17 @@ export function useModule() {
}
const activeModule = canvas.getObjects().find((obj) => canvas.getActiveObjects()[0].id === obj.id)
if (activeModule.circuit) {
- swalFire({
- title: getMessage('can.not.copy.module'),
- icon: 'error',
- type: 'alert',
- })
- return
+ const surfaces = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
+ if (surfaces.some((surface) => surface.isComplete)) {
+ swalFire({
+ title: getMessage('can.not.copy.module'),
+ icon: 'error',
+ type: 'alert',
+ })
+ return
+ }
+
+ removeTrestleMaterials()
}
const modules = type === 'row' ? getRowModules(activeModule) : getColumnModules(activeModule)
const otherModules = canvas.getObjects().filter((obj) => obj.surfaceId === modules[0].surfaceId && obj.name === POLYGON_TYPE.MODULE)
@@ -364,7 +378,7 @@ export function useModule() {
}
modules.forEach((module) => {
- const { top, left } = getPosotion(module, direction, Number(length) + Number(moduleLength), true)
+ const { top, left } = getPosotion(module, direction, Number(length), true)
module.clone((obj) => {
obj.set({
parentId: module.parentId,
@@ -385,6 +399,7 @@ export function useModule() {
canvas.add(obj)
copyModules.push(obj)
obj.setCoords()
+ console.log(obj)
})
if (
isOverlapOtherModules(copyModule, otherModules) ||
@@ -430,6 +445,10 @@ export function useModule() {
if (moduleSetupSurface.isComplete) {
resetSurface()
}
+ const surfaces = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
+ if (surfaces.some((surface) => surface.isComplete)) {
+ removeTrestleMaterials()
+ }
canvas.discardActiveObject()
moduleSetupSurface.set({ modules: otherModules })
canvas.remove(...columnModules)
@@ -528,14 +547,13 @@ export function useModule() {
canvas.renderAll()
},
})
+ } else {
+ surfaces.modules = surfaces.modules.filter((module) => !columnModules.map((copyModule) => copyModule.id).includes(module.id))
}
setModuleStatisticsData()
}
const moduleRowRemove = (type) => {
- // if (isFixedModule()) {
- // return
- // }
const activeModule = canvas.getObjects().find((obj) => canvas.getActiveObjects()[0].id === obj.id)
const rowModules = getRowModules(activeModule)
const otherModules = getOtherModules(rowModules)
@@ -546,8 +564,9 @@ export function useModule() {
let height = -1
const moduleSetupSurface = canvas.getObjects().find((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE && obj.id === activeModule.surfaceId)
let isWarning = false
- if (moduleSetupSurface.isComplete) {
- resetSurface()
+ const surfaces = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
+ if (surfaces.some((surface) => surface.isComplete)) {
+ removeTrestleMaterials()
}
canvas.discardActiveObject()
moduleSetupSurface.set({ modules: otherModules })
@@ -652,9 +671,6 @@ export function useModule() {
}
const moduleColumnInsert = (type) => {
- if (isFixedModule()) {
- return
- }
const activeModule = canvas.getObjects().find((obj) => canvas.getActiveObjects()[0].id === obj.id)
const columnModules = getColumnModules(activeModule)
let otherModules = getOtherModules(columnModules)
@@ -665,25 +681,11 @@ export function useModule() {
const objects = getObjects()
const copyModules = []
const moduleSetupSurface = canvas.getObjects().find((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE && obj.id === activeModule.surfaceId)
- if (moduleSetupSurface.isComplete) {
- resetSurface()
- }
- let width = -1
let isWarning = false
const { moduleIntvlHor, moduleIntvlVer } = moduleSetupSurface.trestleDetail
- if (targetModules.length === 0) {
- swalFire({
- title: '마지막 모듈입니다.',
- icon: 'error',
- type: 'alert',
- })
- return
- }
canvas.discardActiveObject()
targetModules.forEach((module) => {
- if (width === -1)
- width = type === MODULE_INSERT_TYPE.LEFT ? Number(activeModule.left) - Number(module.left) : Number(module.left) - Number(activeModule.left)
- const { top, left } = getPosotion(module, type, module.width, true)
+ const { top, left } = getPosotion(module, type, moduleIntvlHor, true)
module.originPos = {
left: module.left,
top: module.top,
@@ -700,7 +702,7 @@ export function useModule() {
canvas.renderAll()
otherModules = getOtherModules(columnModules)
columnModules.forEach((module) => {
- const { top, left } = getPosotion(module, type, module.width + moduleIntvlHor, true)
+ const { top, left } = getPosotion(module, type, moduleIntvlHor, true)
let copyModule = null
module.clone((obj) => {
obj.set({
@@ -749,6 +751,8 @@ export function useModule() {
canvas.renderAll()
},
})
+ } else {
+ moduleSetupSurface.modules = [...surface.modules, ...copyModules]
}
setModuleStatisticsData()
}
@@ -779,29 +783,14 @@ export function useModule() {
type === MODULE_INSERT_TYPE.TOP
? otherModules.filter((module) => module.top < activeModule.top).sort((a, b) => a.top - b.top)
: otherModules.filter((module) => module.top > activeModule.top).sort((a, b) => a.top - b.top)
- if (targetModules.length === 0) {
- swalFire({
- title: '마지막 모듈입니다.',
- icon: 'error',
- type: 'alert',
- })
- return
- }
const objects = getObjects()
const copyModules = []
const moduleSetupSurface = canvas.getObjects().find((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE && obj.id === activeModule.surfaceId)
- let height = -1
let isWarning = false
const { moduleIntvlHor, moduleIntvlVer } = moduleSetupSurface.trestleDetail
-
- if (surface.isComplete) {
- resetSurface()
- }
canvas.discardActiveObject()
targetModules.forEach((module) => {
- if (height === -1)
- height = type === MODULE_INSERT_TYPE.TOP ? Number(activeModule.top) - Number(module.top) : Number(module.top) - Number(activeModule.top)
- const { top, left } = getPosotion(module, type, activeModule.height + moduleIntvlVer, true)
+ const { top, left } = getPosotion(module, type, moduleIntvlVer, true)
module.originPos = {
left: module.left,
top: module.top,
@@ -817,7 +806,7 @@ export function useModule() {
canvas.renderAll()
otherModules = getOtherModules(rowModules)
rowModules.forEach((module) => {
- const { top, left } = getPosotion(module, type, activeModule.height + moduleIntvlVer, true)
+ const { top, left } = getPosotion(module, type, moduleIntvlVer, true)
let copyModule = null
module.clone((obj) => {
obj.set({
@@ -869,6 +858,8 @@ export function useModule() {
canvas.renderAll()
},
})
+ } else {
+ moduleSetupSurface.modules = [...surface.modules, ...copyModules]
}
setModuleStatisticsData()
}
@@ -931,14 +922,20 @@ export function useModule() {
})
}
+ // 회로가 없을때만 삭제 가능
const modulesRemove = () => {
const activeModule = canvas.getObjects().find((obj) => canvas.getActiveObjects()[0].id === obj.id)
const modules = canvas
.getObjects()
.filter((obj) => obj.surfaceId === activeModule.surfaceId && obj.name === POLYGON_TYPE.MODULE && activeModule.id !== obj.id)
const surface = canvas.getObjects().find((obj) => obj.id === activeModule.surfaceId && obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
- if (surface.isComplete) {
- resetSurface()
+ if (activeModule.circuit) {
+ swalFire({
+ title: getMessage('can.not.remove.module'),
+ icon: 'error',
+ type: 'alert',
+ })
+ return
}
surface.set({ modules: modules })
diff --git a/src/hooks/module/useTrestle.js b/src/hooks/module/useTrestle.js
index d507ab9c..bb359cb9 100644
--- a/src/hooks/module/useTrestle.js
+++ b/src/hooks/module/useTrestle.js
@@ -2799,5 +2799,11 @@ export const useTrestle = () => {
})
}
- return { apply, getTrestleParams, clear, setViewCircuitNumberTexts, getEstimateData, setAllModuleSurfaceIsComplete }
+ // 배치면 전체에 가대 설치 여부
+ const isAllComplete = () => {
+ const surfaces = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
+ return surfaces.every((surface) => surface.isComplete)
+ }
+
+ return { apply, getTrestleParams, clear, setViewCircuitNumberTexts, getEstimateData, setAllModuleSurfaceIsComplete, isAllComplete }
}
diff --git a/src/hooks/useCirCuitTrestle.js b/src/hooks/useCirCuitTrestle.js
index 1d3a1b2e..74675ecb 100644
--- a/src/hooks/useCirCuitTrestle.js
+++ b/src/hooks/useCirCuitTrestle.js
@@ -176,8 +176,6 @@ export function useCircuitTrestle() {
canvas.renderAll()
}
- const setPowerConditionerData = () => {}
-
const setModuleStatisticsData = () => {
console.log('selectedModules', selectedModules)
if (!selectedModules || !selectedModules?.itemList || selectedModules?.itemList?.length === 0) return
@@ -302,6 +300,13 @@ export function useCircuitTrestle() {
})
if (circuitTexts.length > 0) canvas.remove(...circuitTexts)
canvas.renderAll()
+
+ setModuleStatisticsData()
+ }
+
+ const isExistCircuit = () => {
+ const circuits = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE && obj.circuit)
+ return circuits.length > 0
}
return {
@@ -326,5 +331,6 @@ export function useCircuitTrestle() {
removeNotAllocationModules,
setModuleStatisticsData,
resetCircuits,
+ isExistCircuit,
}
}
diff --git a/src/hooks/useContextMenu.js b/src/hooks/useContextMenu.js
index 8845d3b7..6df32c17 100644
--- a/src/hooks/useContextMenu.js
+++ b/src/hooks/useContextMenu.js
@@ -43,6 +43,8 @@ import { useRoofFn } from '@/hooks/common/useRoofFn'
import { MODULE_ALIGN_TYPE, useModule } from './module/useModule'
import PlacementSurfaceLineProperty from '@/components/floor-plan/modal/placementShape/PlacementSurfaceLineProperty'
import { selectedMenuState } from '@/store/menuAtom'
+import { useTrestle } from './module/useTrestle'
+import { useCircuitTrestle } from './useCirCuitTrestle'
export function useContextMenu() {
const canvas = useRecoilValue(canvasState)
@@ -73,7 +75,8 @@ export function useContextMenu() {
const { alignModule, modulesRemove, moduleRoofRemove } = useModule()
const { removeRoofMaterial, removeAllRoofMaterial, moveRoofMaterial, removeOuterLines } = useRoofFn()
const selectedMenu = useRecoilValue(selectedMenuState)
-
+ const { isAllComplete, clear: resetModule } = useTrestle()
+ const { isExistCircuit } = useCircuitTrestle()
const currentMenuSetting = () => {
switch (selectedMenu) {
case 'outline':
@@ -602,56 +605,154 @@ export function useContextMenu() {
{
id: 'move',
name: getMessage('contextmenu.move'),
- component: ,
+ fn: () => {
+ if (currentObject.circuit) {
+ swalFire({
+ title: getMessage('can.not.move.module'),
+ icon: 'error',
+ type: 'alert',
+ })
+ return
+ }
+
+ addPopup(popupId, 1, )
+ },
+ // component: ,
},
{
id: 'copy',
name: getMessage('contextmenu.copy'),
- component: ,
+ fn: () => {
+ if (currentObject.circuit) {
+ swalFire({
+ title: getMessage('can.not.copy.module'),
+ icon: 'error',
+ type: 'alert',
+ })
+ return
+ }
+
+ addPopup(popupId, 1, )
+ },
},
],
[
{
id: 'columnMove',
name: getMessage('contextmenu.column.move'),
- component: ,
+ fn: () => {
+ if (isAllComplete()) {
+ swalFire({
+ title: getMessage('can.not.move.module'),
+ icon: 'error',
+ type: 'alert',
+ })
+ return
+ }
+
+ addPopup(popupId, 1, )
+ },
},
{
id: 'columnCopy',
name: getMessage('contextmenu.column.copy'),
- component: ,
+ fn: () => {
+ if (isAllComplete()) {
+ swalFire({
+ title: getMessage('can.not.copy.module'),
+ icon: 'error',
+ type: 'alert',
+ })
+ return
+ }
+
+ addPopup(popupId, 1, )
+ },
+ // component: ,
},
{
id: 'columnRemove',
name: getMessage('contextmenu.column.remove'),
- component: ,
+ fn: () => {
+ if (isExistCircuit()) {
+ resetModule()
+ }
+
+ addPopup(popupId, 1, )
+ },
+ // component: ,
},
{
id: 'columnInsert',
name: getMessage('contextmenu.column.insert'),
- component: ,
+ fn: () => {
+ if (isExistCircuit()) {
+ resetModule()
+ }
+
+ addPopup(popupId, 1, )
+ },
+ // component: ,
},
],
[
{
id: 'rowMove',
name: getMessage('contextmenu.row.move'),
- component: ,
+ fn: () => {
+ if (isAllComplete()) {
+ swalFire({
+ title: getMessage('can.not.move.module'),
+ icon: 'error',
+ type: 'alert',
+ })
+ return
+ }
+
+ addPopup(popupId, 1, )
+ },
+ // component: ,
},
{
id: 'rowCopy',
name: getMessage('contextmenu.row.copy'),
- component: ,
+ fn: () => {
+ if (isAllComplete()) {
+ swalFire({
+ title: getMessage('can.not.copy.module'),
+ icon: 'error',
+ type: 'alert',
+ })
+ return
+ }
+
+ addPopup(popupId, 1, )
+ },
+ // component: ,
},
{
id: 'rowRemove',
name: getMessage('contextmenu.row.remove'),
- component: ,
+ fn: () => {
+ if (isExistCircuit()) {
+ resetModule()
+ }
+
+ addPopup(popupId, 1, )
+ },
+ // component: ,
},
{
id: 'rowInsert',
name: getMessage('contextmenu.row.insert'),
- component: ,
+ fn: () => {
+ if (isExistCircuit()) {
+ resetModule()
+ }
+
+ addPopup(popupId, 1, )
+ },
+ // component: ,
},
],
])
@@ -663,32 +764,16 @@ export function useContextMenu() {
id: 'moduleVerticalCenterAlign',
name: getMessage('contextmenu.module.vertical.align'),
fn: () => {
- if (currentObject.arrayData) {
- let existCircuit = false
- currentObject.arrayData.forEach((surface) => {
- surface.modules.forEach((module) => {
- if (module.circuit) existCircuit = true
- })
+ if (isAllComplete()) {
+ swalFire({
+ title: getMessage('can.not.move.module'),
+ icon: 'error',
+ type: 'alert',
})
- if (existCircuit) {
- swalFire({
- title: getMessage('can.not.move.module'),
- icon: 'error',
- type: 'alert',
- })
- return
- }
- } else {
- const allocatedModules = currentObject.modules.filter((module) => module.circuit !== null)
- if (allocatedModules.length > 0) {
- swalFire({
- title: getMessage('can.not.move.module'),
- icon: 'error',
- type: 'alert',
- })
- return
- }
+ return
}
+
+ resetModule()
alignModule(MODULE_ALIGN_TYPE.VERTICAL, currentObject.arrayData ?? [currentObject])
},
},
@@ -696,32 +781,15 @@ export function useContextMenu() {
id: 'moduleHorizonCenterAlign',
name: getMessage('contextmenu.module.horizon.align'),
fn: () => {
- if (currentObject.arrayData) {
- let existCircuit = false
- currentObject.arrayData.forEach((surface) => {
- surface.modules.forEach((module) => {
- if (module.circuit) existCircuit = true
- })
+ if (isAllComplete()) {
+ swalFire({
+ title: getMessage('can.not.move.module'),
+ icon: 'error',
+ type: 'alert',
})
- if (existCircuit) {
- swalFire({
- title: getMessage('can.not.move.module'),
- icon: 'error',
- type: 'alert',
- })
- return
- }
- } else {
- const allocatedModules = currentObject.modules.filter((module) => module.circuit !== null)
- if (allocatedModules.length > 0) {
- swalFire({
- title: getMessage('can.not.move.module'),
- icon: 'error',
- type: 'alert',
- })
- return
- }
+ return
}
+
alignModule(MODULE_ALIGN_TYPE.HORIZONTAL, currentObject.arrayData ?? [currentObject])
},
},
@@ -740,12 +808,45 @@ export function useContextMenu() {
{
id: 'moduleMove',
name: getMessage('contextmenu.module.move'),
- component: ,
+ fn: () => {
+ if (isAllComplete()) {
+ swalFire({
+ title: getMessage('can.not.move.module'),
+ icon: 'error',
+ type: 'alert',
+ })
+ return
+ }
+ resetModule()
+ addPopup(
+ popupId,
+ 1,
+ ,
+ )
+ },
+
+ // component: ,
},
{
id: 'moduleCopy',
name: getMessage('contextmenu.module.copy'),
- component: ,
+ fn: () => {
+ if (isAllComplete()) {
+ swalFire({
+ title: getMessage('can.not.move.module'),
+ icon: 'error',
+ type: 'alert',
+ })
+ return
+ }
+ resetModule()
+ addPopup(
+ popupId,
+ 1,
+ ,
+ )
+ },
+ // component: ,
},
// {
// id: 'moduleCircuitNumberEdit',
From 099e860951a7365ad78a54a7b3eaf3a401abb1b0 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=EA=B9=80=EB=AF=BC=EC=8B=9D?=
<43837214+Minsiki@users.noreply.github.com>
Date: Fri, 7 Mar 2025 14:43:27 +0900
Subject: [PATCH 2/2] =?UTF-8?q?=EB=B2=84=EA=B7=B8=20=EC=88=98=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
---
src/hooks/module/useModule.js | 5 +++--
1 file changed, 3 insertions(+), 2 deletions(-)
diff --git a/src/hooks/module/useModule.js b/src/hooks/module/useModule.js
index 4b0b9160..c237e146 100644
--- a/src/hooks/module/useModule.js
+++ b/src/hooks/module/useModule.js
@@ -733,6 +733,7 @@ export function useModule() {
isOutsideSurface(copyModule, moduleSetupSurface)
) {
isWarning = true
+ copyModule.set({ fill: 'red' })
}
module.setCoords()
})
@@ -752,7 +753,7 @@ export function useModule() {
},
})
} else {
- moduleSetupSurface.modules = [...surface.modules, ...copyModules]
+ moduleSetupSurface.modules = [...moduleSetupSurface.modules, ...copyModules]
}
setModuleStatisticsData()
}
@@ -859,7 +860,7 @@ export function useModule() {
},
})
} else {
- moduleSetupSurface.modules = [...surface.modules, ...copyModules]
+ moduleSetupSurface.modules = [...moduleSetupSurface.modules, ...copyModules]
}
setModuleStatisticsData()
}