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

각 변 속성 변경 팝업 추가

Browse Source
This commit is contained in:
김창수 2024-10-04 14:25:53 +09:00
parent d70debe88a
commit f8ac3bcd80
3 changed files with 106 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/app/canvas/page.jsx
View File

@ -11,6 +11,7 @@ import DisplayChange from '@/components/canvas/modal/displaychange/DisplayChange
import DistanceMeasurement01 from '@/components/canvas/modal/distancemeasurement/DistanceMeasurement01'
import DistanceMeasurement02 from '@/components/canvas/modal/distancemeasurement/DistanceMeasurement02'
import DistanceMeasurement03 from '@/components/canvas/modal/distancemeasurement/DistanceMeasurement03'
import EachPropertyChange from '@/components/canvas/modal/eachpropertychange/EachPropertyChange'
import EvaseKerabaOption from '@/components/canvas/modal/eaves_keraba/EavesKerabaOption'
import GridCopy from '@/components/canvas/modal/gridoption/GridCopy'
import GridMove from '@/components/canvas/modal/gridoption/GridMove'
@ -109,6 +110,7 @@ export default function CanvasPage() {
{/* <DistanceMeasurement03/> */}
{/* 각 변 속성 변경 */}
<EachPropertyChange/>
</div>
</div>
</div>

94
src/components/canvas/modal/eachpropertychange/EachPropertyChange.jsx Normal file
View File

@ -0,0 +1,94 @@
import WithDraggable from "@/components/common/draggable/withDraggable";
export default function EachPropertyChange() {
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="guide">
<span className="mb10">属性を変更する辺を選択してください。</span>
<span>選択した値 [龍丸]</span>
</div>
<div className="properties-setting-wrap outer">
<div className="setting-tit">設定</div>
<div className="outline-wrap">
<div className="radio-grid-wrap">
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra01" />
<label htmlFor="ra01">軒先</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra02" />
<label htmlFor="ra02">ケラバ</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra03" />
<label htmlFor="ra03">龍丸</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra04" />
<label htmlFor="ra04">ケラバ左</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra05" />
<label htmlFor="ra05">ヨセムネ</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra06" />
<label htmlFor="ra06">ケラバ右</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra07" />
<label htmlFor="ra07">片側の流れ</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra08" />
<label htmlFor="ra08">谷</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra09" />
<label htmlFor="ra09">壁取り</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra10" />
<label htmlFor="ra10">Lの捨て渓谷</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra11" />
<label htmlFor="ra11">壁取り(型)</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra12" />
<label htmlFor="ra12">マンサード</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra13" />
<label htmlFor="ra13">壁取合(流れ)</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra14" />
<label htmlFor="ra14">設定なし</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra15" />
<label htmlFor="ra15">壁取合(流れ左)</label>
</div>
<div className="d-check-radio pop">
<input type="radio" name="radio01" id="ra16" />
<label htmlFor="ra16">壁取り(流れ右)</label>
</div>
</div>
</div>
</div>
<div className="grid-btn-wrap">
<button className="btn-frame modal act">保存</button>
</div>
</div>
</div>
</WithDraggable>
)
}

10
src/styles/_modal.scss
View File

@ -675,6 +675,9 @@ $alert-color: #101010;
&.sm{
margin-bottom: 15px;
}
span{
display: block;
}
}
// 지붕면 할당
@ -1011,4 +1014,11 @@ $alert-color: #101010;
font-size: $pop-normal-size;
font-weight: $pop-normal-weight;
color: #FFAFAF;
}
// 각 변 속성 변경
.radio-grid-wrap{
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 24px 15px;
}