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

feat: 도면 이미지 로드 기능 마크업 분리

Browse Source
This commit is contained in:
yoosangwook 2024-11-12 10:45:04 +09:00
parent 99aa175a1f
commit 81c9111477
3 changed files with 66 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
public/static/images/canvas/side_icon10.svg Normal file
View File

@ -0,0 +1,4 @@
<svg width="17" height="16" viewBox="0 0 17 16" fill="none" xmlns="http://www.w3.org/2000/svg">
<path d="M4.75 3.94737H12.0625C13.6425 3.94737 14.4325 3.94737 15 4.31991C15.2457 4.48119 15.4567 4.68842 15.6208 4.92979C16 5.48734 16 6.26349 16 7.81579C16 8.02719 16.0003 8.01008 16 8.36842M8.5 3.94737L8.02492 3.01388C7.63134 2.24053 7.27167 1.46209 6.39944 1.14074C6.01742 1 5.58102 1 4.7082 1C3.34585 1 2.66467 1 2.15355 1.28023C1.7892 1.47999 1.48857 1.77535 1.28524 2.13331C1 2.63547 1 3.30469 1 4.64315V6.89474C1 10.3682 1 12.105 2.09835 13.1841C3.11612 14.184 4.7087 14.2574 7.75 14.2627" stroke="white" stroke-linecap="round"/>
<path d="M12.7793 14.5884C13.3445 15.1372 14.2609 15.1372 14.8261 14.5884C15.3914 14.0396 15.3914 13.1498 14.8261 12.601L13.5469 11.3589C13.0473 10.8739 12.2733 10.8175 11.71 11.19M11.7208 9.51684C11.1556 8.96805 10.2392 8.96805 9.67397 9.51684C9.10876 10.0656 9.10876 10.9554 9.67397 11.5042L10.9532 12.7463C11.462 13.2403 12.2554 13.2896 12.8211 12.8942" stroke="white" stroke-linecap="round"/>
</svg>
Side by Side

After

Width:  |  Height:  |  Size: 1.0 KiB

1
src/components/floor-plan/CanvasMenu.jsx
View File

@ -235,6 +235,7 @@ export default function CanvasMenu(props) {
<QSelectBox title={'瓦53A'} option={SelectOption} />
</div>
<div className="btn-from">
<button className="btn10"></button>
{/*<button className="btn04" onClick={() => setShowCanvasSettingModal(true)}></button>*/}
<button className="btn04" onClick={handlePopup}></button>
<button className="btn05"></button>

61
src/components/floor-plan/modal/ImgLoad.jsx Normal file
View File

@ -0,0 +1,61 @@
import WithDraggable from '@/components/common/draggable/WithDraggable'
export default function ImgLoad() {
return (
<WithDraggable isShow={true}>
<div className={`modal-pop-wrap r`}>
<div className="modal-head">
<h1 className="title">画像を読み込む </h1>
<button className="modal-close">닫기</button>
</div>
<div className="modal-body">
<div className="img-flex-box">
<span className="normal-font mr10">サイズ調整と回転</span>
<label className="toggle-btn">
<input type="checkbox" />
<span className="slider"></span>
</label>
</div>
<div className="img-load-from">
<div className="img-load-item">
<div className="d-check-radio pop">
<input type="radio" name="radio03" id="ra06" />
<label htmlFor="ra06">ファイルを読み込む</label>
</div>
<div className="img-flex-box">
<div className="img-edit-wrap">
<label className="img-edit-btn" htmlFor="img_file">
<span className="img-edit"></span>
ファイルの追加
</label>
<input type="file" id="img_file" style={{ display: 'none' }} />
</div>
<div className="img-name-wrap">
<input type="text" className="input-origin al-l" defaultValue={'IMG_Name.PNG'} readOnly />
<button className="img-check"></button>
</div>
</div>
</div>
<div className="img-load-item">
<div className="d-check-radio pop">
<input type="radio" name="radio03" id="ra06" />
<label htmlFor="ra06">アドレスを読み込む</label>
</div>
<div className="img-flex-box for-address">
<input type="text" className="input-origin al-l mr10" placeholder={'住所入力'} />
<div className="img-edit-wrap">
<button className="img-edit-btn">完了</button>
</div>
<span className="check-address fail"></span>
<span className="check-address success"></span>
</div>
</div>
</div>
<div className="grid-btn-wrap">
<button className="btn-frame modal act">完了</button>
</div>
</div>
</div>
</WithDraggable>
)
}