From 5597f8ad70dbbaeeffc8a16c216df6a04fb83159 Mon Sep 17 00:00:00 2001 From: yjnoh Date: Tue, 25 Mar 2025 15:48:18 +0900 Subject: [PATCH] =?UTF-8?q?=EC=A7=80=EB=B6=95=EB=9D=BC=EC=9D=B8=20?= =?UTF-8?q?=EC=83=89=EC=B9=A0=ED=95=98=EA=B8=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/hooks/module/useModuleBasicSetting.js | 30 ++++++++++++++++++++--- 1 file changed, 27 insertions(+), 3 deletions(-) diff --git a/src/hooks/module/useModuleBasicSetting.js b/src/hooks/module/useModuleBasicSetting.js index 1da528a2..277ec492 100644 --- a/src/hooks/module/useModuleBasicSetting.js +++ b/src/hooks/module/useModuleBasicSetting.js @@ -81,6 +81,14 @@ export function useModuleBasicSetting(tabNum) { removeMouseEvent('mouse:up') removeMouseEvent('mouse:move') canvas?.remove(...canvas?.getObjects().filter((obj) => obj.name === 'tempModule')) //움직일때 일단 지워가면서 움직임 + canvas.getObjects().forEach((obj) => { + if (obj.name === POLYGON_TYPE.ROOF) { + obj.set({ + stroke: 'black', + strokeWidth: 3, + }) + } + }) } }, []) @@ -147,11 +155,10 @@ export function useModuleBasicSetting(tabNum) { //가대 상세 데이터 들어오면 실행 useEffect(() => { if (trestleDetailList.length > 0) { - console.log('trestleDetailList', trestleDetailList) //지붕을 가져옴 canvas .getObjects() - .filter((roof) => roof.name === 'roof') + .filter((roof) => roof.name === POLYGON_TYPE.ROOF) .forEach((roof) => { if (!roof.roofMaterial) return const roofIndex = roof.roofMaterial.index //지붕의 지붕재의 순번 @@ -159,7 +166,12 @@ export function useModuleBasicSetting(tabNum) { if (detail.data !== null) { if (Number(detail.data.roofIndex) === roofIndex) { //roof에 상세 데이터 추가 - roof.set({ trestleDetail: detail.data }) + + roof.set({ + trestleDetail: detail.data, + stroke: roofOutlineColor(roofIndex), + strokeWidth: 7, + }) roof.lines.forEach((line) => { line.attributes = { ...line.attributes, @@ -176,6 +188,18 @@ export function useModuleBasicSetting(tabNum) { } }, [trestleDetailList]) + const roofOutlineColor = (roofIndex) => { + if (roofIndex === 1) { + return 'rgb(86,170,255)' + } else if (roofIndex === 2) { + return 'rgb(125, 252, 173)' + } else if (roofIndex === 3) { + return 'rgb(238, 109, 255)' + } else { + return 'rgb(252, 148, 106)' + } + } + const getOffset = (data, type) => { switch (type) { case LINE_TYPE.WALLLINE.EAVES: