마크업 수정
This commit is contained in:
parent
faf733da92
commit
fa2231d5b0
@ -6,8 +6,6 @@ import { useCanvas } from '@/hooks/useCanvas'
|
||||
import { useEvent } from '@/hooks/useEvent'
|
||||
import QContextMenu from '@/components/common/context-menu/QContextMenu'
|
||||
import { useContextMenu } from '@/hooks/useContextMenu'
|
||||
import { useRecoilValue } from 'recoil'
|
||||
import { currentObjectState } from '@/store/canvasAtom'
|
||||
|
||||
export default function CanvasFrame({ plan }) {
|
||||
const canvasRef = useRef(null)
|
||||
@ -35,7 +33,10 @@ export default function CanvasFrame({ plan }) {
|
||||
|
||||
return (
|
||||
<div className="canvas-frame flex justify-center">
|
||||
<canvas ref={canvasRef} id={'canvas'}></canvas>
|
||||
<div className="canvas-container" style={{ position: 'relative' }}>
|
||||
<canvas ref={canvasRef} id={'canvas'}></canvas>
|
||||
</div>
|
||||
|
||||
<QContextMenu contextRef={canvasRef} canvasProps={canvas}>
|
||||
{contextMenu.map((menus, index) => (
|
||||
<ul key={index}>
|
||||
|
||||
@ -9,7 +9,8 @@ import { usePlan } from '@/hooks/usePlan'
|
||||
import { globalLocaleStore } from '@/store/localeAtom'
|
||||
import { SessionContext } from '@/app/SessionProvider'
|
||||
|
||||
export default function CanvasLayout() {
|
||||
export default function CanvasLayout(props) {
|
||||
const { menuNumber } = props
|
||||
const { session } = useContext(SessionContext)
|
||||
const [objectNo, setObjectNo] = useState('test123240822001') // 이후 삭제 필요
|
||||
const globalLocaleState = useRecoilValue(globalLocaleStore)
|
||||
@ -24,7 +25,7 @@ export default function CanvasLayout() {
|
||||
|
||||
return (
|
||||
<div className="canvas-layout">
|
||||
<div className="canvas-page-list">
|
||||
<div className={`canvas-page-list ${menuNumber === 2 || menuNumber === 3 || menuNumber === 4 ? 'active' : ''}`}>
|
||||
<div className="canvas-plane-wrap">
|
||||
{plans.map((plan) => (
|
||||
<button
|
||||
|
||||
@ -33,6 +33,8 @@ const canvasMenus = [
|
||||
|
||||
export default function CanvasMenu(props) {
|
||||
const {
|
||||
menuNumber,
|
||||
setMenuNumber,
|
||||
setShowCanvasSettingModal,
|
||||
showOutlineModal,
|
||||
setShowOutlineModal,
|
||||
@ -53,7 +55,6 @@ export default function CanvasMenu(props) {
|
||||
setShowPropertiesSettingModal,
|
||||
} = props
|
||||
|
||||
const [menuNumber, setMenuNumber] = useState(null)
|
||||
const [type, setType] = useState('')
|
||||
|
||||
const [verticalHorizontalMode, setVerticalHorizontalMode] = useRecoilState(verticalHorizontalModeState)
|
||||
|
||||
@ -53,7 +53,7 @@ export default function FloorPlan() {
|
||||
const [settingModalFirstOptions, setSettingModalFirstOptions] = useRecoilState(settingModalFirstOptionsState)
|
||||
const [settingModalSecondOptions, setSettingModalSecondOptions] = useRecoilState(settingModalSecondOptionsState)
|
||||
const [objectNo, setObjectNo] = useState('test123240912001') // 이후 삭제 필요
|
||||
|
||||
const [menuNumber, setMenuNumber] = useState(null)
|
||||
const [showDotLineGridModal, setShowDotLineGridModal] = useState(false)
|
||||
const [showGridCopyModal, setShowGridCopyModal] = useState(false)
|
||||
const [showGridMoveModal, setShowGridMoveModal] = useState(false)
|
||||
@ -70,6 +70,8 @@ export default function FloorPlan() {
|
||||
}
|
||||
|
||||
const modalProps = {
|
||||
menuNumber,
|
||||
setMenuNumber,
|
||||
setShowCanvasSettingModal,
|
||||
showOutlineModal,
|
||||
setShowOutlineModal,
|
||||
@ -136,35 +138,33 @@ export default function FloorPlan() {
|
||||
useEffect(() => {}, [showOutlineModal])
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="canvas-wrap">
|
||||
<CanvasMenu {...modalProps} />
|
||||
<div className="canvas-content">
|
||||
<CanvasLayout />
|
||||
{showCanvasSettingModal && <SettingModal01 {...canvasSettingProps} />}
|
||||
{showOutlineModal && <WallLineSetting {...outlineProps} />}
|
||||
{showDotLineGridModal && <DotLineGrid {...dotLineProps} />}
|
||||
{showColorPickerModal && <GridColorSetting {...gridColorProps} />}
|
||||
{showPropertiesSettingModal && <PropertiesSetting {...propertiesSettingProps} />}
|
||||
<div className="canvas-wrap">
|
||||
<CanvasMenu {...modalProps} />
|
||||
<div className={`canvas-content ${menuNumber === 2 || menuNumber === 3 || menuNumber === 4 ? 'active' : ''}`}>
|
||||
<CanvasLayout menuNumber={menuNumber} setMenuNumber={setMenuNumber} />
|
||||
{showCanvasSettingModal && <SettingModal01 {...canvasSettingProps} />}
|
||||
{showOutlineModal && <WallLineSetting {...outlineProps} />}
|
||||
{showDotLineGridModal && <DotLineGrid {...dotLineProps} />}
|
||||
{showColorPickerModal && <GridColorSetting {...gridColorProps} />}
|
||||
{showPropertiesSettingModal && <PropertiesSetting {...propertiesSettingProps} />}
|
||||
|
||||
{showPlaceShapeModal && <PlacementShapeSetting setShowPlaceShapeModal={setShowPlaceShapeModal} />}
|
||||
{showRoofShapeSettingModal && <RoofShapeSetting setShowRoofShapeSettingModal={setShowRoofShapeSettingModal} />}
|
||||
{showRoofShapePassivitySettingModal && (
|
||||
<RoofShapePassivitySetting setShowRoofShapePassivitySettingModal={setShowRoofShapePassivitySettingModal} />
|
||||
)}
|
||||
{showAuxiliaryModal && <AuxiliaryDrawing setShowAuxiliaryModal={setShowAuxiliaryModal} />}
|
||||
{showSlopeSettingModal && <Slope setShowSlopeSettingModal={setShowSlopeSettingModal} />}
|
||||
{showPlaceShapeDrawingModal && <PlacementShapeDrawing setShowPlaceShapeDrawingModal={setShowPlaceShapeDrawingModal} />}
|
||||
{showEavesGableEditModal && <EavesGableEdit setShowEavesGableEditModal={setShowEavesGableEditModal} />}
|
||||
{showMovementModal && <MovementSetting setShowMovementModal={setShowMovementModal} />}
|
||||
{showRoofAllocationSettingModal && <RoofAllocationSetting setShowRoofAllocationSettingModal={setShowRoofAllocationSettingModal} />}
|
||||
{showWallLineOffsetSettingModal && <WallLineOffsetSetting setShowWallLineOffsetSettingModal={setShowWallLineOffsetSettingModal} />}
|
||||
{showObjectSettingModal && <ObjectSetting setShowObjectSettingModal={setShowObjectSettingModal} />}
|
||||
{showPlacementSurfaceSettingModal && <PlacementSurfaceSetting setShowPlacementSurfaceSettingModal={setShowPlacementSurfaceSettingModal} />}
|
||||
{showBasicSettingModal && <BasicSetting setShowBasicSettingModal={setShowBasicSettingModal} />}
|
||||
{showCircuitTrestleSettingModal && <CircuitTrestleSetting setShowCircuitTrestleSettingModal={setShowCircuitTrestleSettingModal} />}
|
||||
</div>
|
||||
{showPlaceShapeModal && <PlacementShapeSetting setShowPlaceShapeModal={setShowPlaceShapeModal} />}
|
||||
{showRoofShapeSettingModal && <RoofShapeSetting setShowRoofShapeSettingModal={setShowRoofShapeSettingModal} />}
|
||||
{showRoofShapePassivitySettingModal && (
|
||||
<RoofShapePassivitySetting setShowRoofShapePassivitySettingModal={setShowRoofShapePassivitySettingModal} />
|
||||
)}
|
||||
{showAuxiliaryModal && <AuxiliaryDrawing setShowAuxiliaryModal={setShowAuxiliaryModal} />}
|
||||
{showSlopeSettingModal && <Slope setShowSlopeSettingModal={setShowSlopeSettingModal} />}
|
||||
{showPlaceShapeDrawingModal && <PlacementShapeDrawing setShowPlaceShapeDrawingModal={setShowPlaceShapeDrawingModal} />}
|
||||
{showEavesGableEditModal && <EavesGableEdit setShowEavesGableEditModal={setShowEavesGableEditModal} />}
|
||||
{showMovementModal && <MovementSetting setShowMovementModal={setShowMovementModal} />}
|
||||
{showRoofAllocationSettingModal && <RoofAllocationSetting setShowRoofAllocationSettingModal={setShowRoofAllocationSettingModal} />}
|
||||
{showWallLineOffsetSettingModal && <WallLineOffsetSetting setShowWallLineOffsetSettingModal={setShowWallLineOffsetSettingModal} />}
|
||||
{showObjectSettingModal && <ObjectSetting setShowObjectSettingModal={setShowObjectSettingModal} />}
|
||||
{showPlacementSurfaceSettingModal && <PlacementSurfaceSetting setShowPlacementSurfaceSettingModal={setShowPlacementSurfaceSettingModal} />}
|
||||
{showBasicSettingModal && <BasicSetting setShowBasicSettingModal={setShowBasicSettingModal} />}
|
||||
{showCircuitTrestleSettingModal && <CircuitTrestleSetting setShowCircuitTrestleSettingModal={setShowCircuitTrestleSettingModal} />}
|
||||
</div>
|
||||
</>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user