Compare commits
No commits in common. "6c6e5845ef0341b4125f19d16837ddcddaefbd86" and "82632b962e93eaaae4731c1cebbc1e90fc7b3516" have entirely different histories.
6c6e5845ef
...
82632b962e
@ -39,7 +39,7 @@ export default function QSelectBox({
|
||||
if (showKey !== '' && !value) {
|
||||
//value가 없으면 showKey가 있으면 우선 보여준다
|
||||
// return options[0][showKey]
|
||||
return title !== '' ? title : getMessage('selectbox.title')
|
||||
return title
|
||||
} else if (showKey !== '' && value) {
|
||||
//value가 있으면 sourceKey와 targetKey를 비교하여 보여준다
|
||||
|
||||
|
||||
@ -1,17 +1,12 @@
|
||||
import { useMessage } from '@/hooks/useMessage'
|
||||
import WithDraggable from '@/components/common/draggable/WithDraggable'
|
||||
import { useContext, useEffect, useRef, useState } from 'react'
|
||||
import Module from '@/components/floor-plan/modal/basic/step/Module'
|
||||
import PitchModule from '@/components/floor-plan/modal/basic/step/pitch/PitchModule'
|
||||
import PitchPlacement from '@/components/floor-plan/modal/basic/step/pitch/PitchPlacement'
|
||||
import Placement from '@/components/floor-plan/modal/basic/step/Placement'
|
||||
import { useRecoilValue, useRecoilState } from 'recoil'
|
||||
import {
|
||||
canvasSettingState,
|
||||
canvasState,
|
||||
checkedModuleState,
|
||||
isManualModuleLayoutSetupState,
|
||||
isManualModuleSetupState,
|
||||
toggleManualSetupModeState,
|
||||
} from '@/store/canvasAtom'
|
||||
import { canvasSettingState, canvasState, checkedModuleState, isManualModuleSetupState } from '@/store/canvasAtom'
|
||||
import { usePopup } from '@/hooks/usePopup'
|
||||
import { Orientation } from '@/components/floor-plan/modal/basic/step/Orientation'
|
||||
import { useModuleBasicSetting } from '@/hooks/module/useModuleBasicSetting'
|
||||
@ -34,10 +29,11 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
|
||||
const { getMessage } = useMessage()
|
||||
const { closePopup } = usePopup()
|
||||
const [tabNum, setTabNum] = useState(1)
|
||||
const canvasSetting = useRecoilValue(canvasSettingState)
|
||||
const orientationRef = useRef(null)
|
||||
const [isManualModuleSetup, setIsManualModuleSetup] = useRecoilState(isManualModuleSetupState)
|
||||
const [isManualModuleLayoutSetup, setIsManualModuleLayoutSetup] = useRecoilState(isManualModuleLayoutSetupState)
|
||||
const trestleRef = useRef(null)
|
||||
const { initEvent } = useEvent()
|
||||
const [isManualModuleSetup, setIsManualModuleSetup] = useRecoilState(isManualModuleSetupState)
|
||||
const [moduleSelectionData, setModuleSelectionData] = useRecoilState(moduleSelectionDataState)
|
||||
const [addedRoofs, setAddedRoofs] = useRecoilState(addedRoofsState)
|
||||
const loginUserState = useRecoilValue(loginUserStore)
|
||||
@ -47,9 +43,6 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
|
||||
const [isClosePopup, setIsClosePopup] = useState({ close: false, id: 0 })
|
||||
const [checkedModules, setCheckedModules] = useRecoilState(checkedModuleState)
|
||||
const [roofs, setRoofs] = useState(addedRoofs)
|
||||
const [manualSetupMode, setManualSetupMode] = useRecoilState(toggleManualSetupModeState)
|
||||
const [layoutSetup, setLayoutSetup] = useState([{}])
|
||||
|
||||
const {
|
||||
moduleSelectionInitParams,
|
||||
selectedModules,
|
||||
@ -78,10 +71,8 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
|
||||
const { trigger: trestleTrigger } = useCanvasPopupStatusController(2)
|
||||
const { trigger: placementTrigger } = useCanvasPopupStatusController(3)
|
||||
const roofsStore = useRecoilValue(roofsState)
|
||||
|
||||
// const { initEvent } = useContext(EventContext)
|
||||
const { manualModuleSetup, autoModuleSetup, manualFlatroofModuleSetup, autoFlatroofModuleSetup, manualModuleLayoutSetup } =
|
||||
useModuleBasicSetting(tabNum)
|
||||
const { manualModuleSetup, autoModuleSetup, manualFlatroofModuleSetup, autoFlatroofModuleSetup } = useModuleBasicSetting(tabNum)
|
||||
const { updateObjectDate } = useMasterController()
|
||||
|
||||
useEffect(() => {
|
||||
@ -133,7 +124,7 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
|
||||
|
||||
useEffect(() => {
|
||||
if (basicSetting.roofSizeSet !== '3') {
|
||||
manualModuleSetup()
|
||||
manualModuleSetup(placementRef)
|
||||
} else {
|
||||
manualFlatroofModuleSetup(placementFlatRef)
|
||||
}
|
||||
@ -172,7 +163,7 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
|
||||
|
||||
if (!trestleRef.current.isComplete()) {
|
||||
Swal.fire({
|
||||
title: getMessage('construction.length.difference'),
|
||||
title: getMessage('아직 멀었따'),
|
||||
icon: 'warning',
|
||||
})
|
||||
return
|
||||
@ -192,20 +183,20 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
|
||||
setTabNum(tabNum + 1)
|
||||
}
|
||||
|
||||
const placementRef = {
|
||||
isChidori: useRef('false'),
|
||||
setupLocation: useRef('eaves'),
|
||||
isMaxSetup: useRef('false'),
|
||||
}
|
||||
|
||||
const placementFlatRef = {
|
||||
setupLocation: useRef('south'),
|
||||
}
|
||||
|
||||
const handleManualModuleSetup = () => {
|
||||
setManualSetupMode(`manualSetup_${!isManualModuleSetup}`)
|
||||
setIsManualModuleSetup(!isManualModuleSetup)
|
||||
}
|
||||
|
||||
const handleManualModuleLayoutSetup = () => {
|
||||
setManualSetupMode(`manualLayoutSetup_${!isManualModuleLayoutSetup}`)
|
||||
setIsManualModuleLayoutSetup(!isManualModuleLayoutSetup)
|
||||
}
|
||||
|
||||
const updateObjectDataApi = async (params) => {
|
||||
const res = await updateObjectDate(params)
|
||||
}
|
||||
@ -216,9 +207,6 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
|
||||
if (isManualModuleSetup) {
|
||||
setIsManualModuleSetup(false)
|
||||
}
|
||||
if (isManualModuleLayoutSetup) {
|
||||
setIsManualModuleLayoutSetup(false)
|
||||
}
|
||||
}
|
||||
setIsClosePopup({ close: true, id: id })
|
||||
}
|
||||
@ -269,39 +257,8 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
|
||||
}
|
||||
const placementProps = {}
|
||||
|
||||
useEffect(() => {
|
||||
if (basicSetting.roofSizeSet !== '3') {
|
||||
if (manualSetupMode.indexOf('manualSetup') > -1) {
|
||||
manualModuleSetup()
|
||||
} else if (manualSetupMode.indexOf('manualLayoutSetup') > -1) {
|
||||
manualModuleLayoutSetup(layoutSetup)
|
||||
} else if (manualSetupMode.indexOf('off') > -1) {
|
||||
manualModuleSetup()
|
||||
manualModuleLayoutSetup(layoutSetup)
|
||||
}
|
||||
} else {
|
||||
manualFlatroofModuleSetup(placementFlatRef)
|
||||
}
|
||||
|
||||
if (isClosePopup.close) {
|
||||
closePopup(isClosePopup.id)
|
||||
}
|
||||
}, [manualSetupMode, isClosePopup])
|
||||
|
||||
useEffect(() => {
|
||||
if (isManualModuleLayoutSetup) {
|
||||
manualModuleLayoutSetup(layoutSetup)
|
||||
}
|
||||
}, [layoutSetup])
|
||||
|
||||
useEffect(() => {
|
||||
setIsManualModuleSetup(false)
|
||||
setIsManualModuleLayoutSetup(false)
|
||||
setManualSetupMode(`off`)
|
||||
}, [checkedModules])
|
||||
|
||||
return (
|
||||
<WithDraggable isShow={true} pos={pos} className={basicSetting.roofSizeSet && basicSetting.roofSizeSet != '3' ? 'll' : 'lx-2'}>
|
||||
<WithDraggable isShow={true} pos={pos} className="ll">
|
||||
<WithDraggable.Header title={getMessage('plan.menu.module.circuit.setting.default')} onClose={() => handleClosePopup(id)} />
|
||||
<WithDraggable.Body>
|
||||
<div className="roof-module-tab">
|
||||
@ -323,9 +280,8 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
|
||||
{tabNum === 1 && <Orientation ref={orientationRef} {...orientationProps} />}
|
||||
{/*배치면 초기설정 - 입력방법: 복시도 입력 || 실측값 입력*/}
|
||||
{basicSetting.roofSizeSet && basicSetting.roofSizeSet != '3' && tabNum === 2 && <Trestle ref={trestleRef} {...trestleProps} />}
|
||||
{basicSetting.roofSizeSet && basicSetting.roofSizeSet != '3' && tabNum === 3 && (
|
||||
<Placement setTabNum={setTabNum} layoutSetup={layoutSetup} setLayoutSetup={setLayoutSetup} />
|
||||
)}
|
||||
{basicSetting.roofSizeSet && basicSetting.roofSizeSet != '3' && tabNum === 3 && <Placement setTabNum={setTabNum} ref={placementRef} />}
|
||||
|
||||
{/*배치면 초기설정 - 입력방법: 육지붕*/}
|
||||
{/* {basicSetting.roofSizeSet && basicSetting.roofSizeSet == '3' && tabNum === 3 && <PitchModule setTabNum={setTabNum} />} */}
|
||||
{basicSetting.roofSizeSet && basicSetting.roofSizeSet == '3' && tabNum === 2 && (
|
||||
@ -351,13 +307,11 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
|
||||
<>
|
||||
{basicSetting.roofSizeSet && basicSetting.roofSizeSet != '3' && (
|
||||
<>
|
||||
<button className={`btn-frame modal mr5 ${isManualModuleLayoutSetup ? 'act' : ''}`} onClick={handleManualModuleLayoutSetup}>
|
||||
{getMessage('modal.module.basic.setting.row.batch')}
|
||||
</button>
|
||||
<button className="btn-frame modal mr5">{getMessage('modal.module.basic.setting.row.batch')}</button>
|
||||
<button className={`btn-frame modal mr5 ${isManualModuleSetup ? 'act' : ''}`} onClick={handleManualModuleSetup}>
|
||||
{getMessage('modal.module.basic.setting.passivity.placement')}
|
||||
</button>
|
||||
<button className="btn-frame modal act" onClick={() => autoModuleSetup()}>
|
||||
<button className="btn-frame modal act" onClick={() => autoModuleSetup(placementRef)}>
|
||||
{getMessage('modal.module.basic.setting.auto.placement')}
|
||||
</button>
|
||||
</>
|
||||
|
||||
@ -66,12 +66,12 @@ export const Orientation = forwardRef((props, ref) => {
|
||||
useEffect(() => {
|
||||
if (selectedSurfaceType) {
|
||||
console.log(roughnessCodes, selectedSurfaceType)
|
||||
setInputRoughness(roughnessCodes.find((code) => code.clCode === managementState?.surfaceTypeValue))
|
||||
setInputRoughness(roughnessCodes.find((code) => code.clCode === moduleSelectionData.common.illuminationTp))
|
||||
}
|
||||
}, [selectedSurfaceType])
|
||||
|
||||
useEffect(() => {
|
||||
if (standardWindSpeed) setInputStandardWindSpeed(windSpeedCodes.find((code) => code.clCode === managementState?.standardWindSpeedId))
|
||||
if (standardWindSpeed) setInputStandardWindSpeed(windSpeedCodes.find((code) => code.clCode === moduleSelectionData.common.stdWindSpeed))
|
||||
}, [standardWindSpeed])
|
||||
|
||||
useEffect(() => {
|
||||
@ -181,35 +181,11 @@ export const Orientation = forwardRef((props, ref) => {
|
||||
}
|
||||
|
||||
const handleChangeModule = (e) => {
|
||||
resetRoofs()
|
||||
setSelectedModules(e)
|
||||
}
|
||||
|
||||
const handleChangeRoughness = (e) => {
|
||||
resetRoofs()
|
||||
setInputRoughness(e)
|
||||
}
|
||||
|
||||
const handleChangeInstallHeight = (e) => {
|
||||
resetRoofs()
|
||||
setInputInstallHeight(e)
|
||||
}
|
||||
|
||||
const handleChangeStandardWindSpeed = (e) => {
|
||||
resetRoofs()
|
||||
setInputStandardWindSpeed(e)
|
||||
}
|
||||
|
||||
const handleChangeVerticalSnowCover = (e) => {
|
||||
resetRoofs()
|
||||
setInputVerticalSnowCover(e)
|
||||
}
|
||||
|
||||
const resetRoofs = () => {
|
||||
const newRoofs = addedRoofs.map((roof) => {
|
||||
return {
|
||||
...roof,
|
||||
lengthBase: null,
|
||||
raftBaseCd: null,
|
||||
trestleMkrCd: null,
|
||||
constMthdCd: null,
|
||||
constTp: null,
|
||||
@ -225,6 +201,7 @@ export const Orientation = forwardRef((props, ref) => {
|
||||
}
|
||||
})
|
||||
setRoofs(newRoofs)
|
||||
setSelectedModules(e)
|
||||
}
|
||||
|
||||
return (
|
||||
@ -382,7 +359,10 @@ export const Orientation = forwardRef((props, ref) => {
|
||||
targetKey={'clCode'}
|
||||
sourceKey={'clCode'}
|
||||
showKey={'clCodeNm'}
|
||||
onChange={(e) => handleChangeRoughness(e)}
|
||||
onChange={(e) => {
|
||||
console.log('🚀 ~ handleChangeModule ~ inputRoughness:', e)
|
||||
setInputRoughness(e)
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
@ -394,7 +374,7 @@ export const Orientation = forwardRef((props, ref) => {
|
||||
type="text"
|
||||
className="input-origin block"
|
||||
value={inputInstallHeight}
|
||||
onChange={(e) => handleChangeInstallHeight(e.target.value)}
|
||||
onChange={(e) => setInputInstallHeight(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
<span className="thin">m</span>
|
||||
@ -410,7 +390,10 @@ export const Orientation = forwardRef((props, ref) => {
|
||||
targetKey={'clCode'}
|
||||
sourceKey={'clCode'}
|
||||
showKey={'clCodeNm'}
|
||||
onChange={(e) => handleChangeStandardWindSpeed(e)}
|
||||
onChange={(e) => {
|
||||
console.log('🚀 ~ handleChangeModule ~ inputStandardWindSpeed:', e)
|
||||
setInputStandardWindSpeed(e)
|
||||
}}
|
||||
/>
|
||||
)}
|
||||
</div>
|
||||
@ -422,7 +405,7 @@ export const Orientation = forwardRef((props, ref) => {
|
||||
type="text"
|
||||
className="input-origin block"
|
||||
value={inputVerticalSnowCover}
|
||||
onChange={(e) => handleChangeVerticalSnowCover(e.target.value)}
|
||||
onChange={(e) => setInputVerticalSnowCover(e.target.value)}
|
||||
/>
|
||||
</div>
|
||||
<span className="thin">cm</span>
|
||||
|
||||
@ -1,41 +1,29 @@
|
||||
import { forwardRef, useEffect, useState } from 'react'
|
||||
import { useMessage } from '@/hooks/useMessage'
|
||||
import { useModuleBasicSetting } from '@/hooks/module/useModuleBasicSetting'
|
||||
import {
|
||||
checkedModuleState,
|
||||
isManualModuleLayoutSetupState,
|
||||
isManualModuleSetupState,
|
||||
moduleSetupOptionState,
|
||||
toggleManualSetupModeState,
|
||||
} from '@/store/canvasAtom'
|
||||
import { useRecoilState, useRecoilValue, useResetRecoilState, useSetRecoilState } from 'recoil'
|
||||
import { checkedModuleState, currentCanvasPlanState, isManualModuleSetupState } from '@/store/canvasAtom'
|
||||
import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil'
|
||||
import { moduleSelectionDataState, selectedModuleState } from '@/store/selectedModuleOptions'
|
||||
import { isObjectNotEmpty } from '@/util/common-utils'
|
||||
|
||||
const Placement = forwardRef((props, refs) => {
|
||||
const { getMessage } = useMessage()
|
||||
const [useTab, setUseTab] = useState(true)
|
||||
|
||||
const [isChidori, setIsChidori] = useState(false)
|
||||
const [isChidoriNotAble, setIsChidoriNotAble] = useState(false)
|
||||
|
||||
const [setupLocation, setSetupLocation] = useState('eaves')
|
||||
const [isMaxSetup, setIsMaxSetup] = useState('false')
|
||||
const [selectedItems, setSelectedItems] = useState({})
|
||||
|
||||
const [selectedModules, setSelectedModules] = useRecoilState(selectedModuleState)
|
||||
|
||||
const setCheckedModules = useSetRecoilState(checkedModuleState)
|
||||
const moduleSelectionData = useRecoilValue(moduleSelectionDataState)
|
||||
const { makeModuleInitArea, roofOutlineColor } = useModuleBasicSetting(3)
|
||||
const { makeModuleInitArea } = useModuleBasicSetting(3)
|
||||
|
||||
const [isMultiModule, setIsMultiModule] = useState(false)
|
||||
|
||||
//언마운트시 버튼 초기화
|
||||
const setIsManualModuleSetup = useSetRecoilState(isManualModuleSetupState)
|
||||
const setIsManualModuleLayoutSetup = useSetRecoilState(isManualModuleLayoutSetupState)
|
||||
const setManualSetupMode = useSetRecoilState(toggleManualSetupModeState)
|
||||
|
||||
const [moduleSetupOption, setModuleSetupOption] = useRecoilState(moduleSetupOptionState) //모듈 설치 옵션
|
||||
const resetModuleSetupOption = useResetRecoilState(moduleSetupOptionState)
|
||||
|
||||
const [colspan, setColspan] = useState(1)
|
||||
const [isManualModuleSetup, setIsManualModuleSetup] = useRecoilState(isManualModuleSetupState)
|
||||
|
||||
//모듈 배치면 생성
|
||||
useEffect(() => {
|
||||
@ -48,17 +36,10 @@ const Placement = forwardRef((props, refs) => {
|
||||
makeModuleInitArea(moduleSelectionData)
|
||||
}
|
||||
|
||||
if (moduleSelectionData.module.itemList.length > 1) {
|
||||
setColspan(2)
|
||||
}
|
||||
|
||||
return () => {
|
||||
// refs.isChidori.current = 'false'
|
||||
// refs.setupLocation.current = 'eaves'
|
||||
refs.isChidori.current = 'false'
|
||||
refs.setupLocation.current = 'eaves'
|
||||
setIsManualModuleSetup(false)
|
||||
setIsManualModuleLayoutSetup(false)
|
||||
setManualSetupMode('off')
|
||||
resetModuleSetupOption()
|
||||
}
|
||||
}, [])
|
||||
|
||||
@ -75,10 +56,8 @@ const Placement = forwardRef((props, refs) => {
|
||||
initCheckedModule = { ...initCheckedModule, [obj.itemId]: true }
|
||||
}
|
||||
})
|
||||
|
||||
setSelectedItems(initCheckedModule)
|
||||
setSelectedModules(moduleSelectionData.module)
|
||||
props.setLayoutSetup(moduleSelectionData.module.itemList.map((item) => ({ moduleId: item.itemId, col: 0, row: 0, checked: true })))
|
||||
}
|
||||
|
||||
//모듈 배치면 생성
|
||||
@ -103,75 +82,59 @@ const Placement = forwardRef((props, refs) => {
|
||||
header: [
|
||||
{ type: 'check', name: '', prop: 'check', width: 70 },
|
||||
{ type: 'color-box', name: getMessage('module'), prop: 'module' },
|
||||
{ type: 'text', name: getMessage('modal.module.basic.setting.module.placement.mix.asg.yn'), prop: 'mixAsgYn', width: 50 },
|
||||
{ type: 'text', name: `単数`, prop: 'rows', width: 60 },
|
||||
{ type: 'text', name: `熱水`, prop: 'cols', width: 60 },
|
||||
{ type: 'text', name: `${getMessage('output')} (W)`, prop: 'output', width: 70 },
|
||||
],
|
||||
rows: [],
|
||||
}
|
||||
|
||||
const handleChangeChidori = (e) => {
|
||||
const bool = e.target.value === 'true' ? true : false
|
||||
setModuleSetupOption({ ...moduleSetupOption, isChidori: bool })
|
||||
|
||||
//변경하면 수동 다 꺼짐
|
||||
setIsManualModuleSetup(false)
|
||||
setIsManualModuleLayoutSetup(false)
|
||||
setManualSetupMode('off')
|
||||
setIsChidori(bool)
|
||||
refs.isChidori.current = e.target.value
|
||||
}
|
||||
|
||||
const handleSetupLocation = (e) => {
|
||||
setModuleSetupOption({ ...moduleSetupOption, setupLocation: e.target.value })
|
||||
setSetupLocation(e.target.value)
|
||||
refs.setupLocation.current = e.target.value
|
||||
}
|
||||
|
||||
//변경하면 수동 다 꺼짐
|
||||
setIsManualModuleSetup(false)
|
||||
setIsManualModuleLayoutSetup(false)
|
||||
setManualSetupMode('off')
|
||||
const handleMaxSetup = (e) => {
|
||||
if (e.target.checked) {
|
||||
setIsMaxSetup('true')
|
||||
refs.isMaxSetup.current = 'true'
|
||||
} else {
|
||||
setIsMaxSetup('false')
|
||||
refs.isMaxSetup.current = 'false'
|
||||
}
|
||||
}
|
||||
|
||||
//체크된 모듈 아이디 추출
|
||||
const handleSelectedItem = (e, itemId) => {
|
||||
const handleSelectedItem = (e) => {
|
||||
setSelectedItems({ ...selectedItems, [e.target.name]: e.target.checked })
|
||||
|
||||
const newLayoutSetup = [...props.layoutSetup]
|
||||
props.layoutSetup.forEach((item, index) => {
|
||||
if (item.moduleId === itemId) {
|
||||
newLayoutSetup[index] = { ...props.layoutSetup[index], checked: e.target.checked }
|
||||
}
|
||||
})
|
||||
props.setLayoutSetup(newLayoutSetup)
|
||||
}
|
||||
|
||||
const handleLayoutSetup = (e, itemId, index) => {
|
||||
const newLayoutSetup = [...props.layoutSetup]
|
||||
newLayoutSetup[index] = {
|
||||
...newLayoutSetup[index],
|
||||
moduleId: itemId,
|
||||
[e.target.name]: Number(e.target.value),
|
||||
}
|
||||
props.setLayoutSetup(newLayoutSetup)
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<div className="module-table-flex-wrap">
|
||||
<div className="module-table-flex-wrap mb10">
|
||||
<div className="module-table-box">
|
||||
<div className="module-table-inner">
|
||||
<div className="roof-module-table">
|
||||
<table>
|
||||
<thead>
|
||||
{moduleData.header.map((data) => (
|
||||
<th key={data.prop} style={{ width: data.width ? data.width : '' }}>
|
||||
{data.type === 'check' ? (
|
||||
<div className="d-check-box no-text pop">
|
||||
<input type="checkbox" id="ch01" disabled />
|
||||
<label htmlFor="ch01"></label>
|
||||
</div>
|
||||
) : (
|
||||
data.name
|
||||
)}
|
||||
</th>
|
||||
))}
|
||||
<tr>
|
||||
{moduleData.header.map((data) => (
|
||||
<th key={data.prop} style={{ width: data.width ? data.width : '' }}>
|
||||
{data.type === 'check' ? (
|
||||
<div className="d-check-box no-text pop">
|
||||
<input type="checkbox" id="ch01" disabled />
|
||||
<label htmlFor="ch01"></label>
|
||||
</div>
|
||||
) : (
|
||||
data.name
|
||||
)}
|
||||
</th>
|
||||
))}
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{selectedModules.itemList &&
|
||||
@ -184,7 +147,7 @@ const Placement = forwardRef((props, refs) => {
|
||||
id={item.itemId}
|
||||
name={item.itemId}
|
||||
checked={selectedItems[item.itemId]}
|
||||
onChange={(e) => handleSelectedItem(e, item.itemId)}
|
||||
onChange={handleSelectedItem}
|
||||
/>
|
||||
<label htmlFor={item.itemId}></label>
|
||||
</div>
|
||||
@ -195,171 +158,90 @@ const Placement = forwardRef((props, refs) => {
|
||||
<span className="name">{item.itemNm}</span>
|
||||
</div>
|
||||
</td>
|
||||
<td className="al-c">
|
||||
<div className="color-wrap">
|
||||
<span className="name">{item.mixAsgYn}</span>
|
||||
</div>
|
||||
</td>
|
||||
<td className="al-r">
|
||||
<div className="input-grid">
|
||||
<input
|
||||
type="text"
|
||||
className="input-origin block"
|
||||
name="row"
|
||||
value={props.layoutSetup[index]?.row ?? 1}
|
||||
defaultValue={0}
|
||||
onChange={(e) => handleLayoutSetup(e, item.itemId, index)}
|
||||
/>
|
||||
</div>
|
||||
</td>
|
||||
<td className="al-r">
|
||||
<div className="input-grid">
|
||||
<input
|
||||
type="text"
|
||||
className="input-origin block"
|
||||
name="col"
|
||||
value={props.layoutSetup[index]?.col ?? 1}
|
||||
defaultValue={0}
|
||||
onChange={(e) => handleLayoutSetup(e, item.itemId, index)}
|
||||
/>
|
||||
</div>
|
||||
</td>
|
||||
<td className="al-r">{item.wpOut}</td>
|
||||
</tr>
|
||||
))}
|
||||
<tr>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
<td></td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="module-table-box non-flex">
|
||||
<div className="module-table-box">
|
||||
<div className="module-table-inner">
|
||||
<div className="roof-module-table">
|
||||
<table>
|
||||
<thead>
|
||||
<tr>
|
||||
<th>{getMessage('modal.module.basic.setting.module.placement.waterfowl.arrangement')}</th>
|
||||
<th>{getMessage('modal.module.basic.setting.module.placement.arrangement.standard')}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
<tr>
|
||||
<td>
|
||||
<div className="hexagonal-radio-wrap">
|
||||
<div className="d-check-radio pop mb10">
|
||||
<input
|
||||
type="radio"
|
||||
name="radio02"
|
||||
id="ra03"
|
||||
checked={moduleSetupOption.isChidori}
|
||||
disabled={isChidoriNotAble}
|
||||
value={'true'}
|
||||
onChange={(e) => handleChangeChidori(e)}
|
||||
/>
|
||||
<label htmlFor="ra03">{getMessage('modal.module.basic.setting.module.placement.do')}</label>
|
||||
</div>
|
||||
<div className="d-check-radio pop">
|
||||
<input
|
||||
type="radio"
|
||||
name="radio02"
|
||||
id="ra04"
|
||||
checked={!moduleSetupOption.isChidori}
|
||||
value={'false'}
|
||||
onChange={(e) => handleChangeChidori(e)}
|
||||
/>
|
||||
<label htmlFor="ra04">{getMessage('modal.module.basic.setting.module.placement.do.not')}</label>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
<td>
|
||||
<div className="hexagonal-radio-wrap">
|
||||
<div className="d-check-radio pop mb10">
|
||||
<input
|
||||
type="radio"
|
||||
name="radio03"
|
||||
id="ra05"
|
||||
checked={moduleSetupOption.setupLocation === 'eaves'}
|
||||
value={'eaves'}
|
||||
onChange={handleSetupLocation}
|
||||
/>
|
||||
<label htmlFor="ra05">{getMessage('modal.module.basic.setting.module.placement.arrangement.standard.eaves')}</label>
|
||||
</div>
|
||||
<div className="d-check-radio pop">
|
||||
<input
|
||||
type="radio"
|
||||
name="radio03"
|
||||
id="ra06"
|
||||
checked={moduleSetupOption.setupLocation === 'ridge'}
|
||||
value={'ridge'}
|
||||
onChange={handleSetupLocation}
|
||||
disabled={isMultiModule}
|
||||
/>
|
||||
<label htmlFor="ra06">{getMessage('modal.module.basic.setting.module.placement.arrangement.standard.ridge')}</label>
|
||||
</div>
|
||||
</div>
|
||||
</td>
|
||||
</tr>
|
||||
</tbody>
|
||||
</table>
|
||||
<div className="self-table-tit">{getMessage('modal.module.basic.setting.module.placement.select.fitting.type')}</div>
|
||||
<div className="module-self-table">
|
||||
<div className="self-table-item">
|
||||
<div className="self-item-th">{getMessage('modal.module.basic.setting.module.placement.waterfowl.arrangement')}</div>
|
||||
<div className="self-item-td">
|
||||
<div className="pop-form-radio">
|
||||
<div className="d-check-radio pop">
|
||||
<input
|
||||
type="radio"
|
||||
name="radio01"
|
||||
id="ra01"
|
||||
checked={isChidori}
|
||||
disabled={isChidoriNotAble}
|
||||
value={'true'}
|
||||
onChange={(e) => handleChangeChidori(e)}
|
||||
/>
|
||||
<label htmlFor="ra01">{getMessage('modal.module.basic.setting.module.placement.do')}</label>
|
||||
</div>
|
||||
<div className="d-check-radio pop">
|
||||
<input type="radio" name="radio02" id="ra02" checked={!isChidori} value={'false'} onChange={(e) => handleChangeChidori(e)} />
|
||||
<label htmlFor="ra02">{getMessage('modal.module.basic.setting.module.placement.do.not')}</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="self-table-item">
|
||||
<div className="self-item-th">{getMessage('modal.module.basic.setting.module.placement.arrangement.standard')}</div>
|
||||
<div className="self-item-td">
|
||||
<div className="pop-form-radio">
|
||||
<div className="d-check-radio pop">
|
||||
<input
|
||||
type="radio"
|
||||
name="radio03"
|
||||
id="ra03"
|
||||
checked={setupLocation === 'center'}
|
||||
value={'center'}
|
||||
onChange={handleSetupLocation}
|
||||
disabled={isMultiModule}
|
||||
/>
|
||||
<label htmlFor="ra03">{getMessage('modal.module.basic.setting.module.placement.arrangement.standard.center')}</label>
|
||||
</div>
|
||||
<div className="d-check-radio pop">
|
||||
<input
|
||||
type="radio"
|
||||
name="radio04"
|
||||
id="ra04"
|
||||
checked={setupLocation === 'eaves'}
|
||||
value={'eaves'}
|
||||
onChange={handleSetupLocation}
|
||||
/>
|
||||
<label htmlFor="ra04">{getMessage('modal.module.basic.setting.module.placement.arrangement.standard.eaves')}</label>
|
||||
</div>
|
||||
<div className="d-check-radio pop">
|
||||
<input
|
||||
type="radio"
|
||||
name="radio05"
|
||||
id="ra05"
|
||||
checked={setupLocation === 'ridge'}
|
||||
value={'ridge'}
|
||||
onChange={handleSetupLocation}
|
||||
disabled={isMultiModule}
|
||||
/>
|
||||
<label htmlFor="ra05">{getMessage('modal.module.basic.setting.module.placement.arrangement.standard.ridge')}</label>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="self-table-flx">
|
||||
{/* <div className="d-check-box pop">
|
||||
<input type="checkbox" id="ch04" checked={isMaxSetup === 'true'} value={'true'} onChange={handleMaxSetup} />
|
||||
<label htmlFor="ch04">{getMessage('modal.module.basic.setting.module.placement.maximum')}</label>
|
||||
</div> */}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div className="hide-check-guide">
|
||||
{getMessage('modal.module.basic.setting.module.placement.max.size.check')}
|
||||
<button className={`arr ${!useTab ? 'act' : ''}`} onClick={() => setUseTab(!useTab)}></button>
|
||||
</div>
|
||||
<div className={`module-table-box mt10 ${useTab ? 'hide' : ''}`}>
|
||||
<div className="module-table-inner">
|
||||
<div className="roof-module-table">
|
||||
<table className="">
|
||||
<thead>
|
||||
<tr>
|
||||
<th rowSpan={2} style={{ width: '22%' }}></th>
|
||||
{selectedModules &&
|
||||
selectedModules.itemList.map((item) => (
|
||||
<th colSpan={colspan}>
|
||||
<div className="color-wrap">
|
||||
<span className="color-box" style={{ backgroundColor: item.color }}></span>
|
||||
<span className="name">{item.itemNm}</span>
|
||||
</div>
|
||||
</th>
|
||||
))}
|
||||
</tr>
|
||||
<tr>
|
||||
{selectedModules.itemList.map((item) => (
|
||||
<>
|
||||
<th>{getMessage('modal.module.basic.setting.module.placement.max.row')}</th>
|
||||
{colspan > 1 && <th>{getMessage('modal.module.basic.setting.module.placement.max.rows.multiple')}</th>}
|
||||
</>
|
||||
))}
|
||||
</tr>
|
||||
</thead>
|
||||
<tbody>
|
||||
{moduleSelectionData.roofConstructions.map((item) => (
|
||||
<tr>
|
||||
<td>
|
||||
<div className="color-wrap">
|
||||
<span className="color-box" style={{ backgroundColor: roofOutlineColor(item.roofIndex) }}></span>
|
||||
<span className="name">{item.addRoof.roofMatlNmJp}</span>
|
||||
</div>
|
||||
</td>
|
||||
{selectedModules.itemList.map((item) => (
|
||||
<>
|
||||
<td className="al-c">7</td>
|
||||
{colspan > 1 && <td className="al-c">5</td>}
|
||||
</>
|
||||
))}
|
||||
</tr>
|
||||
))}
|
||||
</tbody>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
@ -172,6 +172,7 @@ const Trestle = forwardRef((props, ref) => {
|
||||
snowGdPossYn,
|
||||
cvrChecked,
|
||||
snowGdChecked,
|
||||
trestleDetail,
|
||||
}
|
||||
}
|
||||
return { ...roof }
|
||||
|
||||
@ -100,7 +100,7 @@ export default function ObjectSetting({ id, pos = { x: 50, y: 230 } }) {
|
||||
]
|
||||
|
||||
return (
|
||||
<WithDraggable isShow={true} pos={pos} className="lrr" isHidden={isHidden}>
|
||||
<WithDraggable isShow={true} pos={pos} className="lrr" style={{ visibility: isHidden ? 'hidden' : 'visible' }}>
|
||||
<WithDraggable.Header title={getMessage('plan.menu.placement.surface.object')} onClose={() => closePopup(id)} />
|
||||
<WithDraggable.Body>
|
||||
<div className="modal-btn-wrap">
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@ -1046,7 +1046,6 @@
|
||||
"outerLine.property.fix": "外壁線の属性設定 を完了しますか？",
|
||||
"outerLine.property.close": "外壁線の属性設定 を終了しますか？",
|
||||
"want.to.complete.auxiliary.creation": "補助線の作成を完了しますか?",
|
||||
"module.layout.setup.has.zero.value": "モジュールの列、行を入力してください.",
|
||||
"modal.placement.initial.setting.plan.drawing.only.number": "(※数字は[半角]入力のみ可能です。)",
|
||||
"wall.line.not.found": "外壁がありません",
|
||||
"roof.line.not.found": "屋根形状がありません",
|
||||
@ -1054,11 +1053,5 @@
|
||||
"chidory.can.not.install": "千鳥配置できない工法です。",
|
||||
"module.layout.setup.max.count": "모듈의 최대 단수는 {0}, 최대 열수는 {1} 입니다. (JA)",
|
||||
"module.layout.setup.max.count.multiple": "모듈 {0}번의 최대 단수는 {1}, 최대 열수는 {2} 입니다. (JA)",
|
||||
"roofAllocation.not.found": "할당할 지붕이 없습니다. (JA)",
|
||||
"modal.module.basic.setting.module.placement.max.size.check": "지붕재별 모듈의 최대 단수. 혼합 최대 단수를 확인하십시오. (JA)",
|
||||
"modal.module.basic.setting.module.placement.max.row": "최대 단수 (JA)",
|
||||
"modal.module.basic.setting.module.placement.max.rows.multiple": "혼합 단수 (JA)",
|
||||
"modal.module.basic.setting.module.placement.mix.asg.yn.error": "혼합 설치 불가능한 모듈입니다. (JA)",
|
||||
"modal.module.basic.setting.module.placement.mix.asg.yn": "ミックス. (JA)",
|
||||
"modal.module.basic.setting.layoutpassivity.placement": "layout配置 (JA)"
|
||||
"roofAllocation.not.found": "할당할 지붕이 없습니다. (JA)"
|
||||
}
|
||||
|
||||
@ -1047,7 +1047,6 @@
|
||||
"outerLine.property.fix": "외벽선 속성 설정을 완료하시겠습니까?",
|
||||
"outerLine.property.close": "외벽선 속성 설정을 종료하시겠습니까?",
|
||||
"want.to.complete.auxiliary.creation": "보조선 작성을 완료하시겠습니까?",
|
||||
"module.layout.setup.has.zero.value": "모듈의 열, 행을 입력해 주세요.",
|
||||
"modal.placement.initial.setting.plan.drawing.only.number": "(※ 숫자는 [반각]입력만 가능합니다.)",
|
||||
"wall.line.not.found": "외벽선이 없습니다.",
|
||||
"roof.line.not.found": "지붕형상이 없습니다.",
|
||||
@ -1055,11 +1054,5 @@
|
||||
"chidory.can.not.install": "치조 불가 공법입니다.",
|
||||
"module.layout.setup.max.count": "모듈의 최대 단수는 {0}, 최대 열수는 {1} 입니다.",
|
||||
"module.layout.setup.max.count.multiple": "모듈 {0}번의 최대 단수는 {1}, 최대 열수는 {2} 입니다.",
|
||||
"roofAllocation.not.found": "할당할 지붕이 없습니다.",
|
||||
"modal.module.basic.setting.module.placement.max.size.check": "지붕재별 모듈의 최대 단수. 혼합 최대 단수를 확인하십시오.",
|
||||
"modal.module.basic.setting.module.placement.max.row": "최대 단수",
|
||||
"modal.module.basic.setting.module.placement.max.rows.multiple": "혼합 단수",
|
||||
"modal.module.basic.setting.module.placement.mix.asg.yn.error": "혼합 설치 불가능한 모듈입니다.",
|
||||
"modal.module.basic.setting.module.placement.mix.asg.yn": "혼합",
|
||||
"modal.module.basic.setting.layoutpassivity.placement": "레이아웃 배치"
|
||||
"roofAllocation.not.found": "할당할 지붕이 없습니다."
|
||||
}
|
||||
|
||||
@ -384,21 +384,3 @@ export const isManualModuleSetupState = atom({
|
||||
key: 'isManualModuleSetupState',
|
||||
default: false,
|
||||
})
|
||||
|
||||
export const isManualModuleLayoutSetupState = atom({
|
||||
key: 'isManualModuleLayoutSetupState',
|
||||
default: false,
|
||||
})
|
||||
|
||||
export const moduleSetupOptionState = atom({
|
||||
key: 'moduleSetupOptionState',
|
||||
default: {
|
||||
isChidori: false, //치조 안함
|
||||
setupLocation: 'eaves', //처마
|
||||
},
|
||||
})
|
||||
|
||||
export const toggleManualSetupModeState = atom({
|
||||
key: 'toggleManualSetupModeState',
|
||||
default: '',
|
||||
})
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user