diff --git a/src/common/common.js b/src/common/common.js index c78673ee..9de60c9a 100644 --- a/src/common/common.js +++ b/src/common/common.js @@ -1,4 +1,5 @@ export const MENU = { + PLAN_DRAWING: 'planDrawing', INITIAL_CANVAS_SETTING: 'initialCanvasSetting', // 배치면 초기설정 ROOF_COVERING: { EXTERIOR_WALL_LINE: 'exteriorWallLine', // 외벽선 그리기 diff --git a/src/components/floor-plan/CanvasMenu.jsx b/src/components/floor-plan/CanvasMenu.jsx index 054394c4..58dad7f1 100644 --- a/src/components/floor-plan/CanvasMenu.jsx +++ b/src/components/floor-plan/CanvasMenu.jsx @@ -18,13 +18,13 @@ import JA from '@/locales/ja.json' import { settingModalFirstOptionsState } from '@/store/settingAtom' const canvasMenus = [ - { index: 0, name: 'plan.menu.plan.drawing', icon: 'con00' }, - { index: 1, name: 'plan.menu.placement.surface.initial.setting', icon: 'con01' }, - { index: 2, name: 'plan.menu.roof.cover', icon: 'con02' }, - { index: 3, name: 'plan.menu.placement.surface', icon: 'con03' }, - { index: 4, name: 'plan.menu.module.circuit.setting', icon: 'con04' }, - { index: 5, name: 'plan.menu.estimate', icon: 'con06' }, - { index: 6, name: 'plan.menu.simulation', icon: 'con05' }, + { 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 default function CanvasMenu(props) { @@ -45,11 +45,21 @@ export default function CanvasMenu(props) { const { getMessage } = useMessage() const SelectOption = [{ name: '瓦53A' }, { name: '瓦53A' }] - const onClickNav = (number) => { - setMenuNumber(number) - if (number === 2) setType('outline') - if (number === 3) setType('surface') - if (number === 4) setType('module') + const onClickNav = (menu) => { + setMenuNumber(menu.index) + setCurrentMenu(menu.title) + + switch (menu.index) { + case 2: + setType('outline') + break + case 3: + setType('surface') + break + case 4: + setType('module') + break + } } const menuProps = { setShowOutlineModal, @@ -89,88 +99,16 @@ export default function CanvasMenu(props) {
{menuNumber !== 6 && menuNumber !== 5 && ( diff --git a/src/components/floor-plan/FloorPlan.jsx b/src/components/floor-plan/FloorPlan.jsx index c3bf4095..c610948f 100644 --- a/src/components/floor-plan/FloorPlan.jsx +++ b/src/components/floor-plan/FloorPlan.jsx @@ -53,11 +53,14 @@ export default function FloorPlan() { 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, diff --git a/src/components/floor-plan/modal/grid/DotLineGrid.jsx b/src/components/floor-plan/modal/grid/DotLineGrid.jsx index aaab09d9..a8828b81 100644 --- a/src/components/floor-plan/modal/grid/DotLineGrid.jsx +++ b/src/components/floor-plan/modal/grid/DotLineGrid.jsx @@ -17,18 +17,9 @@ export default function DotLineGrid(props) { }, { id: 4, name: '1/10' }, ] - - const HandleClickClose = () => { - // setClose(true) - // setTimeout(() => { - // setModalOption({ ...modalOption, gridoption: false }) - // setClose(false) - // }, 180) - } return ( - -
- {/*
*/} + +

{getMessage('modal.canvas.setting.grid.dot.line.setting')}

+
+
+
{getMessage('modal.grid.copy.info')}
+
+
+
+ {getMessage('modal.grid.copy.length')} +
+ +
+ mm +
+
+ + + + +
+
+
+
+ +
+
+
+ + ) +} diff --git a/src/components/floor-plan/modal/grid/GridMove.jsx b/src/components/floor-plan/modal/grid/GridMove.jsx index f30b38cc..1da8b6fa 100644 --- a/src/components/floor-plan/modal/grid/GridMove.jsx +++ b/src/components/floor-plan/modal/grid/GridMove.jsx @@ -1,2 +1,55 @@ +import WithDraggable from '@/components/common/draggable/withDraggable' +import { useMessage } from '@/hooks/useMessage' + export default function GridMove(props) { -} \ No newline at end of file + const { setShowGridMoveModal, setShowGridCopyModal } = props + const { getMessage } = useMessage() + + return ( + +
+
+

{getMessage('modal.grid.move')}

+ +
+
+
{getMessage('modal.grid.move.info')}
+
+
+ + +
+
+
+

{getMessage('modal.grid.move.length')}

+
+
+ +
+ mm +
+
+
+ +
+ mm +
+
+
+ + + + +
+
+
+
+ +
+
+
+ + ) +} diff --git a/src/components/floor-plan/modal/setting01/FirstOption.jsx b/src/components/floor-plan/modal/setting01/FirstOption.jsx index 1c2cf20a..9c146485 100644 --- a/src/components/floor-plan/modal/setting01/FirstOption.jsx +++ b/src/components/floor-plan/modal/setting01/FirstOption.jsx @@ -10,7 +10,7 @@ export default function FirstOption() { const [objectNo, setObjectNo] = useState('test123240912001') // 이후 삭제 필요 const [settingModalFirstOptions, setSettingModalFirstOptions] = useRecoilState(settingModalFirstOptionsState) const [settingModalSecondOptions, setSettingModalSecondOptions] = useRecoilState(settingModalSecondOptionsState) - const { option1, option2 } = settingModalFirstOptions + const { option1, option2, dimensionDisplay } = settingModalFirstOptions const { option3, option4 } = settingModalSecondOptions const { getMessage } = useMessage() const { get, post } = useAxios() @@ -29,12 +29,17 @@ export default function FirstOption() { 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, }) + console.log('optionData5', optionData5) setSettingModalSecondOptions({ option3: optionData3, option4: optionData4, @@ -47,7 +52,7 @@ export default function FirstOption() { const onClickOption = async (option) => { option.selected = !option.selected - setSettingModalFirstOptions({ option1, option2 }) + setSettingModalFirstOptions({ option1, option2, dimensionDisplay }) setSettingModalSecondOptions({ option3, option4 }) try { @@ -107,30 +112,48 @@ export default function FirstOption() { } } + const onClickDimension = (item) => { + const options = settingModalFirstOptions?.dimensionDisplay.map((option) => { + option.selected = option.id === item.id + return option + }) + + setSettingModalFirstOptions({ option1, option2, dimensionDisplay: options }) + } + return ( <>

{getMessage('modal.canvas.setting.first.option.info')}

- {settingModalFirstOptions && - settingModalFirstOptions.option1.map((item) => ( - - ))} + {settingModalFirstOptions?.option1.map((item) => ( + + ))} +
+
+
+

{getMessage('modal.canvas.setting.first.option.dimension')}

+
+ {settingModalFirstOptions?.dimensionDisplay?.map((item) => ( + + ))}

{getMessage('modal.canvas.setting.first.option.display')}

- {settingModalFirstOptions && - settingModalFirstOptions.option2.map((item) => ( - - ))} + {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 e870cd73..e850f403 100644 --- a/src/components/floor-plan/modal/setting01/SecondOption.jsx +++ b/src/components/floor-plan/modal/setting01/SecondOption.jsx @@ -32,11 +32,14 @@ export default function SecondOption() { 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, diff --git a/src/locales/ja.json b/src/locales/ja.json index 5efffbd4..dd2c7026 100644 --- a/src/locales/ja.json +++ b/src/locales/ja.json @@ -71,6 +71,15 @@ "modal.canvas.setting.grid.dot.line.setting.save": "保存", "modal.canvas.setting.grid.absorption.add": "吸着点を追加", "modal.canvas.setting.grid.color.setting": "グリッド色の設定", + "modal.grid.move": "グリッド移動", + "modal.grid.move.info": "移動する方向を入力してください", + "modal.grid.move.all": "グリッド全体移動", + "modal.grid.move.length": "長さ", + "modal.grid.move.save": "保存", + "modal.grid.copy": "グリッドのコピー", + "modal.grid.copy.info": "間隔を設定し、コピー方向を選択します", + "modal.grid.copy.length": "長さ", + "modal.grid.copy.save": "保存", "modal.canvas.setting.font.plan.edit": "フォントとサイズの変更", "modal.canvas.setting.font.plan.edit.word": "文字フォントの変更", "modal.canvas.setting.font.plan.edit.flow": "フロー方向フォントの変更", @@ -95,7 +104,10 @@ "modal.canvas.setting.first.option.trestle": "가대 표시", "modal.canvas.setting.first.option.flow": "흐름방향 표시", "modal.canvas.setting.first.option.total": "집계표 표시", - "modal.canvas.setting.first.option.corridor.dimension": "복도치수 표시", + "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.display": "画面表示", "modal.canvas.setting.first.option.border": "ボーダーのみ", "modal.canvas.setting.first.option.line": "ラインハッチ", diff --git a/src/locales/ko.json b/src/locales/ko.json index 01673a42..d3007a8e 100644 --- a/src/locales/ko.json +++ b/src/locales/ko.json @@ -68,6 +68,15 @@ "modal.canvas.setting.grid.dot.line.setting.save": "저장", "modal.canvas.setting.grid.absorption.add": "흡착점 추가", "modal.canvas.setting.grid.color.setting": "그리드 색 설정", + "modal.grid.move": "그리드 이동", + "modal.grid.move.info": "이동할 방향을 입력해주세요", + "modal.grid.move.all": "그리드 전체 이동", + "modal.grid.move.length": "길이", + "modal.grid.move.save": "저장", + "modal.grid.copy": "그리드 복사", + "modal.grid.copy.info": "간격을 설정하고 복사 방향을 선택하십시오", + "modal.grid.copy.length": "길이", + "modal.grid.copy.save": "저장", "modal.canvas.setting.font.plan.edit": "글꼴 및 크기 변경", "modal.canvas.setting.font.plan.edit.word": "문자 글꼴 변경", "modal.canvas.setting.font.plan.edit.flow": "흐름 방향 글꼴 변경", @@ -92,7 +101,10 @@ "modal.canvas.setting.first.option.trestle": "가대 표시", "modal.canvas.setting.first.option.flow": "흐름방향 표시", "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": "라인해치", diff --git a/src/store/settingAtom.js b/src/store/settingAtom.js index 93cec544..5541cc14 100644 --- a/src/store/settingAtom.js +++ b/src/store/settingAtom.js @@ -6,21 +6,30 @@ export const settingModalFirstOptionsState = atom({ option1: [ { id: 1, column: 'assignDisplay', name: 'modal.canvas.setting.first.option.alloc', selected: false }, { id: 2, column: 'drawDisplay', name: 'modal.canvas.setting.first.option.outline', selected: false }, - { id: 3, column: 'gridDisplay', name: 'modal.canvas.setting.first.option.plan', selected: false }, - { id: 4, column: 'charDisplay', name: 'modal.canvas.setting.first.option.roof.line', selected: false }, - { id: 5, column: 'flowDisplay', name: 'modal.canvas.setting.first.option.grid', selected: false }, - { id: 6, column: 'hallwayDimenDisplay', name: 'modal.canvas.setting.first.option.circuit.num', selected: false }, - { id: 7, column: 'actualDimenDisplay', name: 'modal.canvas.setting.first.option.word', selected: false }, - { id: 8, column: 'noDimenDisplay', name: 'modal.canvas.setting.first.option.trestle', selected: false }, - { id: 9, column: 'trestleDisplay', name: 'modal.canvas.setting.first.option.flow', selected: false }, - { id: 10, column: 'coordiDisplay', name: 'modal.canvas.setting.first.option.total', selected: false }, + { id: 3, column: 'charDisplay', name: 'modal.canvas.setting.first.option.roof.line', selected: false }, + { id: 4, column: 'flowDisplay', name: 'modal.canvas.setting.first.option.grid', selected: false }, + { id: 5, column: 'hallwayDimenDisplay', name: 'modal.canvas.setting.first.option.circuit.num', selected: false }, + { id: 6, column: 'actualDimenDisplay', name: 'modal.canvas.setting.first.option.word', selected: false }, + { id: 7, column: 'noDimenDisplay', name: 'modal.canvas.setting.first.option.trestle', selected: false }, + { id: 8, column: 'trestleDisplay', name: 'modal.canvas.setting.first.option.flow', selected: false }, + { id: 9, column: 'coordiDisplay', name: 'modal.canvas.setting.first.option.total', selected: false }, { - id: 11, + id: 10, column: 'drawConverDisplay', name: 'modal.canvas.setting.first.option.corridor.dimension', selected: false, }, ], + dimensionDisplay: [ + { + id: 1, + column: 'corridorDimension', + name: 'modal.canvas.setting.first.option.corridor.dimension', + selected: false, + }, + { 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 }, + ], option2: [ { id: 1, column: 'onlyBorder', name: 'modal.canvas.setting.first.option.border', selected: false }, { id: 2, column: 'lineHatch', name: 'modal.canvas.setting.first.option.line', selected: false },