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

퍼블 수정

Browse Source
This commit is contained in:
김민식 2025-02-05 09:54:08 +09:00
parent c48cfa8fe4
commit d92493b4e8
1 changed files with 169 additions and 156 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

325
src/components/floor-plan/modal/roofAllocation/ContextRoofAllocationSetting.jsx
View File

@ -45,175 +45,188 @@ export default function ContextRoofAllocationSetting(props) {
return ( return (
<WithDraggable isShow={true} pos={pos}> <WithDraggable isShow={true} pos={pos}>
<div className={`modal-pop-wrap lr mount`}> <div className={`modal-pop-wrap lr mount`}>
<div className="modal-head modal-handle"> {currentRoofList && (
<h1 className="title">{getMessage('plan.menu.estimate.roof.alloc')}</h1> <>
<button className="modal-close" onClick={() => closePopup(id)}> <div className="modal-head modal-handle">
닫기 <h1 className="title">{getMessage('plan.menu.estimate.roof.alloc')}</h1>
</button> <button className="modal-close" onClick={() => closePopup(id)}>
</div> 닫기
<div className="modal-body"> </button>
<div className="properties-guide">{getMessage('modal.roof.alloc.info')}</div>
<div className="allocation-select-wrap">
<span>{getMessage('modal.roof.alloc.select.roof.material')}</span>
<div className="grid-select">
<QSelectBox
options={roofMaterials}
value={roofMaterials[0]}
onChange={(e) => {
// const selected = roofMaterials.find((roofMaterial) => roofMaterial.roofMatlCd === e.id)
setCurrentRoofMaterial(e)
}}
showKey={'roofMatlNm'}
sourceKey={'roofMatlCd'}
targetKey={'roofMatlCd'}
/>
</div> </div>
<button <div className="modal-body">
className="allocation-edit" <div className="properties-guide">{getMessage('modal.roof.alloc.info')}</div>
onClick={() => { <div className="allocation-select-wrap">
onAddRoofMaterial() <span>{getMessage('modal.roof.alloc.select.roof.material')}</span>
}} <div className="grid-select">
> <QSelectBox
<i className="edit-ico"></i> options={roofMaterials}
{getMessage('modal.common.add')} value={roofMaterials[0]}
</button> onChange={(e) => {
</div> // const selected = roofMaterials.find((roofMaterial) => roofMaterial.roofMatlCd === e.id)
<div className="grid-option-wrap"> setCurrentRoofMaterial(e)
{currentRoofList.length > 0 && }}
currentRoofList.map((roof, index) => { showKey={'roofMatlNm'}
return ( sourceKey={'roofMatlCd'}
<div className="grid-option-box" key={index}> targetKey={'roofMatlCd'}
<div className="d-check-radio pop no-text"> />
<input type="radio" name="radio01" checked={roof.selected && 'checked'} readOnly={true} /> </div>
<label <button
htmlFor="ra01" className="allocation-edit"
onClick={(e) => { onClick={() => {
handleDefaultRoofMaterial(index) onAddRoofMaterial()
}} }}
></label> >
</div> <i className="edit-ico"></i>
<div className="grid-option-block-form"> {getMessage('modal.common.add')}
<div className="block-box"> </button>
<div className="flex-ment"> </div>
<div className="grid-select" style={{ width: '248px' }}> <div className="grid-option-overflow">
<QSelectBox <div className="grid-option-wrap">
options={roofMaterials} {currentRoofList.map((roof, index) => {
value={roof} return (
showKey={'roofMatlNm'} <div className="grid-option-box" key={index}>
sourceKey={'roofMatlCd'} <div className="d-check-radio pop no-text">
targetKey={'roofMatlCd'} <input type="radio" name="radio01" checked={roof.selected && 'checked'} readOnly={true} />
onChange={(e) => handleChangeRoofMaterial(e, index)} <label
/> htmlFor="ra01"
</div> onClick={(e) => {
{index === 0 && <span className="dec">{getMessage('modal.roof.alloc.default.roof.material')}</span>} handleDefaultRoofMaterial(index)
{index !== 0 && <button className="delete" onClick={() => onDeleteRoofMaterial(index)}></button>} }}
></label>
</div> </div>
</div> <div className="grid-option-block-form">
<div className="block-box"> <div className="block-box">
<div className="flex-ment">
<span>{getMessage('slope')}</span>
<div className="input-grid" style={{ width: '214px' }}>
<input
type="text"
className="input-origin block"
onChange={(e) => {
handleChangeInput(e, currentAngleType === 'slope' ? 'pitch' : 'angle', index)
}}
defaultValue={currentAngleType === 'slope' ? roof.pitch : roof.angle}
/>
</div>
<span>{pitchText}</span>
</div>
</div>
{(roof.widAuth || roof.lenAuth) && (
<div className="block-box">
{roof.widAuth && (
<div className="flex-ment"> <div className="flex-ment">
<span>W</span> <div className="grid-select">
<div className="input-grid" style={{ width: '100px' }}> <QSelectBox
<input type="text" className="input-origin block" defaultValue={roof.width} readOnly={roof.widAuth === 'R'} /> options={roofMaterials}
value={roof}
showKey={'roofMatlNm'}
sourceKey={'roofMatlCd'}
targetKey={'roofMatlCd'}
onChange={(e) => handleChangeRoofMaterial(e, index)}
/>
</div> </div>
{index === 0 && <span className="absol dec">{getMessage('modal.roof.alloc.default.roof.material')}</span>}
{index !== 0 && (
<span className="absol">
<button className="delete" onClick={() => onDeleteRoofMaterial(index)}></button>
</span>
)}
</div> </div>
)} </div>
{roof.lenAuth && ( <div className="block-box">
<div className="flex-ment"> <div className="flex-ment">
<span>L</span> <span>{getMessage('slope')}</span>
<div className="input-grid" style={{ width: '100px' }}> <div className="input-grid">
<input type="text" className="input-origin block" defaultValue={roof.length} readOnly={roof.lenAuth === 'R'} /> <input
type="text"
className="input-origin block"
onChange={(e) => {
handleChangeInput(e, currentAngleType === 'slope' ? 'pitch' : 'angle', index)
}}
defaultValue={currentAngleType === 'slope' ? roof.pitch : roof.angle}
/>
</div> </div>
<span className="absol">{pitchText}</span>
</div> </div>
)} </div>
</div> {(roof.widAuth || roof.lenAuth) && (
)} <>
{(roof.raftAuth || roof.roofPchAuth) && ( {roof.widAuth && (
<div className="block-box"> <div className="block-box">
{roof.raftAuth && ( <div className="flex-ment">
<div className="block-box"> <span>W</span>
<div className="flex-ment"> <div className="input-grid">
<span>{getMessage('modal.placement.initial.setting.rafter')}</span> <input type="text" className="input-origin block" defaultValue={roof.width} readOnly={roof.widAuth === 'R'} />
{raftCodes.length > 0 && ( </div>
<div className="grid-select" style={{ width: '160px' }}>
<QSelectBox
options={raftCodes}
value={roof}
showKey={'clCodeNm'}
sourceKey={'clCode'}
targetKey={roof.raft ? 'raft' : 'raftBaseCd'}
/>
</div> </div>
)}
</div>
</div>
)}
{roof.roofPchAuth && (
<div className="block-box">
<div className="flex-ment">
<span>{getMessage('hajebichi')}</span>
<div className="input-grid" style={{ width: '84px' }}>
<input
type="text"
className="input-origin block"
value={parseInt(roof.hajebichi)}
readOnly={roof.roofPchAuth === 'R'}
/>
</div> </div>
</div> )}
</div> {roof.lenAuth && (
<div className="block-box">
<div className="flex-ment">
<span>L</span>
<div className="input-grid">
<input type="text" className="input-origin block" defaultValue={roof.length} readOnly={roof.lenAuth === 'R'} />
</div>
</div>
</div>
)}
</>
)} )}
</div> {(roof.raftAuth || roof.roofPchAuth) && (
)} <>
<div className="block-box"> {roof.raftAuth && (
<div className="icon-btn-wrap"> <div className="block-box">
<button <div className="flex-ment">
className={roof.layout === ROOF_MATERIAL_LAYOUT.PARALLEL ? 'act' : ''} <span>{getMessage('modal.placement.initial.setting.rafter')}</span>
onClick={() => { {raftCodes.length > 0 && (
handleChangeLayout(ROOF_MATERIAL_LAYOUT.PARALLEL, index) <div className="grid-select">
}} <QSelectBox
> options={raftCodes}
{getMessage('modal.roof.alloc.select.parallel')} value={roof}
<i className="allocation01"></i> showKey={'clCodeNm'}
</button> sourceKey={'clCode'}
<button targetKey={roof.raft ? 'raft' : 'raftBaseCd'}
className={roof.layout === ROOF_MATERIAL_LAYOUT.STAIRS ? 'act' : ''} />
onClick={() => { </div>
handleChangeLayout(ROOF_MATERIAL_LAYOUT.STAIRS, index) )}
}} </div>
> </div>
{getMessage('modal.roof.alloc.select.stairs')} <i className="allocation02"></i> )}
</button> {roof.roofPchAuth && (
<div className="block-box">
<div className="flex-ment">
<span>{getMessage('hajebichi')}</span>
<div className="input-grid">
<input
type="text"
className="input-origin block"
value={parseInt(roof.hajebichi)}
readOnly={roof.roofPchAuth === 'R'}
/>
</div>
</div>
</div>
)}
</>
)}
<div className="block-box">
<div className="icon-btn-wrap">
<button
className={roof.layout === ROOF_MATERIAL_LAYOUT.PARALLEL ? 'act' : ''}
onClick={() => {
handleChangeLayout(ROOF_MATERIAL_LAYOUT.PARALLEL, index)
}}
>
{getMessage('modal.roof.alloc.select.parallel')}
<i className="allocation01"></i>
</button>
<button
className={roof.layout === ROOF_MATERIAL_LAYOUT.STAIRS ? 'act' : ''}
onClick={() => {
handleChangeLayout(ROOF_MATERIAL_LAYOUT.STAIRS, index)
}}
>
{getMessage('modal.roof.alloc.select.stairs')} <i className="allocation02"></i>
</button>
</div>
</div>
</div> </div>
</div> </div>
</div> )
</div> })}
) </div>
})} </div>
</div> <div className="grid-btn-wrap">
<div className="grid-btn-wrap"> <button className="btn-frame modal act" onClick={handleSaveContext}>
<button className="btn-frame modal act" onClick={handleSaveContext}> {getMessage('modal.roof.alloc.apply')}
{getMessage('modal.roof.alloc.apply')} </button>
</button> </div>
</div> </div>
</div> </>
)}
<div className="modal-foot modal-handle"></div> <div className="modal-foot modal-handle"></div>
</div> </div>
</WithDraggable> </WithDraggable>