기본설정 -> 모듈 퍼블 수정
This commit is contained in:
김민식
parent
c212607251
commit
6ebe12f4c5
@ -81,178 +81,182 @@ export default function Module({}) {
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="module-table-flex-wrap mb10">
|
||||
<div className="module-table-box">
|
||||
<div className="module-table-inner">
|
||||
<div className="outline-form mb10">
|
||||
<span className="mr10">{getMessage('modal.module.basic.setting.module.setting')}</span>
|
||||
<div className="grid-select">
|
||||
{moduleList && (
|
||||
<QSelectBox
|
||||
options={moduleList}
|
||||
value={moduleSelectionInitParams}
|
||||
targetKey={'moduleTpCd'}
|
||||
sourceKey={'itemTp'}
|
||||
showKey={'itemNm'}
|
||||
onChange={handleChangeModule}
|
||||
/>
|
||||
)}
|
||||
<div className="roof-module-tab2-overflow">
|
||||
<div className="module-table-flex-wrap mb10">
|
||||
<div className="module-table-box">
|
||||
<div className="module-table-inner">
|
||||
<div className="outline-form mb10">
|
||||
<span className="mr10">{getMessage('modal.module.basic.setting.module.setting')}</span>
|
||||
<div className="grid-select">
|
||||
{moduleList && (
|
||||
<QSelectBox
|
||||
options={moduleList}
|
||||
value={moduleSelectionInitParams}
|
||||
targetKey={'moduleTpCd'}
|
||||
sourceKey={'itemTp'}
|
||||
showKey={'itemNm'}
|
||||
onChange={handleChangeModule}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
<div className="roof-module-table">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
{moduleData.header.map((header) => {
|
||||
return (
|
||||
<th key={header.prop} style={{ width: header.width ? header.width + 'px' : '' }}>
|
||||
{header.name}
|
||||
</th>
|
||||
)
|
||||
})}
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{selectedModules.itemList &&
|
||||
selectedModules.itemList.map((row) => (
|
||||
<>
|
||||
<tr>
|
||||
<td>
|
||||
<div className="color-wrap">
|
||||
<span className="color-box" style={{ backgroundColor: row.color }}></span>
|
||||
<span className="name">{row.itemNm}</span>
|
||||
</div>
|
||||
</td>
|
||||
<td className="al-r">{Number(row.shortAxis).toFixed(0)}</td>
|
||||
<td className="al-r">{Number(row.longAxis).toFixed(0)}</td>
|
||||
<td className="al-r">{Number(row.wpOut).toFixed(0)}</td>
|
||||
</tr>
|
||||
</>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
<div className="roof-module-table">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
{moduleData.header.map((header) => {
|
||||
return (
|
||||
<th key={header.prop} style={{ width: header.width ? header.width + 'px' : '' }}>
|
||||
{header.name}
|
||||
</th>
|
||||
)
|
||||
})}
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{selectedModules.itemList &&
|
||||
selectedModules.itemList.map((row) => (
|
||||
<>
|
||||
<tr>
|
||||
<td>
|
||||
<div className="color-wrap">
|
||||
<span className="color-box" style={{ backgroundColor: row.color }}></span>
|
||||
<span className="name">{row.itemNm}</span>
|
||||
</div>
|
||||
</td>
|
||||
<td className="al-r">{Number(row.shortAxis).toFixed(0)}</td>
|
||||
<td className="al-r">{Number(row.longAxis).toFixed(0)}</td>
|
||||
<td className="al-r">{Number(row.wpOut).toFixed(0)}</td>
|
||||
</tr>
|
||||
</>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="module-table-box none-flex">
|
||||
<div className="module-table-inner">
|
||||
<div className="module-table-tit">{getMessage('modal.module.basic.setting.module.stuff.info')}</div>
|
||||
<div className="eaves-keraba-table">
|
||||
<div className="eaves-keraba-item">
|
||||
<div className="eaves-keraba-th">{getMessage('modal.module.basic.setting.module.surface.type')}</div>
|
||||
<div className="eaves-keraba-td">
|
||||
<div className="outline-form">
|
||||
<div className="grid-select" style={{ width: '95.77px', flex: 'none' }}>
|
||||
{roughnessCodes.length > 0 && (
|
||||
<QSelectBox
|
||||
options={roughnessCodes}
|
||||
value={managementState}
|
||||
targetKey={'surfaceTypeValue'}
|
||||
sourceKey={'clCode'}
|
||||
showKey={'clCodeNm'}
|
||||
onChange={handleChangeSurfaceType}
|
||||
|
||||
<div className="module-table-box none-flex">
|
||||
<div className="module-table-inner">
|
||||
<div className="module-table-tit">{getMessage('modal.module.basic.setting.module.stuff.info')}</div>
|
||||
<div className="eaves-keraba-table">
|
||||
<div className="eaves-keraba-item">
|
||||
<div className="eaves-keraba-th">{getMessage('modal.module.basic.setting.module.surface.type')}</div>
|
||||
<div className="eaves-keraba-td">
|
||||
<div className="outline-form">
|
||||
<div className="grid-select">
|
||||
{roughnessCodes.length > 0 && (
|
||||
<QSelectBox
|
||||
options={roughnessCodes}
|
||||
value={managementState}
|
||||
targetKey={'surfaceTypeValue'}
|
||||
sourceKey={'clCode'}
|
||||
showKey={'clCodeNm'}
|
||||
onChange={handleChangeSurfaceType}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div className="eaves-keraba-item">
|
||||
<div className="eaves-keraba-th">{getMessage('modal.module.basic.setting.module.fitting.height')}</div>
|
||||
<div className="eaves-keraba-td">
|
||||
<div className="outline-form">
|
||||
<div className="grid-select mr10">
|
||||
<input
|
||||
type="text"
|
||||
className="input-origin block"
|
||||
value={inputInstallHeight}
|
||||
onChange={(e) => setInputInstallHeight(e.target.value)}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
<span className="thin">mm</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="eaves-keraba-item">
|
||||
<div className="eaves-keraba-th">{getMessage('modal.module.basic.setting.module.fitting.height')}</div>
|
||||
<div className="eaves-keraba-td">
|
||||
<div className="outline-form">
|
||||
<div className="grid-select mr10">
|
||||
<input
|
||||
type="text"
|
||||
className="input-origin block"
|
||||
value={inputInstallHeight}
|
||||
onChange={(e) => setInputInstallHeight(e.target.value)}
|
||||
/>
|
||||
<div className="eaves-keraba-item">
|
||||
<div className="eaves-keraba-th">{getMessage('modal.module.basic.setting.module.standard.wind.speed')}</div>
|
||||
<div className="eaves-keraba-td">
|
||||
<div className="outline-form">
|
||||
<div className="grid-select mr10">
|
||||
{windSpeedCodes.length > 0 && managementState && (
|
||||
<QSelectBox
|
||||
title={''}
|
||||
options={windSpeedCodes}
|
||||
value={managementState}
|
||||
targetKey={'standardWindSpeedId'}
|
||||
sourceKey={'clCode'}
|
||||
showKey={'clCodeNm'}
|
||||
onChange={handleChangeWindSpeed}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
<span className="thin">m/s</span>
|
||||
</div>
|
||||
<span className="thin">mm</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="eaves-keraba-item">
|
||||
<div className="eaves-keraba-th">{getMessage('modal.module.basic.setting.module.standard.wind.speed')}</div>
|
||||
<div className="eaves-keraba-td">
|
||||
<div className="outline-form">
|
||||
<div className="grid-select mr10">
|
||||
{windSpeedCodes.length > 0 && managementState && (
|
||||
<QSelectBox
|
||||
title={''}
|
||||
options={windSpeedCodes}
|
||||
value={managementState}
|
||||
targetKey={'standardWindSpeedId'}
|
||||
sourceKey={'clCode'}
|
||||
showKey={'clCodeNm'}
|
||||
onChange={handleChangeWindSpeed}
|
||||
<div className="eaves-keraba-item">
|
||||
<div className="eaves-keraba-th">{getMessage('modal.module.basic.setting.module.standard.snowfall.amount')}</div>
|
||||
<div className="eaves-keraba-td">
|
||||
<div className="outline-form">
|
||||
<div className="grid-select mr10">
|
||||
<input
|
||||
type="text"
|
||||
className="input-origin block"
|
||||
value={inputVerticalSnowCover}
|
||||
onChange={(e) => setInputVerticalSnowCover(e.target.value)}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
<span className="thin">mm</span>
|
||||
</div>
|
||||
<span className="thin">m/s</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="eaves-keraba-item">
|
||||
<div className="eaves-keraba-th">{getMessage('modal.module.basic.setting.module.standard.snowfall.amount')}</div>
|
||||
<div className="eaves-keraba-td">
|
||||
<div className="outline-form">
|
||||
<div className="grid-select mr10">
|
||||
<input
|
||||
type="text"
|
||||
className="input-origin block"
|
||||
value={inputVerticalSnowCover}
|
||||
onChange={(e) => setInputVerticalSnowCover(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
<span className="thin">mm</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="module-table-box mb10">
|
||||
<div className="module-box-tab">
|
||||
|
||||
<div className="module-table-box mb10">
|
||||
<div className="module-box-tab">
|
||||
{addedRoofs &&
|
||||
addedRoofs.map((roof, index) => (
|
||||
<button key={index} className={`module-btn ${roofTab === index ? 'act' : ''}`} onClick={() => (roof ? handleRoofTab(index) : null)}>
|
||||
{roof !== undefined ? `屋根材${index + 1}` : '-'}
|
||||
</button>
|
||||
))}
|
||||
</div>
|
||||
{addedRoofs &&
|
||||
addedRoofs.map((roof, index) => (
|
||||
<button key={index} className={`module-btn ${roofTab === index ? 'act' : ''}`} onClick={() => (roof ? handleRoofTab(index) : null)}>
|
||||
{roof !== undefined ? `屋根材${index + 1}` : '-'}
|
||||
</button>
|
||||
<div style={{ display: roofTab === index ? 'block' : 'none' }} key={index}>
|
||||
<ModuleTabContents
|
||||
key={index}
|
||||
index={index}
|
||||
addRoof={roof}
|
||||
roofTab={index}
|
||||
moduleCommonSelectionData={moduleSelectionData.common}
|
||||
moduleConstructionSelectionData={moduleSelectionData.roofConstructions[index]}
|
||||
setModuleSelectionData={setModuleSelectionData}
|
||||
tempModuleSelectionData={tempModuleSelectionData}
|
||||
setTempModuleSelectionData={setTempModuleSelectionData}
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
{addedRoofs &&
|
||||
addedRoofs.map((roof, index) => (
|
||||
<div style={{ display: roofTab === index ? 'block' : 'none' }} key={index}>
|
||||
<ModuleTabContents
|
||||
key={index}
|
||||
index={index}
|
||||
addRoof={roof}
|
||||
roofTab={index}
|
||||
moduleCommonSelectionData={moduleSelectionData.common}
|
||||
moduleConstructionSelectionData={moduleSelectionData.roofConstructions[index]}
|
||||
setModuleSelectionData={setModuleSelectionData}
|
||||
tempModuleSelectionData={tempModuleSelectionData}
|
||||
setTempModuleSelectionData={setTempModuleSelectionData}
|
||||
/>
|
||||
</div>
|
||||
))}
|
||||
</div>
|
||||
|
||||
<div className="module-bottom">
|
||||
<div className="module-table-box ">
|
||||
<div className="warning-guide">
|
||||
<div className="warning">
|
||||
{getMessage('modal.module.basic.setting.module.setting.info1')}
|
||||
<br />
|
||||
{getMessage('modal.module.basic.setting.module.setting.info2')}
|
||||
<div className="module-bottom">
|
||||
<div className="module-table-box ">
|
||||
<div className="warning-guide">
|
||||
<div className="warning">
|
||||
{getMessage('modal.module.basic.setting.module.setting.info1')}
|
||||
<br />
|
||||
{getMessage('modal.module.basic.setting.module.setting.info2')}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
{/* 설정 오류시 노출 */}
|
||||
<div className="reset-word">※ 施工方法が選択できません。 基準風速または基準積雪量を確認してください。</div>
|
||||
</div>
|
||||
{/* 설정 오류시 노출 */}
|
||||
<div className="reset-word">※ 施工方法が選択できません。 基準風速または基準積雪量を確認してください。</div>
|
||||
</div>
|
||||
</>
|
||||
)
|
||||
|
||||
@ -284,6 +284,22 @@ export default function ModuleTabContents({
|
||||
{globalPitchText}）
|
||||
</div>
|
||||
<div className="eaves-keraba-table">
|
||||
<div className="eaves-keraba-item">
|
||||
<div className="eaves-keraba-th">マンドンピッチ</div>
|
||||
<div className="eaves-keraba-td">
|
||||
<div className="grid-select">
|
||||
<QSelectBox
|
||||
options={raftCodes}
|
||||
value={addRoof}
|
||||
sourceKey={'clCode'}
|
||||
targetKey={'raftBaseCd'}
|
||||
showKey={'clCodeNm'}
|
||||
disabled={roofMaterial.raftAuth === 'R' ? true : false}
|
||||
onChange={handleChangeRaftBase}
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="eaves-keraba-item">
|
||||
{roofMaterial && ['C'].includes(roofMaterial.lenAuth) && (
|
||||
<>
|
||||
@ -308,20 +324,18 @@ export default function ModuleTabContents({
|
||||
<>
|
||||
<div className="eaves-keraba-th">{getMessage('modal.module.basic.setting.module.rafter.margin')}</div>
|
||||
<div className="eaves-keraba-td">
|
||||
<div className="keraba-flex">
|
||||
<div className="grid-select">
|
||||
{raftCodes.length > 0 && (
|
||||
<QSelectBox
|
||||
options={raftCodes}
|
||||
value={addRoof}
|
||||
sourceKey={'clCode'}
|
||||
targetKey={'raftBaseCd'}
|
||||
showKey={'clCodeNm'}
|
||||
disabled={roofMaterial.raftAuth === 'R' ? true : false}
|
||||
onChange={handleChangeRaftBase}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
<div className="grid-select">
|
||||
{raftCodes.length > 0 && (
|
||||
<QSelectBox
|
||||
options={raftCodes}
|
||||
value={addRoof}
|
||||
sourceKey={'clCode'}
|
||||
targetKey={'raftBaseCd'}
|
||||
showKey={'clCodeNm'}
|
||||
disabled={roofMaterial.raftAuth === 'R' ? true : false}
|
||||
onChange={handleChangeRaftBase}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
</div>
|
||||
</>
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user