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