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

Merge branch 'dev' of https://git.jetbrains.space/nalpari/q-cast-iii/qcast-front into dev

Browse Source
This commit is contained in:
hyojun.choi 2025-02-13 17:22:56 +09:00
commit f5650a0419
4 changed files with 179 additions and 115 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx
View File

@ -440,6 +440,7 @@ export default function CircuitTrestleSetting({ id }) {
seletedOption, seletedOption,
setSeletedOption, setSeletedOption,
getModuleList, getModuleList,
setModuleStatisticsData,
} }
// 승압설정 목록 조회 // 승압설정 목록 조회

222
src/components/floor-plan/modal/circuitTrestle/step/StepUp.jsx
View File

@ -28,6 +28,7 @@ export default function StepUp(props) {
setSelectedModels, setSelectedModels,
getSelectedPcsItemList, getSelectedPcsItemList,
getModuleList, getModuleList,
setModuleStatisticsData,
} = props } = props
const { getMessage } = useMessage() const { getMessage } = useMessage()
const { swalFire } = useSwal() const { swalFire } = useSwal()
@ -148,6 +149,7 @@ export default function StepUp(props) {
}) })
canvas.renderAll() canvas.renderAll()
setModuleStatisticsData()
} else { } else {
swalFire({ text: getMessage('common.message.send.error') }) swalFire({ text: getMessage('common.message.send.error') })
// swalFire({ // swalFire({
@ -467,6 +469,7 @@ export default function StepUp(props) {
}) })
canvas.renderAll() canvas.renderAll()
setModuleStatisticsData()
} }
// 현재 선택된 값들을 가져오는 함수 추가 // 현재 선택된 값들을 가져오는 함수 추가
@ -511,114 +514,7 @@ export default function StepUp(props) {
return ( return (
<> <>
<div className="properties-setting-wrap outer"> <div className="properties-setting-wrap outer">
<div className="circuit-overflow"> <div className="circuit-title-sel">
{/* 3개일때 className = by-max */}
{stepUpListData.map((stepUp, index) => (
<div key={index} className={`module-table-box ${stepUp.pcsItemList.length === 3 ? 'by-max' : ''}`}>
{stepUp?.pcsItemList.map((pcsItem, idx) => (
<div key={idx} className="module-table-inner">
<div className="mb-box">
<div className="circuit-table-tit">{stepUp.pcsItemList[idx].goodsNo}</div>
<div className="roof-module-table overflow-y min">
<table>
<thead>
<tr>
<th>{getMessage('modal.circuit.trestle.setting.step.up.allocation.serial.amount')}</th>
<th>{getMessage('modal.circuit.trestle.setting.step.up.allocation.total.amount')}</th>
</tr>
</thead>
<tbody>
{pcsItem.serQtyList.map((item, serQtyIdx) => {
return (
<tr
key={`row-${serQtyIdx}`}
className={`${item.selected ? 'on' : ''}`}
onClick={() => handleRowClick(idx, serQtyIdx)}
style={{ cursor: allocationType === 'auto' ? 'pointer' : 'default' }}
>
<td className="al-r">{item.serQty}</td>
<td className="al-r">{item.paralQty}</td>
</tr>
)
})}
</tbody>
</table>
</div>
</div>
<div className="module-box-tab mb10">
<button
className={`module-btn ${(moduleTabs[`${stepUp.pcsItemList[idx].goodsNo}_${idx}`] || 1) === 1 ? 'act' : ''}`}
onClick={() => handleTabChange(stepUp.pcsItemList[idx].goodsNo, idx, 1)}
>
{getMessage('modal.circuit.trestle.setting.step.up.allocation.connected')}
</button>
<button
className={`module-btn ${(moduleTabs[`${stepUp.pcsItemList[idx].goodsNo}_${idx}`] || 1) === 2 ? 'act' : ''}`}
onClick={() => handleTabChange(stepUp.pcsItemList[idx].goodsNo, idx, 2)}
>
{getMessage('modal.circuit.trestle.setting.step.up.allocation.option')}
</button>
</div>
<div className="circuit-table-flx-wrap">
{(moduleTabs[`${stepUp.pcsItemList[idx].goodsNo}_${idx}`] || 1) === 1 && (
<div className="circuit-table-flx-box">
<div className="roof-module-table min mb10">
<table>
<thead>
<tr>
<th>{getMessage('modal.circuit.trestle.setting.power.conditional.select.name')}</th>
<th>{getMessage('modal.circuit.trestle.setting.power.conditional.select.circuit.amount')}</th>
<th>{getMessage('modal.circuit.trestle.setting.step.up.allocation.circuit.amount')}</th>
</tr>
</thead>
<tbody>
<tr>
<td className="al-c">
{stepUp.pcsItemList[idx].connList?.[0]?.goodsNo ? stepUp.pcsItemList[idx].connList?.[0]?.goodsNo : '-'}
</td>
<td className="al-c">
{stepUp.pcsItemList[idx].connList?.[0]?.connMaxParalCnt
? (stepUp.pcsItemList[idx].connList?.[0]?.connMaxParalCnt ?? '-')
: '-'}
</td>
<td className="al-c">
{stepUp.pcsItemList[idx].connList?.[0]?.vstuParalCnt ? stepUp.pcsItemList[idx].connList?.[0]?.vstuParalCnt : '-'}
</td>
</tr>
</tbody>
</table>
</div>
</div>
)}
{(moduleTabs[`${stepUp.pcsItemList[idx].goodsNo}_${idx}`] || 1) === 2 && (
<div className="circuit-table-flx-box">
<div className="roof-module-table min mb10">
<table>
<thead>
<tr>
{/* <th>名称</th>
<th>昇圧回路数</th> */}
<th>{getMessage('modal.circuit.trestle.setting.power.conditional.select.name')}</th>
<th>{getMessage('modal.circuit.trestle.setting.step.up.allocation.circuit.amount')}</th>
</tr>
</thead>
<tbody>
<tr>
<td className="al-c">-</td>
<td className="al-c">-</td>
</tr>
</tbody>
</table>
</div>
</div>
)}
</div>
</div>
))}
</div>
))}
</div>
<div className="slope-wrap">
<div className="outline-form"> <div className="outline-form">
<span className="mr10" style={{ width: 'auto' }}> <span className="mr10" style={{ width: 'auto' }}>
{getMessage('modal.circuit.trestle.setting.step.up.allocation.select.monitor')} {getMessage('modal.circuit.trestle.setting.step.up.allocation.select.monitor')}
@ -642,6 +538,116 @@ export default function StepUp(props) {
)} )}
</div> </div>
</div> </div>
<div className="slope-wrap">
<div className="circuit-overflow">
{/* 3개일때 className = by-max */}
{stepUpListData.map((stepUp, index) => (
<div key={index} className={`module-table-box ${stepUp.pcsItemList.length === 3 ? 'by-max' : ''}`}>
{stepUp?.pcsItemList.map((pcsItem, idx) => (
<div key={idx} className="module-table-inner">
<div className="mb-box">
<div className="circuit-table-tit">{stepUp.pcsItemList[idx].goodsNo}</div>
<div className="roof-module-table overflow-y min">
<table>
<thead>
<tr>
<th>{getMessage('modal.circuit.trestle.setting.step.up.allocation.serial.amount')}</th>
<th>{getMessage('modal.circuit.trestle.setting.step.up.allocation.total.amount')}</th>
</tr>
</thead>
<tbody>
{pcsItem.serQtyList.map((item, serQtyIdx) => {
return (
<tr
key={`row-${serQtyIdx}`}
className={`${item.selected ? 'on' : ''}`}
onClick={() => handleRowClick(idx, serQtyIdx)}
style={{ cursor: allocationType === 'auto' ? 'pointer' : 'default' }}
>
<td className="al-r">{item.serQty}</td>
<td className="al-r">{item.paralQty}</td>
</tr>
)
})}
</tbody>
</table>
</div>
</div>
<div className="module-box-tab mb10">
<button
className={`module-btn ${(moduleTabs[`${stepUp.pcsItemList[idx].goodsNo}_${idx}`] || 1) === 1 ? 'act' : ''}`}
onClick={() => handleTabChange(stepUp.pcsItemList[idx].goodsNo, idx, 1)}
>
{getMessage('modal.circuit.trestle.setting.step.up.allocation.connected')}
</button>
<button
className={`module-btn ${(moduleTabs[`${stepUp.pcsItemList[idx].goodsNo}_${idx}`] || 1) === 2 ? 'act' : ''}`}
onClick={() => handleTabChange(stepUp.pcsItemList[idx].goodsNo, idx, 2)}
>
{getMessage('modal.circuit.trestle.setting.step.up.allocation.option')}
</button>
</div>
<div className="circuit-table-flx-wrap">
{(moduleTabs[`${stepUp.pcsItemList[idx].goodsNo}_${idx}`] || 1) === 1 && (
<div className="circuit-table-flx-box">
<div className="roof-module-table min mb10">
<table>
<thead>
<tr>
<th>{getMessage('modal.circuit.trestle.setting.power.conditional.select.name')}</th>
<th>{getMessage('modal.circuit.trestle.setting.power.conditional.select.circuit.amount')}</th>
<th>{getMessage('modal.circuit.trestle.setting.step.up.allocation.circuit.amount')}</th>
</tr>
</thead>
<tbody>
<tr>
<td className="al-c">
{stepUp.pcsItemList[idx].connList?.[0]?.goodsNo ? stepUp.pcsItemList[idx].connList?.[0]?.goodsNo : '-'}
</td>
<td className="al-c">
{stepUp.pcsItemList[idx].connList?.[0]?.connMaxParalCnt
? (stepUp.pcsItemList[idx].connList?.[0]?.connMaxParalCnt ?? '-')
: '-'}
</td>
<td className="al-c">
{stepUp.pcsItemList[idx].connList?.[0]?.vstuParalCnt ? stepUp.pcsItemList[idx].connList?.[0]?.vstuParalCnt : '-'}
</td>
</tr>
</tbody>
</table>
</div>
</div>
)}
{(moduleTabs[`${stepUp.pcsItemList[idx].goodsNo}_${idx}`] || 1) === 2 && (
<div className="circuit-table-flx-box">
<div className="roof-module-table min mb10">
<table>
<thead>
<tr>
{/* <th>名称</th>
<th>昇圧回路数</th> */}
<th>{getMessage('modal.circuit.trestle.setting.power.conditional.select.name')}</th>
<th>{getMessage('modal.circuit.trestle.setting.step.up.allocation.circuit.amount')}</th>
</tr>
</thead>
<tbody>
<tr>
<td className="al-c">-</td>
<td className="al-c">-</td>
</tr>
</tbody>
</table>
</div>
</div>
)}
</div>
</div>
))}
</div>
))}
</div>
</div>
</div> </div>
</> </>
) )

