From 6a979fefc934c1f32ec5595d0fbd775292a295be Mon Sep 17 00:00:00 2001 From: minsik Date: Mon, 28 Oct 2024 13:35:23 +0900 Subject: [PATCH 01/29] =?UTF-8?q?=F0=9F=9A=A8chore:=20Sync=20Sass?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/styles/_contents.scss | 2 +- src/styles/_reset.scss | 4 ++++ 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/src/styles/_contents.scss b/src/styles/_contents.scss index e3d8d1ee..e4f6a6b2 100644 --- a/src/styles/_contents.scss +++ b/src/styles/_contents.scss @@ -329,7 +329,7 @@ border-top: 1px solid #000; width: 100%; transition: all .17s ease-in-out; - z-index: 999; + z-index: 99; &.active{ top: calc(92.8px + 50px); } diff --git a/src/styles/_reset.scss b/src/styles/_reset.scss index 525c0488..4225db2e 100644 --- a/src/styles/_reset.scss +++ b/src/styles/_reset.scss @@ -130,6 +130,10 @@ button{ font-family: 'Pretendard', sans-serif !important; } +.no-click{ + cursor: no-drop !important; +} + // margin .mt5{margin-top: 5px !important;} .mt10{margin-top: 10px !important;} From 598772025d345b6b967ab0627226f5b0921a512f Mon Sep 17 00:00:00 2001 From: yoosangwook Date: Mon, 28 Oct 2024 17:22:16 +0900 Subject: [PATCH 02/29] fix: remove unused code --- src/components/floor-plan/FloorPlan.jsx | 5 ----- 1 file changed, 5 deletions(-) diff --git a/src/components/floor-plan/FloorPlan.jsx b/src/components/floor-plan/FloorPlan.jsx index adee1b60..a2a5abc3 100644 --- a/src/components/floor-plan/FloorPlan.jsx +++ b/src/components/floor-plan/FloorPlan.jsx @@ -6,7 +6,6 @@ import { useAxios } from '@/hooks/useAxios' import { globalLocaleStore } from '@/store/localeAtom' import { settingModalFirstOptionsState, settingModalSecondOptionsState } from '@/store/settingAtom' import CanvasMenu from '@/components/floor-plan/CanvasMenu' -import CanvasLayout from '@/components/floor-plan/CanvasLayout' import { useCanvasMenu } from '@/hooks/common/useCanvasMenu' import '@/styles/contents.scss' @@ -28,10 +27,6 @@ export default function FloorPlan({ children }) { fetchSettings() }, [objectNo]) - useEffect(() => { - setMenuNumber(1) - }, []) - // Canvas Setting 조회 const fetchSettings = async () => { try { From 41b03e6acf27aac6f2152c7210581f973075a4cb Mon Sep 17 00:00:00 2001 From: yoosangwook Date: Mon, 28 Oct 2024 17:22:56 +0900 Subject: [PATCH 03/29] fix: add redirect code --- src/components/floor-plan/CanvasMenu.jsx | 5 +++++ 1 file changed, 5 insertions(+) diff --git a/src/components/floor-plan/CanvasMenu.jsx b/src/components/floor-plan/CanvasMenu.jsx index 07411efb..b2ff69f6 100644 --- a/src/components/floor-plan/CanvasMenu.jsx +++ b/src/components/floor-plan/CanvasMenu.jsx @@ -4,6 +4,7 @@ import { useEffect, useState } from 'react' import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil' +import { usePathname, useRouter } from 'next/navigation' import MenuDepth01 from './MenuDepth01' import QSelectBox from '@/components/common/select/QSelectBox' import { v4 as uuidv4 } from 'uuid' @@ -40,6 +41,8 @@ const canvasMenus = [ export default function CanvasMenu(props) { const { menuNumber, setMenuNumber } = props + const pathname = usePathname() + const router = useRouter() const { addPopup, closePopup } = usePopup() const [type, setType] = useState('') @@ -96,6 +99,8 @@ export default function CanvasMenu(props) { setType('module') break } + + if (pathname !== '/floor-plan') router.push('/floor-plan') } const menuProps = { type, From bf471fc76610e49b7254b79338fc7d8b4648c47e Mon Sep 17 00:00:00 2001 From: leeyongjae Date: Mon, 28 Oct 2024 17:58:57 +0900 Subject: [PATCH 04/29] =?UTF-8?q?=EB=A1=9C=EA=B7=B8=EC=9D=B8=20=EC=A0=95?= =?UTF-8?q?=EB=B3=B4=20custCd=20=EC=B6=94=EA=B0=80=20(=EC=9E=84=EC=8B=9C?= =?UTF-8?q?=EB=A1=9C=EA=B7=B8=EC=9D=B8=20custCd=20=EC=98=88=EC=8B=9C=20?= =?UTF-8?q?=EC=B6=94=EA=B0=80)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/layout.js | 1 + src/components/auth/Login.jsx | 2 ++ src/lib/authActions.js | 1 + 3 files changed, 4 insertions(+) diff --git a/src/app/layout.js b/src/app/layout.js index b41172c9..684dfb7f 100644 --- a/src/app/layout.js +++ b/src/app/layout.js @@ -46,6 +46,7 @@ export default async function RootLayout({ children }) { storeLvl: session.storeLvl, groupId: session.groupId, pwdInitYn: session.pwdInitYn, + custCd: session.custCd, isLoggedIn: session.isLoggedIn, } } diff --git a/src/components/auth/Login.jsx b/src/components/auth/Login.jsx index ef4f92a3..283d7d99 100644 --- a/src/components/auth/Login.jsx +++ b/src/components/auth/Login.jsx @@ -98,6 +98,7 @@ export default function Login() { pwdInitYn: 'Y', storeLvl: '1', groupId: '60000', + custCd: '100000', }) setSessionState({ userId: 'NEW016610', @@ -115,6 +116,7 @@ export default function Login() { pwdInitYn: 'Y', storeLvl: '1', groupId: '60000', + custCd: '100000', }) if (chkLoginId) { Cookies.set('chkLoginId', formData.get('id'), { expires: 7 }) diff --git a/src/lib/authActions.js b/src/lib/authActions.js index 618985b9..0834833e 100644 --- a/src/lib/authActions.js +++ b/src/lib/authActions.js @@ -52,6 +52,7 @@ export async function setSession(data) { session.storeLvl = data.storeLvl session.groupId = data.groupId session.pwdInitYn = data.pwdInitYn + session.custCd = data.custCd session.isLoggedIn = true // console.log('session:', session) From 871e29a924ada0274456971bc7bdaf51790138e5 Mon Sep 17 00:00:00 2001 From: yoosangwook Date: Mon, 28 Oct 2024 18:04:01 +0900 Subject: [PATCH 05/29] fix: add 'use client' keyword --- src/components/floor-plan/modal/auxiliary/AuxiliaryMove.jsx | 2 ++ .../floor-plan/modal/panelBatch/PanelBatchStatistics.jsx | 4 +++- 2 files changed, 5 insertions(+), 1 deletion(-) diff --git a/src/components/floor-plan/modal/auxiliary/AuxiliaryMove.jsx b/src/components/floor-plan/modal/auxiliary/AuxiliaryMove.jsx index 9b4beb8f..8b2aca85 100644 --- a/src/components/floor-plan/modal/auxiliary/AuxiliaryMove.jsx +++ b/src/components/floor-plan/modal/auxiliary/AuxiliaryMove.jsx @@ -1,3 +1,5 @@ +'use client' + import { useMessage } from '@/hooks/useMessage' import WithDraggable from '@/components/common/draggable/WithDraggable' import { useRecoilValue } from 'recoil' diff --git a/src/components/floor-plan/modal/panelBatch/PanelBatchStatistics.jsx b/src/components/floor-plan/modal/panelBatch/PanelBatchStatistics.jsx index 2d36c4eb..9a6c7b84 100644 --- a/src/components/floor-plan/modal/panelBatch/PanelBatchStatistics.jsx +++ b/src/components/floor-plan/modal/panelBatch/PanelBatchStatistics.jsx @@ -1,6 +1,8 @@ -import WithDraggable from '@/components/common/draggable/withDraggable' +'use client' + import { useState } from 'react' import { useMessage } from '@/hooks/useMessage' +import WithDraggable from '@/components/common/draggable/withDraggable' export default function PanelBatchStatistics() { const { getMessage } = useMessage() From 58e76cba9e16e67fb3a8fdac70f08aaa8eac4669 Mon Sep 17 00:00:00 2001 From: minsik Date: Mon, 28 Oct 2024 18:14:09 +0900 Subject: [PATCH 06/29] =?UTF-8?q?=F0=9F=9A=A8chore:=20Sync=20Sass?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/styles/_modal.scss | 18 ++++++++++++++++++ 1 file changed, 18 insertions(+) diff --git a/src/styles/_modal.scss b/src/styles/_modal.scss index 9dc39b65..62fad511 100644 --- a/src/styles/_modal.scss +++ b/src/styles/_modal.scss @@ -1788,4 +1788,22 @@ $alert-color: #101010; flex: none; } } +} + +//이미지 크기 설정 +.range-wrap{ + display: flex; + align-items: center; + input{ + flex: 1; + margin-right: 10px; + } + label{ + flex: none; + text-align: right; + width: 35px; + font-size: 13px; + color: #fff; + font-weight: 500; + } } \ No newline at end of file From 37df5f6023b90fcf6eb70c8af468e6ab89084fc4 Mon Sep 17 00:00:00 2001 From: minsik Date: Mon, 28 Oct 2024 18:14:26 +0900 Subject: [PATCH 07/29] =?UTF-8?q?=EC=9D=B4=EB=AF=B8=EC=A7=80=20=ED=81=AC?= =?UTF-8?q?=EA=B8=B0=20=EC=A1=B0=EC=A0=88=20=EB=AA=A8=EB=8B=AC=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../modal/image/ImageSizeSetting.jsx | 42 +++++++++++++++++++ src/locales/ja.json | 29 ++++++------- src/locales/ko.json | 9 ++-- 3 files changed, 62 insertions(+), 18 deletions(-) create mode 100644 src/components/floor-plan/modal/image/ImageSizeSetting.jsx diff --git a/src/components/floor-plan/modal/image/ImageSizeSetting.jsx b/src/components/floor-plan/modal/image/ImageSizeSetting.jsx new file mode 100644 index 00000000..63741e7a --- /dev/null +++ b/src/components/floor-plan/modal/image/ImageSizeSetting.jsx @@ -0,0 +1,42 @@ +import WithDraggable from '@/components/common/draggable/WithDraggable' +import { useState } from 'react' +import { usePopup } from '@/hooks/usePopup' +import { useRecoilValue } from 'recoil' +import { contextPopupPositionState } from '@/store/popupAtom' +import { useMessage } from '@/hooks/useMessage' + +export default function ImageSizeSetting(props) { + const contextPopupPosition = useRecoilValue(contextPopupPositionState) + const { id, pos = contextPopupPosition, size, setSize } = props + const [sizeValue, setSizeValue] = useState(100) + const { getMessage } = useMessage() + const { closePopup } = usePopup() + + return ( + +
+
+

{getMessage('modal.image.size.setting')}

