From 32fee9243a692914aa464b35de560716c269b44c Mon Sep 17 00:00:00 2001 From: minsik Date: Mon, 7 Oct 2024 10:27:35 +0900 Subject: [PATCH] =?UTF-8?q?=EB=B3=B4=EC=A1=B0=EC=84=A0=20=EC=9E=91?= =?UTF-8?q?=EC=84=B1=20=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 | 16 +- src/components/floor-plan/FloorPlan.jsx | 18 +++ .../modal/auxiliary/AuxiliaryDrawing.jsx | 152 ++++++++++++++++++ .../{outerlinesetting => lineTypes}/Angle.jsx | 0 .../Diagonal.jsx | 0 .../DoublePitch.jsx | 0 .../OuterLineWall.jsx | 3 +- .../RightAngle.jsx | 0 .../outerlinesetting/WallLineSetting.jsx | 10 +- src/locales/ja.json | 1 + src/locales/ko.json | 1 + 11 files changed, 193 insertions(+), 8 deletions(-) create mode 100644 src/components/floor-plan/modal/auxiliary/AuxiliaryDrawing.jsx rename src/components/floor-plan/modal/{outerlinesetting => lineTypes}/Angle.jsx (100%) rename src/components/floor-plan/modal/{outerlinesetting => lineTypes}/Diagonal.jsx (100%) rename src/components/floor-plan/modal/{outerlinesetting => lineTypes}/DoublePitch.jsx (100%) rename src/components/floor-plan/modal/{outerlinesetting => lineTypes}/OuterLineWall.jsx (93%) rename src/components/floor-plan/modal/{outerlinesetting => lineTypes}/RightAngle.jsx (100%) diff --git a/src/components/floor-plan/CanvasMenu.jsx b/src/components/floor-plan/CanvasMenu.jsx index 91c5179c..b0fedf65 100644 --- a/src/components/floor-plan/CanvasMenu.jsx +++ b/src/components/floor-plan/CanvasMenu.jsx @@ -31,7 +31,17 @@ const canvasMenus = [ ] export default function CanvasMenu(props) { - const { setShowCanvasSettingModal, showOutlineModal, setShowOutlineModal, setShowPlaceShapeModal, setShowRoofShapeSettingModal } = props + const { + setShowCanvasSettingModal, + showOutlineModal, + setShowOutlineModal, + setShowPlaceShapeModal, + setShowSlopeSettingModal, + setShowPlaceShapeDrawingModal, + setShowRoofShapeSettingModal, + setShowRoofShapePassivitySettingModal, + setShowAuxiliaryModal, + } = props const [menuNumber, setMenuNumber] = useState(null) const [type, setType] = useState('') @@ -76,6 +86,10 @@ export default function CanvasMenu(props) { setShowOutlineModal, setShowPlaceShapeModal, setShowRoofShapeSettingModal, + setShowRoofShapePassivitySettingModal, + setShowAuxiliaryModal, + setShowSlopeSettingModal, + setShowPlaceShapeDrawingModal, type, } diff --git a/src/components/floor-plan/FloorPlan.jsx b/src/components/floor-plan/FloorPlan.jsx index 38d31f9d..debfa4da 100644 --- a/src/components/floor-plan/FloorPlan.jsx +++ b/src/components/floor-plan/FloorPlan.jsx @@ -15,6 +15,10 @@ import PropertiesSetting from '@/components/floor-plan/modal/outerlinesetting/Pr import PlacementShapeSetting from '@/components/floor-plan/modal/placementShape/PlacementShapeSetting' import GridColorSetting from './modal/grid/GridColorSetting' import RoofShapeSetting from '@/components/floor-plan/modal/roofShape/RoofShapeSetting' +import PlacementShapeDrawing from '@/components/floor-plan/modal/placementShape/PlacementShapeDrawing' +import Slope from '@/components/floor-plan/modal/Slope' +import RoofShapePassivitySetting from '@/components/floor-plan/modal/roofShape/RoofShapePassivitySetting' +import AuxiliaryDrawing from '@/components/floor-plan/modal/auxiliary/AuxiliaryDrawing' export default function FloorPlan() { const [showCanvasSettingModal, setShowCanvasSettingModal] = useState(false) @@ -22,6 +26,10 @@ export default function FloorPlan() { const [showPlaceShapeModal, setShowPlaceShapeModal] = useState(false) const [showPropertiesSettingModal, setShowPropertiesSettingModal] = useState(false) const [showRoofShapeSettingModal, setShowRoofShapeSettingModal] = useState(false) + const [showRoofShapePassivitySettingModal, setShowRoofShapePassivitySettingModal] = useState(false) + const [showAuxiliaryModal, setShowAuxiliaryModal] = useState(false) + const [showSlopeSettingModal, setShowSlopeSettingModal] = useState(false) + const [showPlaceShapeDrawingModal, setShowPlaceShapeDrawingModal] = useState(false) const globalLocaleState = useRecoilValue(globalLocaleStore) const { get } = useAxios(globalLocaleState) @@ -49,7 +57,11 @@ export default function FloorPlan() { showOutlineModal, setShowOutlineModal, setShowPlaceShapeModal, + setShowSlopeSettingModal, + setShowPlaceShapeDrawingModal, setShowRoofShapeSettingModal, + setShowRoofShapePassivitySettingModal, + setShowAuxiliaryModal, } useEffect(() => { @@ -110,6 +122,12 @@ export default function FloorPlan() { {showPropertiesSettingModal && } {showPlaceShapeModal && } {showRoofShapeSettingModal && } + {showRoofShapePassivitySettingModal && ( + + )} + {showAuxiliaryModal && } + {showSlopeSettingModal && } + {showPlaceShapeDrawingModal && } diff --git a/src/components/floor-plan/modal/auxiliary/AuxiliaryDrawing.jsx b/src/components/floor-plan/modal/auxiliary/AuxiliaryDrawing.jsx new file mode 100644 index 00000000..cb93375b --- /dev/null +++ b/src/components/floor-plan/modal/auxiliary/AuxiliaryDrawing.jsx @@ -0,0 +1,152 @@ +import { useState } from 'react' +import { useMessage } from '@/hooks/useMessage' +import WithDraggable from '@/components/common/draggable/withDraggable' +import RightAngle from '@/components/floor-plan/modal/lineTypes/RightAngle' +import DoublePitch from '@/components/floor-plan/modal/lineTypes/DoublePitch' +import Angle from '@/components/floor-plan/modal/lineTypes/Angle' +import Diagonal from '@/components/floor-plan/modal/lineTypes/Diagonal' +import { OUTER_LINE_TYPE } from '@/store/outerLineAtom' +import { useOuterLineWall } from '@/hooks/roofcover/useOuterLineWall' +import OuterLineWall from '@/components/floor-plan/modal/lineTypes/OuterLineWall' + +export default function AuxiliaryDrawing() { + const { getMessage } = useMessage() + const [buttonAct, setButtonAct] = useState(1) + const types = [ + { id: 1, name: getMessage('straight.line'), type: OUTER_LINE_TYPE.OUTER_LINE }, + { id: 2, name: getMessage('right.angle'), type: OUTER_LINE_TYPE.RIGHT_ANGLE }, + { id: 3, name: getMessage('double.pitch'), type: OUTER_LINE_TYPE.DOUBLE_PITCH }, + { id: 4, name: getMessage('angle'), type: OUTER_LINE_TYPE.ANGLE }, + { id: 5, name: getMessage('diagonal'), type: OUTER_LINE_TYPE.DIAGONAL_LINE }, + ] + const { + length1, + setLength1, + length2, + setLength2, + length1Ref, + length2Ref, + arrow1, + setArrow1, + arrow2, + setArrow2, + angle1, + setAngle1, + angle1Ref, + angle2, + setAngle2, + angle2Ref, + type, + setType, + arrow1Ref, + arrow2Ref, + outerLineDiagonalLength, + setOuterLineDiagonalLength, + outerLineDiagonalLengthRef, + handleRollback, + handleFix, + } = useOuterLineWall() + + const outerLineProps = { + length1, + setLength1, + length1Ref, + arrow1, + setArrow1, + } + + const rightAngleProps = { + length1, + setLength1, + length1Ref, + length2, + setLength2, + length2Ref, + arrow1, + setArrow1, + arrow2, + setArrow2, + } + + const doublePitchProps = { + angle1, + setAngle1, + angle1Ref, + angle2, + setAngle2, + angle2Ref, + length1, + setLength1, + length1Ref, + length2, + setLength2, + length2Ref, + arrow1, + setArrow1, + arrow2, + setArrow2, + arrow1Ref, + arrow2Ref, + } + + const angleProps = { + angle1, + setAngle1, + angle1Ref, + length1, + setLength1, + length1Ref, + } + + const diagonalLineProps = { + length1, + setLength1, + length1Ref, + length2, + setLength2, + length2Ref, + outerLineDiagonalLength, + setOuterLineDiagonalLength, + outerLineDiagonalLengthRef, + arrow1, + setArrow1, + arrow2, + setArrow2, + } + + const onClickButton = (button) => { + setButtonAct(button.id) + setType(button.type) + } + return ( + +
+
+

{getMessage('modal.auxiliary.drawing')}

+ +
+
+
+ {types.map((type) => ( + + ))} +
+
+
{getMessage('setting')}
+ {buttonAct === 1 && } + {buttonAct === 2 && } + {buttonAct === 3 && } + {buttonAct === 4 && } + {buttonAct === 5 && } +
+
+ + +
+
+
+ + ) +} diff --git a/src/components/floor-plan/modal/outerlinesetting/Angle.jsx b/src/components/floor-plan/modal/lineTypes/Angle.jsx similarity index 100% rename from src/components/floor-plan/modal/outerlinesetting/Angle.jsx rename to src/components/floor-plan/modal/lineTypes/Angle.jsx diff --git a/src/components/floor-plan/modal/outerlinesetting/Diagonal.jsx b/src/components/floor-plan/modal/lineTypes/Diagonal.jsx similarity index 100% rename from src/components/floor-plan/modal/outerlinesetting/Diagonal.jsx rename to src/components/floor-plan/modal/lineTypes/Diagonal.jsx diff --git a/src/components/floor-plan/modal/outerlinesetting/DoublePitch.jsx b/src/components/floor-plan/modal/lineTypes/DoublePitch.jsx similarity index 100% rename from src/components/floor-plan/modal/outerlinesetting/DoublePitch.jsx rename to src/components/floor-plan/modal/lineTypes/DoublePitch.jsx diff --git a/src/components/floor-plan/modal/outerlinesetting/OuterLineWall.jsx b/src/components/floor-plan/modal/lineTypes/OuterLineWall.jsx similarity index 93% rename from src/components/floor-plan/modal/outerlinesetting/OuterLineWall.jsx rename to src/components/floor-plan/modal/lineTypes/OuterLineWall.jsx index ffa5e0e7..f469fba8 100644 --- a/src/components/floor-plan/modal/outerlinesetting/OuterLineWall.jsx +++ b/src/components/floor-plan/modal/lineTypes/OuterLineWall.jsx @@ -2,7 +2,6 @@ import { useMessage } from '@/hooks/useMessage' import { onlyNumberInputChange } from '@/util/input-utils' -import GridMove from '@/components/floor-plan/modal/grid/GridMove' export default function OuterLineWall({ props }) { const { getMessage } = useMessage() @@ -12,7 +11,7 @@ export default function OuterLineWall({ props }) {
- {getMessage('modal.cover.outline.length')} + {getMessage('straight.line')}