12
src/hooks/useCirCuitTrestle.js
View File

@ -208,7 +208,7 @@ export function useCircuitTrestle() {
surface.modules.forEach((module) => { surface.modules.forEach((module) => {
if (!surfaceObjects[surface.id][module.moduleInfo.itemId]) { if (!surfaceObjects[surface.id][module.moduleInfo.itemId]) {
// 지붕면에 모듈 존재 여부 // 지붕면에 모듈 존재 여부
surfaceObjects[surface.id][module.moduleInfo.itemId] = new Big(0) // 모듈 초기화 surfaceObjects[surface.id][module.moduleInfo.itemId] = Big(0) // 모듈 초기화
} }
surfaceObjects[surface.id][module.moduleInfo.itemId]++ surfaceObjects[surface.id][module.moduleInfo.itemId]++
@ -266,7 +266,7 @@ export function useCircuitTrestle() {
}) })
let ftWpOut = 0 let ftWpOut = 0
tempRows.forEach((row) => { tempRows.forEach((row) => {
ftWpOut = Big(ftWpOut).plus(+row.wpOut).toNumber() ftWpOut = Big(ftWpOut).plus(Big(row.wpOut)).toNumber()
}) })
const tempFooter = { const tempFooter = {
@ -277,9 +277,11 @@ export function useCircuitTrestle() {
selectedModules.itemList.forEach((module) => { selectedModules.itemList.forEach((module) => {
let wpOut = 0 let wpOut = 0
tempRows.forEach((row) => { tempRows.forEach((row) => {
wpOut = Big(wpOut) if (row[module.itemId]) {
.plus(+row[module.itemId] ?? 0) wpOut = Big(wpOut)
.toNumber() .plus(Big(row[module.itemId] ?? 0))
.toNumber()
}
}) })
tempFooter[module.itemId] = wpOut tempFooter[module.itemId] = wpOut
}) })

59
src/styles/_modal.scss
View File

@ -142,8 +142,28 @@ $alert-color: #101010;
background: url(../../public/static/images/canvas/modal_close.svg)no-repeat center; background: url(../../public/static/images/canvas/modal_close.svg)no-repeat center;
} }
} }
.modal-body{ .modal-body{
position: relative;
padding: 24px; padding: 24px;
.left-bar{
position: absolute;
top: 0;
left: 0;
width: 5px;
height: 100%;
background-color: #000;
cursor: pointer;
}
.right-bar{
position: absolute;
top: 0;
right: 0;
width: 5px;
height: 100%;
background-color: #000;
cursor: pointer;
}
.modal-btn-wrap{ .modal-btn-wrap{
display: flex; display: flex;
align-items: center; align-items: center;
@ -524,7 +544,7 @@ $alert-color: #101010;
align-items: center; align-items: center;
gap: 10px; gap: 10px;
&.place{ &.place{
gap: 15px; gap: 33px;
.outline-form{ .outline-form{
span{ span{
width: fit-content; width: fit-content;
@ -1648,7 +1668,6 @@ $alert-color: #101010;
.circuit-overflow{ .circuit-overflow{
overflow-x: auto; overflow-x: auto;
margin-bottom: 25px;
&::-webkit-scrollbar { &::-webkit-scrollbar {
height: 4px; height: 4px;
background-color: transparent; background-color: transparent;
@ -1666,6 +1685,42 @@ $alert-color: #101010;
} }
} }
} }
.circuit-title-sel{
padding-bottom: 14px;
.outline-form{
span{
color: #62C207;
}
.grid-select{
.sort-select{
border: 1px solid #4E9E04;
background-color: #1A3104;
p{
line-height: 27px;
}
.select-item-wrap{
background-color: #1A3104;
border: 1px solid #4E9E04;
.select-item:hover{
background-color: #294e07;
}
&::-webkit-scrollbar {
width: 2px;
background-color: transparent;
}
&::-webkit-scrollbar-thumb {
background-color: #fff;
border-radius: 10px;
}
&::-webkit-scrollbar-track {
background-color: transparent;
}
}
}
}
}
}
.circuit-table-flx-wrap{ .circuit-table-flx-wrap{
display: flex; display: flex;