📌fix: add popup handle

This commit is contained in:
yoosangwook 2025-02-13 18:03:32 +09:00
parent 9f6bbdf01c
commit dff5ee3cd2
42 changed files with 84 additions and 0 deletions

View File

@ -51,6 +51,8 @@ export default function ColorPickerModal(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="color-setting-wrap">
<div className="color-tit">COLOR PICKER</div>
<div className="color-picker">

View File

@ -82,6 +82,8 @@ export default function FontSetting(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="slope-wrap">
<div className="font-option-warp">
<div className="font-option-item">

View File

@ -86,6 +86,8 @@ export default function ImgLoad() {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="img-flex-box">
<span className="normal-font mr10">{getMessage('modal.image.load.size.rotate')}</span>
<label className="toggle-btn">

View File

@ -22,6 +22,8 @@ export default function Slope({ id, pos = { x: 50, y: 230 } }) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="slope-wrap">
<div className="outline-form">
<span className="mr10" style={{ width: 'auto' }}>

View File

@ -133,6 +133,8 @@ export default function AuxiliaryDrawing({ id, pos = { x: 50, y: 230 } }) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="modal-btn-wrap">
{types.map((type, idx) => (
<button key={idx} className={`btn-frame modal ${buttonAct === type.id ? 'act' : ''}`} onClick={() => onClickButton(type)}>

View File

@ -64,6 +64,8 @@ export default function AuxiliaryEdit(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="grid-option-tit">{getMessage(type === 'copy' ? 'modal.auxiliary.copy.info' : 'modal.auxiliary.move.info')}</div>
<div className="grid-option-wrap">
<div className="grid-option-box">

View File

@ -120,6 +120,8 @@ export default function AuxiliarySize(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="discrimination-box mb10">
<div className="d-check-radio pop mb10">
<input type="radio" name="radio01" id="ra01" onClick={(e) => setCheckedRadio(1)} />

View File

@ -144,6 +144,8 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="roof-module-tab">
<div className={`module-tab-bx act`}>{getMessage('modal.module.basic.setting.orientation.setting')}</div>
<span className={`tab-arr ${tabNum !== 1 ? 'act' : ''}`}></span>

View File

@ -509,6 +509,8 @@ export default function CircuitTrestleSetting({ id }) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="roof-module-tab">
<div className={`module-tab-bx act`}>{getMessage('modal.circuit.trestle.setting.power.conditional.select')}</div>
<span className={`tab-arr ${tabNum === 2 ? 'act' : ''}`}></span>

View File

@ -92,6 +92,8 @@ export default function DimensionLineSetting(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="guide">{getMessage('modal.display.edit.info')}</div>
<div className="mb-box">
<div className="slope-wrap">

View File

@ -25,6 +25,8 @@ export default function Distance(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="slope-wrap">
<div className="eaves-keraba-table">
<div className="eaves-keraba-item">

View File

@ -47,6 +47,8 @@ export default function EavesGableEdit({ id, pos = { x: 50, y: 230 } }) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="modal-btn-wrap">
{buttonMenu.map((item) => (
<button key={item.id} className={`btn-frame modal ${type === item.type ? 'act' : ''}`} onClick={() => setType(item.type)}>

View File

@ -72,6 +72,8 @@ export default function FlowDirectionSetting(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="drawing-flow-wrap">
<div className="discrimination-box">
<div className="discrimination-tit mb15">{getMessage('modal.flow.direction.setting')}</div>

View File

@ -192,6 +192,8 @@ export default function DotLineGrid(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="grid-check-form">
<div className="d-check-box pop">
<input type="checkbox" id="ch01" value={TYPE.DOT} onChange={handleCheckBoxChange} checked={copyCurrentSetting.DOT} />

View File

@ -29,6 +29,8 @@ export default function GridCopy(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="grid-option-tit">{getMessage('modal.grid.copy.info')}</div>
<div className="grid-option-wrap">
<div className="grid-option-box">

View File

@ -82,6 +82,8 @@ export default function GridMove(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="grid-option-tit">{getMessage('modal.grid.move.info')}</div>
<div className="grid-option-wrap">
<div className="d-check-box pop mb10">

View File

@ -59,6 +59,8 @@ export default function LinePropertySetting(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="guide">
<span className="mb10">{getMessage('modal.line.property.edit.info')}</span>
<span>

View File

@ -23,6 +23,8 @@ export default function CircuitNumberEdit(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="grid-option-tit"> {getMessage('modal.module.circuit.number.edit.info')}</div>
<div className="grid-option-wrap">
<div className="grid-option-box">

View File

@ -105,6 +105,8 @@ export default function PanelEdit(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="grid-option-tit">
{getMessage([PANEL_EDIT_TYPE.MOVE, PANEL_EDIT_TYPE.COLUMN_MOVE].includes(type) ? 'modal.move.setting.info' : 'modal.copy.setting.info')}
</div>

View File

@ -33,6 +33,8 @@ export default function ColumnInsert(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="properties-setting-wrap">
<div className="setting-tit">{getMessage('modal.panel.column.insert.info')}</div>
<div className="additional-wrap">

View File

@ -36,6 +36,8 @@ export default function ColumnRemove(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="properties-setting-wrap">
<div className="setting-tit">{getMessage('modal.panel.column.remove.info')}</div>
<div className="additional-wrap">

View File

@ -33,6 +33,8 @@ export default function RowInsert(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="properties-setting-wrap">
<div className="setting-tit">{getMessage('modal.row.insert.info')}</div>
<div className="additional-wrap">

View File

@ -36,6 +36,8 @@ export default function RowRemove(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="properties-setting-wrap">
<div className="setting-tit">{getMessage('modal.row.remove.info')}</div>
<div className="additional-wrap">

View File

@ -25,6 +25,8 @@ export default function MovementSetting({ id, pos = { x: 50, y: 230 } }) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="modal-btn-wrap">
{buttonType.map((item) => (
<button key={item.id} className={`btn-frame modal ${type === item.type ? 'act' : ''}`} onClick={() => setType(item.type)}>

View File

@ -49,6 +49,8 @@ export default function DormerOffset(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="grid-option-tit">{getMessage('modal.dormer.offset.info')}</div>
<div className="grid-option-wrap">
<div className="grid-option-box">

View File

@ -84,6 +84,8 @@ export default function ObjectSetting({ id, pos = { x: 50, y: 230 } }) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="modal-btn-wrap">
{buttonMenu.map((item) => (
<button key={item.id} className={`btn-frame modal ${buttonAct === item.id ? 'act' : ''}`} onClick={() => setButtonAct(item.id)}>

View File

@ -30,6 +30,8 @@ export default function RoofMaterialSetting(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="slope-wrap">
<div className="grid-select">
<QSelectBox title={'지붕재 선택'} options={roofMaterials} />

View File

@ -54,6 +54,8 @@ export default function SizeSetting(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="slope-wrap">
<div className="size-option-top">
<div className="size-option-wrap">

View File

@ -17,6 +17,8 @@ export default function PropertiesSetting(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="properties-guide">{getMessage('modal.canvas.setting.wallline.properties.setting.info')}</div>
<div className="properties-setting-wrap">
<div className="setting-tit">{getMessage('setting')}</div>

View File

@ -121,6 +121,8 @@ export default function WallLineSetting(props) {
<button className="modal-close" onClick={() => closePopup(id)}></button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="modal-btn-wrap">
<button
className={`btn-frame modal ${type === OUTER_LINE_TYPE.OUTER_LINE ? 'act' : ''}`}

View File

@ -130,6 +130,8 @@ export default function PlacementShapeDrawing({ id, pos = { x: 50, y: 230 } }) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="modal-btn-wrap">
{types.map((type, idx) => (
<button

View File

@ -194,6 +194,8 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, set
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="placement-table">
<table>
<colgroup>

View File

@ -253,6 +253,8 @@ export default function PlacementSurfaceSetting({ id, pos = { x: 50, y: 230 } })
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="plane-frame-wrap">
<div className="plane-shape-wrap">
<div className="plane-shape-menu">

View File

@ -70,6 +70,8 @@ export default function ActualSizeSetting(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="guide">
<span>{getMessage('modal.actual.size.setting.info')}</span>
</div>

View File

@ -57,6 +57,8 @@ export default function ContextRoofAllocationSetting(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="properties-guide">{getMessage('modal.roof.alloc.info')}</div>
<div className="allocation-select-wrap">
<span>{getMessage('modal.roof.alloc.select.roof.material')}</span>

View File

@ -57,6 +57,8 @@ export default function RoofAllocationSetting(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="properties-guide">{getMessage('modal.roof.alloc.info')}</div>
<div className="allocation-select-wrap">
<span>{getMessage('modal.roof.alloc.select.roof.material')}</span>

View File

@ -38,6 +38,8 @@ export default function RoofShapePassivitySetting({ id, pos = { x: 50, y: 230 }
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="modal-btn-wrap">
{buttons.map((button) => (
<button key={button.id} className={`btn-frame modal ${type === button.type ? 'act' : ''}`} onClick={() => setType(button.type)}>

View File

@ -97,6 +97,8 @@ export default function RoofShapeSetting({ id, pos = { x: 50, y: 230 } }) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="roof-shape-menu">
{shapeMenu.map((item) => (
<button key={item.id} className={`shape-menu-box ${shapeNum === item.id ? 'act' : ''}`} onClick={() => setShapeNum(item.id)}>

View File

@ -82,6 +82,8 @@ export default function SettingModal01(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="modal-btn-wrap">
<button className={`btn-frame modal ${buttonAct === 1 ? 'act' : ''}`} onClick={() => handleBtnClick(1)}>
{getMessage('modal.canvas.setting.display')}

View File

@ -205,6 +205,8 @@ export default function DimensionLineSetting(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="font-btn-wrap">
<button className="btn-frame modal" onClick={() => popupHandle('font')}>
{getMessage('modal.font.setting')}

View File

@ -70,6 +70,8 @@ export default function PlanSizeSetting(props) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="slope-wrap">
<div className="outline-form mb10">
<span style={{ width: 'auto' }}>{getMessage('common.horizon')}</span>

View File

@ -48,6 +48,8 @@ export default function WallLineOffsetSetting({ id, pos = { x: 50, y: 230 } }) {
</button>
</div>
<div className="modal-body">
<div className="left-bar modal-handle"></div>
<div className="right-bar modal-handle"></div>
<div className="modal-btn-wrap">
{buttonMenu.map((item) => (
<button key={item.id} className={`btn-frame modal ${type === item.type ? 'act' : ''}`} onClick={() => setType(item.type)}>