+ +
+
+
+ setSizeValue(e.target.value)} + /> + +
+
+
+
+ ) +} diff --git a/src/locales/ja.json b/src/locales/ja.json index 97e20595..6bb6d71c 100644 --- a/src/locales/ja.json +++ b/src/locales/ja.json @@ -214,20 +214,20 @@ "modal.canvas.setting.font.plan.absorption.dimension.display": "見る", "modal.canvas.setting.font.plan.absorption.plan.size.setting": "図面サイズの設定", "modal.canvas.setting.first.option.info": "※図面に表示する項目をクリックすると適用されます。", - "modal.canvas.setting.first.option.alloc": "할당표시", - "modal.canvas.setting.first.option.outline": "외벽선표시", - "modal.canvas.setting.first.option.plan": "도면표시", - "modal.canvas.setting.first.option.roof.line": "지붕선표시", - "modal.canvas.setting.first.option.grid": "그리드표시", - "modal.canvas.setting.first.option.circuit.num": "회로 번호 표시", - "modal.canvas.setting.first.option.word": "문자 표시", - "modal.canvas.setting.first.option.trestle": "가대 표시", - "modal.canvas.setting.first.option.flow": "흐름방향 표시", - "modal.canvas.setting.first.option.total": "집계표 표시", - "modal.canvas.setting.first.option.dimension": "치수 표시(JA)", - "modal.canvas.setting.first.option.corridor.dimension": "복도치수 표시(JA)", - "modal.canvas.setting.first.option.real.dimension": "실제치수 표시(JA)", - "modal.canvas.setting.first.option.none.dimension": "치수표시없음(JA)", + "modal.canvas.setting.first.option.alloc": "割り当て表示", + "modal.canvas.setting.first.option.outline": "外壁線表示", + "modal.canvas.setting.first.option.grid": "グリッド表示", + "modal.canvas.setting.first.option.roof.line": "屋根線標示", + "modal.canvas.setting.first.option.word": "文字表示", + "modal.canvas.setting.first.option.circuit.num": "回路番号表示", + "modal.canvas.setting.first.option.flow": "流れ方向表示", + "modal.canvas.setting.first.option.trestle": "架台表示", + "modal.canvas.setting.first.option.image": "画像表示", + "modal.canvas.setting.first.option.total": "集計表表示", + "modal.canvas.setting.first.option.dimension": "寸法表示", + "modal.canvas.setting.first.option.corridor.dimension": "廊下寸法表示", + "modal.canvas.setting.first.option.real.dimension": "実際の寸法表示", + "modal.canvas.setting.first.option.none.dimension": "寸法表示なし", "modal.canvas.setting.first.option.display": "画面表示", "modal.canvas.setting.first.option.border": "ボーダーのみ", "modal.canvas.setting.first.option.line": "ラインハッチ", @@ -274,6 +274,7 @@ "modal.panel.batch.statistic.total": "合計", "modal.flow.direction.setting": "流れ方向の設定", "modal.flow.direction.setting.info": "流れ方向を選択してください。", + "modal.image.size.setting": "画像のサイズ変更", "plan.message.confirm.save": "PLAN을 저장하시겠습니까?", "plan.message.confirm.copy": "PLAN을 복사하시겠습니까?", "plan.message.confirm.delete": "PLAN을 삭제하시겠습니까?", diff --git a/src/locales/ko.json b/src/locales/ko.json index cc47a03d..7f4555be 100644 --- a/src/locales/ko.json +++ b/src/locales/ko.json @@ -221,13 +221,13 @@ "modal.canvas.setting.first.option.info": "※도면에 표시하는 항목을 클릭하면 적용됩니다.", "modal.canvas.setting.first.option.alloc": "할당표시", "modal.canvas.setting.first.option.outline": "외벽선표시", - "modal.canvas.setting.first.option.plan": "도면표시", - "modal.canvas.setting.first.option.roof.line": "지붕선표시", "modal.canvas.setting.first.option.grid": "그리드표시", - "modal.canvas.setting.first.option.circuit.num": "회로 번호 표시", + "modal.canvas.setting.first.option.roof.line": "지붕선표시", "modal.canvas.setting.first.option.word": "문자 표시", - "modal.canvas.setting.first.option.trestle": "가대 표시", + "modal.canvas.setting.first.option.circuit.num": "회로 번호 표시", "modal.canvas.setting.first.option.flow": "흐름방향 표시", + "modal.canvas.setting.first.option.trestle": "가대 표시", + "modal.canvas.setting.first.option.image": "이미지 표시", "modal.canvas.setting.first.option.total": "집계표 표시", "modal.canvas.setting.first.option.dimension": "치수 표시", "modal.canvas.setting.first.option.corridor.dimension": "복도치수 표시", @@ -279,6 +279,7 @@ "modal.panel.batch.statistic.total": "합계", "modal.flow.direction.setting": "흐름 방향 설정", "modal.flow.direction.setting.info": "흐름방향을 선택하세요.", + "modal.image.size.setting": "이미지 크기 조절", "plan.message.confirm.save": "PLAN을 저장하시겠습니까?", "plan.message.confirm.copy": "PLAN을 복사하시겠습니까?", "plan.message.confirm.delete": "PLAN을 삭제하시겠습니까?", From b48e43dd9ff3a19153c5fcf341ef7fd5c5f73a72 Mon Sep 17 00:00:00 2001 From: minsik Date: Mon, 28 Oct 2024 18:15:01 +0900 Subject: [PATCH 08/29] =?UTF-8?q?-=20canvas=20setting=EC=97=90=20=EC=9D=B4?= =?UTF-8?q?=EB=AF=B8=EC=A7=80=20=ED=91=9C=EC=8B=9C=20=EC=B6=94=EA=B0=80=20?= =?UTF-8?q?-=20context=20menu=EC=97=90=20=EC=9D=B4=EB=AF=B8=EC=A7=80=20?= =?UTF-8?q?=ED=81=AC=EA=B8=B0=20=EC=A1=B0=EC=A0=88=20=EA=B8=B0=EB=8A=A5=20?= =?UTF-8?q?=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/hooks/useContextMenu.js | 13 +++++++++++- src/store/settingAtom.js | 40 ++++++++++++++++++++++++++++++++----- 2 files changed, 47 insertions(+), 6 deletions(-) diff --git a/src/hooks/useContextMenu.js b/src/hooks/useContextMenu.js index c5134e25..293a0ceb 100644 --- a/src/hooks/useContextMenu.js +++ b/src/hooks/useContextMenu.js @@ -23,6 +23,7 @@ import FlowDirectionSetting from '@/components/floor-plan/modal/flowDirection/Fl import { useMessage } from '@/hooks/useMessage' import { useCanvasEvent } from '@/hooks/useCanvasEvent' import { contextMenuState } from '@/store/contextMenu' +import ImageSizeSetting from '@/components/floor-plan/modal/image/ImageSizeSetting' export function useContextMenu() { const currentMenu = useRecoilValue(currentMenuState) // 현재 메뉴 @@ -36,7 +37,7 @@ export function useContextMenu() { const [gridColor, setGridColor] = useRecoilState(gridColorState) const [qContextMenu, setQContextMenu] = useRecoilState(contextMenuState) const { handleZoomClear } = useCanvasEvent() - const currentMenuSetting = (position) => { + const currentMenuSetting = () => { switch (currentMenu) { case MENU.PLAN_DRAWING: setContextMenu([ @@ -104,6 +105,11 @@ export function useContextMenu() { id: 'wallLineRemove', name: getMessage('contextmenu.wallline.remove'), }, + { + id: 'imageSizeEdit', + name: getMessage('modal.image.size.setting'), + component: , + }, ], [ { @@ -170,6 +176,11 @@ export function useContextMenu() { shortcut: ['c', 'C'], name: `${getMessage('contextmenu.copy')}(C)`, }, + { + id: 'imageSizeEdit', + name: getMessage('modal.image.size.setting'), + component: , + }, ], [ { diff --git a/src/store/settingAtom.js b/src/store/settingAtom.js index 2432d884..4cab929c 100644 --- a/src/store/settingAtom.js +++ b/src/store/settingAtom.js @@ -12,10 +12,16 @@ export const settingModalFirstOptionsState = atom({ { id: 6, column: 'circuitNumDisplay', name: 'modal.canvas.setting.first.option.circuit.num', selected: false }, { id: 7, column: 'flowDisplay', name: 'modal.canvas.setting.first.option.flow', selected: false }, { id: 8, column: 'trestleDisplay', name: 'modal.canvas.setting.first.option.trestle', selected: false }, + { id: 10, column: 'imageDisplay', name: 'modal.canvas.setting.first.option.image', selected: false }, { id: 9, column: 'totalDisplay', name: 'modal.canvas.setting.first.option.total', selected: false }, ], dimensionDisplay: [ - { id: 1, column: 'corridorDimension', name: 'modal.canvas.setting.first.option.corridor.dimension', selected: true }, + { + id: 1, + column: 'corridorDimension', + name: 'modal.canvas.setting.first.option.corridor.dimension', + selected: true, + }, { id: 2, column: 'realDimension', name: 'modal.canvas.setting.first.option.real.dimension', selected: false }, { id: 3, column: 'noneDimension', name: 'modal.canvas.setting.first.option.none.dimension', selected: false }, ], @@ -38,10 +44,34 @@ export const settingModalSecondOptionsState = atom({ { id: 4, name: 'modal.canvas.setting.font.plan.edit.circuit.num' }, ], option4: [ - { id: 1, column: 'adsorpRangeSmall', name: 'modal.canvas.setting.font.plan.absorption.small', selected: true, range: 10 }, - { id: 2, column: 'adsorpRangeSmallSemi', name: 'modal.canvas.setting.font.plan.absorption.small.semi', selected: false, range: 30 }, - { id: 3, column: 'adsorpRangeMedium', name: 'modal.canvas.setting.font.plan.absorption.medium', selected: false, range: 50 }, - { id: 4, column: 'adsorpRangeLarge', name: 'modal.canvas.setting.font.plan.absorption.large', selected: false, range: 70 }, + { + id: 1, + column: 'adsorpRangeSmall', + name: 'modal.canvas.setting.font.plan.absorption.small', + selected: true, + range: 10, + }, + { + id: 2, + column: 'adsorpRangeSmallSemi', + name: 'modal.canvas.setting.font.plan.absorption.small.semi', + selected: false, + range: 30, + }, + { + id: 3, + column: 'adsorpRangeMedium', + name: 'modal.canvas.setting.font.plan.absorption.medium', + selected: false, + range: 50, + }, + { + id: 4, + column: 'adsorpRangeLarge', + name: 'modal.canvas.setting.font.plan.absorption.large', + selected: false, + range: 70, + }, ], }, dangerouslyAllowMutability: true, From 09abb897ac2e4b28b610b334ddaafa7f1833f25c Mon Sep 17 00:00:00 2001 From: changkyu choi Date: Mon, 28 Oct 2024 18:59:21 +0900 Subject: [PATCH 09/29] =?UTF-8?q?Canvas=20=EC=84=A4=EC=A0=95=20=EC=A4=91?= =?UTF-8?q?=EA=B0=84=20Commit?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/floor-plan/FloorPlan.jsx | 37 +- .../modal/setting01/FirstOption.jsx | 372 +++++++++--------- .../modal/setting01/SecondOption.jsx | 260 ++++++------ src/hooks/option/useCanvasSetting.js | 268 +++++++++++++ .../option/useCanvasSettingController.js | 1 + 5 files changed, 602 insertions(+), 336 deletions(-) create mode 100644 src/hooks/option/useCanvasSetting.js diff --git a/src/components/floor-plan/FloorPlan.jsx b/src/components/floor-plan/FloorPlan.jsx index a2a5abc3..5639b93f 100644 --- a/src/components/floor-plan/FloorPlan.jsx +++ b/src/components/floor-plan/FloorPlan.jsx @@ -2,56 +2,33 @@ import { useEffect, useState } from 'react' import { useRecoilState, useRecoilValue } from 'recoil' -import { useAxios } from '@/hooks/useAxios' -import { globalLocaleStore } from '@/store/localeAtom' import { settingModalFirstOptionsState, settingModalSecondOptionsState } from '@/store/settingAtom' import CanvasMenu from '@/components/floor-plan/CanvasMenu' import { useCanvasMenu } from '@/hooks/common/useCanvasMenu' +import { useCanvasSetting } from '@/hooks/option/useCanvasSetting' import '@/styles/contents.scss' export default function FloorPlan({ children }) { - const globalLocaleState = useRecoilValue(globalLocaleStore) - const { get } = useAxios(globalLocaleState) const [settingModalFirstOptions, setSettingModalFirstOptions] = useRecoilState(settingModalFirstOptionsState) const [settingModalSecondOptions, setSettingModalSecondOptions] = useRecoilState(settingModalSecondOptionsState) const [objectNo, setObjectNo] = useState('test123240912001') // 이후 삭제 필요 - // const [menuNumber, setMenuNumber] = useState(null) const { menuNumber, setMenuNumber } = useCanvasMenu() + const { fetchSettings } = useCanvasSetting() + const modalProps = { menuNumber, setMenuNumber, } + useEffect(() => { fetchSettings() }, [objectNo]) - // Canvas Setting 조회 - const fetchSettings = async () => { - try { - const res = await get({ url: `/api/canvas-management/canvas-settings/by-object/${objectNo}` }) - const optionData1 = settingModalFirstOptions.option1.map((item) => ({ ...item, selected: res[item.column] })) - const optionData2 = settingModalFirstOptions.option2.map((item) => ({ ...item, selected: res[item.column] })) - const optionData3 = settingModalSecondOptions.option3.map((item) => ({ ...item })) - const optionData4 = settingModalSecondOptions.option4.map((item) => ({ ...item, selected: res[item.column] })) - const optionData5 = settingModalFirstOptions.dimensionDisplay.map((item) => ({ - ...item, - })) - // 데이터 설정 - setSettingModalFirstOptions({ - option1: optionData1, - option2: optionData2, - dimensionDisplay: optionData5, - }) - setSettingModalSecondOptions({ - option3: optionData3, - option4: optionData4, - }) - } catch (error) { - console.error('Data fetching error:', error) - } - } + useEffect(() => { + setMenuNumber(1) + }, []) return ( <> diff --git a/src/components/floor-plan/modal/setting01/FirstOption.jsx b/src/components/floor-plan/modal/setting01/FirstOption.jsx index 6373d8a8..db721dd5 100644 --- a/src/components/floor-plan/modal/setting01/FirstOption.jsx +++ b/src/components/floor-plan/modal/setting01/FirstOption.jsx @@ -1,210 +1,216 @@ -import { useRecoilState, useRecoilValue } from 'recoil' -import { settingModalSecondOptionsState } from '@/store/settingAtom' -import { useMessage } from '@/hooks/useMessage' import React, { useEffect, useState } from 'react' -import { useAxios } from '@/hooks/useAxios' -import { useSwal } from '@/hooks/useSwal' -import { useFirstOption } from '@/hooks/option/useFirstOption' -import { setSurfaceShapePattern } from '@/util/canvas-util' -import { canvasState } from '@/store/canvasAtom' -import { POLYGON_TYPE } from '@/common/common' +import { useCanvasSetting } from '@/hooks/option/useCanvasSetting' +import { useMessage } from '@/hooks/useMessage' + +//import { useRecoilState, useRecoilValue } from 'recoil' +//import { settingModalSecondOptionsState } from '@/store/settingAtom' +//import { useAxios } from '@/hooks/useAxios' +//import { useSwal } from '@/hooks/useSwal' +//import { setSurfaceShapePattern } from '@/util/canvas-util' +//import { canvasState } from '@/store/canvasAtom' +//import { POLYGON_TYPE } from '@/common/common' export default function FirstOption() { const [objectNo, setObjectNo] = useState('test123240912001') // 이후 삭제 필요 - const { settingModalFirstOptions, setSettingModalFirstOptions } = useFirstOption() - const [settingModalSecondOptions, setSettingModalSecondOptions] = useRecoilState(settingModalSecondOptionsState) - const { option1, option2, dimensionDisplay } = settingModalFirstOptions - const { option3, option4 } = settingModalSecondOptions + const { settingModalFirstOptions, setSettingModalFirstOptions } = useCanvasSetting() + const { settingModalSecondOptions, setSettingModalSecondOptions } = useCanvasSetting() const { getMessage } = useMessage() - const { get, post } = useAxios() - const { swalFire } = useSwal() - const canvas = useRecoilValue(canvasState) + + //const [settingModalSecondOptions, setSettingModalSecondOptions] = useRecoilState(settingModalSecondOptionsState) + //const { option1, option2, dimensionDisplay } = settingModalFirstOptions + //const { option3, option4 } = settingModalSecondOptions + //const { get, post } = useAxios() + //const { swalFire } = useSwal() + //const canvas = useRecoilValue(canvasState) + + const { fetchSettings, frontSettings, onClickOption } = useCanvasSetting() // 데이터를 최초 한 번만 조회 useEffect(() => { console.log('FirstOption useEffect 실행') - fetchSettings() + //fetchSettings() + //frontSettings() }, [objectNo]) - // Canvas Setting 조회 및 초기화 - const fetchSettings = async () => { - try { - const res = await get({ url: `/api/canvas-management/canvas-settings/by-object/${objectNo}` }) - const optionData1 = settingModalFirstOptions.option1.map((item) => ({ ...item, selected: res[item.column] })) - const optionData2 = settingModalFirstOptions.option2.map((item) => ({ ...item, selected: res[item.column] })) - const optionData5 = settingModalFirstOptions.dimensionDisplay.map((item) => ({ ...item, selected: res[item.column] })) - const optionData3 = settingModalSecondOptions.option3.map((item) => ({ ...item })) - const optionData4 = settingModalSecondOptions.option4.map((item) => ({ ...item, selected: res[item.column] })) + // // Canvas Setting 조회 및 초기화 + // const fetchSettings = async () => { + // try { + // const res = await get({ url: `/api/canvas-management/canvas-settings/by-object/${objectNo}` }) + // const optionData1 = settingModalFirstOptions.option1.map((item) => ({ ...item, selected: res[item.column] })) + // const optionData2 = settingModalFirstOptions.option2.map((item) => ({ ...item, selected: res[item.column] })) + // const optionData5 = settingModalFirstOptions.dimensionDisplay.map((item) => ({ ...item, selected: res[item.column] })) + // const optionData3 = settingModalSecondOptions.option3.map((item) => ({ ...item })) + // const optionData4 = settingModalSecondOptions.option4.map((item) => ({ ...item, selected: res[item.column] })) - // 데이터 설정 - setSettingModalFirstOptions({ - option1: optionData1, - option2: optionData2, - dimensionDisplay: optionData5, - }) + // // 데이터 설정 + // setSettingModalFirstOptions({ + // option1: optionData1, + // option2: optionData2, + // dimensionDisplay: optionData5, + // }) - setSettingModalSecondOptions({ - option3: optionData3, - option4: optionData4, - }) - } catch (error) { - console.error('Data fetching error:', error) - } - } + // setSettingModalSecondOptions({ + // option3: optionData3, + // option4: optionData4, + // }) + // } catch (error) { + // console.error('Data fetching error:', error) + // } + // } - const onClickOption = async (option) => { - option.selected = !option.selected + // const onClickOption = async (option) => { + // option.selected = !option.selected - setSettingModalFirstOptions({ option1, option2, dimensionDisplay }) - setSettingModalSecondOptions({ option3, option4 }) + // setSettingModalFirstOptions({ option1, option2, dimensionDisplay }) + // setSettingModalSecondOptions({ option3, option4 }) - try { - // 서버에 전송할 데이터 - const dataToSend = { - firstOption1: option1.map((item) => ({ - column: item.column, - selected: item.selected, - })), - firstOption2: option2.map((item) => ({ - column: item.column, - selected: item.selected, - })), - firstOption3: dimensionDisplay.map((item) => ({ - column: item.column, - selected: item.selected, - })), - // secondOption1: secondOptions[0].option1.map((item) => ({ - // name: item.id, - // name: item.name, - // // 필요한 경우 데이터 항목 추가 - // })), - secondOption2: option4.map((item) => ({ - column: item.column, - selected: item.selected, - })), - } + // try { + // // 서버에 전송할 데이터 + // const dataToSend = { + // firstOption1: option1.map((item) => ({ + // column: item.column, + // selected: item.selected, + // })), + // firstOption2: option2.map((item) => ({ + // column: item.column, + // selected: item.selected, + // })), + // firstOption3: dimensionDisplay.map((item) => ({ + // column: item.column, + // selected: item.selected, + // })), + // // secondOption1: secondOptions[0].option1.map((item) => ({ + // // name: item.id, + // // name: item.name, + // // // 필요한 경우 데이터 항목 추가 + // // })), + // secondOption2: option4.map((item) => ({ + // column: item.column, + // selected: item.selected, + // })), + // } - const patternData = { - objectNo, - //디스플레이 설정(다중) - allocDisplay: dataToSend.firstOption1[0].selected, - outlineDisplay: dataToSend.firstOption1[1].selected, - gridDisplay: dataToSend.firstOption1[2].selected, - lineDisplay: dataToSend.firstOption1[3].selected, - wordDisplay: dataToSend.firstOption1[4].selected, - circuitNumDisplay: dataToSend.firstOption1[5].selected, - flowDisplay: dataToSend.firstOption1[6].selected, - trestleDisplay: dataToSend.firstOption1[7].selected, - totalDisplay: dataToSend.firstOption1[8].selected, - //차수 표시(다건) - corridorDimension: dataToSend.firstOption3[0].selected, - realDimension: dataToSend.firstOption3[1].selected, - noneDimension: dataToSend.firstOption3[2].selected, - //화면 표시(다중) - onlyBorder: dataToSend.firstOption2[0].selected, - lineHatch: dataToSend.firstOption2[1].selected, - allPainted: dataToSend.firstOption2[2].selected, - //흡착범위 설정(단건) - adsorpRangeSmall: dataToSend.secondOption2[0].selected, - adsorpRangeSmallSemi: dataToSend.secondOption2[1].selected, - adsorpRangeMedium: dataToSend.secondOption2[2].selected, - adsorpRangeLarge: dataToSend.secondOption2[3].selected, - } + // const patternData = { + // objectNo, + // //디스플레이 설정(다중) + // allocDisplay: dataToSend.firstOption1[0].selected, + // outlineDisplay: dataToSend.firstOption1[1].selected, + // gridDisplay: dataToSend.firstOption1[2].selected, + // lineDisplay: dataToSend.firstOption1[3].selected, + // wordDisplay: dataToSend.firstOption1[4].selected, + // circuitNumDisplay: dataToSend.firstOption1[5].selected, + // flowDisplay: dataToSend.firstOption1[6].selected, + // trestleDisplay: dataToSend.firstOption1[7].selected, + // totalDisplay: dataToSend.firstOption1[8].selected, + // //차수 표시(다건) + // corridorDimension: dataToSend.firstOption3[0].selected, + // realDimension: dataToSend.firstOption3[1].selected, + // noneDimension: dataToSend.firstOption3[2].selected, + // //화면 표시(다중) + // onlyBorder: dataToSend.firstOption2[0].selected, + // lineHatch: dataToSend.firstOption2[1].selected, + // allPainted: dataToSend.firstOption2[2].selected, + // //흡착범위 설정(단건) + // adsorpRangeSmall: dataToSend.secondOption2[0].selected, + // adsorpRangeSmallSemi: dataToSend.secondOption2[1].selected, + // adsorpRangeMedium: dataToSend.secondOption2[2].selected, + // adsorpRangeLarge: dataToSend.secondOption2[3].selected, + // } - // HTTP POST 요청 보내기 - await post({ url: `/api/canvas-management/canvas-settings`, data: patternData }).then((res) => { - swalFire({ text: getMessage(res.returnMessage) }) - }) - } catch (error) { - swalFire({ text: getMessage(res.returnMessage), icon: 'error' }) - } - } + // // HTTP POST 요청 보내기 + // await post({ url: `/api/canvas-management/canvas-settings`, data: patternData }).then((res) => { + // swalFire({ text: getMessage(res.returnMessage) }) + // }) + // } catch (error) { + // swalFire({ text: getMessage(res.returnMessage), icon: 'error' }) + // } + // } - const onClickOnlyOne = async (item) => { - //화면 표시 - if (item.column === 'onlyBorder' || item.column === 'lineHatch' || item.column === 'allPainted') { - const options2 = settingModalFirstOptions?.option2.map((option2) => { - option2.selected = option2.id === item.id - return option2 - }) + // const onClickOnlyOne = async (item) => { + // //화면 표시 + // if (item.column === 'onlyBorder' || item.column === 'lineHatch' || item.column === 'allPainted') { + // const options2 = settingModalFirstOptions?.option2.map((option2) => { + // option2.selected = option2.id === item.id + // return option2 + // }) - const polygons = canvas?.getObjects().filter((obj) => obj.name === POLYGON_TYPE.ROOF) + // const polygons = canvas?.getObjects().filter((obj) => obj.name === POLYGON_TYPE.ROOF) - polygons.forEach((polygon) => { - setSurfaceShapePattern(polygon, item.column) - }) + // polygons.forEach((polygon) => { + // setSurfaceShapePattern(polygon, item.column) + // }) - //치수 표시 - } else { - const options = settingModalFirstOptions?.dimensionDisplay.map((option) => { - option.selected = option.id === item.id - return option - }) - } + // //치수 표시 + // } else { + // const options = settingModalFirstOptions?.dimensionDisplay.map((option) => { + // option.selected = option.id === item.id + // return option + // }) + // } - setSettingModalFirstOptions({ option1, option2, dimensionDisplay }) + // setSettingModalFirstOptions({ option1, option2, dimensionDisplay }) - try { - // 서버에 전송할 데이터 - const dataToSend = { - firstOption1: option1.map((item) => ({ - column: item.column, - selected: item.selected, - })), - firstOption2: option2.map((item) => ({ - column: item.column, - selected: item.selected, - })), - firstOption3: dimensionDisplay.map((item) => ({ - column: item.column, - selected: item.selected, - })), - // secondOption1: secondOptions[0].option1.map((item) => ({ - // name: item.id, - // name: item.name, - // // 필요한 경우 데이터 항목 추가 - // })), - secondOption2: option4.map((item) => ({ - column: item.column, - selected: item.selected, - })), - } + // try { + // // 서버에 전송할 데이터 + // const dataToSend = { + // firstOption1: option1.map((item) => ({ + // column: item.column, + // selected: item.selected, + // })), + // firstOption2: option2.map((item) => ({ + // column: item.column, + // selected: item.selected, + // })), + // firstOption3: dimensionDisplay.map((item) => ({ + // column: item.column, + // selected: item.selected, + // })), + // // secondOption1: secondOptions[0].option1.map((item) => ({ + // // name: item.id, + // // name: item.name, + // // // 필요한 경우 데이터 항목 추가 + // // })), + // secondOption2: option4.map((item) => ({ + // column: item.column, + // selected: item.selected, + // })), + // } - const patternData = { - objectNo, - //디스플레이 설정(다중) - allocDisplay: dataToSend.firstOption1[0].selected, - outlineDisplay: dataToSend.firstOption1[1].selected, - gridDisplay: dataToSend.firstOption1[2].selected, - lineDisplay: dataToSend.firstOption1[3].selected, - wordDisplay: dataToSend.firstOption1[4].selected, - circuitNumDisplay: dataToSend.firstOption1[5].selected, - flowDisplay: dataToSend.firstOption1[6].selected, - trestleDisplay: dataToSend.firstOption1[7].selected, - totalDisplay: dataToSend.firstOption1[8].selected, - //차수 표시(다건) - corridorDimension: dataToSend.firstOption3[0].selected, - realDimension: dataToSend.firstOption3[1].selected, - noneDimension: dataToSend.firstOption3[2].selected, - //화면 표시(다중) - onlyBorder: dataToSend.firstOption2[0].selected, - lineHatch: dataToSend.firstOption2[1].selected, - allPainted: dataToSend.firstOption2[2].selected, - //흡착범위 설정(단건) - adsorpRangeSmall: dataToSend.secondOption2[0].selected, - adsorpRangeSmallSemi: dataToSend.secondOption2[1].selected, - adsorpRangeMedium: dataToSend.secondOption2[2].selected, - adsorpRangeLarge: dataToSend.secondOption2[3].selected, - } + // const patternData = { + // objectNo, + // //디스플레이 설정(다중) + // allocDisplay: dataToSend.firstOption1[0].selected, + // outlineDisplay: dataToSend.firstOption1[1].selected, + // gridDisplay: dataToSend.firstOption1[2].selected, + // lineDisplay: dataToSend.firstOption1[3].selected, + // wordDisplay: dataToSend.firstOption1[4].selected, + // circuitNumDisplay: dataToSend.firstOption1[5].selected, + // flowDisplay: dataToSend.firstOption1[6].selected, + // trestleDisplay: dataToSend.firstOption1[7].selected, + // totalDisplay: dataToSend.firstOption1[8].selected, + // //차수 표시(다건) + // corridorDimension: dataToSend.firstOption3[0].selected, + // realDimension: dataToSend.firstOption3[1].selected, + // noneDimension: dataToSend.firstOption3[2].selected, + // //화면 표시(다중) + // onlyBorder: dataToSend.firstOption2[0].selected, + // lineHatch: dataToSend.firstOption2[1].selected, + // allPainted: dataToSend.firstOption2[2].selected, + // //흡착범위 설정(단건) + // adsorpRangeSmall: dataToSend.secondOption2[0].selected, + // adsorpRangeSmallSemi: dataToSend.secondOption2[1].selected, + // adsorpRangeMedium: dataToSend.secondOption2[2].selected, + // adsorpRangeLarge: dataToSend.secondOption2[3].selected, + // } - // HTTP POST 요청 보내기 - await post({ url: `/api/canvas-management/canvas-settings`, data: patternData }).then((res) => { - swalFire({ text: getMessage(res.returnMessage) }) - }) - } catch (error) { - swalFire({ text: getMessage(res.returnMessage), icon: 'error' }) - } - } + // // HTTP POST 요청 보내기 + // await post({ url: `/api/canvas-management/canvas-settings`, data: patternData }).then((res) => { + // swalFire({ text: getMessage(res.returnMessage) }) + // }) + // } catch (error) { + // swalFire({ text: getMessage(res.returnMessage), icon: 'error' }) + // } + // } return ( <> @@ -225,7 +231,7 @@ export default function FirstOption() {
{settingModalFirstOptions && settingModalFirstOptions.dimensionDisplay.map((item) => ( - @@ -237,7 +243,7 @@ export default function FirstOption() {
{settingModalFirstOptions && settingModalFirstOptions.option2.map((item) => ( - diff --git a/src/components/floor-plan/modal/setting01/SecondOption.jsx b/src/components/floor-plan/modal/setting01/SecondOption.jsx index ceccce5e..ff8d61db 100644 --- a/src/components/floor-plan/modal/setting01/SecondOption.jsx +++ b/src/components/floor-plan/modal/setting01/SecondOption.jsx @@ -1,143 +1,148 @@ import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil' -import { settingModalFirstOptionsState, settingModalSecondOptionsState } from '@/store/settingAtom' +//import { settingModalFirstOptionsState, settingModalSecondOptionsState } from '@/store/settingAtom' import { useMessage } from '@/hooks/useMessage' import React, { useEffect, useState } from 'react' -import { useAxios } from '@/hooks/useAxios' -import { useSwal } from '@/hooks/useSwal' -import { adsorptionPointModeState, adsorptionRangeState } from '@/store/canvasAtom' import DimensionLineSetting from '@/components/floor-plan/modal/setting01/dimensionLine/DimensionLineSetting' import { usePopup } from '@/hooks/usePopup' import { v4 as uuidv4 } from 'uuid' import FontSetting from '@/components/common/font/FontSetting' import PlanSizeSetting from '@/components/floor-plan/modal/setting01/planSize/PlanSizeSetting' import { dimensionLineSettingsState } from '@/store/commonUtilsAtom' +import { useCanvasSetting } from '@/hooks/option/useCanvasSetting' + +//import { useAxios } from '@/hooks/useAxios' +//import { useSwal } from '@/hooks/useSwal' +// import { adsorptionPointModeState, adsorptionRangeState } from '@/store/canvasAtom' export default function SecondOption() { - const [objectNo, setObjectNo] = useState('test123240912001') // 이후 삭제 필요 - const [settingModalFirstOptions, setSettingModalFirstOptions] = useRecoilState(settingModalFirstOptionsState) - const [settingModalSecondOptions, setSettingModalSecondOptions] = useRecoilState(settingModalSecondOptionsState) - const [adsorptionPointMode, setAdsorptionPointMode] = useRecoilState(adsorptionPointModeState) - const setAdsorptionRange = useSetRecoilState(adsorptionRangeState) + //const [settingModalFirstOptions, setSettingModalFirstOptions] = useRecoilState(settingModalFirstOptionsState) + //const [settingModalSecondOptions, setSettingModalSecondOptions] = useRecoilState(settingModalSecondOptionsState) + // const [adsorptionPointMode, setAdsorptionPointMode] = useRecoilState(adsorptionPointModeState) + // const setAdsorptionRange = useSetRecoilState(adsorptionRangeState) + // const { option1, option2, dimensionDisplay } = settingModalFirstOptions + // const { option3, option4 } = settingModalSecondOptions + // const { get, post } = useAxios() + // const { swalFire } = useSwal() - const { option1, option2, dimensionDisplay } = settingModalFirstOptions - const { option3, option4 } = settingModalSecondOptions const { getMessage } = useMessage() - const { get, post } = useAxios() - const { swalFire } = useSwal() const { addPopup, closePopup, closePopups } = usePopup() const [showFontSettingModal, setShowFontSettingModal] = useState(false) const [showDimensionLineSettingModal, setShowDimensionLineSettingModal] = useState(false) const [showPlanSizeSettingModal, setShowPlanSizeSettingModal] = useState(false) const dimensionSettings = useRecoilValue(dimensionLineSettingsState) + const [objectNo, setObjectNo] = useState('test123240912001') // 이후 삭제 필요 + const { settingModalFirstOptions, setSettingModalFirstOptions } = useCanvasSetting() + const { settingModalSecondOptions, setSettingModalSecondOptions } = useCanvasSetting() + const { adsorptionPointMode, setAdsorptionPointMode } = useCanvasSetting() + const { fetchSettings, frontSettings, onClickOption } = useCanvasSetting() + // 데이터를 최초 한 번만 조회 useEffect(() => { console.log('SecondOption useEffect 실행') - fetchSettings() + //fetchSettings() }, [objectNo]) // Canvas Setting 조회 및 초기화 - const fetchSettings = async () => { - try { - const res = await get({ url: `/api/canvas-management/canvas-settings/by-object/${objectNo}` }) - const optionData1 = settingModalFirstOptions.option1.map((item) => ({ ...item, selected: res[item.column] })) - const optionData2 = settingModalFirstOptions.option2.map((item) => ({ ...item, selected: res[item.column] })) - const optionData5 = settingModalFirstOptions.dimensionDisplay.map((item) => ({ - ...item, - selected: res[item.column], - })) - const optionData3 = settingModalSecondOptions.option3.map((item) => ({ ...item })) - const optionData4 = settingModalSecondOptions.option4.map((item) => ({ ...item, selected: res[item.column] })) + // const fetchSettings = async () => { + // try { + // const res = await get({ url: `/api/canvas-management/canvas-settings/by-object/${objectNo}` }) + // const optionData1 = settingModalFirstOptions.option1.map((item) => ({ ...item, selected: res[item.column] })) + // const optionData2 = settingModalFirstOptions.option2.map((item) => ({ ...item, selected: res[item.column] })) + // const optionData5 = settingModalFirstOptions.dimensionDisplay.map((item) => ({ ...item, selected: res[item.column] })) + // const optionData3 = settingModalSecondOptions.option3.map((item) => ({ ...item })) + // const optionData4 = settingModalSecondOptions.option4.map((item) => ({ ...item, selected: res[item.column] })) - setSettingModalFirstOptions({ - option1: optionData1, - option2: optionData2, - dimensionDisplay: optionData5, - }) - setSettingModalSecondOptions({ - option3: optionData3, - option4: optionData4, - }) - } catch (error) { - console.error('Data fetching error:', error) - } - } + // setSettingModalFirstOptions({ + // option1: optionData1, + // option2: optionData2, + // dimensionDisplay: optionData5, + // }) + // setSettingModalSecondOptions({ + // option3: optionData3, + // option4: optionData4, + // }) + // } catch (error) { + // console.error('Data fetching error:', error) + // } + // } - const onClickOption = async (option) => { - // option4에서 한 개만 선택 가능하도록 처리 - const updatedOption4 = option4.map((item) => - item.id === option.id - ? { ...item, selected: true } - : { - ...item, - selected: false, - }, - ) + // const onClickOption = async (option) => { + // // option4에서 한 개만 선택 가능하도록 처리 + // const updatedOption4 = option4.map((item) => + // item.id === option.id + // ? { ...item, selected: true } + // : { + // ...item, + // selected: false, + // }, + // ) - setSettingModalFirstOptions({ option1, option2, dimensionDisplay }) - setSettingModalSecondOptions({ option3, option4: updatedOption4 }) + // setSettingModalFirstOptions({ option1, option2, dimensionDisplay }) + // setSettingModalSecondOptions({ option3, option4: updatedOption4 }) - try { - // 서버에 전송할 데이터 - const dataToSend = { - firstOption1: option1.map((item) => ({ - column: item.column, - selected: item.selected, - })), - firstOption2: option2.map((item) => ({ - column: item.column, - selected: item.selected, - })), - firstOption3: dimensionDisplay.map((item) => ({ - column: item.column, - selected: item.selected, - })), - // secondOption1: secondOptions[0].option3.map((item) => ({ - // name: item.id, - // name: item.name, - // // 필요한 경우 데이터 항목 추가 - // })), - secondOption2: updatedOption4.map((item) => ({ - column: item.column, - selected: item.selected, - })), - } - const patternData = { - objectNo, - //디스플레이 설정(다중) - allocDisplay: dataToSend.firstOption1[0].selected, - outlineDisplay: dataToSend.firstOption1[1].selected, - gridDisplay: dataToSend.firstOption1[2].selected, - lineDisplay: dataToSend.firstOption1[3].selected, - wordDisplay: dataToSend.firstOption1[4].selected, - circuitNumDisplay: dataToSend.firstOption1[5].selected, - flowDisplay: dataToSend.firstOption1[6].selected, - trestleDisplay: dataToSend.firstOption1[7].selected, - totalDisplay: dataToSend.firstOption1[8].selected, - //차수 표시(다건) - corridorDimension: dataToSend.firstOption3[0].selected, - realDimension: dataToSend.firstOption3[1].selected, - noneDimension: dataToSend.firstOption3[2].selected, - //화면 표시(다중) - onlyBorder: dataToSend.firstOption2[0].selected, - lineHatch: dataToSend.firstOption2[1].selected, - allPainted: dataToSend.firstOption2[2].selected, - //흡착범위 설정(단건) - adsorpRangeSmall: dataToSend.secondOption2[0].selected, - adsorpRangeSmallSemi: dataToSend.secondOption2[1].selected, - adsorpRangeMedium: dataToSend.secondOption2[2].selected, - adsorpRangeLarge: dataToSend.secondOption2[3].selected, - } + // try { + // // 서버에 전송할 데이터 + // const dataToSend = { + // firstOption1: option1.map((item) => ({ + // column: item.column, + // selected: item.selected, + // })), + // firstOption2: option2.map((item) => ({ + // column: item.column, + // selected: item.selected, + // })), + // firstOption3: dimensionDisplay.map((item) => ({ + // column: item.column, + // selected: item.selected, + // })), + // // secondOption1: secondOptions[0].option3.map((item) => ({ + // // name: item.id, + // // name: item.name, + // // // 필요한 경우 데이터 항목 추가 + // // })), + // secondOption2: updatedOption4.map((item) => ({ + // column: item.column, + // selected: item.selected, + // })), + // } + // const patternData = { + // objectNo, + // //디스플레이 설정(다중) + // allocDisplay: dataToSend.firstOption1[0].selected, + // outlineDisplay: dataToSend.firstOption1[1].selected, + // gridDisplay: dataToSend.firstOption1[2].selected, + // lineDisplay: dataToSend.firstOption1[3].selected, + // wordDisplay: dataToSend.firstOption1[4].selected, + // circuitNumDisplay: dataToSend.firstOption1[5].selected, + // flowDisplay: dataToSend.firstOption1[6].selected, + // trestleDisplay: dataToSend.firstOption1[7].selected, + // totalDisplay: dataToSend.firstOption1[8].selected, + // //차수 표시(다건) + // corridorDimension: dataToSend.firstOption3[0].selected, + // realDimension: dataToSend.firstOption3[1].selected, + // noneDimension: dataToSend.firstOption3[2].selected, + // //화면 표시(다중) + // onlyBorder: dataToSend.firstOption2[0].selected, + // lineHatch: dataToSend.firstOption2[1].selected, + // allPainted: dataToSend.firstOption2[2].selected, + // //흡착범위 설정(단건) + // adsorpRangeSmall: dataToSend.secondOption2[0].selected, + // adsorpRangeSmallSemi: dataToSend.secondOption2[1].selected, + // adsorpRangeMedium: dataToSend.secondOption2[2].selected, + // adsorpRangeLarge: dataToSend.secondOption2[3].selected, + // } + + // // HTTP POST 요청 보내기 + // await post({ url: `/api/canvas-management/canvas-settings`, data: patternData }).then((res) => { + // swalFire({ text: getMessage(res.returnMessage) }) + // }) + // } catch (error) { + // swalFire({ text: getMessage(res.returnMessage), icon: 'error' }) + // } + // setAdsorptionRange(option.range) + // } - // HTTP POST 요청 보내기 - await post({ url: `/api/canvas-management/canvas-settings`, data: patternData }).then((res) => { - swalFire({ text: getMessage(res.returnMessage) }) - }) - } catch (error) { - swalFire({ text: getMessage(res.returnMessage), icon: 'error' }) - } - setAdsorptionRange(option.range) - } let dimensionId = null let fontId = null let planSizeId = null @@ -192,16 +197,6 @@ export default function SecondOption() { setShowFontSettingModal(false) switch (type) { - case 'dimensionLine': - if (!showDimensionLineSettingModal) { - setShowDimensionLineSettingModal(true) - addPopup(dimensionId, 2, ) - } else { - setShowDimensionLineSettingModal(false) - closePopup(dimensionId) - } - - break case 'font1': { //문자 글꼴변경 setShowFontSettingModal(true) @@ -210,6 +205,7 @@ export default function SecondOption() { addPopup(fontId + 1, 2, ) break } + case 'font2': { //흐름 방향 글꼴 변경 setShowFontSettingModal(true) @@ -218,6 +214,7 @@ export default function SecondOption() { addPopup(fontId + 2, 2, ) break } + case 'font3': { //치수 글꼴변경 setShowFontSettingModal(true) @@ -226,17 +223,34 @@ export default function SecondOption() { addPopup(fontId + 3, 2, ) break } - case 'font4': //회로번호 글꼴변경 + + case 'font4': { + //회로번호 글꼴변경 setShowFontSettingModal(true) fontProps.type = 'circuitNumberText' fontProps.id = fontId addPopup(fontId, 2, ) break - case 'planSize': - setShowPlanSizeSettingModal(true) + } + case 'dimensionLine': { + //치수선 설정 + if (!showDimensionLineSettingModal) { + setShowDimensionLineSettingModal(true) + addPopup(dimensionId, 2, ) + } else { + setShowDimensionLineSettingModal(false) + closePopup(dimensionId) + } + break + } + + case 'planSize': { + //도면크기 설정 + setShowPlanSizeSettingModal(true) addPopup(planSizeId, 2, ) break + } } } diff --git a/src/hooks/option/useCanvasSetting.js b/src/hooks/option/useCanvasSetting.js new file mode 100644 index 00000000..2856b5c2 --- /dev/null +++ b/src/hooks/option/useCanvasSetting.js @@ -0,0 +1,268 @@ +import { useEffect, useState } from 'react' +import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil' +import { canvasState } from '@/store/canvasAtom' +import { globalLocaleStore } from '@/store/localeAtom' +import { useMessage } from '@/hooks/useMessage' +import { useAxios } from '@/hooks/useAxios' +import { useSwal } from '@/hooks/useSwal' +import { settingModalFirstOptionsState, settingModalSecondOptionsState } from '@/store/settingAtom' +import { setSurfaceShapePattern } from '@/util/canvas-util' +import { POLYGON_TYPE } from '@/common/common' + +import { adsorptionPointModeState, adsorptionRangeState } from '@/store/canvasAtom' + +export function useCanvasSetting() { + const canvas = useRecoilValue(canvasState) + + const [settingModalFirstOptions, setSettingModalFirstOptions] = useRecoilState(settingModalFirstOptionsState) + const [settingModalSecondOptions, setSettingModalSecondOptions] = useRecoilState(settingModalSecondOptionsState) + const { option1, option2, dimensionDisplay } = settingModalFirstOptions + const { option3, option4 } = settingModalSecondOptions + + const globalLocaleState = useRecoilValue(globalLocaleStore) + const { get, post } = useAxios(globalLocaleState) + const { getMessage } = useMessage() + const { swalFire } = useSwal() + + const [adsorptionPointMode, setAdsorptionPointMode] = useRecoilState(adsorptionPointModeState) + const setAdsorptionRange = useSetRecoilState(adsorptionRangeState) + + const [objectNo, setObjectNo] = useState('test123240912001') // 이후 삭제 필요 + + useEffect(() => { + console.log('useCanvasSetting useEffect 실행1') + fetchSettings() + }, [objectNo]) + + useEffect(() => { + console.log('useCanvasSetting useEffect 실행2') + //fetchSettings() + //onClickOption() + //fetchSettings() + }, [settingModalFirstOptions, settingModalSecondOptions]) + + const fetchSettings = async () => { + try { + const res = await get({ url: `/api/canvas-management/canvas-settings/by-object/${objectNo}` }) + const optionData1 = settingModalFirstOptions.option1.map((item) => ({ ...item, selected: res[item.column] })) + const optionData2 = settingModalFirstOptions.option2.map((item) => ({ ...item, selected: res[item.column] })) + const optionData3 = settingModalSecondOptions.option3.map((item) => ({ ...item })) + const optionData4 = settingModalSecondOptions.option4.map((item) => ({ ...item, selected: res[item.column] })) + const optionData5 = settingModalFirstOptions.dimensionDisplay.map((item) => ({ + ...item, + })) + // 데이터 설정 + setSettingModalFirstOptions({ + option1: optionData1, + option2: optionData2, + dimensionDisplay: optionData5, + }) + setSettingModalSecondOptions({ + option3: optionData3, + option4: optionData4, + }) + } catch (error) { + console.error('Data fetching error:', error) + } + } + + // 옵션 클릭 후 저장 + const onClickOption = async (item) => { + //치수 표시(단 건 선택) + if (item.column === 'corridorDimension' || item.column === 'realDimension' || item.column === 'noneDimension') { + console.log('치수 표시 ', item) + const options = settingModalFirstOptions?.dimensionDisplay.map((option) => { + option.selected = option.id === item.id + return option + }) + + //화면 표시(단 건 선택) + } else if (item.column === 'onlyBorder' || item.column === 'lineHatch' || item.column === 'allPainted') { + console.log('화면 표시 ', item) + const options2 = settingModalFirstOptions?.option2.map((option2) => { + option2.selected = option2.id === item.id + return option2 + }) + + const polygons = canvas?.getObjects().filter((obj) => obj.name === POLYGON_TYPE.ROOF) + + polygons.forEach((polygon) => { + setSurfaceShapePattern(polygon, item.column) + }) + + //흡착범위 설정(단 건 선택) + } else if ( + item.column === 'adsorpRangeSmall' || + item.column === 'adsorpRangeSmallSemi' || + item.column === 'adsorpRangeMedium' || + item.column === 'adsorpRangeLarge' + ) { + console.log('화면 표시2 ', item, option4) + // option4에서 한 개만 선택 가능하도록 처리 + const updatedOption4 = option4.map((option) => + option.id === item.id + ? { ...option, selected: true } + : { + ...option, + selected: false, + }, + ) + + setSettingModalSecondOptions({ option3, option4: updatedOption4 }) + + //디스플레이 설정(다 건 선택) + } else { + console.log('디스플레이 설정 ', item) + item.selected = !item.selected + } + + setSettingModalFirstOptions({ option1, option2, dimensionDisplay }) + + try { + // 서버에 전송할 데이터 + const dataToSend = { + firstOption1: option1.map((item) => ({ + column: item.column, + selected: item.selected, + })), + firstOption2: option2.map((item) => ({ + column: item.column, + selected: item.selected, + })), + firstOption3: dimensionDisplay.map((item) => ({ + column: item.column, + selected: item.selected, + })), + // secondOption1: secondOptions[0].option1.map((item) => ({ + // name: item.id, + // name: item.name, + // // 필요한 경우 데이터 항목 추가 + // })), + secondOption2: option4.map((item) => ({ + column: item.column, + selected: item.selected, + })), + } + + const patternData = { + objectNo, + //디스플레이 설정(다중) + allocDisplay: dataToSend.firstOption1[0].selected, + outlineDisplay: dataToSend.firstOption1[1].selected, + gridDisplay: dataToSend.firstOption1[2].selected, + lineDisplay: dataToSend.firstOption1[3].selected, + wordDisplay: dataToSend.firstOption1[4].selected, + circuitNumDisplay: dataToSend.firstOption1[5].selected, + flowDisplay: dataToSend.firstOption1[6].selected, + trestleDisplay: dataToSend.firstOption1[7].selected, + totalDisplay: dataToSend.firstOption1[8].selected, + //차수 표시(단 건) + corridorDimension: dataToSend.firstOption3[0].selected, + realDimension: dataToSend.firstOption3[1].selected, + noneDimension: dataToSend.firstOption3[2].selected, + //화면 표시(단 건) + onlyBorder: dataToSend.firstOption2[0].selected, + lineHatch: dataToSend.firstOption2[1].selected, + allPainted: dataToSend.firstOption2[2].selected, + //흡착범위 설정(단 건) + adsorpRangeSmall: dataToSend.secondOption2[0].selected, + adsorpRangeSmallSemi: dataToSend.secondOption2[1].selected, + adsorpRangeMedium: dataToSend.secondOption2[2].selected, + adsorpRangeLarge: dataToSend.secondOption2[3].selected, + } + + console.log('patternData ', patternData) + + // HTTP POST 요청 보내기 + await post({ url: `/api/canvas-management/canvas-settings`, data: patternData }).then((res) => { + swalFire({ text: getMessage(res.returnMessage) }) + + // Canvas 디스플레이 설정 시 해당 옵션 적용 + frontSettings() + }) + } catch (error) { + swalFire({ text: getMessage(res.returnMessage), icon: 'error' }) + } + + setAdsorptionRange(item.range) + } + + // Canvas 디스플레이 설정 시 해당 옵션 적용 + const frontSettings = async () => { + const option1 = settingModalFirstOptions.option1 + + // 'allocDisplay' 할당 표시 + // 'outlineDisplay' 외벽선 표시 'outerLine', 'wallLine' + // 'gridDisplay' 그리드 표시 'lindGrid', 'dotGrid' + // 'lineDisplay' 지붕선 표시 'roof', 'roofBase' + // 'wordDisplay' 문자 표시 + // 'circuitNumDisplay' 회로번호 표시 + // 'flowDisplay' 흐름방향 표시 'arrow' + // 'trestleDisplay' 가대 표시 + // 'totalDisplay' 집계표 표시 + + let optionName //옵션명 + let optionSelected //옵션상태 + + for (let i = 0; i < option1.length; i++) { + switch (option1[i].column) { + case 'allocDisplay': //할당 표시 + optionName = ['1'] + break + case 'outlineDisplay': //외벽선 표시 + optionName = ['outerLine', 'wallLine'] + break + case 'gridDisplay': //그리드 표시 + optionName = ['lindGrid', 'dotGrid'] + break + case 'lineDisplay': //지붕선 표시 + optionName = ['roof', 'roofBase'] + break + case 'wordDisplay': //문자 표시 + optionName = ['6'] + break + case 'circuitNumDisplay': //회로번호 표시 + optionName = ['7'] + break + case 'flowDisplay': //흐름방향 표시 + optionName = ['arrow'] + break + case 'trestleDisplay': //가대 표시 + optionName = ['8'] + break + case 'totalDisplay': //집계표 표시 + optionName = ['9'] + break + } + // 표시 선택 상태(true/false) + optionSelected = option1[i].selected + + canvas + .getObjects() + .filter((obj) => optionName.includes(obj.name)) + //.filter((obj) => obj.name === optionName) + .forEach((obj) => { + obj.set({ visible: optionSelected }) + //obj.set({ visible: !obj.visible }) + }) + + // console.log( + // 'optionName', + // optionName, + // canvas.getObjects().filter((obj) => optionName.includes(obj.name)), + // ) + } + } + + return { + settingModalFirstOptions, + setSettingModalFirstOptions, + settingModalSecondOptions, + setSettingModalSecondOptions, + fetchSettings, + onClickOption, + frontSettings, + adsorptionPointMode, + setAdsorptionPointMode, + } +} diff --git a/src/hooks/option/useCanvasSettingController.js b/src/hooks/option/useCanvasSettingController.js index 72a590eb..48db6c08 100644 --- a/src/hooks/option/useCanvasSettingController.js +++ b/src/hooks/option/useCanvasSettingController.js @@ -46,6 +46,7 @@ export const useCanvasSettingController = () => { } } + // const onClickOption = async (option) => { option.selected = !option.selected From b362ba8b6371a5eb113d07b5f18c2912d330a1a4 Mon Sep 17 00:00:00 2001 From: "hyojun.choi" Date: Tue, 29 Oct 2024 10:13:16 +0900 Subject: [PATCH 10/29] =?UTF-8?q?line=20to=20polygon=EC=8B=9C=20=EA=B8=B8?= =?UTF-8?q?=EC=9D=B4=20=EC=95=88=EB=A7=9E=EB=8A=94=20=ED=98=84=EC=83=81=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/fabric/QLine.js | 4 +--- src/components/fabric/QPolygon.js | 4 ++-- 2 files changed, 3 insertions(+), 5 deletions(-) diff --git a/src/components/fabric/QLine.js b/src/components/fabric/QLine.js index 4ee9535a..86a96845 100644 --- a/src/components/fabric/QLine.js +++ b/src/components/fabric/QLine.js @@ -21,9 +21,7 @@ export const QLine = fabric.util.createClass(fabric.Line, { } this.line = this // 소수점 전부 제거 - points.forEach((point) => { - point = Math.round(point) - }) + points = points.map((point) => Math.round(point)) this.idx = options.idx ?? 0 this.direction = options.direction ?? getDirectionByPoint({ x: this.x1, y: this.y1 }, { x: this.x2, y: this.y2 }) diff --git a/src/components/fabric/QPolygon.js b/src/components/fabric/QPolygon.js index 8068a772..decc99ae 100644 --- a/src/components/fabric/QPolygon.js +++ b/src/components/fabric/QPolygon.js @@ -24,8 +24,8 @@ export const QPolygon = fabric.util.createClass(fabric.Polygon, { initialize: function (points, options, canvas) { // 소수점 전부 제거 points.forEach((point) => { - point.x = Math.round(point.x) - point.y = Math.round(point.y) + point.x = Number(point.x.toFixed(1)) + point.y = Number(point.y.toFixed(1)) }) options.selectable = options.selectable ?? true options.sort = options.sort ?? true From eb636881da1277c885a4adb6d6b3e0c975649cc4 Mon Sep 17 00:00:00 2001 From: basssy Date: Tue, 29 Oct 2024 10:14:48 +0900 Subject: [PATCH 11/29] =?UTF-8?q?=EB=AC=BC=EA=B1=B4=ED=98=84=ED=99=A9=20?= =?UTF-8?q?=EB=AA=A9=EB=A1=9D,=20=EC=83=81=EC=84=B8=201=EC=B0=A8=EC=A0=90,?= =?UTF-8?q?2=EC=B0=A8=EC=A0=90=20=EC=A6=90=EA=B2=A8=EC=B0=BE=EA=B8=B0=20&?= =?UTF-8?q?=20=EB=AA=A9=EB=A1=9D=20=EA=B7=B8=EB=A6=AC=EB=93=9C=20=ED=97=A4?= =?UTF-8?q?=EB=8D=94=20=EC=A0=95=EB=A0=AC=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/management/Stuff.jsx | 4 +- src/components/management/StuffDetail.jsx | 277 ++++++++++++------ src/components/management/StuffQGrid.jsx | 2 +- .../management/StuffSearchCondition.jsx | 37 ++- 4 files changed, 219 insertions(+), 101 deletions(-) diff --git a/src/components/management/Stuff.jsx b/src/components/management/Stuff.jsx index 138a3b85..dfd4f94b 100644 --- a/src/components/management/Stuff.jsx +++ b/src/components/management/Stuff.jsx @@ -43,9 +43,9 @@ export default function Stuff() { const copyNo = async (value) => { try { await navigator.clipboard.writeText(value) - alert('물건번호가 복사되었습니다.') + alert(getMessage('stuff.detail.header.message2')) } catch (error) { - alert('물건번호 복사에 실패했습니다.') + alert(getMessage('stuff.detail.header.message3')) } } diff --git a/src/components/management/StuffDetail.jsx b/src/components/management/StuffDetail.jsx index 9960fb1f..ed47ee99 100644 --- a/src/components/management/StuffDetail.jsx +++ b/src/components/management/StuffDetail.jsx @@ -88,6 +88,9 @@ export default function StuffDetail() { const [prefCodeList, setPrefCodeList] = useState([]) //도도부현 코트 리스트 const [prefValue, setPrefValue] = useState('') const [saleStoreList, setSaleStoreList] = useState([]) // 판매점 리스트 + const [favoriteStoreList, setFavoriteStoreList] = useState([]) //즐겨찾기한 판매점목록 + const [showSaleStoreList, setShowSaleStoreList] = useState([]) //보여줄 판매점목록 + const [otherSaleStoreList, setOtherSaleStoreList] = useState([]) const [originOtherSaleStoreList, setOriginOtherSaleStoreList] = useState([]) @@ -318,21 +321,37 @@ export default function StuffDetail() { //1차점 : X167 T01 //2차점 : 10X22, 201X112 - get({ url: `/api/object/saleStore/${sessionState?.storeId}/list` }).then((res) => { + let url + if (sessionState?.storeId === 'T01') { + // url = `/api/object/saleStore/${sessionState?.storeId}/list?userId=an1` + url = `/api/object/saleStore/${sessionState?.storeId}/list?userId=${sessionState?.userId}` + } else { + url = `/api/object/saleStore/${sessionState?.storeId}/list` + } + + get({ url: url }).then((res) => { if (!isEmptyArray(res)) { const firstList = res.filter((row) => row.saleStoreLevel === '1') + let favList + if (sessionState?.storeId === 'T01') { + firstList.sort((a, b) => (a.saleStoreId !== 'T01') - (b.saleStoreId !== 'T01') || a.saleStoreId - b.saleStoreId) + favList = firstList.filter((row) => row.saleStoreId === 'T01' || row.priority !== 'B') + setSaleStoreList(firstList) + setFavoriteStoreList(favList) + setShowSaleStoreList(favList) + } else { + //1차점 셀렉트박스 + setSaleStoreList(firstList) + } const otherList = res.filter((row) => row.saleStoreLevel !== '1') - - //1차점 셀렉트박스 - setSaleStoreList(firstList) - let filterOtherList if (sessionState?.storeId === 'T01') { filterOtherList = otherList.filter((row) => row.firstAgentId === 'T01') + setOriginOtherSaleStoreList(filterOtherList) setOtherSaleStoreList(filterOtherList) } else { - //1차점 아닌 판매점 셀렉트박스 + //T01 아니고 2차점 판매점 셀렉트박스 setOriginOtherSaleStoreList(otherList) setOtherSaleStoreList(otherList) } @@ -380,13 +399,29 @@ export default function StuffDetail() { //1차점 : X167 T01 //2차점 : 10X22, 201X112 - get({ url: `/api/object/saleStore/${sessionState?.storeId}/list` }).then((res) => { + let url + if (sessionState?.storeId === 'T01') { + // url = `/api/object/saleStore/${sessionState?.storeId}/list?userId=an1` + url = `/api/object/saleStore/${sessionState?.storeId}/list?userId=${sessionState?.userId}` + } else { + url = `/api/object/saleStore/${sessionState?.storeId}/list` + } + get({ url: url }).then((res) => { if (!isEmptyArray(res)) { const firstList = res.filter((row) => row.saleStoreLevel === '1') const otherList = res.filter((row) => row.saleStoreLevel !== '1') + let favList - //1차점 셀렉트박스 - setSaleStoreList(firstList) + if (sessionState?.storeId === 'T01') { + firstList.sort((a, b) => (a.saleStoreId !== 'T01') - (b.saleStoreId !== 'T01') || a.saleStoreId - b.saleStoreId) + favList = firstList.filter((row) => row.saleStoreId === 'T01' || row.priority !== 'B') + setSaleStoreList(firstList) + setFavoriteStoreList(favList) + setShowSaleStoreList(favList) + } else { + //1차점 셀렉트박스 + setSaleStoreList(firstList) + } let filterOtherList if (sessionState?.storeId === 'T01') { @@ -495,6 +530,16 @@ export default function StuffDetail() { const onRadioChange = (key) => { setSelectObjectStatusId(key.target.value) } + + //1차점 자동완성 input + const onInputChange = (key) => { + if (key !== '') { + setShowSaleStoreList(saleStoreList) + } else { + setShowSaleStoreList(favoriteStoreList) + } + } + //1차점 변경 이벤트 const onSelectionChange = (key) => { if (isObjectNotEmpty(key)) { @@ -516,7 +561,7 @@ export default function StuffDetail() { } } else { // EDIT - if (planReqNo !== null) { + if (planReqNo !== null && planReqNo !== '') { if (confirm(getMessage('stuff.detail.confirm.message1'))) { delFlg = true } else { @@ -629,7 +674,7 @@ export default function StuffDetail() { } } else { //EDIT - if (planReqNo !== null) { + if (planReqNo !== null && planReqNo !== '') { if (confirm(getMessage('stuff.detail.confirm.message1'))) { delFlg = true } else { @@ -849,7 +894,6 @@ export default function StuffDetail() { errors.installHeight = true } - // console.log('상세에러필드:::::', errors) setIsFormValid(Object.keys(errors).length === 0 ? true : false) } }, [ @@ -906,20 +950,17 @@ export default function StuffDetail() { // 저장 const onValid = async () => { const formData = form.getValues() - let errors = {} let fieldNm //담당자 if (!formData.receiveUser || formData.receiveUser.trim().length === 0) { fieldNm = getMessage('stuff.detail.receiveUser') errors = fieldNm - inputReceiveUserEl.current.focus() } //물건명 if (!formData.objectName || formData.objectName.trim().length === 0) { fieldNm = getMessage('stuff.detail.objectStatusId') errors = fieldNm - inputObjectNameEl.current.focus() } //경칭 if (!formData.objectNameOmit) { @@ -935,13 +976,11 @@ export default function StuffDetail() { if (!formData.zipNo) { fieldNm = getMessage('stuff.detail.zipNo') errors = fieldNm - inputZipNoEl.current.focus() } //주소 if (!formData.address) { fieldNm = getMessage('stuff.detail.address') errors = fieldNm - inputAddressEl.current.focus() } //도도부현 if (!formData.prefId || formData.prefId === '0') { @@ -962,7 +1001,6 @@ export default function StuffDetail() { if (!formData.verticalSnowCover) { fieldNm = getMessage('stuff.detail.verticalSnowCover') errors = fieldNm - inputVerticalSnowCoverEl.current.focus() } //면조도구분 @@ -974,7 +1012,6 @@ export default function StuffDetail() { if (!formData.installHeight) { fieldNm = getMessage('stuff.detail.installHeight') errors = fieldNm - inputInstallHeightEl.current.focus() } if (Object.keys(errors).length > 0) { @@ -1306,33 +1343,68 @@ export default function StuffDetail() {
-
- -
+ {(sessionState?.storeId === 'T01' && ( + <> +
+ +
+
+ +
+ + )) || ( + <> +
+ +
+
+ +
+ + )}
@@ -1651,13 +1723,7 @@ export default function StuffDetail() {
- +
@@ -1686,7 +1752,7 @@ export default function StuffDetail() { })} {/* 상세라디오끝 */}
- +
x.saleStoreName} - getOptionValue={(x) => x.saleStoreId} - isClearable={sessionState?.storeLvl === '1' ? true : false} - isDisabled={sessionState?.storeLvl !== '1' ? true : false} - value={saleStoreList.filter(function (option) { - return option.saleStoreId === selOptions - })} - /> -
-
- -
+ {(sessionState?.storeId === 'T01' && ( + <> +
+ +
+ + )) || ( + <> +
+ +
+ + )}
@@ -1811,7 +1912,7 @@ export default function StuffDetail() {
- +
- +
@@ -1935,7 +2030,6 @@ export default function StuffDetail() { onKeyUp={handleKeyUp} value={form.watch('verticalSnowCover') || ''} {...register('verticalSnowCover')} - ref={inputVerticalSnowCoverEl} /> cm @@ -1987,7 +2081,6 @@ export default function StuffDetail() { onKeyUp={handleKeyUp} value={form.watch('installHeight') || ''} {...register('installHeight')} - ref={inputInstallHeightEl} /> m @@ -2017,7 +2110,7 @@ export default function StuffDetail() { {getMessage('stuff.detail.remarks')}
- +
diff --git a/src/components/management/StuffQGrid.jsx b/src/components/management/StuffQGrid.jsx index 7a5f4eb7..32c686fb 100644 --- a/src/components/management/StuffQGrid.jsx +++ b/src/components/management/StuffQGrid.jsx @@ -39,7 +39,7 @@ export default function StuffQGrid(props) { return { filter: false, flex: 1, - sortable: false, + sortable: true, suppressMovable: true, resizable: true, suppressSizeToFit: false, diff --git a/src/components/management/StuffSearchCondition.jsx b/src/components/management/StuffSearchCondition.jsx index 1822140e..3e5b07f6 100644 --- a/src/components/management/StuffSearchCondition.jsx +++ b/src/components/management/StuffSearchCondition.jsx @@ -4,7 +4,6 @@ import React, { useEffect, useRef, useState } from 'react' import { useAxios } from '@/hooks/useAxios' import { useRecoilState, useRecoilValue, useResetRecoilState } from 'recoil' import { appMessageStore, globalLocaleStore } from '@/store/localeAtom' -// import Select from 'react-dropdown-select' import Select from 'react-select' import KO from '@/locales/ko.json' import JA from '@/locales/ja.json' @@ -57,7 +56,9 @@ export default function StuffSearchCondition() { const [receiveUser, setReceiveUser] = useState('') //담당자 const [dateType, setDateType] = useState('U') //갱신일(U)/등록일(R) - const [schSelSaleStoreList, setSchSelSaleStoreList] = useState([]) //판매대리점 자동완성 SELECT + const [schSelSaleStoreList, setSchSelSaleStoreList] = useState([]) //판매대리점 자동완성 SELECT 전체 + const [favoriteStoreList, setFavoriteStoreList] = useState([]) //즐겨찾기한 판매점목록 + const [showSaleStoreList, setShowSaleStoreList] = useState([]) //보여줄 판매점목록 // 조회 const onSubmit = () => { let diff = dayjs(endDate).diff(startDate, 'day') @@ -128,13 +129,24 @@ export default function StuffSearchCondition() { useEffect(() => { if (isObjectNotEmpty(sessionState)) { // storeId가 T01 이거나 1차점일때만 판매대리점 선택 활성화 - get({ url: `/api/object/saleStore/${sessionState?.storeId}/list` }).then((res) => { + let url + if (sessionState?.storeId === 'T01') { + // url = `/api/object/saleStore/${sessionState?.storeId}/list?userId=an1` + url = `/api/object/saleStore/${sessionState?.storeId}/list?userId=${sessionState?.userId}` + } else { + url = `/api/object/saleStore/${sessionState?.storeId}/list` + } + get({ url: url }).then((res) => { if (!isEmptyArray(res)) { res.map((row) => { row.value = row.saleStoreId row.label = row.saleStoreName }) - setSchSelSaleStoreList(res) + const allList = res + const favList = res.filter((row) => row.priority !== 'B') + setSchSelSaleStoreList(allList) + setFavoriteStoreList(favList) + setShowSaleStoreList(favList) } }) } @@ -147,6 +159,15 @@ export default function StuffSearchCondition() { } } + //자동완성 인풋 + const onInputChange = (key) => { + if (key !== '') { + setShowSaleStoreList(schSelSaleStoreList) + } else { + setShowSaleStoreList(favoriteStoreList) + } + } + //판매대리점 자동완성 변경 const onSelectionChange = (key) => { if (isObjectNotEmpty(key)) { @@ -300,11 +321,15 @@ export default function StuffSearchCondition() { classNamePrefix="custom" placeholder="Select" ref={ref} - options={schSelSaleStoreList} + // options={schSelSaleStoreList} + options={showSaleStoreList} + onInputChange={onInputChange} onChange={onSelectionChange} getOptionLabel={(x) => x.saleStoreName} getOptionValue={(x) => x.saleStoreId} - value={schSelSaleStoreList.filter(function (option) { + // value={schSelSaleStoreList.filter(function (option) { + value={showSaleStoreList.filter(function (option) { + // console.log('자동완성 value::::', option) if (stuffSearch?.code === 'S' && schSelSaleStoreId === '') { return false } else if (stuffSearch?.code === 'S' && schSelSaleStoreId !== '') { From a7da20e8ad919d8725f2d719b8f996b00af65e36 Mon Sep 17 00:00:00 2001 From: yoosangwook Date: Tue, 29 Oct 2024 10:50:31 +0900 Subject: [PATCH 12/29] =?UTF-8?q?fix:=20=EA=B2=AC=EC=A0=81=EC=84=9C=20?= =?UTF-8?q?=ED=8E=98=EC=9D=B4=EC=A7=80=20=EB=9D=BC=EC=9D=B4=ED=84=B0=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/app/floor-plan/{ => estimate}/[mid]/[pid]/page.jsx | 0 1 file changed, 0 insertions(+), 0 deletions(-) rename src/app/floor-plan/{ => estimate}/[mid]/[pid]/page.jsx (100%) diff --git a/src/app/floor-plan/[mid]/[pid]/page.jsx b/src/app/floor-plan/estimate/[mid]/[pid]/page.jsx similarity index 100% rename from src/app/floor-plan/[mid]/[pid]/page.jsx rename to src/app/floor-plan/estimate/[mid]/[pid]/page.jsx From 5daf9891800be586c370c9392653d0fa35667da5 Mon Sep 17 00:00:00 2001 From: "hyojun.choi" Date: Tue, 29 Oct 2024 12:56:38 +0900 Subject: [PATCH 13/29] =?UTF-8?q?=EA=B0=81=EB=8F=84=20=EA=B3=84=EC=82=B0?= =?UTF-8?q?=20=EC=88=98=EC=A0=95,=20=EC=A7=80=EB=B6=95=EB=A9=B4=20?= =?UTF-8?q?=EC=99=84=EB=A3=8C=20=EC=8B=9C=20=EC=99=B8=EB=B2=BD=EC=84=A0=20?= =?UTF-8?q?=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/hooks/roofcover/useEavesGableEdit.js | 5 ++++- src/hooks/roofcover/useRoofAllocationSetting.js | 6 ++++++ src/util/canvas-util.js | 2 +- 3 files changed, 11 insertions(+), 2 deletions(-) diff --git a/src/hooks/roofcover/useEavesGableEdit.js b/src/hooks/roofcover/useEavesGableEdit.js index b0085019..7696dc7a 100644 --- a/src/hooks/roofcover/useEavesGableEdit.js +++ b/src/hooks/roofcover/useEavesGableEdit.js @@ -170,7 +170,10 @@ export function useEavesGableEdit(id) { }) const wallLines = canvas.getObjects().filter((obj) => obj.name === 'wallLine') - + const removeTargets = canvas.getObjects().filter((obj) => obj.name === 'pitchText') + removeTargets.forEach((obj) => { + canvas.remove(obj) + }) wallLines.forEach((wallLine) => { addPitchTextsByOuterLines() const roof = drawRoofPolygon(wallLine) diff --git a/src/hooks/roofcover/useRoofAllocationSetting.js b/src/hooks/roofcover/useRoofAllocationSetting.js index 3f355111..3be745d6 100644 --- a/src/hooks/roofcover/useRoofAllocationSetting.js +++ b/src/hooks/roofcover/useRoofAllocationSetting.js @@ -130,6 +130,12 @@ export function useRoofAllocationSetting(id) { setSurfaceShapePattern(roof, roofDisplay.column) drawDirectionArrow(roof) }) + + const removeTargets = canvas.getObjects().filter((obj) => obj.name === 'outerLinePoint' || obj.name === 'outerLine') + removeTargets.forEach((obj) => { + canvas.remove(obj) + }) + closePopup(id) } diff --git a/src/util/canvas-util.js b/src/util/canvas-util.js index 9f8b9469..73464722 100644 --- a/src/util/canvas-util.js +++ b/src/util/canvas-util.js @@ -268,7 +268,7 @@ export const getDegreeByChon = (chon) => { export const getChonByDegree = (degree) => { // tan(theta) = height / base const radians = (degree * Math.PI) / 180 - return Number(Number(Math.tan(radians) * 10).toFixed(1)) + return Number(Number(Math.tan(radians) * 10).toFixed(2)) } /** From 0c1697596503dd57466a648f448b0d637d899a2b Mon Sep 17 00:00:00 2001 From: minsik Date: Tue, 29 Oct 2024 14:26:25 +0900 Subject: [PATCH 14/29] =?UTF-8?q?=EA=B0=81=EB=8F=84/=EA=B2=BD=EC=82=AC=20?= =?UTF-8?q?=EB=8B=A8=EC=9C=84=20=ED=91=9C=EC=8B=9C=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../modal/dimensionLine/DimensionLineSetting.jsx | 8 +++++--- 1 file changed, 5 insertions(+), 3 deletions(-) diff --git a/src/components/floor-plan/modal/dimensionLine/DimensionLineSetting.jsx b/src/components/floor-plan/modal/dimensionLine/DimensionLineSetting.jsx index 57fe3364..d24d8d43 100644 --- a/src/components/floor-plan/modal/dimensionLine/DimensionLineSetting.jsx +++ b/src/components/floor-plan/modal/dimensionLine/DimensionLineSetting.jsx @@ -1,15 +1,17 @@ import WithDraggable from '@/components/common/draggable/WithDraggable' import { usePopup } from '@/hooks/usePopup' import { useMessage } from '@/hooks/useMessage' -import { useRecoilValue } from 'recoil' +import { useRecoilState, useRecoilValue } from 'recoil' import { contextPopupPositionState } from '@/store/popupAtom' import QSelectBox from '@/components/common/select/QSelectBox' +import { pitchTextSelector } from '@/store/canvasAtom' export default function DimensionLineSetting(props) { const contextPopupPosition = useRecoilValue(contextPopupPositionState) const { id, setIsShow, pos = contextPopupPosition } = props const { getMessage } = useMessage() const { closePopup } = usePopup() + const pitchText = useRecoilState(pitchTextSelector) const SelectOption01 = [{ name: '0' }, { name: '0' }, { name: '0' }, { name: '0' }] return ( @@ -52,14 +54,14 @@ export default function DimensionLineSetting(props) {
- 寸法 + {pitchText}
傾斜
- 寸法 + {pitchText}
傾き設定されている場合、入力した数値に傾き計算をした数値が表示されます。
From 4a4d532bbeeb5e0ce7913d1b8238e0455f24197b Mon Sep 17 00:00:00 2001 From: minsik Date: Tue, 29 Oct 2024 14:27:21 +0900 Subject: [PATCH 15/29] =?UTF-8?q?-=20=EB=B0=B0=EC=B9=98=EB=A9=B4=20?= =?UTF-8?q?=EC=B4=88=EA=B8=B0=20=EC=84=A4=EC=A0=95:=20=EC=B9=98=EC=88=98?= =?UTF-8?q?=EC=9E=85=EB=A0=A5=20=EB=B0=A9=EB=B2=95=20=EC=84=A4=EC=A0=95?= =?UTF-8?q?=EC=97=90=20=EB=A7=9E=EC=B6=B0=20=EB=9D=BC=EC=9A=B0=ED=8C=85=20?= =?UTF-8?q?=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/floor-plan/CanvasMenu.jsx | 70 +++++----- src/components/floor-plan/MenuDepth01.jsx | 148 +++------------------- src/hooks/common/useMenu.js | 95 ++++++++++++++ src/store/menuAtom.js | 68 ++++++++++ 4 files changed, 216 insertions(+), 165 deletions(-) create mode 100644 src/hooks/common/useMenu.js diff --git a/src/components/floor-plan/CanvasMenu.jsx b/src/components/floor-plan/CanvasMenu.jsx index b2ff69f6..ebcac837 100644 --- a/src/components/floor-plan/CanvasMenu.jsx +++ b/src/components/floor-plan/CanvasMenu.jsx @@ -12,53 +12,51 @@ import { useMessage } from '@/hooks/useMessage' import { usePlan } from '@/hooks/usePlan' import { useSwal } from '@/hooks/useSwal' import { useEvent } from '@/hooks/useEvent' -import { canvasState, canvasZoomState, currentCanvasPlanState, currentMenuState, verticalHorizontalModeState } from '@/store/canvasAtom' +import { + canvasSettingState, + canvasState, + canvasZoomState, + currentCanvasPlanState, + currentMenuState, + verticalHorizontalModeState, +} from '@/store/canvasAtom' import { sessionStore } from '@/store/commonAtom' import { outerLinePointsState } from '@/store/outerLineAtom' import { appMessageStore, globalLocaleStore } from '@/store/localeAtom' -import { settingModalFirstOptionsState, wordDisplaySelector } from '@/store/settingAtom' -import { MENU } from '@/common/common' +import { settingModalFirstOptionsState } from '@/store/settingAtom' import KO from '@/locales/ko.json' import JA from '@/locales/ja.json' import { useCanvasEvent } from '@/hooks/useCanvasEvent' -import { popupState } from '@/store/popupAtom' import SettingModal01 from '@/components/floor-plan/modal/setting01/SettingModal01' import { usePopup } from '@/hooks/usePopup' import { placementShapeDrawingPointsState } from '@/store/placementShapeDrawingAtom' import PlacementShapeSetting from '@/components/floor-plan/modal/placementShape/PlacementShapeSetting' import { useCommonUtils } from '@/hooks/common/useCommonUtils' - -const canvasMenus = [ - { index: 0, name: 'plan.menu.plan.drawing', icon: 'con00', title: MENU.PLAN_DRAWING }, - { index: 1, name: 'plan.menu.placement.surface.initial.setting', icon: 'con01', title: MENU.INITIAL_CANVAS_SETTING }, - { index: 2, name: 'plan.menu.roof.cover', icon: 'con02', title: MENU.ROOF_COVERING.DEFAULT }, - { index: 3, name: 'plan.menu.placement.surface', icon: 'con03', title: MENU.BATCH_CANVAS.DEFAULT }, - { index: 4, name: 'plan.menu.module.circuit.setting', icon: 'con04', title: MENU.MODULE_CIRCUIT_SETTING.DEFAULT }, - { index: 5, name: 'plan.menu.estimate', icon: 'con06', title: MENU.ESTIMATE.DEFAULT }, - { index: 6, name: 'plan.menu.simulation', icon: 'con05', title: MENU.POWER_GENERATION_SIMULATION.DEFAULT }, -] +import { menusState, menuTypeState } from '@/store/menuAtom' +import useMenu from '@/hooks/common/useMenu' +import { MENU } from '@/common/common' export default function CanvasMenu(props) { const { menuNumber, setMenuNumber } = props const pathname = usePathname() const router = useRouter() - - const { addPopup, closePopup } = usePopup() - const [type, setType] = useState('') - + const { addPopup } = usePopup() + const canvasMenus = useRecoilValue(menusState) + const [type, setType] = useRecoilState(menuTypeState) const [verticalHorizontalMode, setVerticalHorizontalMode] = useRecoilState(verticalHorizontalModeState) const [appMessageState, setAppMessageState] = useRecoilState(appMessageStore) const setCurrentMenu = useSetRecoilState(currentMenuState) const setOuterLinePoints = useSetRecoilState(outerLinePointsState) const setPlacementPoints = useSetRecoilState(placementShapeDrawingPointsState) + const canvasSetting = useRecoilValue(canvasSettingState) const [canvasZoom, setCanvasZoom] = useRecoilState(canvasZoomState) const [currentCanvasPlan, setcurrentCanvasPlan] = useRecoilState(currentCanvasPlanState) - const { handleZoomClear } = useCanvasEvent() - + const sessionState = useRecoilValue(sessionStore) const globalLocale = useRecoilValue(globalLocaleStore) const canvas = useRecoilValue(canvasState) - const sessionState = useRecoilValue(sessionStore) + const { handleZoomClear } = useCanvasEvent() + const { handleMenu } = useMenu() const { getMessage } = useMessage() const { saveCanvas } = usePlan() @@ -70,14 +68,11 @@ export default function CanvasMenu(props) { dimension: false, distance: false, }) - const { commonFunctions } = useCommonUtils({ commonFunctionState, setCommonFunctionState, }) - const [popup, setPopup] = useRecoilState(popupState) - const SelectOption = [{ name: '瓦53A' }, { name: '瓦53A' }] const onClickNav = (menu) => { @@ -102,9 +97,6 @@ export default function CanvasMenu(props) { if (pathname !== '/floor-plan') router.push('/floor-plan') } - const menuProps = { - type, - } const settingsModalOptions = useRecoilState(settingModalFirstOptionsState) @@ -135,7 +127,6 @@ export default function CanvasMenu(props) { } const onClickPlacementInitialMenu = () => { addPopup(placementInitialId, 1, ) - // setShowPlaceShapeModal(true) } const handleClear = () => { @@ -162,7 +153,19 @@ export default function CanvasMenu(props) { } else { setAppMessageState(JA) } - }, [menuNumber, type, globalLocale]) + }, [type, globalLocale]) + + useEffect(() => { + if (['2', '3'].includes(canvasSetting?.roofSizeSet?.toString())) { + setMenuNumber(3) + setType('surface') + setCurrentMenu(MENU.BATCH_CANVAS.BATCH_DRAWING) + } else { + setMenuNumber(2) + setType('outline') + setCurrentMenu(MENU.ROOF_COVERING.EXTERIOR_WALL_LINE) + } + }, [canvasSetting]) return (
@@ -173,9 +176,12 @@ export default function CanvasMenu(props) {
  • onClickNav(menu)} + onClick={() => { + if (['2', '3'].includes(canvasSetting?.roofSizeSet?.toString()) && menu.index === 2) return + onClickNav(menu) + }} > - @@ -263,7 +269,7 @@ export default function CanvasMenu(props) {
  • - {(menuNumber === 2 || menuNumber === 3 || menuNumber === 4) && } + {(menuNumber === 2 || menuNumber === 3 || menuNumber === 4) && }
    ) diff --git a/src/components/floor-plan/MenuDepth01.jsx b/src/components/floor-plan/MenuDepth01.jsx index 113a1f0e..63e5e67a 100644 --- a/src/components/floor-plan/MenuDepth01.jsx +++ b/src/components/floor-plan/MenuDepth01.jsx @@ -1,150 +1,32 @@ 'use client' import { useMessage } from '@/hooks/useMessage' -import { useEffect, useState } from 'react' -import { MENU } from '@/common/common' import { currentMenuState } from '@/store/canvasAtom' -import { useSetRecoilState } from 'recoil' -import { useSurfaceShapeBatch } from '@/hooks/surface/useSurfaceShapeBatch' -import { usePopup } from '@/hooks/usePopup' -import { v4 as uuidv4 } from 'uuid' -import WallLineSetting from '@/components/floor-plan/modal/outerlinesetting/WallLineSetting' -import RoofShapeSetting from '@/components/floor-plan/modal/roofShape/RoofShapeSetting' -import RoofShapePassivitySetting from '@/components/floor-plan/modal/roofShape/RoofShapePassivitySetting' -import AuxiliaryDrawing from '@/components/floor-plan/modal/auxiliary/AuxiliaryDrawing' -import EavesGableEdit from '@/components/floor-plan/modal/eavesGable/EavesGableEdit' -import MovementSetting from '@/components/floor-plan/modal/movement/MovementSetting' -import WallLineOffsetSetting from '@/components/floor-plan/modal/wallLineOffset/WallLineOffsetSetting' -import RoofAllocationSetting from '@/components/floor-plan/modal/roofAllocation/RoofAllocationSetting' -import Slope from '@/components/floor-plan/modal/Slope' -import ObjectSetting from '@/components/floor-plan/modal/object/ObjectSetting' -import PlacementShapeDrawing from '@/components/floor-plan/modal/placementShape/PlacementShapeDrawing' -import PlacementSurfaceSetting from '@/components/floor-plan/modal/placementSurface/PlacementSurfaceSetting' -import BasicSetting from '@/components/floor-plan/modal/basic/BasicSetting' -import CircuitTrestleSetting from '@/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting' +import { useRecoilState, useRecoilValue } from 'recoil' +import { menuTypeState, subMenusState } from '@/store/menuAtom' +import useMenu from '@/hooks/common/useMenu' +import { useEffect } from 'react' -export default function MenuDepth01(props) { - const { type } = props +export default function MenuDepth01() { + const type = useRecoilValue(menuTypeState) const { getMessage } = useMessage() - const [activeMenu, setActiveMenu] = useState() - const setCurrentMenu = useSetRecoilState(currentMenuState) - const { deleteAllSurfacesAndObjects } = useSurfaceShapeBatch() - const { addPopup } = usePopup() - const [outlineId, setOutlineId] = useState(uuidv4()) - const onClickMenu = ({ id, menu, name }) => { - setActiveMenu(menu) + const { handleMenu } = useMenu() + const [currentMenu, setCurrentMenu] = useRecoilState(currentMenuState) + const subMenus = useRecoilValue(subMenusState) + + const onClickMenu = ({ id, menu }) => { setCurrentMenu(menu) - if (type === 'outline') { - switch (id) { - case 0: - addPopup(outlineId, 1, ) - break - case 1: - addPopup(outlineId, 1, ) - break - case 2: - addPopup(outlineId, 1, ) - break - case 3: - addPopup(outlineId, 1, ) - break - case 4: - addPopup(outlineId, 1, ) - break - case 5: - addPopup(outlineId, 1, ) - break - case 6: - addPopup(outlineId, 1, ) - break - case 7: - addPopup(outlineId, 1, ) - break - } - } - - if (type === 'surface') { - switch (id) { - case 0: - addPopup(outlineId, 1, ) - break - case 1: - addPopup(outlineId, 1, ) - break - case 2: - addPopup(outlineId, 1, ) - break - case 3: - addPopup(outlineId, 1, ) - break - case 4: - deleteAllSurfacesAndObjects() - break - } - } - - if (type === 'module') { - switch (id) { - case 0: - addPopup(outlineId, 1, ) - break - case 1: - addPopup(outlineId, 1, ) - break - } - } } useEffect(() => { - setActiveMenu(null) - }, [type]) - - const menuInfo = { - outline: [ - // 지붕덮개 - { id: 0, name: 'plan.menu.roof.cover.outline.drawing', menu: MENU.ROOF_COVERING.EXTERIOR_WALL_LINE }, - { id: 1, name: 'plan.menu.roof.cover.roof.shape.setting', menu: MENU.ROOF_COVERING.ROOF_SHAPE_SETTINGS }, - { - id: 2, - name: 'plan.menu.roof.cover.roof.shape.passivity.setting', - menu: MENU.ROOF_COVERING.ROOF_SHAPE_PASSIVITY_SETTINGS, - }, - { id: 3, name: 'plan.menu.roof.cover.auxiliary.line.drawing', menu: MENU.ROOF_COVERING.HELP_LINE_DRAWING }, - { id: 4, name: 'plan.menu.roof.cover.eaves.kerava.edit', menu: MENU.ROOF_COVERING.EAVES_KERAVA_EDIT }, - { id: 5, name: 'plan.menu.roof.cover.movement.shape.updown', menu: MENU.ROOF_COVERING.MOVEMENT_SHAPE_UPDOWN }, - { id: 6, name: 'plan.menu.roof.cover.outline.edit.offset', menu: MENU.ROOF_COVERING.OUTLINE_EDIT_OFFSET }, - { id: 7, name: 'plan.menu.roof.cover.roof.surface.alloc', menu: MENU.ROOF_COVERING.ROOF_SHAPE_ALLOC }, - ], - surface: [ - // 배치면 - { id: 0, name: 'plan.menu.placement.surface.slope.setting', menu: MENU.BATCH_CANVAS.SLOPE_SETTING }, - { id: 1, name: 'plan.menu.placement.surface.drawing', menu: MENU.BATCH_CANVAS.BATCH_DRAWING }, - { id: 2, name: 'plan.menu.placement.surface.arrangement', menu: MENU.BATCH_CANVAS.SURFACE_SHAPE_BATCH }, - { id: 3, name: 'plan.menu.placement.surface.object', menu: MENU.BATCH_CANVAS.OBJECT_BATCH }, - { id: 4, name: 'plan.menu.placement.surface.all.remove', menu: MENU.BATCH_CANVAS.ALL_REMOVE }, - ], - module: [ - // 모듈, 회로 구성 - - { id: 0, name: 'plan.menu.module.circuit.setting.default', menu: MENU.MODULE_CIRCUIT_SETTING.BASIC_SETTING }, - { - id: 1, - name: 'plan.menu.module.circuit.setting.circuit.trestle.setting', - menu: MENU.MODULE_CIRCUIT_SETTING.CIRCUIT_TRESTLE_SETTING, - }, - { - id: 2, - name: 'plan.menu.module.circuit.setting.plan.orientation', - menu: MENU.MODULE_CIRCUIT_SETTING.PLAN_ORIENTATION, - }, - ], - } + handleMenu(type) + }, [currentMenu]) return (
      - {menuInfo[type].map((menu) => { + {subMenus[type]?.map((menu) => { return ( -
    • +
    • ) diff --git a/src/hooks/common/useMenu.js b/src/hooks/common/useMenu.js new file mode 100644 index 00000000..75905a73 --- /dev/null +++ b/src/hooks/common/useMenu.js @@ -0,0 +1,95 @@ +import WallLineSetting from '@/components/floor-plan/modal/outerlinesetting/WallLineSetting' +import RoofShapeSetting from '@/components/floor-plan/modal/roofShape/RoofShapeSetting' +import RoofShapePassivitySetting from '@/components/floor-plan/modal/roofShape/RoofShapePassivitySetting' +import AuxiliaryDrawing from '@/components/floor-plan/modal/auxiliary/AuxiliaryDrawing' +import EavesGableEdit from '@/components/floor-plan/modal/eavesGable/EavesGableEdit' +import MovementSetting from '@/components/floor-plan/modal/movement/MovementSetting' +import WallLineOffsetSetting from '@/components/floor-plan/modal/wallLineOffset/WallLineOffsetSetting' +import RoofAllocationSetting from '@/components/floor-plan/modal/roofAllocation/RoofAllocationSetting' +import Slope from '@/components/floor-plan/modal/Slope' +import PlacementShapeDrawing from '@/components/floor-plan/modal/placementShape/PlacementShapeDrawing' +import PlacementSurfaceSetting from '@/components/floor-plan/modal/placementSurface/PlacementSurfaceSetting' +import ObjectSetting from '@/components/floor-plan/modal/object/ObjectSetting' +import BasicSetting from '@/components/floor-plan/modal/basic/BasicSetting' +import CircuitTrestleSetting from '@/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting' +import { usePopup } from '@/hooks/usePopup' +import { useState } from 'react' +import { v4 as uuidv4 } from 'uuid' +import { useSurfaceShapeBatch } from '@/hooks/surface/useSurfaceShapeBatch' +import { useRecoilValue } from 'recoil' +import { currentMenuState } from '@/store/canvasAtom' +import { MENU } from '@/common/common' + +export default function useMenu() { + const menus = [] + const currentMenu = useRecoilValue(currentMenuState) + const [popupId, setPopupId] = useState(uuidv4()) + const { addPopup } = usePopup() + const { deleteAllSurfacesAndObjects } = useSurfaceShapeBatch() + const handleMenu = (type) => { + if (type === 'outline') { + switch (currentMenu) { + case MENU.ROOF_COVERING.EXTERIOR_WALL_LINE: + addPopup(popupId, 1, ) + break + case MENU.ROOF_COVERING.ROOF_SHAPE_SETTINGS: + addPopup(popupId, 1, ) + break + case MENU.ROOF_COVERING.ROOF_SHAPE_PASSIVITY_SETTINGS: + addPopup(popupId, 1, ) + break + case MENU.ROOF_COVERING.HELP_LINE_DRAWING: + addPopup(popupId, 1, ) + break + case MENU.ROOF_COVERING.EAVES_KERAVA_EDIT: + addPopup(popupId, 1, ) + break + case MENU.ROOF_COVERING.MOVEMENT_SHAPE_UPDOWN: + addPopup(popupId, 1, ) + break + case MENU.ROOF_COVERING.OUTLINE_EDIT_OFFSET: + addPopup(popupId, 1, ) + break + case MENU.ROOF_COVERING.ROOF_SHAPE_ALLOC: + addPopup(popupId, 1, ) + break + } + } + + if (type === 'surface') { + switch (currentMenu) { + case MENU.BATCH_CANVAS.SLOPE_SETTING: + addPopup(popupId, 1, ) + break + case MENU.BATCH_CANVAS.BATCH_DRAWING: + addPopup(popupId, 1, ) + break + case MENU.BATCH_CANVAS.SURFACE_SHAPE_BATCH: + addPopup(popupId, 1, ) + break + case MENU.BATCH_CANVAS.OBJECT_BATCH: + addPopup(popupId, 1, ) + break + case MENU.BATCH_CANVAS.ALL_REMOVE: + deleteAllSurfacesAndObjects() + break + } + } + + if (type === 'module') { + switch (currentMenu) { + case MENU.MODULE_CIRCUIT_SETTING.BASIC_SETTING: + addPopup(popupId, 1, ) + break + case MENU.MODULE_CIRCUIT_SETTING.CIRCUIT_TRESTLE_SETTING: + addPopup(popupId, 1, ) + break + } + } + } + + return { + menus, + handleMenu, + } +} diff --git a/src/store/menuAtom.js b/src/store/menuAtom.js index b86ecbd0..834498f0 100644 --- a/src/store/menuAtom.js +++ b/src/store/menuAtom.js @@ -1,6 +1,74 @@ import { atom } from 'recoil' +import { MENU } from '@/common/common' export const menuNumberState = atom({ key: 'menuNumberState', default: null, }) + +export const menuTypeState = atom({ + key: 'menuTypeState', + default: null, +}) + +export const menusState = atom({ + key: 'menusState', + default: [ + { index: 0, name: 'plan.menu.plan.drawing', icon: 'con00', title: MENU.PLAN_DRAWING }, + { + index: 1, + name: 'plan.menu.placement.surface.initial.setting', + icon: 'con01', + title: MENU.INITIAL_CANVAS_SETTING, + }, + { index: 2, name: 'plan.menu.roof.cover', icon: 'con02', title: MENU.ROOF_COVERING.DEFAULT }, + { index: 3, name: 'plan.menu.placement.surface', icon: 'con03', title: MENU.BATCH_CANVAS.DEFAULT }, + { index: 4, name: 'plan.menu.module.circuit.setting', icon: 'con04', title: MENU.MODULE_CIRCUIT_SETTING.DEFAULT }, + { index: 5, name: 'plan.menu.estimate', icon: 'con06', title: MENU.ESTIMATE.DEFAULT }, + { index: 6, name: 'plan.menu.simulation', icon: 'con05', title: MENU.POWER_GENERATION_SIMULATION.DEFAULT }, + ], +}) + +export const subMenusState = atom({ + key: 'subMenusState', + default: { + outline: [ + // 지붕덮개 + { id: 0, name: 'plan.menu.roof.cover.outline.drawing', menu: MENU.ROOF_COVERING.EXTERIOR_WALL_LINE }, + { id: 1, name: 'plan.menu.roof.cover.roof.shape.setting', menu: MENU.ROOF_COVERING.ROOF_SHAPE_SETTINGS }, + { + id: 2, + name: 'plan.menu.roof.cover.roof.shape.passivity.setting', + menu: MENU.ROOF_COVERING.ROOF_SHAPE_PASSIVITY_SETTINGS, + }, + { id: 3, name: 'plan.menu.roof.cover.auxiliary.line.drawing', menu: MENU.ROOF_COVERING.HELP_LINE_DRAWING }, + { id: 4, name: 'plan.menu.roof.cover.eaves.kerava.edit', menu: MENU.ROOF_COVERING.EAVES_KERAVA_EDIT }, + { id: 5, name: 'plan.menu.roof.cover.movement.shape.updown', menu: MENU.ROOF_COVERING.MOVEMENT_SHAPE_UPDOWN }, + { id: 6, name: 'plan.menu.roof.cover.outline.edit.offset', menu: MENU.ROOF_COVERING.OUTLINE_EDIT_OFFSET }, + { id: 7, name: 'plan.menu.roof.cover.roof.surface.alloc', menu: MENU.ROOF_COVERING.ROOF_SHAPE_ALLOC }, + ], + surface: [ + // 배치면 + { id: 0, name: 'plan.menu.placement.surface.slope.setting', menu: MENU.BATCH_CANVAS.SLOPE_SETTING }, + { id: 1, name: 'plan.menu.placement.surface.drawing', menu: MENU.BATCH_CANVAS.BATCH_DRAWING }, + { id: 2, name: 'plan.menu.placement.surface.arrangement', menu: MENU.BATCH_CANVAS.SURFACE_SHAPE_BATCH }, + { id: 3, name: 'plan.menu.placement.surface.object', menu: MENU.BATCH_CANVAS.OBJECT_BATCH }, + { id: 4, name: 'plan.menu.placement.surface.all.remove', menu: MENU.BATCH_CANVAS.ALL_REMOVE }, + ], + module: [ + // 모듈, 회로 구성 + + { id: 0, name: 'plan.menu.module.circuit.setting.default', menu: MENU.MODULE_CIRCUIT_SETTING.BASIC_SETTING }, + { + id: 1, + name: 'plan.menu.module.circuit.setting.circuit.trestle.setting', + menu: MENU.MODULE_CIRCUIT_SETTING.CIRCUIT_TRESTLE_SETTING, + }, + { + id: 2, + name: 'plan.menu.module.circuit.setting.plan.orientation', + menu: MENU.MODULE_CIRCUIT_SETTING.PLAN_ORIENTATION, + }, + ], + }, +}) From 1e698f4597ca3f913cb96e1c47d389f212e8f69c Mon Sep 17 00:00:00 2001 From: minsik Date: Tue, 29 Oct 2024 15:49:43 +0900 Subject: [PATCH 16/29] =?UTF-8?q?=F0=9F=9A=A8chore:=20Sync=20Sass?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../static/images/canvas/img_check_fail.svg | 6 ++ .../images/canvas/img_check_success.svg | 4 + public/static/images/canvas/img_edit_ico.svg | 4 + public/static/images/sub/attachment_ico.svg | 14 +--- public/static/images/sub/change_ico.svg | 7 ++ public/static/images/sub/click_check_ico.svg | 7 +- public/static/images/sub/open_ico.svg | 6 ++ .../placementShape/PlacementShapeSetting.jsx | 19 +++++ src/styles/_contents.scss | 70 ++++++++++------- src/styles/_grid-detail.scss | 7 -- src/styles/_layout.scss | 2 +- src/styles/_modal.scss | 54 ++++++++++++- src/styles/_table.scss | 78 +++++++++++++++++++ 13 files changed, 230 insertions(+), 48 deletions(-) create mode 100644 public/static/images/canvas/img_check_fail.svg create mode 100644 public/static/images/canvas/img_check_success.svg create mode 100644 public/static/images/canvas/img_edit_ico.svg create mode 100644 public/static/images/sub/change_ico.svg create mode 100644 public/static/images/sub/open_ico.svg diff --git a/public/static/images/canvas/img_check_fail.svg b/public/static/images/canvas/img_check_fail.svg new file mode 100644 index 00000000..2941a08d --- /dev/null +++ b/public/static/images/canvas/img_check_fail.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/public/static/images/canvas/img_check_success.svg b/public/static/images/canvas/img_check_success.svg new file mode 100644 index 00000000..0ced9e65 --- /dev/null +++ b/public/static/images/canvas/img_check_success.svg @@ -0,0 +1,4 @@ + + + + diff --git a/public/static/images/canvas/img_edit_ico.svg b/public/static/images/canvas/img_edit_ico.svg new file mode 100644 index 00000000..abc1118b --- /dev/null +++ b/public/static/images/canvas/img_edit_ico.svg @@ -0,0 +1,4 @@ + + + + diff --git a/public/static/images/sub/attachment_ico.svg b/public/static/images/sub/attachment_ico.svg index 7e622a4e..71b132fb 100644 --- a/public/static/images/sub/attachment_ico.svg +++ b/public/static/images/sub/attachment_ico.svg @@ -1,11 +1,5 @@ - - - - - - - - - - + + + + diff --git a/public/static/images/sub/change_ico.svg b/public/static/images/sub/change_ico.svg new file mode 100644 index 00000000..b0dda7ee --- /dev/null +++ b/public/static/images/sub/change_ico.svg @@ -0,0 +1,7 @@ + + + + + + + diff --git a/public/static/images/sub/click_check_ico.svg b/public/static/images/sub/click_check_ico.svg index 4fc2dae1..d92ca90d 100644 --- a/public/static/images/sub/click_check_ico.svg +++ b/public/static/images/sub/click_check_ico.svg @@ -1,4 +1,5 @@ - - - + + + + diff --git a/public/static/images/sub/open_ico.svg b/public/static/images/sub/open_ico.svg new file mode 100644 index 00000000..2ef23b73 --- /dev/null +++ b/public/static/images/sub/open_ico.svg @@ -0,0 +1,6 @@ + + + + + + diff --git a/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx b/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx index b635ea86..99b72eb4 100644 --- a/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx +++ b/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx @@ -18,6 +18,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set const [canvasSetting, setCanvasSetting] = useRecoilState(canvasSettingState) const { closePopup } = usePopup() const [basicSetting, setBasicSettings] = useRecoilState(basicSettingState) + const [image, setImage] = useState(null) const { getMessage } = useMessage() const { get, post } = useAxios() @@ -479,6 +480,24 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
    + + {getMessage('common.input.file')} + +
    +
    + + setImage(e.target.files[0])} /> +
    +
    + + {image && } +
    +
    + + diff --git a/src/styles/_contents.scss b/src/styles/_contents.scss index e4f6a6b2..8e29b78a 100644 --- a/src/styles/_contents.scss +++ b/src/styles/_contents.scss @@ -23,6 +23,7 @@ left: 0; display: block; width: 100%; + height: 46.8px; padding-bottom: 0; background-color: #383838; transition: padding .17s ease-in-out; @@ -544,9 +545,9 @@ .sub-content{ padding-top: 46px; .sub-content-inner{ - max-width: 1720px; + max-width: 1760px; margin: 0 auto; - padding-top: 20px; + padding: 20px 20px 0; .sub-content-box{ margin-bottom: 20px; &:last-child{ @@ -897,45 +898,63 @@ display: flex; align-items: center; margin-right: 15px; - .attachment-required{ + .explane-item{ position: relative; display: flex; align-items: center; + padding: 0 10px; font-size: 12px; font-weight: 400; - color: #45576F; - padding-right: 10px; - .ico{ - width: 23px; - height: 23px; + span{ + width: 20px; + height: 20px; margin-right: 5px; - background: url(../../public/static/images/sub/attachment_ico.svg)no-repeat center; background-size: cover; + background-repeat: no-repeat; + background-position: center; } - &::before{ + &:before{ content: ''; position: absolute; top: 50%; - right: 0; + left: 0; transform: translateY(-50%); width: 1px; height: 12px; background-color: #D9D9D9; } - } - .click-check{ - display: flex; - align-items: center; - font-size: 12px; - font-weight: 400; - color: #F16A6A ; - padding-left: 10px; - .ico{ - width: 14px; - height: 14px; - margin-right: 5px; - background: url(../../public/static/images/sub/click_check_ico.svg)no-repeat center; - background-size: cover; + &:first-child{ + padding-left: 0; + &::before{ + display: none; + } + } + &:last-child{ + padding-right: 0; + } + &.item01{ + color: #3BBB48; + span{ + background-image: url(../../public/static/images/sub/open_ico.svg); + } + } + &.item02{ + color: #909000; + span{ + background-image: url(../../public/static/images/sub/change_ico.svg); + } + } + &.item03{ + color: #0191C9; + span{ + background-image: url(../../public/static/images/sub/attachment_ico.svg); + } + } + &.item04{ + color: #F16A6A; + span{ + background-image: url(../../public/static/images/sub/click_check_ico.svg); + } } } } @@ -960,7 +979,6 @@ } } } - } // 발전시물레이션 diff --git a/src/styles/_grid-detail.scss b/src/styles/_grid-detail.scss index 0392bae8..1f6a2270 100644 --- a/src/styles/_grid-detail.scss +++ b/src/styles/_grid-detail.scss @@ -128,10 +128,3 @@ } } -.grid-tip{ - display: block; - width: 15px; - height: 15px; - background: url(../../public/static/images/sub/grid_tip.svg)no-repeat center; - background-size: cover; -} \ No newline at end of file diff --git a/src/styles/_layout.scss b/src/styles/_layout.scss index 2bddf61f..7f3834df 100644 --- a/src/styles/_layout.scss +++ b/src/styles/_layout.scss @@ -1,7 +1,7 @@ .wrap{ display: flex; flex-direction: column; - min-width: 1600px; + min-width: 1280px; min-height: 100vh; overflow-x: hidden; } diff --git a/src/styles/_modal.scss b/src/styles/_modal.scss index 62fad511..361aa957 100644 --- a/src/styles/_modal.scss +++ b/src/styles/_modal.scss @@ -399,6 +399,12 @@ $alert-color: #101010; color: $pop-color; border-bottom: 1px solid #424242; padding-left: 20px; + vertical-align: middle; + .flex-box{ + display: flex; + align-items: center; + height: 100%; + } } &:first-child{ td, @@ -470,6 +476,52 @@ $alert-color: #101010; } } +.img-edit-wrap{ + flex: none; + .img-edit-btn{ + display: flex; + align-items: center; + height: 30px; + padding: 0 10px; + font-size: 12px; + font-weight: 400; + color: #101010; + background-color: #fff; + border-radius: 2px; + transition: all .15s ease-in-out; + .img-edit{ + width: 16px; + height: 16px; + background: url(../../public/static/images/canvas/img_edit_ico.svg)no-repeat center; + background-size: cover; + margin-right: 5px; + } + &:hover{ + background-color: #ebebeb; + } + } +} +.img-name-wrap{ + display: flex; + align-items: center; + width: 100%; + margin-left: 10px; + input{ + flex: 1; + + } + .img-check{ + flex: none; + width: 18px; + height: 18px; + margin-left: 5px; + background-repeat: no-repeat; + background-position: center; + background-size: cover; + background-image: url(../../public/static/images/canvas/img_check_fail.svg); + } +} + // 외벽선 그리기 .outline-wrap{ padding: 24px 0; @@ -1801,7 +1853,7 @@ $alert-color: #101010; label{ flex: none; text-align: right; - width: 35px; + width: 38px; font-size: 13px; color: #fff; font-weight: 500; diff --git a/src/styles/_table.scss b/src/styles/_table.scss index d7e1c407..4dcef37a 100644 --- a/src/styles/_table.scss +++ b/src/styles/_table.scss @@ -430,4 +430,82 @@ table{ } } } +} + +// 견적서 테이블 +.esimate-table{ + table{ + table-layout: fixed; + border-collapse: separate; + thead{ + tr{ + th{ + text-align: center; + font-size: 13px; + color: #fff; + font-weight: 600; + padding: 11px 5px; + background-color: #5D6A76; + &:first-child{ + border-radius: 4px 0 0 4px; + } + &:last-child{ + border-radius: 0 4px 4px 0; + } + } + } + } + tbody{ + tr{ + td{ + padding: 5px 10px; + font-size: 13px; + color: #45576F; + font-weight: 400; + border-bottom: 1px solid #ECF0F4; + .form-flex-wrap{ + display: flex; + align-items: center; + .input-wrap, + .select-wrap{ + flex: 1; + } + .btn-area{ + flex: none; + } + .icon-wrap{ + margin-left: auto; + display: flex; + align-items: center; + gap: 5px; + } + } + .tb_ico{ + display: block; + width: 20px; + height: 20px; + background-repeat: no-repeat; + background-position: center; + background-size: cover; + &.change_check{ + background-image: url(../../public/static/images/sub/change_ico.svg); + } + &.file_check{ + background-image: url(../../public/static/images/sub/attachment_ico.svg); + } + &.open_check{ + background-image: url(../../public/static/images/sub/open_ico.svg); + } + } + .grid-tip{ + display: block; + width: 20px; + height: 20px; + background: url(../../public/static/images/sub/click_check_ico.svg)no-repeat center; + background-size: cover; + } + } + } + } + } } \ No newline at end of file From 5be28db1f9cbe912a1ebee93a444e7d206347ab8 Mon Sep 17 00:00:00 2001 From: minsik Date: Tue, 29 Oct 2024 15:50:04 +0900 Subject: [PATCH 17/29] =?UTF-8?q?=EB=8B=A4=EA=B5=AD=EC=96=B4=20=EC=B6=94?= =?UTF-8?q?=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/locales/ja.json | 10 ++++++++++ src/locales/ko.json | 10 ++++++++++ 2 files changed, 20 insertions(+) diff --git a/src/locales/ja.json b/src/locales/ja.json index 834363a3..ea75bf6f 100644 --- a/src/locales/ja.json +++ b/src/locales/ja.json @@ -299,6 +299,14 @@ "contextmenu.auxiliary.cut": "보조선 절삭(JA)", "contextmenu.auxiliary.remove.all": "보조선 전체 삭제(JA)", "contextmenu.line.property.edit": "各辺属性の変更", + "contextmenu.column.move": "열 이동(JA)", + "contextmenu.column.copy": "열 복사(JA)", + "contextmenu.column.remove": "コピー設定", + "contextmenu.column.insert": "열 삽입(JA)", + "contextmenu.row.move": "단 이동(JA)", + "contextmenu.row.copy": "단 복사(JA)", + "contextmenu.row.remove": "단 삭제(JA)", + "contextmenu.row.insert": "단 삽입(JA)", "modal.line.property.edit.info": "属性を変更する辺を選択してください。", "modal.line.property.edit.selected": "選択した値", "contextmenu.flow.direction.edit": "흐름 방향 변경(JA)", @@ -399,6 +407,8 @@ "common.message.writeToConfirm": "作成解除を実行しますか?", "common.message.password.init.success": "パスワード [{0}] に初期化されました。", "common.message.no.edit.save": "この文書は変更できません。", + "common.input.file": "ファイルを読み込む", + "common.input.file.load": "ファイルの追加", "common.require": "必須", "commons.west": "立つ", "commons.east": "ドン", diff --git a/src/locales/ko.json b/src/locales/ko.json index 501aa72d..62336c1c 100644 --- a/src/locales/ko.json +++ b/src/locales/ko.json @@ -304,6 +304,14 @@ "contextmenu.auxiliary.cut": "보조선 절삭", "contextmenu.auxiliary.remove.all": "보조선 전체 삭제", "contextmenu.line.property.edit": "각 변 속성 변경", + "contextmenu.column.move": "열 이동", + "contextmenu.column.copy": "열 복사", + "contextmenu.column.remove": "열 삭제", + "contextmenu.column.insert": "열 삽입", + "contextmenu.row.move": "단 이동", + "contextmenu.row.copy": "단 복사", + "contextmenu.row.remove": "단 삭제", + "contextmenu.row.insert": "단 삽입", "modal.line.property.edit.info": "속성을 변경할 변을 선택해주세요.", "modal.line.property.edit.selected": "선택한 값", "contextmenu.flow.direction.edit": "흐름 방향 변경", @@ -404,6 +412,8 @@ "common.message.writeToConfirm": "작성 해제를 실행하시겠습니까?", "common.message.password.init.success": "비밀번호 [{0}]로 초기화 되었습니다.", "common.message.no.edit.save": "This document cannot be changed.", + "common.input.file": "파일 불러오기", + "common.input.file.load": "불러오기", "common.require": "필수", "commons.west": "서", "commons.east": "동", From 7c41008abedd3022828c8595078a061a928234a0 Mon Sep 17 00:00:00 2001 From: basssy Date: Tue, 29 Oct 2024 16:06:59 +0900 Subject: [PATCH 18/29] =?UTF-8?q?=EB=AC=BC=EA=B1=B4=ED=98=84=ED=99=A9=20->?= =?UTF-8?q?=20=EA=B2=AC=EC=A0=81=EC=84=9C=20=EB=AC=BC=EA=B1=B4=EB=B2=88?= =?UTF-8?q?=ED=98=B8=20=EB=A6=AC=EC=BD=94=EC=9D=BC?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../floor-plan/estimate/[mid]/[pid]/page.jsx | 7 +- src/components/estimate/Estimate.jsx | 67 +++++++++++++++++-- src/components/management/StuffDetail.jsx | 2 +- src/store/floorPlanObjectAtom.js | 2 +- 4 files changed, 69 insertions(+), 9 deletions(-) diff --git a/src/app/floor-plan/estimate/[mid]/[pid]/page.jsx b/src/app/floor-plan/estimate/[mid]/[pid]/page.jsx index 80eae575..6e793bf5 100644 --- a/src/app/floor-plan/estimate/[mid]/[pid]/page.jsx +++ b/src/app/floor-plan/estimate/[mid]/[pid]/page.jsx @@ -1,9 +1,12 @@ import Estimate from '@/components/estimate/Estimate' -export default function EstimatePage() { +export default function EstimatePage({ params }) { + //floor-plan/estimate/mid/pid + //mid :5 견적탭 + //pid : 넘어온 플랜번호 return ( <> - + ) } diff --git a/src/components/estimate/Estimate.jsx b/src/components/estimate/Estimate.jsx index e1a453fe..af51ea74 100644 --- a/src/components/estimate/Estimate.jsx +++ b/src/components/estimate/Estimate.jsx @@ -1,14 +1,59 @@ 'use client' -import { useEffect, useState } from 'react' +import { useEffect, useState, useRef } from 'react' import { useMessage } from '@/hooks/useMessage' import SingleDatePicker from '../common/datepicker/SingleDatePicker' import { useRecoilValue } from 'recoil' import { floorPlanObjectState } from '@/store/floorPlanObjectAtom' +import { Button } from '@nextui-org/react' +import { sessionStore } from '@/store/commonAtom' -export default function Estimate() { +export default function Estimate({ params }) { + const sessionState = useRecoilValue(sessionStore) const { getMessage } = useMessage() const objectRecoil = useRecoilValue(floorPlanObjectState) - console.log('견적서화면이군요', objectRecoil.floorPlanObjectNo) + const [objectNo, setObjectNo] = useState('') + const fileInputRef = useRef(null) + const [files, setFiles] = useState([]) //첨부파일 + const fileId = useRef(0) + + useEffect(() => { + setObjectNo(objectRecoil.floorPlanObjectNo) + }, [objectRecoil]) + + useEffect(() => { + if (objectNo) { + //Q101X278191023001 + console.log('세션정보::::', sessionState) + //상세API호출 + } + }, [objectNo]) + + const handleButtonClick = () => { + fileInputRef.current.click() + } + + const onChangeFiles = (e) => { + // e.preventDefault() + // e.persist() + // console.log('파일::', e.target.files[0]) + // console.log('파일::', e.target.files) + // let selectFiles = [] + // let tempFiles = files + // selectFiles = e.target.files + // for (const file of selectFiles) { + // tempFiles = [ + // ...tempFiles, + // { + // id: fileId.current++, + // object: file, + // }, + // ] + // } + // setFiles(tempFiles) + // const formData = new FormData() + // formData.append('file', e.target.files[0]) + } + return (
    @@ -18,7 +63,9 @@ export default function Estimate() {
    {getMessage('estimate.detail.objectNo')}
    -
    RX524231020006 (Plan No: 1)
    +
    + {objectNo} (Plan No: {params.pid}) +
    {getMessage('estimate.detail.estimateNo')}
    @@ -165,7 +212,17 @@ export default function Estimate() {
    - + +

    Drag file here

    diff --git a/src/components/management/StuffDetail.jsx b/src/components/management/StuffDetail.jsx index ed47ee99..21dc5d17 100644 --- a/src/components/management/StuffDetail.jsx +++ b/src/components/management/StuffDetail.jsx @@ -262,7 +262,7 @@ export default function StuffDetail() { onClick={() => { //mid:5(견적서), /pid:플랜번호 setFloorPlanObjectNo({ floorPlanObjectNo: params.data.objectNo }) - router.push(`/floor-plan/5/${params.data.planNo}`) + router.push(`/floor-plan/estimate/5/${params.data.planNo}`) }} > diff --git a/src/store/floorPlanObjectAtom.js b/src/store/floorPlanObjectAtom.js index 50cdccf4..3acd49a3 100644 --- a/src/store/floorPlanObjectAtom.js +++ b/src/store/floorPlanObjectAtom.js @@ -3,7 +3,7 @@ import { v1 } from 'uuid' export const floorPlanObjectState = atom({ key: `floorPlanObjectState/${v1()}`, default: { - objectNo: '', //물건번호 + floorPlanObjectNo: '', //물건번호 }, dangerouslyAllowMutability: true, }) From ba2c58e38d659e71a4a7ea2b0694c175a55debb2 Mon Sep 17 00:00:00 2001 From: "hyojun.choi" Date: Tue, 29 Oct 2024 17:49:27 +0900 Subject: [PATCH 19/29] =?UTF-8?q?toObject=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/common/common.js | 36 ++++++++++++++++++++++++++++++ src/components/fabric/QLine.js | 6 ----- src/components/fabric/QPolygon.js | 11 --------- src/hooks/useCanvas.js | 20 +++++++++++++++++ src/hooks/usePlan.js | 37 ++----------------------------- src/store/canvasAtom.js | 1 - 6 files changed, 58 insertions(+), 53 deletions(-) diff --git a/src/common/common.js b/src/common/common.js index cf9788be..decf1aad 100644 --- a/src/common/common.js +++ b/src/common/common.js @@ -116,3 +116,39 @@ export const POLYGON_TYPE = { ROOF: 'roof', TRESTLE: 'trestle', } + +export const SAVE_KEY = [ + 'selectable', + 'name', + 'parentId', + 'id', + 'length', + 'idx', + 'direction', + 'parentDirection', + 'lines', + 'points', + 'lockMovementX', + 'lockMovementY', + 'lockRotation', + 'lockScalingX', + 'lockScalingY', + 'opacity', + 'cells', + 'maxX', + 'maxY', + 'minX', + 'minY', + 'x', + 'y', + 'x1', + 'x2', + 'y1', + 'y2', + 'attributes', + 'stickeyPoint', + 'text', + 'pitch', + 'uuid', + 'originText', +] diff --git a/src/components/fabric/QLine.js b/src/components/fabric/QLine.js index 86a96845..781d8395 100644 --- a/src/components/fabric/QLine.js +++ b/src/components/fabric/QLine.js @@ -39,12 +39,6 @@ export const QLine = fabric.util.createClass(fabric.Line, { } }, - toObject: function (propertiesToInclude) { - return fabric.util.object.extend(this.callSuper('toObject', propertiesToInclude), { - type: this.type, - text: this.text, - }) - }, init: function () { this.addLengthText() diff --git a/src/components/fabric/QPolygon.js b/src/components/fabric/QPolygon.js index decc99ae..7cf70d0b 100644 --- a/src/components/fabric/QPolygon.js +++ b/src/components/fabric/QPolygon.js @@ -101,17 +101,6 @@ export const QPolygon = fabric.util.createClass(fabric.Polygon, { this.shape = shape }, - - toObject: function (propertiesToInclude) { - return fabric.util.object.extend(this.callSuper('toObject', propertiesToInclude), { - id: this.id, - type: this.type, - text: this.text, - hips: this.hips, - ridges: this.ridges, - connectRidges: this.connectRidges, - }) - }, init: function () { this.addLengthText() diff --git a/src/hooks/useCanvas.js b/src/hooks/useCanvas.js index 886407b4..5be247e9 100644 --- a/src/hooks/useCanvas.js +++ b/src/hooks/useCanvas.js @@ -13,6 +13,7 @@ import { writeImage } from '@/lib/canvas' import { useCanvasEvent } from '@/hooks/useCanvasEvent' import { useAxios } from '@/hooks/useAxios' import { useFont } from '@/hooks/common/useFont' +import { SAVE_KEY } from '@/common/common' export function useCanvas(id) { const [canvas, setCanvas] = useRecoilState(canvasState) @@ -103,6 +104,25 @@ export function useCanvas(id) { fabric.Object.prototype.cornerStyle = 'rect' fabric.Object.prototype.cornerStrokeColor = '#2BEBC8' fabric.Object.prototype.cornerSize = 6 + + fabric.Line.prototype.toObject = function (propertiesToInclude) { + let source = {} + for (let key in this) { + if (typeof this[key] !== 'function' && SAVE_KEY.includes(key)) { + source.key = this[key] + } + } + return fabric.util.object.extend(this.callSuper('toObject', propertiesToInclude), source) + } + fabric.Polygon.prototype.toObject = function (propertiesToInclude) { + let source = {} + for (let key in this) { + if (typeof this[key] !== 'function' && SAVE_KEY.includes(key)) { + source.key = this[key] + } + } + return fabric.util.object.extend(this.callSuper('toObject', propertiesToInclude), source) + } fabric.QLine = QLine fabric.QPolygon = QPolygon QPolygon.prototype.canvas = canvas diff --git a/src/hooks/usePlan.js b/src/hooks/usePlan.js index 1cced0f0..ee3439f2 100644 --- a/src/hooks/usePlan.js +++ b/src/hooks/usePlan.js @@ -5,6 +5,7 @@ import { canvasState, currentCanvasPlanState, initCanvasPlansState, plansState, import { useAxios } from '@/hooks/useAxios' import { useMessage } from '@/hooks/useMessage' import { useSwal } from '@/hooks/useSwal' +import { SAVE_KEY } from '@/common/common' export function usePlan() { const [planNum, setPlanNum] = useState(0) @@ -33,41 +34,7 @@ export function usePlan() { } const addCanvas = () => { - const objs = canvas?.toJSON([ - 'selectable', - 'name', - 'parentId', - 'id', - 'length', - 'idx', - 'direction', - 'parentDirection', - 'lines', - 'points', - 'lockMovementX', - 'lockMovementY', - 'lockRotation', - 'lockScalingX', - 'lockScalingY', - 'opacity', - 'cells', - 'maxX', - 'maxY', - 'minX', - 'minY', - 'x', - 'y', - 'x1', - 'x2', - 'y1', - 'y2', - 'attributes', - 'stickeyPoint', - 'text', - 'pitch', - 'uuid', - 'originText', - ]) + const objs = canvas?.toJSON(SAVE_KEY) const str = JSON.stringify(objs) diff --git a/src/store/canvasAtom.js b/src/store/canvasAtom.js index bdce5876..0242a7b2 100644 --- a/src/store/canvasAtom.js +++ b/src/store/canvasAtom.js @@ -323,7 +323,6 @@ export const pitchSelector = selector({ set: ({ get, set }, newValue) => { const basicSettingStateValue = get(basicSettingState) const roofAngleSet = basicSettingStateValue.roofAngleSet - console.log(newValue) if (roofAngleSet === 'slope') { set(globalPitchState, newValue) } else { From ed90f71908380dd0805da7499dcea07acf173b27 Mon Sep 17 00:00:00 2001 From: basssy Date: Tue, 29 Oct 2024 17:56:24 +0900 Subject: [PATCH 20/29] =?UTF-8?q?=EC=83=81=EB=8B=A8=20=EB=A9=94=EB=89=B4?= =?UTF-8?q?=20=EB=AA=85=20/=20=EC=9D=B4=EB=8F=99=EA=B2=BD=EB=A1=9C=20?= =?UTF-8?q?=EB=B3=80=EA=B2=BD=20=EB=AC=BC=EA=B1=B4=ED=98=84=ED=99=A9=20?= =?UTF-8?q?=EB=AA=A9=EB=A1=9D=ED=99=94=EB=A9=B4=20=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/header/Header.jsx | 4 +- src/components/management/Stuff.jsx | 33 ++--- src/components/management/StuffSubHeader.jsx | 128 ++++++++++++------- src/locales/ja.json | 6 +- src/locales/ko.json | 6 +- 5 files changed, 105 insertions(+), 72 deletions(-) diff --git a/src/components/header/Header.jsx b/src/components/header/Header.jsx index c12d237e..29cec36b 100644 --- a/src/components/header/Header.jsx +++ b/src/components/header/Header.jsx @@ -89,8 +89,8 @@ export default function Header(props) { name: 'header.menus.management', url: '', children: [ - { id: 3, name: 'header.menus.management.stuff', url: '/management/stuff', children: [] }, - { id: 4, name: 'header.menus.management.plan', url: '/floor-plan', children: [] }, + { id: 3, name: 'header.menus.management.newStuff', url: '/management/stuff/tempdetail', children: [] }, + { id: 4, name: 'header.menus.management.stuffList', url: '/management/stuff', children: [] }, ], }, { diff --git a/src/components/management/Stuff.jsx b/src/components/management/Stuff.jsx index dfd4f94b..5a1bee40 100644 --- a/src/components/management/Stuff.jsx +++ b/src/components/management/Stuff.jsx @@ -71,7 +71,7 @@ export default function Stuff() { // headerCheckboxSelectionCurrentPageOnly: true, //페이징시 현재 페이지만 체크되도록 // checkboxSelection: true, // showDisabledCheckboxes: true, - cellStyle: { textAlign: 'center' }, + cellStyle: { justifyContent: 'center' }, valueFormatter: function (params) { if (params.value) { return dayjs(params?.value).format('YYYY.MM.DD HH:mm:ss') @@ -85,31 +85,32 @@ export default function Stuff() { minWidth: 230, headerName: getMessage('stuff.gridHeader.objectNo'), cellRenderer: function (params) { + let objectNo = params.value.substring(0, 1) if (params.data.objectNo) { return ( -
    - - {params.value} +
    + {params.value.toLocaleString()} + {objectNo === 'R' && ( + + )}
    ) } }, cellRendererParams: { - onPress: copyNo, + onClick: copyNo, }, }, { field: 'planTotCnt', headerName: getMessage('stuff.gridHeader.planTotCnt'), - cellStyle: { textAlign: 'right' }, + cellStyle: { justifyContent: 'center' }, }, { field: 'objectName', headerName: getMessage('stuff.gridHeader.objectName'), cellStyle: { textAlign: 'left' } }, { @@ -131,7 +132,7 @@ export default function Stuff() { return null } }, - cellStyle: { textAlign: 'center' }, + cellStyle: { justifyContent: 'center' }, }, { field: 'createDatetime', @@ -143,7 +144,7 @@ export default function Stuff() { return null } }, - cellStyle: { textAlign: 'center' }, + cellStyle: { justifyContent: 'center' }, }, ], gridCount: 0, diff --git a/src/components/management/StuffSubHeader.jsx b/src/components/management/StuffSubHeader.jsx index f1103143..12a51394 100644 --- a/src/components/management/StuffSubHeader.jsx +++ b/src/components/management/StuffSubHeader.jsx @@ -25,58 +25,90 @@ export default function StuffSubHeader({ type }) { const moveFloorPlan = () => { setFloorPlanObjectNo({ floorPlanObjectNo: objectNo }) - router.push('/floor-plan') + //상단 헤더에서 이동할땐 무조건 첫번째 플랜으로 + router.push('/floor-plan/estimate/5/1') } return ( -
    -
    - {type === 'list' && ( - -

    {getMessage('header.menus.management')}

    - - )} - {type === 'temp' && ( -
      -
    • - - {getMessage('stuff.temp.subTitle')} + <> +
      +
      + {type === 'list' && ( + <> + +

      {getMessage('header.menus.management')}

      -
    • -
    - )} - {type === 'detail' && ( - - )} - - {type !== 'detail' && ( -
      -
    • - - react - -
    • -
    • - {getMessage('header.menus.management')} -
    • -
    • - {getMessage('header.menus.management.stuff')} -
    • -
    - )} +
      +
    • + + react + +
    • +
    • + {getMessage('header.menus.management')} +
    • +
    • + {getMessage('header.menus.management.stuffList')} +
    • +
    + + )} + {type === 'temp' && ( + <> +
      +
    • + + {getMessage('stuff.temp.subTitle')} + +
    • +
    +
      +
    • + + react + +
    • +
    • + {getMessage('header.menus.management')} +
    • +
    • + {getMessage('header.menus.management.newStuff')} +
    • +
    + + )} + {type === 'detail' && ( + <> + +
      +
    • + + react + +
    • +
    • + {getMessage('header.menus.management')} +
    • +
    • + {getMessage('header.menus.management.newStuff')} +
    • +
    + + )} +
    -
    + ) } diff --git a/src/locales/ja.json b/src/locales/ja.json index ea75bf6f..a75b6967 100644 --- a/src/locales/ja.json +++ b/src/locales/ja.json @@ -3,8 +3,8 @@ "welcome": "환영합니다. {0}님", "header.menus.home": "ホームへv", "header.menus.management": "物品及び図面管理", - "header.menus.management.stuff": "新規物件登録", - "header.menus.management.plan": "モノ/図面管理", + "header.menus.management.newStuff": "新規 物件 登録", + "header.menus.management.stuffList": "物件の状況", "header.menus.community": "コミュニティ", "header.menus.community.notice": "お知らせ", "header.menus.community.faq": "FAQ", @@ -606,7 +606,7 @@ "stuff.planReqPopup.search.schDateGbnR": "受付日", "stuff.planReqPopup.error.message1": "設計依頼を選択してください。", "stuff.search.title": "物件状況", - "stuff.search.btn1": "物件登録", + "stuff.search.btn1": "新規 物件 登録", "stuff.search.btn2": "照会", "stuff.search.btn3": "初期化", "stuff.search.schObjectNo": "品番", diff --git a/src/locales/ko.json b/src/locales/ko.json index 62336c1c..19dedd58 100644 --- a/src/locales/ko.json +++ b/src/locales/ko.json @@ -3,8 +3,8 @@ "welcome": "환영합니다. {0}님", "header.menus.home": "Home", "header.menus.management": "물건 및 도면 관리", - "header.menus.management.stuff": "신규 물건 등록", - "header.menus.management.plan": "사물/도면 관리", + "header.menus.management.newStuff": "신규 물건 등록", + "header.menus.management.stuffList": "물건 현황", "header.menus.community": "커뮤니티", "header.menus.community.notice": "공지", "header.menus.community.faq": "FAQ", @@ -611,7 +611,7 @@ "stuff.planReqPopup.search.schDateGbnR": "접수일", "stuff.planReqPopup.error.message1": "설계의뢰를 선택해주세요.", "stuff.search.title": "물건현황", - "stuff.search.btn1": "신규등록", + "stuff.search.btn1": "신규 물건 등록", "stuff.search.btn2": "조회", "stuff.search.btn3": "초기화", "stuff.search.schObjectNo": "물건번호", From c051291c6873fb16b367dbb808d29e29565cb533 Mon Sep 17 00:00:00 2001 From: "hyojun.choi" Date: Tue, 29 Oct 2024 18:21:20 +0900 Subject: [PATCH 21/29] =?UTF-8?q?=EB=B3=B5=EA=B5=AC=ED=95=A0=20=EC=98=A4?= =?UTF-8?q?=EB=B8=8C=EC=A0=9D=ED=8A=B8=20=ED=83=80=EC=9E=85=20common=20js?= =?UTF-8?q?=EB=A1=9C=20=EC=9D=B4=EB=8F=99?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/common/common.js | 10 ++++++++++ src/hooks/useCanvas.js | 29 ++++++++++++----------------- 2 files changed, 22 insertions(+), 17 deletions(-) diff --git a/src/common/common.js b/src/common/common.js index decf1aad..a0204047 100644 --- a/src/common/common.js +++ b/src/common/common.js @@ -1,3 +1,5 @@ +import { fabric } from 'fabric' + export const MENU = { PLAN_DRAWING: 'planDrawing', INITIAL_CANVAS_SETTING: 'initialCanvasSetting', // 배치면 초기설정 @@ -152,3 +154,11 @@ export const SAVE_KEY = [ 'uuid', 'originText', ] + +export const OBJECT_PROTOTYPE = [ + fabric.Line.prototype, + fabric.Polygon.prototype, + fabric.Text.prototype, + fabric.IText.prototype, + fabric.Triangle.prototype, +] diff --git a/src/hooks/useCanvas.js b/src/hooks/useCanvas.js index 5be247e9..6ffb03fc 100644 --- a/src/hooks/useCanvas.js +++ b/src/hooks/useCanvas.js @@ -13,7 +13,7 @@ import { writeImage } from '@/lib/canvas' import { useCanvasEvent } from '@/hooks/useCanvasEvent' import { useAxios } from '@/hooks/useAxios' import { useFont } from '@/hooks/common/useFont' -import { SAVE_KEY } from '@/common/common' +import { OBJECT_PROTOTYPE, RELOAD_TYPE_PROTOTYPE, SAVE_KEY } from '@/common/common' export function useCanvas(id) { const [canvas, setCanvas] = useRecoilState(canvasState) @@ -105,24 +105,19 @@ export function useCanvas(id) { fabric.Object.prototype.cornerStrokeColor = '#2BEBC8' fabric.Object.prototype.cornerSize = 6 - fabric.Line.prototype.toObject = function (propertiesToInclude) { - let source = {} - for (let key in this) { - if (typeof this[key] !== 'function' && SAVE_KEY.includes(key)) { - source.key = this[key] + // 해당 오브젝트 타입의 경우 저장한 값 그대로 불러와야함 + OBJECT_PROTOTYPE.forEach((type) => { + type.toObject = function (propertiesToInclude) { + let source = {} + for (let key in this) { + if (typeof this[key] !== 'function' && SAVE_KEY.includes(key)) { + source.key = this[key] + } } + return fabric.util.object.extend(this.callSuper('toObject', propertiesToInclude), source) } - return fabric.util.object.extend(this.callSuper('toObject', propertiesToInclude), source) - } - fabric.Polygon.prototype.toObject = function (propertiesToInclude) { - let source = {} - for (let key in this) { - if (typeof this[key] !== 'function' && SAVE_KEY.includes(key)) { - source.key = this[key] - } - } - return fabric.util.object.extend(this.callSuper('toObject', propertiesToInclude), source) - } + }) + fabric.QLine = QLine fabric.QPolygon = QPolygon QPolygon.prototype.canvas = canvas From 9a70b02857a60a8eebca655c13dd868038e8653a Mon Sep 17 00:00:00 2001 From: changkyu choi Date: Tue, 29 Oct 2024 18:35:09 +0900 Subject: [PATCH 22/29] =?UTF-8?q?Canvas=20=EC=84=A4=EC=A0=95=20=EC=9D=B4?= =?UTF-8?q?=EB=AF=B8=EC=A7=80=ED=91=9C=EC=8B=9C=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../floor-plan/modal/grid/DotLineGrid.jsx | 8 +- .../modal/setting01/FirstOption.jsx | 197 ------------------ .../modal/setting01/SecondOption.jsx | 114 ---------- src/hooks/option/useCanvasSetting.js | 51 ++++- src/store/settingAtom.js | 13 +- 5 files changed, 59 insertions(+), 324 deletions(-) diff --git a/src/components/floor-plan/modal/grid/DotLineGrid.jsx b/src/components/floor-plan/modal/grid/DotLineGrid.jsx index 4cd63b1f..520d56dd 100644 --- a/src/components/floor-plan/modal/grid/DotLineGrid.jsx +++ b/src/components/floor-plan/modal/grid/DotLineGrid.jsx @@ -71,7 +71,7 @@ export default function DotLineGrid(props) { // 데이터를 최초 한 번만 조회 useEffect(() => { console.log('DotLineGrid useEffect 실행') - // fetchGridSettings() + fetchGridSettings() }, [objectNo]) const HandleClickClose = () => { @@ -100,9 +100,9 @@ export default function DotLineGrid(props) { const patternData = { INTERVAL: { type: res.gridType, - horizontalInterval: res.gridHorizon, - verticalInterval: res.gridVertical, - ratioInterval: res.gridRatio, + horizontalInterval: res.gridHorizon * 10, + verticalInterval: res.gridVertical * 10, + ratioInterval: res.gridRatio * 10, }, dimension: res.gridDimen, DOT: res.dotGridDisplay, diff --git a/src/components/floor-plan/modal/setting01/FirstOption.jsx b/src/components/floor-plan/modal/setting01/FirstOption.jsx index db721dd5..cb3253b3 100644 --- a/src/components/floor-plan/modal/setting01/FirstOption.jsx +++ b/src/components/floor-plan/modal/setting01/FirstOption.jsx @@ -2,216 +2,19 @@ import React, { useEffect, useState } from 'react' import { useCanvasSetting } from '@/hooks/option/useCanvasSetting' import { useMessage } from '@/hooks/useMessage' -//import { useRecoilState, useRecoilValue } from 'recoil' -//import { settingModalSecondOptionsState } from '@/store/settingAtom' -//import { useAxios } from '@/hooks/useAxios' -//import { useSwal } from '@/hooks/useSwal' -//import { setSurfaceShapePattern } from '@/util/canvas-util' -//import { canvasState } from '@/store/canvasAtom' -//import { POLYGON_TYPE } from '@/common/common' - export default function FirstOption() { const [objectNo, setObjectNo] = useState('test123240912001') // 이후 삭제 필요 const { settingModalFirstOptions, setSettingModalFirstOptions } = useCanvasSetting() const { settingModalSecondOptions, setSettingModalSecondOptions } = useCanvasSetting() const { getMessage } = useMessage() - //const [settingModalSecondOptions, setSettingModalSecondOptions] = useRecoilState(settingModalSecondOptionsState) - //const { option1, option2, dimensionDisplay } = settingModalFirstOptions - //const { option3, option4 } = settingModalSecondOptions - //const { get, post } = useAxios() - //const { swalFire } = useSwal() - //const canvas = useRecoilValue(canvasState) - const { fetchSettings, frontSettings, onClickOption } = useCanvasSetting() // 데이터를 최초 한 번만 조회 useEffect(() => { console.log('FirstOption useEffect 실행') - //fetchSettings() - //frontSettings() }, [objectNo]) - // // Canvas Setting 조회 및 초기화 - // const fetchSettings = async () => { - // try { - // const res = await get({ url: `/api/canvas-management/canvas-settings/by-object/${objectNo}` }) - // const optionData1 = settingModalFirstOptions.option1.map((item) => ({ ...item, selected: res[item.column] })) - // const optionData2 = settingModalFirstOptions.option2.map((item) => ({ ...item, selected: res[item.column] })) - // const optionData5 = settingModalFirstOptions.dimensionDisplay.map((item) => ({ ...item, selected: res[item.column] })) - // const optionData3 = settingModalSecondOptions.option3.map((item) => ({ ...item })) - // const optionData4 = settingModalSecondOptions.option4.map((item) => ({ ...item, selected: res[item.column] })) - - // // 데이터 설정 - // setSettingModalFirstOptions({ - // option1: optionData1, - // option2: optionData2, - // dimensionDisplay: optionData5, - // }) - - // setSettingModalSecondOptions({ - // option3: optionData3, - // option4: optionData4, - // }) - // } catch (error) { - // console.error('Data fetching error:', error) - // } - // } - - // const onClickOption = async (option) => { - // option.selected = !option.selected - - // setSettingModalFirstOptions({ option1, option2, dimensionDisplay }) - // setSettingModalSecondOptions({ option3, option4 }) - - // try { - // // 서버에 전송할 데이터 - // const dataToSend = { - // firstOption1: option1.map((item) => ({ - // column: item.column, - // selected: item.selected, - // })), - // firstOption2: option2.map((item) => ({ - // column: item.column, - // selected: item.selected, - // })), - // firstOption3: dimensionDisplay.map((item) => ({ - // column: item.column, - // selected: item.selected, - // })), - // // secondOption1: secondOptions[0].option1.map((item) => ({ - // // name: item.id, - // // name: item.name, - // // // 필요한 경우 데이터 항목 추가 - // // })), - // secondOption2: option4.map((item) => ({ - // column: item.column, - // selected: item.selected, - // })), - // } - - // const patternData = { - // objectNo, - // //디스플레이 설정(다중) - // allocDisplay: dataToSend.firstOption1[0].selected, - // outlineDisplay: dataToSend.firstOption1[1].selected, - // gridDisplay: dataToSend.firstOption1[2].selected, - // lineDisplay: dataToSend.firstOption1[3].selected, - // wordDisplay: dataToSend.firstOption1[4].selected, - // circuitNumDisplay: dataToSend.firstOption1[5].selected, - // flowDisplay: dataToSend.firstOption1[6].selected, - // trestleDisplay: dataToSend.firstOption1[7].selected, - // totalDisplay: dataToSend.firstOption1[8].selected, - // //차수 표시(다건) - // corridorDimension: dataToSend.firstOption3[0].selected, - // realDimension: dataToSend.firstOption3[1].selected, - // noneDimension: dataToSend.firstOption3[2].selected, - // //화면 표시(다중) - // onlyBorder: dataToSend.firstOption2[0].selected, - // lineHatch: dataToSend.firstOption2[1].selected, - // allPainted: dataToSend.firstOption2[2].selected, - // //흡착범위 설정(단건) - // adsorpRangeSmall: dataToSend.secondOption2[0].selected, - // adsorpRangeSmallSemi: dataToSend.secondOption2[1].selected, - // adsorpRangeMedium: dataToSend.secondOption2[2].selected, - // adsorpRangeLarge: dataToSend.secondOption2[3].selected, - // } - - // // HTTP POST 요청 보내기 - // await post({ url: `/api/canvas-management/canvas-settings`, data: patternData }).then((res) => { - // swalFire({ text: getMessage(res.returnMessage) }) - // }) - // } catch (error) { - // swalFire({ text: getMessage(res.returnMessage), icon: 'error' }) - // } - // } - - // const onClickOnlyOne = async (item) => { - // //화면 표시 - // if (item.column === 'onlyBorder' || item.column === 'lineHatch' || item.column === 'allPainted') { - // const options2 = settingModalFirstOptions?.option2.map((option2) => { - // option2.selected = option2.id === item.id - // return option2 - // }) - - // const polygons = canvas?.getObjects().filter((obj) => obj.name === POLYGON_TYPE.ROOF) - - // polygons.forEach((polygon) => { - // setSurfaceShapePattern(polygon, item.column) - // }) - - // //치수 표시 - // } else { - // const options = settingModalFirstOptions?.dimensionDisplay.map((option) => { - // option.selected = option.id === item.id - // return option - // }) - // } - - // setSettingModalFirstOptions({ option1, option2, dimensionDisplay }) - - // try { - // // 서버에 전송할 데이터 - // const dataToSend = { - // firstOption1: option1.map((item) => ({ - // column: item.column, - // selected: item.selected, - // })), - // firstOption2: option2.map((item) => ({ - // column: item.column, - // selected: item.selected, - // })), - // firstOption3: dimensionDisplay.map((item) => ({ - // column: item.column, - // selected: item.selected, - // })), - // // secondOption1: secondOptions[0].option1.map((item) => ({ - // // name: item.id, - // // name: item.name, - // // // 필요한 경우 데이터 항목 추가 - // // })), - // secondOption2: option4.map((item) => ({ - // column: item.column, - // selected: item.selected, - // })), - // } - - // const patternData = { - // objectNo, - // //디스플레이 설정(다중) - // allocDisplay: dataToSend.firstOption1[0].selected, - // outlineDisplay: dataToSend.firstOption1[1].selected, - // gridDisplay: dataToSend.firstOption1[2].selected, - // lineDisplay: dataToSend.firstOption1[3].selected, - // wordDisplay: dataToSend.firstOption1[4].selected, - // circuitNumDisplay: dataToSend.firstOption1[5].selected, - // flowDisplay: dataToSend.firstOption1[6].selected, - // trestleDisplay: dataToSend.firstOption1[7].selected, - // totalDisplay: dataToSend.firstOption1[8].selected, - // //차수 표시(다건) - // corridorDimension: dataToSend.firstOption3[0].selected, - // realDimension: dataToSend.firstOption3[1].selected, - // noneDimension: dataToSend.firstOption3[2].selected, - // //화면 표시(다중) - // onlyBorder: dataToSend.firstOption2[0].selected, - // lineHatch: dataToSend.firstOption2[1].selected, - // allPainted: dataToSend.firstOption2[2].selected, - // //흡착범위 설정(단건) - // adsorpRangeSmall: dataToSend.secondOption2[0].selected, - // adsorpRangeSmallSemi: dataToSend.secondOption2[1].selected, - // adsorpRangeMedium: dataToSend.secondOption2[2].selected, - // adsorpRangeLarge: dataToSend.secondOption2[3].selected, - // } - - // // HTTP POST 요청 보내기 - // await post({ url: `/api/canvas-management/canvas-settings`, data: patternData }).then((res) => { - // swalFire({ text: getMessage(res.returnMessage) }) - // }) - // } catch (error) { - // swalFire({ text: getMessage(res.returnMessage), icon: 'error' }) - // } - // } - return ( <>
    diff --git a/src/components/floor-plan/modal/setting01/SecondOption.jsx b/src/components/floor-plan/modal/setting01/SecondOption.jsx index ff8d61db..c09dfdc1 100644 --- a/src/components/floor-plan/modal/setting01/SecondOption.jsx +++ b/src/components/floor-plan/modal/setting01/SecondOption.jsx @@ -1,5 +1,4 @@ import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil' -//import { settingModalFirstOptionsState, settingModalSecondOptionsState } from '@/store/settingAtom' import { useMessage } from '@/hooks/useMessage' import React, { useEffect, useState } from 'react' import DimensionLineSetting from '@/components/floor-plan/modal/setting01/dimensionLine/DimensionLineSetting' @@ -10,20 +9,7 @@ import PlanSizeSetting from '@/components/floor-plan/modal/setting01/planSize/Pl import { dimensionLineSettingsState } from '@/store/commonUtilsAtom' import { useCanvasSetting } from '@/hooks/option/useCanvasSetting' -//import { useAxios } from '@/hooks/useAxios' -//import { useSwal } from '@/hooks/useSwal' -// import { adsorptionPointModeState, adsorptionRangeState } from '@/store/canvasAtom' - export default function SecondOption() { - //const [settingModalFirstOptions, setSettingModalFirstOptions] = useRecoilState(settingModalFirstOptionsState) - //const [settingModalSecondOptions, setSettingModalSecondOptions] = useRecoilState(settingModalSecondOptionsState) - // const [adsorptionPointMode, setAdsorptionPointMode] = useRecoilState(adsorptionPointModeState) - // const setAdsorptionRange = useSetRecoilState(adsorptionRangeState) - // const { option1, option2, dimensionDisplay } = settingModalFirstOptions - // const { option3, option4 } = settingModalSecondOptions - // const { get, post } = useAxios() - // const { swalFire } = useSwal() - const { getMessage } = useMessage() const { addPopup, closePopup, closePopups } = usePopup() const [showFontSettingModal, setShowFontSettingModal] = useState(false) @@ -43,106 +29,6 @@ export default function SecondOption() { //fetchSettings() }, [objectNo]) - // Canvas Setting 조회 및 초기화 - // const fetchSettings = async () => { - // try { - // const res = await get({ url: `/api/canvas-management/canvas-settings/by-object/${objectNo}` }) - // const optionData1 = settingModalFirstOptions.option1.map((item) => ({ ...item, selected: res[item.column] })) - // const optionData2 = settingModalFirstOptions.option2.map((item) => ({ ...item, selected: res[item.column] })) - // const optionData5 = settingModalFirstOptions.dimensionDisplay.map((item) => ({ ...item, selected: res[item.column] })) - // const optionData3 = settingModalSecondOptions.option3.map((item) => ({ ...item })) - // const optionData4 = settingModalSecondOptions.option4.map((item) => ({ ...item, selected: res[item.column] })) - - // setSettingModalFirstOptions({ - // option1: optionData1, - // option2: optionData2, - // dimensionDisplay: optionData5, - // }) - // setSettingModalSecondOptions({ - // option3: optionData3, - // option4: optionData4, - // }) - // } catch (error) { - // console.error('Data fetching error:', error) - // } - // } - - // const onClickOption = async (option) => { - // // option4에서 한 개만 선택 가능하도록 처리 - // const updatedOption4 = option4.map((item) => - // item.id === option.id - // ? { ...item, selected: true } - // : { - // ...item, - // selected: false, - // }, - // ) - - // setSettingModalFirstOptions({ option1, option2, dimensionDisplay }) - // setSettingModalSecondOptions({ option3, option4: updatedOption4 }) - - // try { - // // 서버에 전송할 데이터 - // const dataToSend = { - // firstOption1: option1.map((item) => ({ - // column: item.column, - // selected: item.selected, - // })), - // firstOption2: option2.map((item) => ({ - // column: item.column, - // selected: item.selected, - // })), - // firstOption3: dimensionDisplay.map((item) => ({ - // column: item.column, - // selected: item.selected, - // })), - // // secondOption1: secondOptions[0].option3.map((item) => ({ - // // name: item.id, - // // name: item.name, - // // // 필요한 경우 데이터 항목 추가 - // // })), - // secondOption2: updatedOption4.map((item) => ({ - // column: item.column, - // selected: item.selected, - // })), - // } - // const patternData = { - // objectNo, - // //디스플레이 설정(다중) - // allocDisplay: dataToSend.firstOption1[0].selected, - // outlineDisplay: dataToSend.firstOption1[1].selected, - // gridDisplay: dataToSend.firstOption1[2].selected, - // lineDisplay: dataToSend.firstOption1[3].selected, - // wordDisplay: dataToSend.firstOption1[4].selected, - // circuitNumDisplay: dataToSend.firstOption1[5].selected, - // flowDisplay: dataToSend.firstOption1[6].selected, - // trestleDisplay: dataToSend.firstOption1[7].selected, - // totalDisplay: dataToSend.firstOption1[8].selected, - // //차수 표시(다건) - // corridorDimension: dataToSend.firstOption3[0].selected, - // realDimension: dataToSend.firstOption3[1].selected, - // noneDimension: dataToSend.firstOption3[2].selected, - // //화면 표시(다중) - // onlyBorder: dataToSend.firstOption2[0].selected, - // lineHatch: dataToSend.firstOption2[1].selected, - // allPainted: dataToSend.firstOption2[2].selected, - // //흡착범위 설정(단건) - // adsorpRangeSmall: dataToSend.secondOption2[0].selected, - // adsorpRangeSmallSemi: dataToSend.secondOption2[1].selected, - // adsorpRangeMedium: dataToSend.secondOption2[2].selected, - // adsorpRangeLarge: dataToSend.secondOption2[3].selected, - // } - - // // HTTP POST 요청 보내기 - // await post({ url: `/api/canvas-management/canvas-settings`, data: patternData }).then((res) => { - // swalFire({ text: getMessage(res.returnMessage) }) - // }) - // } catch (error) { - // swalFire({ text: getMessage(res.returnMessage), icon: 'error' }) - // } - // setAdsorptionRange(option.range) - // } - let dimensionId = null let fontId = null let planSizeId = null diff --git a/src/hooks/option/useCanvasSetting.js b/src/hooks/option/useCanvasSetting.js index 2856b5c2..0f87e156 100644 --- a/src/hooks/option/useCanvasSetting.js +++ b/src/hooks/option/useCanvasSetting.js @@ -39,18 +39,29 @@ export function useCanvasSetting() { //fetchSettings() //onClickOption() //fetchSettings() + }, [adsorptionPointMode]) + + useEffect(() => { + console.log('useCanvasSetting useEffect 실행3') + //fetchSettings() + //onClickOption() + //fetchSettings() }, [settingModalFirstOptions, settingModalSecondOptions]) const fetchSettings = async () => { try { const res = await get({ url: `/api/canvas-management/canvas-settings/by-object/${objectNo}` }) + console.log('res', res) const optionData1 = settingModalFirstOptions.option1.map((item) => ({ ...item, selected: res[item.column] })) const optionData2 = settingModalFirstOptions.option2.map((item) => ({ ...item, selected: res[item.column] })) const optionData3 = settingModalSecondOptions.option3.map((item) => ({ ...item })) const optionData4 = settingModalSecondOptions.option4.map((item) => ({ ...item, selected: res[item.column] })) - const optionData5 = settingModalFirstOptions.dimensionDisplay.map((item) => ({ - ...item, - })) + const optionData5 = settingModalFirstOptions.dimensionDisplay.map((item) => ({ ...item })) + + const patternData = { + adsorpPoint: res.adsorpPoint, + } + // 데이터 설정 setSettingModalFirstOptions({ option1: optionData1, @@ -61,6 +72,10 @@ export function useCanvasSetting() { option3: optionData3, option4: optionData4, }) + + setAdsorptionPointMode(patternData.adsorpPoint) + + console.log('adsorptionPointMode', adsorptionPointMode) } catch (error) { console.error('Data fetching error:', error) } @@ -110,8 +125,23 @@ export function useCanvasSetting() { setSettingModalSecondOptions({ option3, option4: updatedOption4 }) + //흡착점 ON / OFF + } else if (item === 'adsorpPoint') { + console.log('흡착점 ON / OFF ', item) + const options2 = settingModalFirstOptions?.option2.map((option2) => { + option2.selected = option2.id === item.id + return option2 + }) + + const polygons = canvas?.getObjects().filter((obj) => obj.name === POLYGON_TYPE.ROOF) + + polygons.forEach((polygon) => { + setSurfaceShapePattern(polygon, item.column) + }) + //디스플레이 설정(다 건 선택) } else { + //console.log('디스플레이 설정1 ', item.column) console.log('디스플레이 설정 ', item) item.selected = !item.selected } @@ -155,7 +185,8 @@ export function useCanvasSetting() { circuitNumDisplay: dataToSend.firstOption1[5].selected, flowDisplay: dataToSend.firstOption1[6].selected, trestleDisplay: dataToSend.firstOption1[7].selected, - totalDisplay: dataToSend.firstOption1[8].selected, + imageDisplay: dataToSend.firstOption1[8].selected, + totalDisplay: dataToSend.firstOption1[9].selected, //차수 표시(단 건) corridorDimension: dataToSend.firstOption3[0].selected, realDimension: dataToSend.firstOption3[1].selected, @@ -169,6 +200,8 @@ export function useCanvasSetting() { adsorpRangeSmallSemi: dataToSend.secondOption2[1].selected, adsorpRangeMedium: dataToSend.secondOption2[2].selected, adsorpRangeLarge: dataToSend.secondOption2[3].selected, + //흡착점 ON/OFF + adsorpPoint: adsorptionPointMode, } console.log('patternData ', patternData) @@ -199,6 +232,7 @@ export function useCanvasSetting() { // 'circuitNumDisplay' 회로번호 표시 // 'flowDisplay' 흐름방향 표시 'arrow' // 'trestleDisplay' 가대 표시 + // 'imageDisplay' 이미지 표시 // 'totalDisplay' 집계표 표시 let optionName //옵션명 @@ -230,9 +264,12 @@ export function useCanvasSetting() { case 'trestleDisplay': //가대 표시 optionName = ['8'] break - case 'totalDisplay': //집계표 표시 + case 'imageDisplay': //이미지 표시 optionName = ['9'] break + case 'totalDisplay': //집계표 표시 + optionName = ['10'] + break } // 표시 선택 상태(true/false) optionSelected = option1[i].selected @@ -259,10 +296,10 @@ export function useCanvasSetting() { setSettingModalFirstOptions, settingModalSecondOptions, setSettingModalSecondOptions, + adsorptionPointMode, + setAdsorptionPointMode, fetchSettings, onClickOption, frontSettings, - adsorptionPointMode, - setAdsorptionPointMode, } } diff --git a/src/store/settingAtom.js b/src/store/settingAtom.js index 4cab929c..9679d2d7 100644 --- a/src/store/settingAtom.js +++ b/src/store/settingAtom.js @@ -12,8 +12,8 @@ export const settingModalFirstOptionsState = atom({ { id: 6, column: 'circuitNumDisplay', name: 'modal.canvas.setting.first.option.circuit.num', selected: false }, { id: 7, column: 'flowDisplay', name: 'modal.canvas.setting.first.option.flow', selected: false }, { id: 8, column: 'trestleDisplay', name: 'modal.canvas.setting.first.option.trestle', selected: false }, - { id: 10, column: 'imageDisplay', name: 'modal.canvas.setting.first.option.image', selected: false }, - { id: 9, column: 'totalDisplay', name: 'modal.canvas.setting.first.option.total', selected: false }, + { id: 9, column: 'imageDisplay', name: 'modal.canvas.setting.first.option.image', selected: false }, + { id: 10, column: 'totalDisplay', name: 'modal.canvas.setting.first.option.total', selected: false }, ], dimensionDisplay: [ { @@ -160,6 +160,15 @@ export const trestleDisplaySelector = selector({ }, }) +// 디스플레이 설정 - 이미지 표시 +export const imageDisplaySelector = selector({ + key: 'imageDisplaySelector', + get: ({ get }) => { + const settingModalFirstOptions = get(settingModalFirstOptionsState) + return settingModalFirstOptions.option1.find((option) => option.column === 'imageDisplay').selected + }, +}) + // 디스플레이 설정 - 집계표 표시 export const totalDisplaySelector = selector({ key: 'totalDisplaySelector', From c3360a8632d456e8e7723ee5d5d610a1fb5482df Mon Sep 17 00:00:00 2001 From: "hyojun.choi" Date: Wed, 30 Oct 2024 09:54:51 +0900 Subject: [PATCH 23/29] =?UTF-8?q?text=20type=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/common/common.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/common/common.js b/src/common/common.js index a0204047..8a7e9041 100644 --- a/src/common/common.js +++ b/src/common/common.js @@ -158,7 +158,7 @@ export const SAVE_KEY = [ export const OBJECT_PROTOTYPE = [ fabric.Line.prototype, fabric.Polygon.prototype, - fabric.Text.prototype, - fabric.IText.prototype, + // fabric.Text.prototype, + // fabric.IText.prototype, fabric.Triangle.prototype, ] From b9b4eae47413192a52aca1350881b94dc69fcae9 Mon Sep 17 00:00:00 2001 From: basssy Date: Wed, 30 Oct 2024 09:57:37 +0900 Subject: [PATCH 24/29] =?UTF-8?q?=EB=AC=BC=EA=B1=B4=ED=98=84=ED=99=A9=20?= =?UTF-8?q?=EC=88=98=EC=A0=95?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/management/StuffDetail.jsx | 29 +++++++++-------------- 1 file changed, 11 insertions(+), 18 deletions(-) diff --git a/src/components/management/StuffDetail.jsx b/src/components/management/StuffDetail.jsx index 21dc5d17..1a4c99ae 100644 --- a/src/components/management/StuffDetail.jsx +++ b/src/components/management/StuffDetail.jsx @@ -22,12 +22,12 @@ import { floorPlanObjectState } from '@/store/floorPlanObjectAtom' export default function StuffDetail() { const setFloorPlanObjectNo = useSetRecoilState(floorPlanObjectState) //견적서 화면용 물건번호리코일 - const inputReceiveUserEl = useRef(null) //담당자ref - const inputObjectNameEl = useRef(null) //물건명ref - const inputZipNoEl = useRef(null) //우편번호ref - const inputAddressEl = useRef(null) //주소ref - const inputVerticalSnowCoverEl = useRef(null) //수직적설량ref - const inputInstallHeightEl = useRef(null) //설치높이ref + // const inputReceiveUserEl = useRef(null) //담당자ref + // const inputObjectNameEl = useRef(null) //물건명ref + // const inputZipNoEl = useRef(null) //우편번호ref + // const inputAddressEl = useRef(null) //주소ref + // const inputVerticalSnowCoverEl = useRef(null) //수직적설량ref + // const inputInstallHeightEl = useRef(null) //설치높이ref //공통코드 const { commonCode, findCommonCode } = useCommonCode() @@ -1183,6 +1183,7 @@ export default function StuffDetail() { return alert(getMessage('stuff.detail.save.valierror2')) } + return await promisePost({ url: '/api/object/save-object', data: params }).then((res) => { if (res.status === 201) { alert(getMessage('stuff.detail.tempSave.message1')) @@ -1268,7 +1269,7 @@ export default function StuffDetail() {
    - +
    @@ -1297,7 +1298,7 @@ export default function StuffDetail() { })} {/* 라디오끝 */}
    - +
    +
    - +
    @@ -1575,7 +1570,6 @@ export default function StuffDetail() { onKeyUp={handleKeyUp} value={form.watch('verticalSnowCover') || ''} {...register('verticalSnowCover')} - ref={inputVerticalSnowCoverEl} />
    cm @@ -1623,7 +1617,6 @@ export default function StuffDetail() { onKeyUp={handleKeyUp} value={form.watch('installHeight') || ''} {...register('installHeight')} - ref={inputInstallHeightEl} />
    m From a44c4bbeb0dd686a5ec4c9926424d02b3cca36a6 Mon Sep 17 00:00:00 2001 From: basssy Date: Wed, 30 Oct 2024 10:00:29 +0900 Subject: [PATCH 25/29] =?UTF-8?q?=EA=B2=AC=EC=A0=81=EC=84=9C=20=EC=83=81?= =?UTF-8?q?=EC=84=B8=ED=99=94=EB=A9=B4?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/estimate/Estimate.jsx | 26 +++++++++++++------------- src/locales/ja.json | 11 +++++++++++ src/locales/ko.json | 11 +++++++++++ 3 files changed, 35 insertions(+), 13 deletions(-) diff --git a/src/components/estimate/Estimate.jsx b/src/components/estimate/Estimate.jsx index af51ea74..de96d1a3 100644 --- a/src/components/estimate/Estimate.jsx +++ b/src/components/estimate/Estimate.jsx @@ -152,7 +152,7 @@ export default function Estimate({ params }) { {/* 주문분류 */} - 注文分類/주문분류 * + {getMessage('estimate.detail.orderType')} *
    @@ -160,7 +160,7 @@ export default function Estimate({ params }) { {/* 지붕재・사양시공 최대4개*/} - 屋根材・仕様施工 / 지붕재・사양시공 + {getMessage('estimate.detail.roofCns')}
    @@ -178,7 +178,7 @@ export default function Estimate({ params }) { {/* 비고 */} - 備考 /비고 + {getMessage('estimate.detail.note')}
    @@ -193,9 +193,9 @@ export default function Estimate({ params }) {

    {getMessage('estimate.detail.header.fileList1')}

    - -
    @@ -273,23 +273,23 @@ export default function Estimate({ params }) {
    -
    수량 (PCS)
    +
    {getMessage('estimate.detail.sepcialEstimateProductInfo.totPcs')}
    74
    -
    용량 (Kw)
    +
    {getMessage('estimate.detail.sepcialEstimateProductInfo.vol')}
    8300
    -
    공급가액
    +
    {getMessage('estimate.detail.sepcialEstimateProductInfo.netAmt')}
    6,798,900
    -
    부가세 (10%)
    +
    {getMessage('estimate.detail.sepcialEstimateProductInfo.vat')}
    679,890
    -
    총액
    +
    {getMessage('estimate.detail.sepcialEstimateProductInfo.totPrice')}
    7,478,790
    @@ -317,9 +317,9 @@ export default function Estimate({ params }) {
    {getMessage('estimate.detail.sepcialEstimateProductInfo.pkgWeight')} - (모듈수량 * 수량) / 100) + {getMessage('estimate.detail.sepcialEstimateProductInfo.calcFormula1')} {getMessage('estimate.detail.sepcialEstimateProductInfo.pkgPrice')} - PKG단가(W) * PKG용량(W) + {getMessage('estimate.detail.sepcialEstimateProductInfo.calcFormula2')} diff --git a/src/locales/ja.json b/src/locales/ja.json index a75b6967..27b20ada 100644 --- a/src/locales/ja.json +++ b/src/locales/ja.json @@ -730,14 +730,25 @@ "estimate.detail.receiveUser": "担当者 ", "estimate.detail.title": "案件名", "estimate.detail.remarks": "メモ", + "estimate.detail.orderType": "注文分類", + "estimate.detail.roofCns": "屋根材・仕様施工", + "estimate.detail.note": "備考", + "estimate.detail.nextSubmit": "後日資料提出", "estimate.detail.header.fileList1": "ファイル添付", "estimate.detail.fileList.btn": "ファイル選択", "estimate.detail.header.fileList2": "添付ファイル一覧", "estimate.detail.header.specialEstimate": "見積もりの具体的な", "estimate.detail.header.specialEstimateProductInfo": "製品情報", + "estimate.detail.sepcialEstimateProductInfo.totPcs": "数量 (PCS)", + "estimate.detail.sepcialEstimateProductInfo.vol": "容量 (Kw)", + "estimate.detail.sepcialEstimateProductInfo.netAmt": "供給価格", + "estimate.detail.sepcialEstimateProductInfo.vat": "付加価値税 (10%)", + "estimate.detail.sepcialEstimateProductInfo.totPrice": "総額", "estimate.detail.sepcialEstimateProductInfo.pkgUnitPrice": "住宅PKG単価 (W)", "estimate.detail.sepcialEstimateProductInfo.pkgWeight": "PKG容量 (Kw)", "estimate.detail.sepcialEstimateProductInfo.pkgPrice": "PKG金額", + "estimate.detail.sepcialEstimateProductInfo.calcFormula1": "(モジュール容量 × 数量)÷1000", + "estimate.detail.sepcialEstimateProductInfo.calcFormula2": "PKG単価 (W)×PKG容量(W)", "estimate.detail.header.showPrice": "価格表示", "estimate.detail.showPrice.btn1": "Pricing", "estimate.detail.showPrice.description": "クリックして製品の特異性を確認する", diff --git a/src/locales/ko.json b/src/locales/ko.json index 19dedd58..ecd5b73b 100644 --- a/src/locales/ko.json +++ b/src/locales/ko.json @@ -735,14 +735,25 @@ "estimate.detail.receiveUser": "담당자", "estimate.detail.title": "안건명", "estimate.detail.remarks": "메모", + "estimate.detail.orderType": "주문분류", + "estimate.detail.roofCns": "지붕재・사양시공", + "estimate.detail.note": "비고", + "estimate.detail.nextSubmit": "후일자료제출", "estimate.detail.header.fileList1": "파일첨부", "estimate.detail.fileList.btn": "파일선택", "estimate.detail.header.fileList2": "첨부파일 목록", "estimate.detail.header.specialEstimate": "견적특이사항", "estimate.detail.header.specialEstimateProductInfo": "제품정보", + "estimate.detail.sepcialEstimateProductInfo.totPcs": "수량 (PCS)", + "estimate.detail.sepcialEstimateProductInfo.vol": "용량 (Kw)", + "estimate.detail.sepcialEstimateProductInfo.netAmt": "공급가액", + "estimate.detail.sepcialEstimateProductInfo.vat": "부가세 (10%)", + "estimate.detail.sepcialEstimateProductInfo.totPrice": "총액", "estimate.detail.sepcialEstimateProductInfo.pkgUnitPrice": "주택PKG단가 (W)", "estimate.detail.sepcialEstimateProductInfo.pkgWeight": "PKG 용량 (Kw)", "estimate.detail.sepcialEstimateProductInfo.pkgPrice": "PKG 금액", + "estimate.detail.sepcialEstimateProductInfo.calcFormula1": "(모듈수량 * 수량)÷100", + "estimate.detail.sepcialEstimateProductInfo.calcFormula2": "PKG단가(W) * PKG용량(W)", "estimate.detail.header.showPrice": "가격표시", "estimate.detail.showPrice.btn1": "Pricing", "estimate.detail.showPrice.description": "클릭하여 제품 특이사항 확인", From b113579e530bc6b739a03354519a3318f85de58e Mon Sep 17 00:00:00 2001 From: basssy Date: Wed, 30 Oct 2024 10:03:12 +0900 Subject: [PATCH 26/29] =?UTF-8?q?=EC=9E=84=EC=8B=9C=EC=A0=80=EC=9E=A5=20re?= =?UTF-8?q?turn=20=EC=A0=9C=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/management/StuffDetail.jsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/management/StuffDetail.jsx b/src/components/management/StuffDetail.jsx index 1a4c99ae..ac39e5b2 100644 --- a/src/components/management/StuffDetail.jsx +++ b/src/components/management/StuffDetail.jsx @@ -1183,7 +1183,6 @@ export default function StuffDetail() { return alert(getMessage('stuff.detail.save.valierror2')) } - return await promisePost({ url: '/api/object/save-object', data: params }).then((res) => { if (res.status === 201) { alert(getMessage('stuff.detail.tempSave.message1')) From f53a571a0ec0319b22fd185e15871a1b372fe2f0 Mon Sep 17 00:00:00 2001 From: basssy Date: Wed, 30 Oct 2024 10:08:43 +0900 Subject: [PATCH 27/29] =?UTF-8?q?=EC=9E=84=EC=8B=9C=EC=A0=80=EC=9E=A5=20?= =?UTF-8?q?=ED=95=84=EC=88=98=EA=B0=92=20=EC=B2=B4=ED=81=AC=20=EC=A0=9C?= =?UTF-8?q?=EA=B1=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/management/StuffDetail.jsx | 16 ++++++++-------- 1 file changed, 8 insertions(+), 8 deletions(-) diff --git a/src/components/management/StuffDetail.jsx b/src/components/management/StuffDetail.jsx index ac39e5b2..43089124 100644 --- a/src/components/management/StuffDetail.jsx +++ b/src/components/management/StuffDetail.jsx @@ -1173,15 +1173,15 @@ export default function StuffDetail() { params.saleStoreLevel = sessionState.storeLvl } //수직적설량, 설치높이 0인지 체크 - let snow = params.verticalSnowCover - let height = params.installHeight + // let snow = params.verticalSnowCover + // let height = params.installHeight - if (snow === '0') { - return alert(getMessage('stuff.detail.save.valierror1')) - } - if (height === '0') { - return alert(getMessage('stuff.detail.save.valierror2')) - } + // if (snow === '0') { + // return alert(getMessage('stuff.detail.save.valierror1')) + // } + // if (height === '0') { + // return alert(getMessage('stuff.detail.save.valierror2')) + // } await promisePost({ url: '/api/object/save-object', data: params }).then((res) => { if (res.status === 201) { From 9a5ac095ffca9ed80d92733983059e97c996f60a Mon Sep 17 00:00:00 2001 From: basssy Date: Wed, 30 Oct 2024 10:34:47 +0900 Subject: [PATCH 28/29] =?UTF-8?q?=EB=AC=BC=EA=B1=B4=EB=AA=A9=EB=A1=9D?= =?UTF-8?q?=ED=99=94=EB=A9=B4=20=EC=97=94=ED=84=B0=EA=B2=80=EC=83=89=20?= =?UTF-8?q?=EB=8B=A4=EB=A5=B8=ED=95=84=EB=93=9C=EB=8F=84=20=EC=A0=81?= =?UTF-8?q?=EC=9A=A9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/management/StuffDetail.jsx | 6 +++--- src/components/management/StuffSearchCondition.jsx | 6 ++++++ 2 files changed, 9 insertions(+), 3 deletions(-) diff --git a/src/components/management/StuffDetail.jsx b/src/components/management/StuffDetail.jsx index 43089124..6d3a83ee 100644 --- a/src/components/management/StuffDetail.jsx +++ b/src/components/management/StuffDetail.jsx @@ -1128,9 +1128,10 @@ export default function StuffDetail() { // 수정모드일때는 PUT await promisePut({ url: apiUrl, data: params }).then((res) => { if (res.status === 201) { + setFloorPlanObjectNo({ floorPlanObjectNo: res.data.objectNo }) alert(getMessage('stuff.detail.save')) - setFloorPlanObjectNo({ floorPlanObjectNo: objectNo }) - router.refresh() + // router.refresh() + router.push(`/management/stuff/detail?objectNo=${res.data.objectNo.toString()}`) } }) } @@ -1182,7 +1183,6 @@ export default function StuffDetail() { // if (height === '0') { // return alert(getMessage('stuff.detail.save.valierror2')) // } - await promisePost({ url: '/api/object/save-object', data: params }).then((res) => { if (res.status === 201) { alert(getMessage('stuff.detail.tempSave.message1')) diff --git a/src/components/management/StuffSearchCondition.jsx b/src/components/management/StuffSearchCondition.jsx index 3e5b07f6..421f806f 100644 --- a/src/components/management/StuffSearchCondition.jsx +++ b/src/components/management/StuffSearchCondition.jsx @@ -144,6 +144,7 @@ export default function StuffSearchCondition() { }) const allList = res const favList = res.filter((row) => row.priority !== 'B') + setSchSelSaleStoreList(allList) setFavoriteStoreList(favList) setShowSaleStoreList(favList) @@ -263,6 +264,7 @@ export default function StuffSearchCondition() { onChange={(e) => { setSaleStoreName(saleStoreNameRef.current.value) }} + onKeyUp={handleByOnKeyUp} />
    @@ -277,6 +279,7 @@ export default function StuffSearchCondition() { onChange={(e) => { setAddress(addressRef.current.value) }} + onKeyUp={handleByOnKeyUp} />
    @@ -293,6 +296,7 @@ export default function StuffSearchCondition() { onChange={(e) => { setobjectName(objectNameRef.current.value) }} + onKeyUp={handleByOnKeyUp} />
    @@ -307,6 +311,7 @@ export default function StuffSearchCondition() { onChange={(e) => { setDispCompanyName(dispCompanyNameRef.current.value) }} + onKeyUp={handleByOnKeyUp} />
    @@ -363,6 +368,7 @@ export default function StuffSearchCondition() { onChange={(e) => { setReceiveUser(receiveUserRef.current.value) }} + onKeyUp={handleByOnKeyUp} />
    From 34af06eef49fb9b91802fdbd6dac139e2ea22a35 Mon Sep 17 00:00:00 2001 From: "hyojun.choi" Date: Wed, 30 Oct 2024 10:53:25 +0900 Subject: [PATCH 29/29] =?UTF-8?q?=EB=8F=99=EC=84=A0=EC=9D=B4=EB=8F=99=20?= =?UTF-8?q?=ED=98=95=20=EC=98=AC=EB=A6=BC=EB=82=B4=EB=A6=BC=20=EC=9E=91?= =?UTF-8?q?=EC=97=85=20=EC=B4=88=EA=B8=B0=EC=84=B8=ED=8C=85?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/common/common.js | 8 +-- .../modal/movement/MovementSetting.jsx | 27 ++++++---- .../modal/movement/type/FlowLine.jsx | 54 +++++++++++++++++-- .../floor-plan/modal/movement/type/Updown.jsx | 44 +++++++++++++-- src/hooks/roofcover/useMovementSetting.js | 48 +++++++++++++++++ 5 files changed, 153 insertions(+), 28 deletions(-) create mode 100644 src/hooks/roofcover/useMovementSetting.js diff --git a/src/common/common.js b/src/common/common.js index 8a7e9041..c8dc5383 100644 --- a/src/common/common.js +++ b/src/common/common.js @@ -155,10 +155,4 @@ export const SAVE_KEY = [ 'originText', ] -export const OBJECT_PROTOTYPE = [ - fabric.Line.prototype, - fabric.Polygon.prototype, - // fabric.Text.prototype, - // fabric.IText.prototype, - fabric.Triangle.prototype, -] +export const OBJECT_PROTOTYPE = [fabric.Line.prototype, fabric.Polygon.prototype, fabric.Triangle.prototype] diff --git a/src/components/floor-plan/modal/movement/MovementSetting.jsx b/src/components/floor-plan/modal/movement/MovementSetting.jsx index fabf813c..424a697e 100644 --- a/src/components/floor-plan/modal/movement/MovementSetting.jsx +++ b/src/components/floor-plan/modal/movement/MovementSetting.jsx @@ -4,15 +4,18 @@ import { useState } from 'react' import FlowLine from '@/components/floor-plan/modal/movement/type/FlowLine' import Updown from '@/components/floor-plan/modal/movement/type/Updown' import { usePopup } from '@/hooks/usePopup' +import { useMovementSetting } from '@/hooks/roofcover/useMovementSetting' export default function MovementSetting({ id, pos = { x: 50, y: 230 } }) { const { getMessage } = useMessage() - const { closePopup } = usePopup() - const [buttonAct, setButtonAct] = useState(1) - const buttonMenu = [ - { id: 1, name: getMessage('modal.movement.flow.line.move') }, - { id: 2, name: getMessage('modal.movement.flow.line.updown') }, - ] + const { TYPE, closePopup, buttonType, type, setType, FLOW_LINE_REF, UP_DOWN_REF, handleSave } = useMovementSetting(id) + + const flowLineProps = { + FLOW_LINE_REF, + } + const updownProps = { + UP_DOWN_REF, + } return ( @@ -25,19 +28,21 @@ export default function MovementSetting({ id, pos = { x: 50, y: 230 } }) {
    - {buttonMenu.map((item) => ( - ))}
    {getMessage('setting')}
    - {buttonAct === 1 && } - {buttonAct === 2 && } + {type === TYPE.FLOW_LINE && } + {type === TYPE.UP_DOWN && }
    - +
    diff --git a/src/components/floor-plan/modal/movement/type/FlowLine.jsx b/src/components/floor-plan/modal/movement/type/FlowLine.jsx index d1bf8023..1d3dd26e 100644 --- a/src/components/floor-plan/modal/movement/type/FlowLine.jsx +++ b/src/components/floor-plan/modal/movement/type/FlowLine.jsx @@ -1,7 +1,24 @@ import { useMessage } from '@/hooks/useMessage' +import { useEffect, useState } from 'react' -export default function FlowLine({}) { +const FLOW_LINE_TYPE = { + DOWN_LEFT: 'downLeft', + UP_RIGHT: 'upRight', +} + +export default function FlowLine({ FLOW_LINE_REF }) { const { getMessage } = useMessage() + const [type, setType] = useState(FLOW_LINE_TYPE.DOWN_LEFT) + + useEffect(() => { + if (type === FLOW_LINE_TYPE.DOWN_LEFT) { + FLOW_LINE_REF.UP_RIGHT_INPUT_REF.current.value = '' + FLOW_LINE_REF.DOWN_LEFT_INPUT_REF.current.focus() + } else { + FLOW_LINE_REF.DOWN_LEFT_INPUT_REF.current.value = '' + FLOW_LINE_REF.UP_RIGHT_INPUT_REF.current.focus() + } + }, [type]) return ( <> @@ -11,14 +28,28 @@ export default function FlowLine({}) {
    - + { + setType(FLOW_LINE_TYPE.DOWN_LEFT) + }} + />
    - +
    @@ -26,14 +57,27 @@ export default function FlowLine({}) {
    - + { + setType(FLOW_LINE_TYPE.UP_RIGHT) + }} + />
    - +
    mm
    diff --git a/src/components/floor-plan/modal/movement/type/Updown.jsx b/src/components/floor-plan/modal/movement/type/Updown.jsx index 2650ca4a..a27abf80 100644 --- a/src/components/floor-plan/modal/movement/type/Updown.jsx +++ b/src/components/floor-plan/modal/movement/type/Updown.jsx @@ -1,7 +1,24 @@ import { useMessage } from '@/hooks/useMessage' +import { useEffect, useState } from 'react' -export default function Updown({}) { +const UP_DOWN_TYPE = { + UP: 'up', + DOWN: 'down', +} + +export default function Updown({ UP_DOWN_REF }) { const { getMessage } = useMessage() + const [type, setType] = useState(UP_DOWN_TYPE.UP) + + useEffect(() => { + if (type === UP_DOWN_TYPE.UP) { + UP_DOWN_REF.DOWN_INPUT_REF.current.value = '' + UP_DOWN_REF.UP_INPUT_REF.current.focus() + } else { + UP_DOWN_REF.UP_INPUT_REF.current.value = '' + UP_DOWN_REF.DOWN_INPUT_REF.current.focus() + } + }, [type]) return ( <> @@ -11,14 +28,23 @@ export default function Updown({}) {
    - + { + setType(UP_DOWN_TYPE.UP) + }} + />
    - +
    @@ -26,14 +52,22 @@ export default function Updown({}) {
    - + { + setType(UP_DOWN_TYPE.DOWN) + }} + />
    - +
    mm
    diff --git a/src/hooks/roofcover/useMovementSetting.js b/src/hooks/roofcover/useMovementSetting.js new file mode 100644 index 00000000..355a6bf8 --- /dev/null +++ b/src/hooks/roofcover/useMovementSetting.js @@ -0,0 +1,48 @@ +import { useRecoilValue } from 'recoil' +import { canvasState } from '@/store/canvasAtom' +import { usePopup } from '@/hooks/usePopup' +import { useMessage } from '@/hooks/useMessage' +import { useRef, useState } from 'react' + +//동선이동 형 올림 내림 +export function useMovementSetting(id) { + const TYPE = { + FLOW_LINE: 'flowLine', // 동선이동 + UP_DOWN: 'updown', //형 올림내림 + } + const canvas = useRecoilValue(canvasState) + const { closePopup } = usePopup() + const { getMessage } = useMessage() + const buttonType = [ + { id: 1, name: getMessage('modal.movement.flow.line.move'), type: TYPE.FLOW_LINE }, + { id: 2, name: getMessage('modal.movement.flow.line.updown'), type: TYPE.UP_DOWN }, + ] + const [type, setType] = useState(TYPE.FLOW_LINE) + + const FLOW_LINE_REF = { + DOWN_LEFT_INPUT_REF: useRef(null), + UP_RIGHT_INPUT_REF: useRef(null), + DOWN_LEFT_RADIO_REF: useRef(null), + UP_RIGHT_RADIO_REF: useRef(null), + } + + const UP_DOWN_REF = { + UP_INPUT_REF: useRef(null), + DOWN_INPUT_REF: useRef(null), + UP_RADIO_REF: useRef(null), + DOWN_RADIO_REF: useRef(null), + } + + const handleSave = () => {} + + return { + TYPE, + closePopup, + buttonType, + type, + setType, + FLOW_LINE_REF, + UP_DOWN_REF, + handleSave, + } +}