qcast3/qcast-front
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

면형상 배치 디자인 수정

Browse Source
This commit is contained in:
minsik 2024-10-30 18:07:14 +09:00
parent d760d1d654
commit de9b53fff3
2 changed files with 42 additions and 31 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

3
src/components/floor-plan/modal/placementSurface/PlacementSurface.jsx
View File

@ -49,7 +49,8 @@ const PlacementSurface = forwardRef((props, refs) => {
{lines?.map((line, index) => (
<div className="eaves-keraba-item" id={index} key={index}>
<div className="eaves-keraba-th">
{line.isDiagonal ? getMessage('modal.placement.surface.setting.diagonal.length') : num[index]}
{/*{line.isDiagonal ? getMessage('modal.placement.surface.setting.diagonal.length') : num[index]}*/}
{num[index]}
</div>
<div className="eaves-keraba-td">
<div className="outline-form">

70
src/components/floor-plan/modal/placementSurface/PlacementSurfaceSetting.jsx
View File

@ -241,7 +241,7 @@ export default function PlacementSurfaceSetting({ id, pos = { x: 50, y: 230 } })
return (
<WithDraggable isShow={true} pos={{ x: 50, y: 230 }}>
<div className={`modal-pop-wrap l-2`}>
<div className={`modal-pop-wrap lr-2`}>
<div className="modal-head">
<h1 className="title">{getMessage('plan.menu.placement.surface.arrangement')} </h1>
<button className="modal-close" onClick={() => closePopup(id)}>
@ -249,35 +249,45 @@ export default function PlacementSurfaceSetting({ id, pos = { x: 50, y: 230 } })
</button>
</div>
<div className="modal-body">
<div className="plane-shape-menu">
{types.map((type) => (
<button key={type.id} className={`shape-menu-box ${selectedType?.id === type.id ? 'act' : ''}`} onClick={() => setSelectedType(type)}>
<div className="shape-box">
<Image
src={`/static/images/canvas/plane_shape0${type?.id}.svg`}
alt="react"
width={0}
height={0}
style={{
width: 'auto',
height: 'auto',
transform: getInversionState(),
}}
/>
</div>
</button>
))}
</div>
<div className="shape-library">
<button className="library-btn ico01" onClick={() => setRotate((yInversion !== xInversion ? rotate - 1 : rotate + 1) % 4)}></button>
<button className="library-btn ico02" onClick={() => setYInversion(!yInversion)}></button>
<button className="library-btn ico03" onClick={() => setXInversion(!xInversion)}></button>
</div>
<PlacementSurface {...placementSurfaceProps} ref={surfaceRefs} />
<div className="grid-btn-wrap">
<button className="btn-frame modal act" onClick={applySurfaces}>
{getMessage('write')}
</button>
<div className="plane-frame-wrap">
<div className="plane-shape-wrap">
<div className="plane-shape-menu">
{types.map((type) => (
<button
key={type.id}
className={`shape-menu-box ${selectedType?.id === type.id ? 'act' : ''}`}
onClick={() => setSelectedType(type)}
>
<div className="shape-box">
<Image
src={`/static/images/canvas/plane_shape0${type?.id}.svg`}
alt="react"
width={0}
height={0}
style={{
width: 'auto',
height: 'auto',
transform: getInversionState(),
}}
/>
</div>
</button>
))}
</div>
<div className="shape-library">
<button className="library-btn ico01" onClick={() => setRotate((yInversion !== xInversion ? rotate - 1 : rotate + 1) % 4)}></button>
<button className="library-btn ico02" onClick={() => setYInversion(!yInversion)}></button>
<button className="library-btn ico03" onClick={() => setXInversion(!xInversion)}></button>
</div>
</div>
<div className="plane-detail-wrap">
<PlacementSurface {...placementSurfaceProps} ref={surfaceRefs} />
<div className="plane-shape-btn">
<button className="btn-frame modal act" onClick={applySurfaces}>
{getMessage('write')}
</button>
</div>
</div>
</div>
</div>
</div>