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

Merge branch 'dev' into dev-yj

Browse Source 
# Conflicts:
#	src/locales/ko.json
This commit is contained in:
yjnoh 2025-01-22 11:23:50 +09:00
commit 5ad95a3579
41 changed files with 2792 additions and 2605 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
src/app/GlobalLoadingProvider.js Normal file
View File

@ -0,0 +1,11 @@
'use client'
import { useContext } from 'react'
import { QcastContext } from './QcastProvider'
import GlobalSpinner from '@/components/common/spinner/GlobalSpinner'
export default function GlobalLoadingProvider() {
const { isGlobalLoading } = useContext(QcastContext)
return <>{isGlobalLoading && <GlobalSpinner />}</>
}

8
src/app/QcastProvider.js
View File

@ -6,7 +6,6 @@ import { useCommonCode } from '@/hooks/common/useCommonCode'
import ServerError from './error' import ServerError from './error'
import '@/styles/common.scss' import '@/styles/common.scss'
import GlobalSpinner from '@/components/common/spinner/GlobalSpinner'
export const QcastContext = createContext({ export const QcastContext = createContext({
qcastState: {}, qcastState: {},
@ -17,7 +16,7 @@ export const QcastContext = createContext({
export const QcastProvider = ({ children }) => { export const QcastProvider = ({ children }) => {
const [planSave, setPlanSave] = useState(false) const [planSave, setPlanSave] = useState(false)
const [isGlobalLoading, setIsGlobalLoading] = useState(false) const [isGlobalLoading, setIsGlobalLoading] = useState(true)
const { commonCode, findCommonCode } = useCommonCode() const { commonCode, findCommonCode } = useCommonCode()
const [qcastState, setQcastState] = useState({ const [qcastState, setQcastState] = useState({
@ -35,11 +34,6 @@ export const QcastProvider = ({ children }) => {
return ( return (
<> <>
{isGlobalLoading && (
<div className="fixed inset-0 bg-white z-50 flex items-center justify-center">
<GlobalSpinner />
</div>
)}
<QcastContext.Provider value={{ qcastState, setQcastState, isGlobalLoading, setIsGlobalLoading }}> <QcastContext.Provider value={{ qcastState, setQcastState, isGlobalLoading, setIsGlobalLoading }}>
<ErrorBoundary fallback={<ServerError />}>{children}</ErrorBoundary> <ErrorBoundary fallback={<ServerError />}>{children}</ErrorBoundary>
</QcastContext.Provider> </QcastContext.Provider>

20
src/app/floor-plan/FloorPlanProvider.js
View File

@ -47,14 +47,22 @@ const FloorPlanProvider = ({ children }) => {
const searchParams = useSearchParams() const searchParams = useSearchParams()
const objectNo = searchParams.get('objectNo') const objectNo = searchParams.get('objectNo')
const pid = searchParams.get('pid') const pid = searchParams.get('pid')
useEffect(() => {
if (pathname === '/floor-plan') {
if (pid === undefined || pid === '' || pid === null || objectNo === undefined || objectNo === '' || objectNo === null) {
notFound()
}
setCurrentObjectNo(objectNo)
}
}, [pathname])
//useEffect(() => { // 오류 발생으로 useEffect 사용 //useEffect(() => { // 오류 발생으로 useEffect 사용
if (pathname === '/floor-plan') { // if (pathname === '/floor-plan') {
if (pid === undefined || pid === '' || pid === null || objectNo === undefined || objectNo === '' || objectNo === null) { // if (pid === undefined || pid === '' || pid === null || objectNo === undefined || objectNo === '' || objectNo === null) {
notFound() // notFound()
} // }
setCurrentObjectNo(objectNo) // setCurrentObjectNo(objectNo)
} // }
//}, [pid, objectNo]) //}, [pid, objectNo])
const [floorPlanState, setFloorPlanState] = useState({ const [floorPlanState, setFloorPlanState] = useState({

21
src/app/floor-plan/layout.js
View File

@ -1,31 +1,22 @@
'use client' 'use client'
import { usePathname } from 'next/navigation'
import FloorPlanProvider from './FloorPlanProvider' import FloorPlanProvider from './FloorPlanProvider'
import FloorPlan from '@/components/floor-plan/FloorPlan' import FloorPlan from '@/components/floor-plan/FloorPlan'
import CanvasLayout from '@/components/floor-plan/CanvasLayout' import CanvasLayout from '@/components/floor-plan/CanvasLayout'
import { Suspense } from 'react'
import GlobalSpinner from '@/components/common/spinner/GlobalSpinner'
export default function FloorPlanLayout({ children }) { export default function FloorPlanLayout({ children }) {
console.log('🚀 ~ FloorPlanLayout ~ FloorPlanLayout:')
const pathname = usePathname()
console.log('🚀 ~ FloorPlanLayout ~ pathname:', pathname)
return ( return (
<> <>
<Suspense fallback={<GlobalSpinner />}> <FloorPlanProvider>
<FloorPlanProvider> <FloorPlan>
<FloorPlan> {/* {pathname.includes('estimate') || pathname.includes('simulator') ? (
{/* {pathname.includes('estimate') || pathname.includes('simulator') ? (
<div className="canvas-layout">{children}</div> <div className="canvas-layout">{children}</div>
) : ( ) : (
<CanvasLayout>{children}</CanvasLayout> <CanvasLayout>{children}</CanvasLayout>
)} */} )} */}
<CanvasLayout>{children}</CanvasLayout> <CanvasLayout>{children}</CanvasLayout>
</FloorPlan> </FloorPlan>
</FloorPlanProvider> </FloorPlanProvider>
</Suspense>
</> </>
) )
} }

6
src/app/layout.js
View File

@ -8,15 +8,13 @@ import SessionProvider from './SessionProvider'
import GlobalDataProvider from './GlobalDataProvider' import GlobalDataProvider from './GlobalDataProvider'
import Header from '@/components/header/Header' import Header from '@/components/header/Header'
import QModal from '@/components/common/modal/QModal' import QModal from '@/components/common/modal/QModal'
import Dimmed from '@/components/ui/Dimmed'
import PopupManager from '@/components/common/popupManager/PopupManager' import PopupManager from '@/components/common/popupManager/PopupManager'
import './globals.css' import './globals.css'
import '../styles/style.scss' import '../styles/style.scss'
import '../styles/contents.scss' import '../styles/contents.scss'
import Footer from '@/components/footer/Footer' import Footer from '@/components/footer/Footer'
import { Suspense } from 'react' import GlobalLoadingProvider from './GlobalLoadingProvider'
import GlobalSpinner from '@/components/common/spinner/GlobalSpinner'
export const metadata = { export const metadata = {
title: 'Create Next App', title: 'Create Next App',
@ -70,10 +68,10 @@ export default async function RootLayout({ children }) {
<QcastProvider>{children}</QcastProvider> <QcastProvider>{children}</QcastProvider>
) : ( ) : (
<QcastProvider> <QcastProvider>
<GlobalLoadingProvider />
<div className="wrap"> <div className="wrap">
<Header userSession={sessionProps} /> <Header userSession={sessionProps} />
<div className="content"> <div className="content">
<Dimmed />
<SessionProvider useSession={sessionProps}>{children}</SessionProvider> <SessionProvider useSession={sessionProps}>{children}</SessionProvider>
</div> </div>
<Footer /> <Footer />

6
src/components/common/select/QSelectBox.jsx
View File

@ -75,7 +75,11 @@ export default function QSelectBox({
useOnClickOutside(ref, handleClose) useOnClickOutside(ref, handleClose)
return ( return (
<div className={`sort-select ${openSelect ? 'active' : ''}`} ref={ref} onClick={disabled ? () => {} : () => setOpenSelect(!openSelect)}> <div
className={`sort-select ${openSelect ? 'active' : ''} ${disabled ? 'disabled' : ''}`}
ref={ref}
onClick={disabled ? () => {} : () => setOpenSelect(!openSelect)}
>
<p>{selected}</p> <p>{selected}</p>
<ul className="select-item-wrap"> <ul className="select-item-wrap">
{options?.length > 0 && {options?.length > 0 &&

12
src/components/floor-plan/CanvasFrame.jsx
View File

@ -1,6 +1,6 @@
'use client' 'use client'
import { useEffect, useRef } from 'react' import { useContext, useEffect, useRef } from 'react'
import { useRecoilValue } from 'recoil' import { useRecoilValue } from 'recoil'
@ -14,20 +14,24 @@ import { useCanvasConfigInitialize } from '@/hooks/common/useCanvasConfigInitial
import { currentMenuState } from '@/store/canvasAtom' import { currentMenuState } from '@/store/canvasAtom'
import { totalDisplaySelector } from '@/store/settingAtom' import { totalDisplaySelector } from '@/store/settingAtom'
import { MENU } from '@/common/common' import { MENU } from '@/common/common'
import { FloorPlanContext } from '@/app/floor-plan/FloorPlanProvider'
import { QcastContext } from '@/app/QcastProvider'
export default function CanvasFrame() { export default function CanvasFrame() {
const canvasRef = useRef(null) const canvasRef = useRef(null)
const { canvas } = useCanvas('canvas') const { canvas } = useCanvas('canvas')
const { canvasLoadInit, gridInit } = useCanvasConfigInitialize() const { canvasLoadInit, gridInit } = useCanvasConfigInitialize()
const currentMenu = useRecoilValue(currentMenuState) const currentMenu = useRecoilValue(currentMenuState)
const { floorPlanState } = useContext(FloorPlanContext)
const { contextMenu, handleClick } = useContextMenu() const { contextMenu, handleClick } = useContextMenu()
const { selectedPlan } = usePlan() const { selectedPlan } = usePlan()
const totalDisplay = useRecoilValue(totalDisplaySelector) // 집계표 표시 여부 const totalDisplay = useRecoilValue(totalDisplaySelector) // 집계표 표시 여부
const { setIsGlobalLoading } = useContext(QcastContext)
const loadCanvas = () => { const loadCanvas = () => {
if (canvas) { if (canvas) {
canvas?.clear() // 캔버스를 초기화합니다. canvas?.clear() // 캔버스를 초기화합니다.
if (selectedPlan?.canvasStatus) { if (selectedPlan?.canvasStatus && floorPlanState.objectNo === selectedPlan.objectNo) {
canvas?.loadFromJSON(JSON.parse(selectedPlan.canvasStatus), function () { canvas?.loadFromJSON(JSON.parse(selectedPlan.canvasStatus), function () {
canvasLoadInit() //config된 상태로 캔버스 객체를 그린다 canvasLoadInit() //config된 상태로 캔버스 객체를 그린다
canvas?.renderAll() // 캔버스를 다시 그립니다. canvas?.renderAll() // 캔버스를 다시 그립니다.
@ -41,6 +45,10 @@ export default function CanvasFrame() {
loadCanvas() loadCanvas()
}, [selectedPlan, canvas]) }, [selectedPlan, canvas])
useEffect(() => {
setIsGlobalLoading(false)
}, [])
return ( return (
<div className="canvas-frame"> <div className="canvas-frame">
<canvas ref={canvasRef} id="canvas" style={{ position: 'relative' }}></canvas> <canvas ref={canvasRef} id="canvas" style={{ position: 'relative' }}></canvas>

18
src/components/floor-plan/CanvasMenu.jsx
View File

@ -168,7 +168,7 @@ export default function CanvasMenu(props) {
break break
case 4: case 4:
if (!checkMenuAndCanvasState()) { if (!checkMenuAndCanvasState()) {
swalFire({ text: getMessage('estimate.menu.move.valid1') }) swalFire({ text: getMessage('menu.validation.canvas.roof') })
return return
} else { } else {
setType('module') setType('module')
@ -245,6 +245,20 @@ export default function CanvasMenu(props) {
await saveCanvas() await saveCanvas()
} }
// 나가기 버튼 클릭
const handleLeaveCanvas = () => {
swalFire({
text: getMessage('plan.message.leave'),
type: 'confirm',
confirmButtonText: getMessage('plan.message.corfirm.yes'),
cancelButtonText: getMessage('plan.message.confirm.no'),
confirmFn: async () => {
await handleSaveCanvas()
router.push(`/management/stuff`)
},
})
}
const [placementInitialId, setPlacementInitialId] = useState(uuidv4()) const [placementInitialId, setPlacementInitialId] = useState(uuidv4())
const placementInitialProps = { const placementInitialProps = {
id: placementInitialId, id: placementInitialId,
@ -531,7 +545,7 @@ export default function CanvasMenu(props) {
</div> </div>
<div className="btn-from"> <div className="btn-from">
<button className="btn08" onClick={handleSaveCanvas}></button> <button className="btn08" onClick={handleSaveCanvas}></button>
<button className="btn09"></button> <button className="btn09" onClick={handleLeaveCanvas}></button>
</div> </div>
</> </>
)} )}

22
src/components/floor-plan/FloorPlan.jsx
View File

@ -1,18 +1,30 @@
'use client' 'use client'
import { useEffect } from 'react' import { useEffect } from 'react'
//import { useRecoilState } from 'recoil'
import CanvasMenu from '@/components/floor-plan/CanvasMenu' import CanvasMenu from '@/components/floor-plan/CanvasMenu'
import { useCanvasMenu } from '@/hooks/common/useCanvasMenu' import { useCanvasMenu } from '@/hooks/common/useCanvasMenu'
import { useCanvasSetting } from '@/hooks/option/useCanvasSetting' import { useCanvasSetting } from '@/hooks/option/useCanvasSetting'
import { usePopup } from '@/hooks/usePopup' import { usePopup } from '@/hooks/usePopup'
//import { FloorPlanContext } from '@/app/floor-plan/FloorPlanProvider'
//import { correntObjectNoState } from '@/store/settingAtom'
import '@/styles/contents.scss' import '@/styles/contents.scss'
import { notFound, usePathname, useSearchParams } from 'next/navigation'
import { useSetRecoilState } from 'recoil'
import { correntObjectNoState } from '@/store/settingAtom'
export default function FloorPlan({ children }) { export default function FloorPlan({ children }) {
//const { floorPlanState, setFloorPlanState } = useContext(FloorPlanContext) // const pathname = usePathname()
//const [correntObjectNo, setCorrentObjectNo] = useRecoilState(correntObjectNoState) // const setCurrentObjectNo = useSetRecoilState(correntObjectNoState)
// const searchParams = useSearchParams()
// const objectNo = searchParams.get('objectNo')
// const pid = searchParams.get('pid')
// useEffect(() => {
// if (pathname === '/floor-plan') {
// if (pid === undefined || pid === '' || pid === null || objectNo === undefined || objectNo === '' || objectNo === null) {
// notFound()
// }
// setCurrentObjectNo(objectNo)
// }
// }, [pathname])
const { closeAll } = usePopup() const { closeAll } = usePopup()
const { menuNumber, setMenuNumber } = useCanvasMenu() const { menuNumber, setMenuNumber } = useCanvasMenu()
const { fetchSettings, fetchBasicSettings } = useCanvasSetting() const { fetchSettings, fetchBasicSettings } = useCanvasSetting()

15
src/components/floor-plan/modal/basic/step/Orientation.jsx
View File

@ -1,4 +1,4 @@
import { forwardRef, useContext, useImperativeHandle, useState } from 'react' import { forwardRef, useContext, useEffect, useImperativeHandle, useState } from 'react'
import { useMessage } from '@/hooks/useMessage' import { useMessage } from '@/hooks/useMessage'
import { useOrientation } from '@/hooks/module/useOrientation' import { useOrientation } from '@/hooks/module/useOrientation'
import { getDegreeInOrientation } from '@/util/canvas-util' import { getDegreeInOrientation } from '@/util/canvas-util'
@ -8,6 +8,8 @@ import { useCanvasPopupStatusController } from '@/hooks/common/useCanvasPopupSta
export const Orientation = forwardRef(({ tabNum }, ref) => { export const Orientation = forwardRef(({ tabNum }, ref) => {
const { getMessage } = useMessage() const { getMessage } = useMessage()
const { trigger: canvasPopupStatusTrigger } = useCanvasPopupStatusController(1)
const { nextStep, compasDeg, setCompasDeg } = useOrientation() const { nextStep, compasDeg, setCompasDeg } = useOrientation()
const [hasAnglePassivity, setHasAnglePassivity] = useState(false) const [hasAnglePassivity, setHasAnglePassivity] = useState(false)
@ -21,6 +23,10 @@ export const Orientation = forwardRef(({ tabNum }, ref) => {
canvasPopupStatusTrigger(compasDeg) canvasPopupStatusTrigger(compasDeg)
} }
useEffect(() => {
checkDegree(compasDeg)
}, [compasDeg])
const checkDegree = (e) => { const checkDegree = (e) => {
if (numberCheck(Number(e)) && Number(e) >= -180 && Number(e) <= 180) { if (numberCheck(Number(e)) && Number(e) >= -180 && Number(e) <= 180) {
setCompasDeg(Number(e)) setCompasDeg(Number(e))
@ -29,12 +35,9 @@ export const Orientation = forwardRef(({ tabNum }, ref) => {
} }
} }
const { trigger: canvasPopupStatusTrigger } = useCanvasPopupStatusController(1)
return ( return (
<> <>
<div className="properties-setting-wrap"> <div className="properties-setting-wrap">
<div className="setting-tit">{getMessage('modal.module.basic.setting.orientation.setting')}</div>
<div className="outline-wrap"> <div className="outline-wrap">
<div className="guide">{getMessage('modal.module.basic.setting.orientation.setting.info')}</div> <div className="guide">{getMessage('modal.module.basic.setting.orientation.setting.info')}</div>
<div className="roof-module-compas"> <div className="roof-module-compas">
@ -68,7 +71,7 @@ export const Orientation = forwardRef(({ tabNum }, ref) => {
</div> </div>
<div className="center-wrap"> <div className="center-wrap">
<div className="d-check-box pop"> <div className="d-check-box pop">
<input type="checkbox" id="ch99" checked={!hasAnglePassivity} onChange={() => setHasAnglePassivity(!hasAnglePassivity)} /> <input type="checkbox" id="ch99" checked={hasAnglePassivity} onChange={() => setHasAnglePassivity(!hasAnglePassivity)} />
<label htmlFor="ch99">{getMessage('modal.module.basic.setting.orientation.setting.angle.passivity')}（-180 〜 180）</label> <label htmlFor="ch99">{getMessage('modal.module.basic.setting.orientation.setting.angle.passivity')}（-180 〜 180）</label>
</div> </div>
<div className="outline-form"> <div className="outline-form">
@ -77,7 +80,7 @@ export const Orientation = forwardRef(({ tabNum }, ref) => {
type="text" type="text"
className="input-origin block" className="input-origin block"
value={compasDeg} value={compasDeg}
readOnly={hasAnglePassivity} readOnly={!hasAnglePassivity}
placeholder={0} placeholder={0}
onChange={ onChange={
(e) => checkDegree(e.target.value) (e) => checkDegree(e.target.value)

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

@ -6,14 +6,12 @@ import StepUp from '@/components/floor-plan/modal/circuitTrestle/step/StepUp'
import { useMessage } from '@/hooks/useMessage' import { useMessage } from '@/hooks/useMessage'
import { usePopup } from '@/hooks/usePopup' import { usePopup } from '@/hooks/usePopup'
import PassivityCircuitAllocation from './step/type/PassivityCircuitAllocation' import PassivityCircuitAllocation from './step/type/PassivityCircuitAllocation'
import { useAxios } from '@/hooks/useAxios'
import { useMasterController } from '@/hooks/common/useMasterController' import { useMasterController } from '@/hooks/common/useMasterController'
import { get } from 'react-hook-form'
import { correntObjectNoState } from '@/store/settingAtom' import { correntObjectNoState } from '@/store/settingAtom'
import { useRecoilValue } from 'recoil' import { useRecoilValue } from 'recoil'
import { GlobalDataContext } from '@/app/GlobalDataProvider' import { GlobalDataContext } from '@/app/GlobalDataProvider'
import { useRecoilState } from 'recoil' import { useRecoilState } from 'recoil'
import { modelState, pcsCheckState, powerConditionalState } from '@/store/circuitTrestleAtom' import { makersState, modelsState, modelState, pcsCheckState, selectedMakerState, seriesState } from '@/store/circuitTrestleAtom'
import { POLYGON_TYPE } from '@/common/common' import { POLYGON_TYPE } from '@/common/common'
import { useSwal } from '@/hooks/useSwal' import { useSwal } from '@/hooks/useSwal'
import { canvasState } from '@/store/canvasAtom' import { canvasState } from '@/store/canvasAtom'
@ -27,46 +25,52 @@ const ALLOCATION_TYPE = {
export default function CircuitTrestleSetting({ id }) { export default function CircuitTrestleSetting({ id }) {
const { getMessage } = useMessage() const { getMessage } = useMessage()
const { closePopup } = usePopup() const { closePopup } = usePopup()
// 탭 번호 1: 파워 컨디셔너 선택(+수동 설정)
// 탭 번호 2: 회로 할당
const [tabNum, setTabNum] = useState(1)
const [allocationType, setAllocationType] = useState(ALLOCATION_TYPE.AUTO)
const [makers, setMakers] = useState([])
const [series, setSeries] = useState([])
const [model, setModel] = useRecoilState(modelState)
const [selectedModels, setSelectedModels] = useState(model.selectedModels)
const [models, setModels] = useState(model.models)
const [selectedMaker, setSelectedMaker] = useState(null)
const [selectedSeries, setSelectedSeries] = useState(null)
const correntObjectNo = useRecoilValue(correntObjectNoState)
const { getPcsMakerList } = useMasterController()
const { managementState, setManagementState, managementStateLoaded } = useContext(GlobalDataContext)
const [pcsCheck, setPcsCheck] = useRecoilState(pcsCheckState)
const canvas = useRecoilValue(canvasState)
const { apply } = useTrestle() const { apply } = useTrestle()
const { swalFire } = useSwal() const { swalFire } = useSwal()
const canvas = useRecoilValue(canvasState)
const [makers, setMakers] = useRecoilState(makersState)
const [selectedMaker, setSelectedMaker] = useRecoilState(selectedMakerState)
const [series, setSeries] = useRecoilState(seriesState)
const [models, setModels] = useRecoilState(modelsState)
const [pcsCheck, setPcsCheck] = useRecoilState(pcsCheckState)
const [tabNum, setTabNum] = useState(1)
const [allocationType, setAllocationType] = useState(ALLOCATION_TYPE.AUTO)
const [circuitAllocationType, setCircuitAllocationType] = useState(1) const [circuitAllocationType, setCircuitAllocationType] = useState(1)
const powerConditionalSelectProps = { const powerConditionalSelectProps = {
tabNum, tabNum,
setTabNum, setTabNum,
makers,
setMakers,
selectedMaker,
setSelectedMaker,
series,
setSeries,
models,
setModels,
} }
const circuitProps = {
const passivityProps = {
tabNum, tabNum,
setTabNum, setTabNum,
models,
setModels,
}
const stepUpProps = {
tabNum,
setTabNum,
models,
setModels,
circuitAllocationType, circuitAllocationType,
setCircuitAllocationType, setCircuitAllocationType,
} }
useEffect(() => {
console.log('🚀 ~ CircuitTrestleSetting ~ model:', model)
setSelectedModels(model.selectedModels)
}, [model])
const onAutoAllocation = () => { const onAutoAllocation = () => {
let moduleStdQty = 0 let moduleStdQty = 0
let moduleMaxQty = 0 let moduleMaxQty = 0
const selectedModels = models.filter((m) => m.selected)
if (selectedModels.length === 0) { if (selectedModels.length === 0) {
moduleStdQty = models.reduce((acc, model) => { moduleStdQty = models.reduce((acc, model) => {
@ -100,14 +104,16 @@ export default function CircuitTrestleSetting({ id }) {
} }
const onPassivityAllocation = () => { const onPassivityAllocation = () => {
console.log('🚀 ~ onPassivityAllocation ~ selectedModels:', model) console.log('🚀 ~ onPassivityAllocation ~ selectedModels:', models)
if (selectedModels.length === 0) {
if (models.filter((m) => m.selected).length === 0) {
swalFire({ swalFire({
title: '파워 컨디셔너를 추가해 주세요.', title: '파워 컨디셔너를 추가해 주세요.',
type: 'alert', type: 'alert',
}) })
return return
} else if (pcsCheck.max) { } else if (pcsCheck.max) {
const selectedModels = models.filter((m) => m.selected)
const moduleStdQty = selectedModels.reduce((acc, model) => { const moduleStdQty = selectedModels.reduce((acc, model) => {
return acc + parseInt(model.moduleStdQty) return acc + parseInt(model.moduleStdQty)
}, 0) }, 0)
@ -148,8 +154,8 @@ export default function CircuitTrestleSetting({ id }) {
</div> </div>
</div> </div>
{tabNum === 1 && allocationType === ALLOCATION_TYPE.AUTO && <PowerConditionalSelect {...powerConditionalSelectProps} />} {tabNum === 1 && allocationType === ALLOCATION_TYPE.AUTO && <PowerConditionalSelect {...powerConditionalSelectProps} />}
{tabNum === 1 && allocationType === ALLOCATION_TYPE.PASSIVITY && <PassivityCircuitAllocation {...powerConditionalSelectProps} />} {tabNum === 1 && allocationType === ALLOCATION_TYPE.PASSIVITY && <PassivityCircuitAllocation {...passivityProps} />}
{tabNum === 2 && <StepUp />} {tabNum === 2 && <StepUp {...stepUpProps} />}
{tabNum === 1 && allocationType === ALLOCATION_TYPE.AUTO && ( {tabNum === 1 && allocationType === ALLOCATION_TYPE.AUTO && (
<div className="grid-btn-wrap"> <div className="grid-btn-wrap">
<button className="btn-frame modal mr5" onClick={() => onAutoAllocation()}> <button className="btn-frame modal mr5" onClick={() => onAutoAllocation()}>

129
src/components/floor-plan/modal/circuitTrestle/step/PowerConditionalSelect.jsx
View File

@ -1,28 +1,19 @@
import { GlobalDataContext } from '@/app/GlobalDataProvider' import { GlobalDataContext } from '@/app/GlobalDataProvider'
import QSelectBox from '@/components/common/select/QSelectBox' import QSelectBox from '@/components/common/select/QSelectBox'
import { useMasterController } from '@/hooks/common/useMasterController' import { useMasterController } from '@/hooks/common/useMasterController'
import { useEvent } from '@/hooks/useEvent'
import { useMessage } from '@/hooks/useMessage' import { useMessage } from '@/hooks/useMessage'
import { useSwal } from '@/hooks/useSwal' import { useSwal } from '@/hooks/useSwal'
import { makerState, modelState, pcsCheckState, seriesState } from '@/store/circuitTrestleAtom' import { pcsCheckState } from '@/store/circuitTrestleAtom'
import { globalLocaleStore } from '@/store/localeAtom' import { globalLocaleStore } from '@/store/localeAtom'
import { moduleSelectionDataState, selectedModuleState } from '@/store/selectedModuleOptions' import { selectedModuleState } from '@/store/selectedModuleOptions'
import { isNullOrUndefined } from '@/util/common-utils'
import { useContext, useEffect, useState } from 'react' import { useContext, useEffect, useState } from 'react'
import { useRecoilState } from 'recoil' import { useRecoilState } from 'recoil'
import { useRecoilValue } from 'recoil' import { useRecoilValue } from 'recoil'
import { v4 as uuidv4 } from 'uuid' import { v4 as uuidv4 } from 'uuid'
export default function PowerConditionalSelect(props) { export default function PowerConditionalSelect(props) {
let { tabNum, setTabNum } = props let { tabNum, setTabNum, makers, setMakers, selectedMaker, setSelectedMaker, series, setSeries, models, setModels } = props
const [makerData, setMakerData] = useRecoilState(makerState)
const [makers, setMakers] = useState(makerData.makers)
const [selectedMaker, setSelectedMaker] = useState(makerData.selectedMaker)
const [series, setSeries] = useRecoilState(seriesState)
const [seriesList, setSeriesList] = useState(series.series)
const [selectedSeries, setSelectedSeries] = useState(series.selectedSeries)
const [model, setModel] = useRecoilState(modelState)
const [models, setModels] = useState(model.models)
const [selectedModels, setSelectedModels] = useState(model.selectedModels)
const [pcsCheck, setPcsCheck] = useRecoilState(pcsCheckState) const [pcsCheck, setPcsCheck] = useRecoilState(pcsCheckState)
const { managementState, setManagementState, managementStateLoaded } = useContext(GlobalDataContext) const { managementState, setManagementState, managementStateLoaded } = useContext(GlobalDataContext)
const { getMessage } = useMessage() const { getMessage } = useMessage()
@ -56,6 +47,8 @@ export default function PowerConditionalSelect(props) {
] ]
useEffect(() => { useEffect(() => {
console.log('series', series)
console.log('models', models)
if (makers.length === 0) { if (makers.length === 0) {
getPcsMakerList().then((res) => { getPcsMakerList().then((res) => {
setMakers(res.data) setMakers(res.data)
@ -69,32 +62,35 @@ export default function PowerConditionalSelect(props) {
// console.log('🚀 ~ useEffect ~ /api/object/${correntObjectNo}/detail:', res) // console.log('🚀 ~ useEffect ~ /api/object/${correntObjectNo}/detail:', res)
// // coldRegionFlg-한랭지사양, conType// 계약조건(잉여~,전량) // // coldRegionFlg-한랭지사양, conType// 계약조건(잉여~,전량)
// }) // })
return () => { // return () => {
setMakerData({ makers, selectedMaker }) // console.log('🚀 ~ useEffect ~ PowerConditionalSelect unmount:', makers, selectedMaker)
setSeries({ series: seriesList, selectedSeries }) // setMakerData({ makers, selectedMaker })
setModel({ models, selectedModels }) // setSeries({ series: seriesList, selectedSeries })
} // setModels({ models, selectedModels })
// }
}, []) }, [])
useEffect(() => { useEffect(() => {
console.log('🚀 ~ PowerConditionalSelect ~ selectedMaker:', selectedMaker) console.log('🚀 ~ PowerConditionalSelect ~ selectedMaker:', selectedMaker)
if (selectedMaker) { if (selectedMaker) {
setSelectedModels([]) setModels(null)
setModels([]) if (series.length === 0)
getPcsMakerList(selectedMaker).then((res) => { getPcsMakerList(selectedMaker).then((res) => {
setSeriesList( setSeries(
res.data.map((series) => { res.data.map((series) => {
return { ...series, selected: false } // return { ...series, selected: isNullOrUndefined(series.selected) ? false : series.selected }
}), return { ...series, selected: false }
) }),
}) )
})
} }
}, [selectedMaker]) }, [selectedMaker])
useEffect(() => { useEffect(() => {
if (seriesList.filter((series) => series.selected).length === 0) return console.log('🚀 ~ useEffect ~ series:', series)
const pcsMkrCd = seriesList.filter((series) => series.selected)[0]?.pcsMkrCd if (series.filter((s) => s.selected).length === 0) return
const pcsSerList = seriesList const pcsMkrCd = series.filter((s) => s.selected)[0]?.pcsMkrCd
const pcsSerList = series
.filter((series) => series.selected) .filter((series) => series.selected)
.map((series) => { .map((series) => {
return { pcsSerCd: series.pcsSerCd } return { pcsSerCd: series.pcsSerCd }
@ -106,7 +102,7 @@ export default function PowerConditionalSelect(props) {
} }
}) })
getPcsModelList({ pcsMkrCd, pcsSerList, moduleItemList }).then((res) => { getPcsModelList({ pcsMkrCd, pcsSerList, moduleItemList }).then((res) => {
if (res?.result.code === 200) { if (res?.result.code === 200 && res?.data) {
console.log('🚀 ~ useEffect ~ res:', res.data) console.log('🚀 ~ useEffect ~ res:', res.data)
setModels( setModels(
res.data.map((model) => { res.data.map((model) => {
@ -121,23 +117,15 @@ export default function PowerConditionalSelect(props) {
) )
} }
}) })
}, [seriesList]) }, [series])
useEffect(() => {
console.log('🚀 ~ useEffect ~ models:', models)
}, [models])
useEffect(() => {
console.log('🚀 ~ useEffect ~ pcsCheck:', pcsCheck)
}, [pcsCheck])
const onCheckSeries = (series) => { const onCheckSeries = (series) => {
setSeriesList((prev) => prev.map((s) => ({ ...s, selected: s.pcsSerCd === series.pcsSerCd ? !s.selected : s.selected }))) setSeries((prev) => prev.map((s) => ({ ...s, selected: s.pcsSerCd === series.pcsSerCd ? !s.selected : s.selected })))
} }
const onAddSelectedModel = () => { const onAddSelectedModel = () => {
if (selectedRow === null) return if (selectedRow === null) return
if (selectedModels.length === 3) { if (models.filter((m) => m.selected).length === 3) {
swalFire({ swalFire({
title: '최대 3개까지 선택할 수 있습니다.', title: '최대 3개까지 선택할 수 있습니다.',
icon: 'warning', icon: 'warning',
@ -145,28 +133,41 @@ export default function PowerConditionalSelect(props) {
return return
} }
setSelectedModels([...selectedModels, selectedRow]) setModels(
models.map((model) => {
if (model.code === selectedRow.code) {
return {
...model,
selected: true,
}
}
return {
...model,
}
}),
)
setSelectedRow(null) setSelectedRow(null)
} }
const onRemoveSelectedModel = (model) => { const onRemoveSelectedModel = (model) => {
setSelectedModels(selectedModels.filter((m) => m.code !== model.code)) // setSelectedModels(selectedModels.filter((m) => m.code !== model.code))
setModels(models.map((m) => ({ ...m, selected: m.code !== model.code ? m.selected : false })))
} }
useEffect(() => { // useEffect(() => {
console.log('🚀 ~ useEffect ~ selectedModels:', selectedModels) // console.log('🚀 ~ useEffect ~ selectedModels:', selectedModels)
const selectedModelsIds = selectedModels.map((model) => model.code) // const selectedModelsIds = selectedModels.map((model) => model.code)
setModels( // setModels(
models.map((model) => { // models.map((model) => {
return { // return {
...model, // ...model,
selected: selectedModelsIds.includes(model.code), // selected: selectedModelsIds.includes(model.code),
} // }
}), // }),
) // )
setModel({ ...model, selectedModels: selectedModels }) // setModel({ ...model, selectedModels: selectedModels })
}, [selectedModels]) // }, [selectedModels])
return ( return (
<> <>
<div className="outline-form mb15"> <div className="outline-form mb15">
@ -191,7 +192,7 @@ export default function PowerConditionalSelect(props) {
<div className="module-table-box mb10"> <div className="module-table-box mb10">
<div className="module-table-inner"> <div className="module-table-inner">
<div className="circuit-check-inner overflow"> <div className="circuit-check-inner overflow">
{seriesList?.map((series, index) => ( {series?.map((series, index) => (
<div className="d-check-box pop sel"> <div className="d-check-box pop sel">
<input type="checkbox" id={`"ch0"${index}`} onClick={() => onCheckSeries(series)} checked={series.selected} /> <input type="checkbox" id={`"ch0"${index}`} onClick={() => onCheckSeries(series)} checked={series.selected} />
<label htmlFor={`"ch0"${index}`}>{globalLocale === 'ko' ? series.pcsSerNm : series.pcsSerNmJp}</label> <label htmlFor={`"ch0"${index}`}>{globalLocale === 'ko' ? series.pcsSerNm : series.pcsSerNmJp}</label>
@ -234,11 +235,13 @@ export default function PowerConditionalSelect(props) {
</button> </button>
</div> </div>
<div className="circuit-data-form"> <div className="circuit-data-form">
{selectedModels?.map((model) => ( {models
<span className="normal-font"> ?.filter((m) => m.selected)
{model.itemNm} <button className="del" onClick={() => onRemoveSelectedModel(model)}></button> ?.map((model) => (
</span> <span className="normal-font">
))} {model.itemNm} <button className="del" onClick={() => onRemoveSelectedModel(model)}></button>
</span>
))}
</div> </div>
</div> </div>
</div> </div>

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

@ -10,16 +10,18 @@ import { useCanvasPopupStatusController } from '@/hooks/common/useCanvasPopupSta
import { canvasPopupStatusStore } from '@/store/canvasPopupStatusAtom' import { canvasPopupStatusStore } from '@/store/canvasPopupStatusAtom'
import { useMasterController } from '@/hooks/common/useMasterController' import { useMasterController } from '@/hooks/common/useMasterController'
export default function StepUp({}) { export default function StepUp(props) {
const { getMessage } = useMessage() const { getMessage } = useMessage()
const [moduleTab, setModuleTab] = useState(1) const [moduleTab, setModuleTab] = useState(1)
const [arrayLength, setArrayLength] = useState(3) //module-table-inner의 반복 개수 const [arrayLength, setArrayLength] = useState(3) //module-table-inner의 반복 개수
const [pcsCheck, setPcsCheck] = useRecoilState(pcsCheckState) const [pcsCheck, setPcsCheck] = useRecoilState(pcsCheckState)
const model = useRecoilValue(modelState) const { models } = props
const { getPcsAutoRecommendList } = useMasterController() const { getPcsVoltageStepUpList, getPcsAutoRecommendList } = useMasterController()
const { managementState, setManagementState, managementStateLoaded } = useContext(GlobalDataContext) const { managementState, setManagementState, managementStateLoaded } = useContext(GlobalDataContext)
const canvas = useRecoilValue(canvasState) const canvas = useRecoilValue(canvasState)
const selectedModules = useRecoilValue(selectedModuleState) const selectedModules = useRecoilValue(selectedModuleState)
const [stepUpListData, setStepUpListData] = useState([])
const [optCodes, setOptCodes] = useState([])
useEffect(() => { useEffect(() => {
if (!managementState) { if (!managementState) {
@ -27,9 +29,11 @@ export default function StepUp({}) {
setManagementState(managementStateLoaded) setManagementState(managementStateLoaded)
} }
const useModuleItemList = model.selectedModels.map((model) => { const useModuleItemList = models
return { itemId: model.itemId, mixMatlNo: model.mixMatlNo } .filter((m) => m.selected)
}) .map((model) => {
return { itemId: model.itemId, mixMatlNo: model.mixMatlNo }
})
// [{ roofSurfaceId: '', roofSurface: '', roofSurfaceIncl: '', moduleList: [{ itemId: '' }] }], // [{ roofSurfaceId: '', roofSurface: '', roofSurfaceIncl: '', moduleList: [{ itemId: '' }] }],
const roofSurfaceList = canvas const roofSurfaceList = canvas
.getObjects() .getObjects()
@ -48,13 +52,15 @@ export default function StepUp({}) {
} }
}) })
// [{ itemId: '', pcsMkrCd: '', pcsSerCd: '' }], // [{ itemId: '', pcsMkrCd: '', pcsSerCd: '' }],
const pscItemList = model.selectedModels.map((model) => { const pscItemList = models
return { .filter((m) => m.selected)
itemId: model.itemId, .map((model) => {
pcsMkrCd: model.pcsMkrCd, return {
pcsSerCd: model.pcsSerCd, itemId: model.itemId,
} pcsMkrCd: model.pcsMkrCd,
}) pcsSerCd: model.pcsSerCd,
}
})
const params = { const params = {
maxConnYn: pcsCheck.max, maxConnYn: pcsCheck.max,
@ -64,7 +70,44 @@ export default function StepUp({}) {
roofSurfaceList: roofSurfaceList, roofSurfaceList: roofSurfaceList,
pscItemList: pscItemList, pscItemList: pscItemList,
} }
getPcsAutoRecommendList(params) //getPcsVoltageStepUpList(null)
getPcsVoltageStepUpList().then((res) => {
if (res?.result.code === 200 && res?.data) {
const dataArray = Array.isArray(res.data) ? res.data : [res.data]
const stepUpListData = dataArray.map((stepUps) => ({
...stepUps,
optionList: (stepUps.optionList || []).map((option) => ({
pcsOptCd: option.pcsOptCd,
pcsOptNm: option.pcsOptNm,
pcsOptNmJp: option.pcsOptNmJp,
})),
pcsItemList: (stepUps.pcsItemList || []).map((item) => ({
goodsNo: item.goodsNo,
itemId: item.itemId,
itemNm: item.itemNm,
pcsMkrCd: item.pcsMkrCd,
pcsSerCd: item.pcsSerCd,
connList: (item.connList || []).map((conn) => ({
connAllowCur: conn.connAllowCur,
connMaxParalCnt: conn.connMaxParalCnt,
goodsNo: conn.goodsNo,
itemId: conn.itemId,
itemNm: conn.itemNm,
vstuParalCnt: conn.vstuParalCnt,
})),
serQtyList: (item.serQtyList || []).map((qty) => ({
serQty: qty.serQty,
paralQty: qty.paralQty,
})),
})),
}))
console.log('🚀 ~ useEffect ~ getPcsVoltageStepUpList ~ stepUpListData:', stepUpListData)
setStepUpListData(stepUpListData)
}
})
//setOptCodes(stepUpListData.optionList.map((opt) => ({ ...opt, code: opt.pcsOptCd, name: opt.pcsOptNm, nameJp: opt.pcsOptNmJp })))
}, []) }, [])
useCanvasPopupStatusController(6) useCanvasPopupStatusController(6)
@ -77,112 +120,101 @@ export default function StepUp({}) {
<div className="properties-setting-wrap outer"> <div className="properties-setting-wrap outer">
<div className="circuit-overflow"> <div className="circuit-overflow">
{/* 3개일때 className = by-max */} {/* 3개일때 className = by-max */}
<div className={`module-table-box ${arrayLength === 3 ? 'by-max' : ''}`}> {stepUpListData.map((stepUp, index) => (
{Array.from({ length: arrayLength }).map((_, idx) => ( <div key={index} className={`module-table-box ${stepUp.pcsItemList.length === 3 ? 'by-max' : ''}`}>
<div key={idx} className="module-table-inner"> {Array.from({ length: stepUp.pcsItemList.length }).map((_, idx) => (
<div className="mb-box"> <div key={idx} className="module-table-inner">
<div className="circuit-table-tit">HQJP-KA55-5</div> <div className="mb-box">
<div className="roof-module-table overflow-y min"> <div className="circuit-table-tit">{stepUp.pcsItemList[idx].goodsNo}</div>
<table> <div className="roof-module-table overflow-y min">
<thead> <table>
<tr> <thead>
<th>{getMessage('modal.circuit.trestle.setting.step.up.allocation.serial.amount')}</th> <tr>
<th>{getMessage('modal.circuit.trestle.setting.step.up.allocation.total.amount')}</th> <th>{getMessage('modal.circuit.trestle.setting.step.up.allocation.serial.amount')}</th>
</tr> <th>{getMessage('modal.circuit.trestle.setting.step.up.allocation.total.amount')}</th>
</thead> </tr>
<tbody> </thead>
<tr className="on"> <tbody>
<td className="al-r">10</td> {stepUp.pcsItemList[idx].serQtyList.map((item) => {
<td className="al-r">0</td> return (
</tr> <tr className="on">
<tr> <td className="al-r">{item.serQty}</td>
<td className="al-r">10</td> <td className="al-r">{item.paralQty}</td>
<td className="al-r">0</td> </tr>
</tr> )
<tr> })}
<td className="al-r">10</td> </tbody>
<td className="al-r">0</td> </table>
</tr> </div>
<tr> </div>
<td className="al-r">10</td> <div className="module-box-tab mb10">
<td className="al-r">0</td> <button className={`module-btn ${moduleTab === 1 ? 'act' : ''}`} onClick={() => setModuleTab(1)}>
</tr> {getMessage('modal.circuit.trestle.setting.step.up.allocation.connected')}
<tr> </button>
<td className="al-r">10</td> <button className={`module-btn ${moduleTab === 2 ? 'act' : ''}`} onClick={() => setModuleTab(2)}>
<td className="al-r">0</td> {getMessage('modal.circuit.trestle.setting.step.up.allocation.option')}
</tr> </button>
<tr> </div>
<td className="al-r">10</td> <div className="circuit-table-flx-wrap">
<td className="al-r">0</td> {moduleTab === 1 && (
</tr> <div className="circuit-table-flx-box">
</tbody> <div className="roof-module-table min mb10">
</table> <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}</td>
<td className="al-r">{stepUp.pcsItemList[idx].connList[0].connMaxParalCnt}</td>
<td className="al-r">{stepUp.pcsItemList[idx].connList[0].vstuParalCnt}</td>
</tr>
</tbody>
</table>
</div>
</div>
)}
{moduleTab === 2 && (
<div className="circuit-table-flx-box">
<div className="roof-module-table min mb10">
<table>
<thead>
<tr>
<th>名称</th>
<th>昇圧回路数</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="module-box-tab mb10"> ))}
<button className={`module-btn ${moduleTab === 1 ? 'act' : ''}`} onClick={() => setModuleTab(1)}> </div>
{getMessage('modal.circuit.trestle.setting.step.up.allocation.connected')} ))}
</button>
<button className={`module-btn ${moduleTab === 2 ? 'act' : ''}`} onClick={() => setModuleTab(2)}>
{getMessage('modal.circuit.trestle.setting.step.up.allocation.option')}
</button>
</div>
<div className="circuit-table-flx-wrap">
{moduleTab === 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">KTN-CBD4C</td>
<td className="al-r">4</td>
<td className="al-r">0</td>
</tr>
</tbody>
</table>
</div>
</div>
)}
{moduleTab === 2 && (
<div className="circuit-table-flx-box">
<div className="roof-module-table min mb10">
<table>
<thead>
<tr>
<th>名称</th>
<th>昇圧回路数</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 className="slope-wrap"> <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')}
</span> </span>
<div className="grid-select mr10"> {optCodes.length > 0 && (
<QSelectBox title={'電力検出ユニット (モニター付き)'} /> <div className="grid-select mr10">
</div> <QSelectBox title={'電力検出ユニット (モニター付き)'} />
{/* <QSelectBox options={optCodes} value={optCodes.name} sourceKey="code" targetKey="code" showKey="name" /> */}
</div>
)}
</div> </div>
</div> </div>
</div> </div>

208
src/components/floor-plan/modal/circuitTrestle/step/type/PassivityCircuitAllocation.jsx
View File

@ -2,31 +2,24 @@ import { GlobalDataContext } from '@/app/GlobalDataProvider'
import { POLYGON_TYPE } from '@/common/common' import { POLYGON_TYPE } from '@/common/common'
import { useMessage } from '@/hooks/useMessage' import { useMessage } from '@/hooks/useMessage'
import { canvasState } from '@/store/canvasAtom' import { canvasState } from '@/store/canvasAtom'
import { modelState } from '@/store/circuitTrestleAtom' import { moduleStatisticsState } from '@/store/circuitTrestleAtom'
import { selectedModuleState } from '@/store/selectedModuleOptions' import { selectedModuleState } from '@/store/selectedModuleOptions'
import { useContext, useEffect, useState } from 'react' import { useContext, useEffect, useState } from 'react'
import { useRecoilValue } from 'recoil' import { useRecoilValue } from 'recoil'
const DIRECTION = { export default function PassivityCircuitAllocation(props) {
north: '北', const { tabNum, setTabNum, models, setModels } = props
south: '南',
west: '西',
east: '東',
}
export default function PassivityCircuitAllocation() {
const { getMessage } = useMessage() const { getMessage } = useMessage()
const canvas = useRecoilValue(canvasState) const canvas = useRecoilValue(canvasState)
const selectedModules = useRecoilValue(selectedModuleState)
const { managementState, setManagementState, managementStateLoaded } = useContext(GlobalDataContext) const { managementState, setManagementState, managementStateLoaded } = useContext(GlobalDataContext)
const [moduleData, setModuleData] = useState({ const selectedModules = useRecoilValue(selectedModuleState)
header: [], const moduleStatistics = useRecoilValue(moduleStatisticsState)
rows: [], // const [totalWpout, setTotalWpout] = useState(0)
}) const [selectedPcs, setSelectedPcs] = useState(models.filter((model) => model.selected)[0])
const model = useRecoilValue(modelState) const { header, rows: row } = moduleStatistics
const [selectedModels, setSelectedModels] = useState(model.selectedModels) const [headers, setHeaders] = useState(header)
const [selectedPcs, setSelectedPcs] = useState(selectedModels[0]) const [rows, setRows] = useState(row)
const [totalWpout, setTotalWpout] = useState(0) const [footer, setFooter] = useState(['합계'])
useEffect(() => { useEffect(() => {
setSurfaceInfo() setSurfaceInfo()
@ -35,48 +28,90 @@ export default function PassivityCircuitAllocation() {
} }
}, []) }, [])
useEffect(() => {
console.log('🚀 ~ useEffect ~ headers:', headers)
}, [headers])
useEffect(() => {
console.log('🚀 ~ useEffect ~ rows:', rows)
}, [rows])
const setSurfaceInfo = () => { const setSurfaceInfo = () => {
console.log('🚀 ~ setSurfaceInfo ~ headers:', headers)
console.log('🚀 ~ setSurfaceInfo ~ rows:', rows)
// console.log('🚀 ~ setSurfaceInfo ~ surfaces:', surfaces)
const surfaces = canvas.getObjects().filter((obj) => POLYGON_TYPE.MODULE_SETUP_SURFACE === obj.name) const surfaces = canvas.getObjects().filter((obj) => POLYGON_TYPE.MODULE_SETUP_SURFACE === obj.name)
let totalWpout = 0 setHeaders([header[0], { name: '회로', prop: 'circuit' }, ...header.slice(1)])
const rows = surfaces.map((surface) => { setRows(
let wpOut = 0 rows.map((row) => {
let moduleInfo = {} return {
surface.modules.forEach((module) => { ...row,
wpOut += +module.moduleInfo.wpOut circuit: '',
if (!moduleInfo[module.moduleInfo.itemId]) moduleInfo[module.moduleInfo.itemId] = 0 }
moduleInfo[module.moduleInfo.itemId]++ }),
}) )
totalWpout += wpOut let totals = {}
console.log('🚀 ~ moduleData.rows=surfaces.map ~ module:', module)
return { rows.forEach((row) => {
roofShape: DIRECTION[surface.direction], if (header.length === 4) {
powerGeneration: wpOut.toLocaleString('ko-KR', { maximumFractionDigits: 4 }), if (!totals[header[2].prop]) totals[header[2].prop] = 0
...moduleInfo, totals[header[2].prop] += +row[header[2].prop]
} else if (header.length === 5) {
if (!totals[header[2].prop]) totals[header[2].prop] = 0
totals[header[2].prop] += +row[header[2].prop]
if (!totals[header[3].prop]) totals[header[3].prop] = 0
totals[header[3]] += +row[header[3]]
} }
}) })
console.log(totals)
setFooter([
...['합계', ''],
...Object.keys(totals).map((key) => {
return totals[key]
}),
Object.keys(totals).reduce((acc, key) => {
return acc + totals[key]
}, 0),
])
// let totalWpout = 0
// const rows = surfaces.map((surface) => {
// let wpOut = 0
// let moduleInfo = {}
// surface.modules.forEach((module) => {
// wpOut += +module.moduleInfo.wpOut
// if (!moduleInfo[module.moduleInfo.itemId]) moduleInfo[module.moduleInfo.itemId] = 0
// moduleInfo[module.moduleInfo.itemId]++
// })
// totalWpout += wpOut
// console.log('🚀 ~ moduleData.rows=surfaces.map ~ module:', module)
// return {
// roofShape: DIRECTION[surface.direction],
// powerGeneration: wpOut.toLocaleString('ko-KR', { maximumFractionDigits: 4 }),
// ...moduleInfo,
// }
// })
setTotalWpout(totalWpout) // setTotalWpout(totalWpout)
// 지붕면 리스트 -> 지붕면에 있는 모듈 리스트 -> 발전량 총합 계산 // 지붕면 리스트 -> 지붕면에 있는 모듈 리스트 -> 발전량 총합 계산
// wpOut // wpOut
console.log('🚀 ~ setSurfaceInfo ~ modules:', rows)
console.log('🚀 ~ setSurfaceInfo ~ surfaces:', surfaces) // setModuleData({
setModuleData({ // header: [
header: [ // { name: getMessage('modal.panel.batch.statistic.roof.shape'), prop: 'roofShape' },
{ name: getMessage('modal.panel.batch.statistic.roof.shape'), prop: 'roofShape' }, // { name: getMessage('modal.circuit.trestle.setting.circuit.allocation.passivity.circuit'), prop: 'circuit' },
{ name: getMessage('modal.circuit.trestle.setting.circuit.allocation.passivity.circuit'), prop: 'circuit' }, // ...selectedModules.itemList.map((module) => {
...selectedModules.itemList.map((module) => { // return {
return { // name: module.itemNm,
name: module.itemNm, // prop: module.itemId,
prop: module.itemId, // }
} // }),
}), // {
{ // name: `${getMessage('modal.panel.batch.statistic.power.generation.amount')}(kW)`,
name: `${getMessage('modal.panel.batch.statistic.power.generation.amount')}(kW)`, // prop: 'powerGeneration',
prop: 'powerGeneration', // },
}, // ],
], // rows: rows,
rows: rows, // })
})
} }
return ( return (
<> <>
@ -87,32 +122,27 @@ export default function PassivityCircuitAllocation() {
<div className="bold-font mb10">{getMessage('modal.circuit.trestle.setting.circuit.allocation.passivity')}</div> <div className="bold-font mb10">{getMessage('modal.circuit.trestle.setting.circuit.allocation.passivity')}</div>
<div className="normal-font mb15">{getMessage('modal.circuit.trestle.setting.circuit.allocation.passivity.info')}</div> <div className="normal-font mb15">{getMessage('modal.circuit.trestle.setting.circuit.allocation.passivity.info')}</div>
<div className="roof-module-table overflow-y"> <div className="roof-module-table overflow-y">
{moduleData.header && ( {header && (
<table> <table>
<thead> <thead>
<tr> <tr>
{moduleData.header.map((header) => ( {headers.map((header) => (
<th key={header.prop}>{header.name}</th> <th key={'header' + header.prop}>{header.name}</th>
))} ))}
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
{moduleData.rows.map((row, index) => ( {rows.map((row, index) => (
<tr key={index} className="wrong"> <tr key={'row' + index}>
{moduleData.header.map((header) => ( {headers.map((header) => (
<td className="al-c" key={header.prop}> <td className="al-c">{row[header.prop]}</td>
{row[header.prop]}
</td>
))} ))}
</tr> </tr>
))} ))}
<tr className="wrong"> <tr>
<td className="al-c">총합</td> {footer.map((footer) => (
{Array.from({ length: moduleData.header.length - 3 }).map((_, index) => { <td className="al-c">{footer}</td>
return <td key={index} className="al-c"></td> ))}
})}
<td className="al-c">{totalWpout.toLocaleString('ko-KR', { maximumFractionDigits: 4 })}</td>
<td className="al-c">{totalWpout.toLocaleString('ko-KR', { maximumFractionDigits: 4 })}</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
@ -127,25 +157,27 @@ export default function PassivityCircuitAllocation() {
<div className="bold-font">{getMessage('modal.circuit.trestle.setting.circuit.allocation.passivity.selected.power.conditional')}</div> <div className="bold-font">{getMessage('modal.circuit.trestle.setting.circuit.allocation.passivity.selected.power.conditional')}</div>
</div> </div>
<div className="hexagonal-item"> <div className="hexagonal-item">
{selectedModels.map((model, index) => ( {models
<div className="d-check-radio pop mb10"> .filter((model) => model.selected)
<input .map((model, index) => (
type="radio" <div className="d-check-radio pop mb10" key={'model' + index}>
name="radio01" <input
id={`ra0${index + 1}`} type="radio"
checked={selectedPcs === model} name="radio01"
onChange={() => setSelectedPcs(model)} id={`ra0${index + 1}`}
/> checked={selectedPcs === model}
<label htmlFor="ra01"> onChange={() => setSelectedPcs(model)}
{model.itemNm} ( />
{getMessage( <label htmlFor="ra01">
'modal.circuit.trestle.setting.circuit.allocation.passivity.circuit.info', {model.itemNm} (
managementState?.coldRegionFlg === '1' ? [model.serMinQty, model.serColdZoneMaxQty] : [model.serMinQty, model.serMaxQty], {getMessage(
)} 'modal.circuit.trestle.setting.circuit.allocation.passivity.circuit.info',
) managementState?.coldRegionFlg === '1' ? [model.serMinQty, model.serColdZoneMaxQty] : [model.serMinQty, model.serMaxQty],
</label> )}
</div> )
))} </label>
</div>
))}
{/* <div className="d-check-radio pop mb10"> {/* <div className="d-check-radio pop mb10">
<input type="radio" name="radio01" id="ra01" /> <input type="radio" name="radio01" id="ra01" />
<label htmlFor="ra01">HQJP-KA55-5 (標準回路2枚～10枚)</label> <label htmlFor="ra01">HQJP-KA55-5 (標準回路2枚～10枚)</label>

1
src/components/floor-plan/modal/movement/MovementSetting.jsx
View File

@ -33,7 +33,6 @@ export default function MovementSetting({ id, pos = { x: 50, y: 230 } }) {
))} ))}
</div> </div>
<div className="properties-setting-wrap outer"> <div className="properties-setting-wrap outer">
<div className="setting-tit">{getMessage('setting')}</div>
{type === TYPE.FLOW_LINE && <FlowLine {...flowLineProps} />} {type === TYPE.FLOW_LINE && <FlowLine {...flowLineProps} />}
{type === TYPE.UP_DOWN && <Updown {...updownProps} />} {type === TYPE.UP_DOWN && <Updown {...updownProps} />}
</div> </div>

1
src/components/floor-plan/modal/object/ObjectSetting.jsx
View File

@ -92,7 +92,6 @@ export default function ObjectSetting({ id, pos = { x: 50, y: 230 } }) {
))} ))}
</div> </div>
<div className="properties-setting-wrap outer"> <div className="properties-setting-wrap outer">
<div className="setting-tit">{getMessage('setting')}</div>
{buttonAct === 1 && <OpenSpace ref={objectPlacement} />} {buttonAct === 1 && <OpenSpace ref={objectPlacement} />}
{buttonAct === 2 && <Shadow ref={objectPlacement} />} {buttonAct === 2 && <Shadow ref={objectPlacement} />}
{buttonAct === 3 && <TriangleDormer ref={dormerPlacement} />} {buttonAct === 3 && <TriangleDormer ref={dormerPlacement} />}

1
src/components/floor-plan/modal/outerlinesetting/WallLineSetting.jsx
View File

@ -152,7 +152,6 @@ export default function WallLineSetting(props) {
</button> </button>
</div> </div>
<div className="properties-setting-wrap outer"> <div className="properties-setting-wrap outer">
<div className="setting-tit">{getMessage('modal.cover.outline.setting')}</div>
{type === OUTER_LINE_TYPE.OUTER_LINE ? ( {type === OUTER_LINE_TYPE.OUTER_LINE ? (
<OuterLineWall props={outerLineProps} /> <OuterLineWall props={outerLineProps} />
) : type === OUTER_LINE_TYPE.RIGHT_ANGLE ? ( ) : type === OUTER_LINE_TYPE.RIGHT_ANGLE ? (

21
src/components/floor-plan/modal/panelBatch/PanelBatchStatistics.jsx
View File

@ -4,7 +4,7 @@ import { useState } from 'react'
import { useMessage } from '@/hooks/useMessage' import { useMessage } from '@/hooks/useMessage'
import WithDraggable from '@/components/common/draggable/WithDraggable' import WithDraggable from '@/components/common/draggable/WithDraggable'
import { moduleStatisticsState } from '@/store/circuitTrestleAtom' import { moduleStatisticsState } from '@/store/circuitTrestleAtom'
import { useRecoilValue } from 'recoil' import { useRecoilValue, useResetRecoilState } from 'recoil'
export default function PanelBatchStatistics() { export default function PanelBatchStatistics() {
const { getMessage } = useMessage() const { getMessage } = useMessage()
@ -24,23 +24,24 @@ export default function PanelBatchStatistics() {
<table className="penal-table"> <table className="penal-table">
<thead> <thead>
<tr> <tr>
{header.map((item) => ( {header.map((item, index) => (
<th>{item.name}</th> <th key={index}>{item.name}</th>
))} ))}
</tr> </tr>
</thead> </thead>
<tbody> <tbody>
{rows.map((row) => ( {rows.map((row, index) => (
<tr> <tr key={index}>
{header.map((item) => ( {header.map((item, i) => (
// <td>{item.prop === 'name' ? item.name : item.prop === 'powerGeneration' ? item.powerGeneration : item.amount}</td> <td key={index}>
<td>{row[item.prop]}</td> {typeof row[item.prop] === 'number' ? row[item.prop].toLocaleString('ko-KR', { maximumFractionDigits: 4 }) : row[item.prop]}
</td>
))} ))}
</tr> </tr>
))} ))}
<tr> <tr>
{footer.map((item) => ( {footer.map((item, index) => (
<td>{item}</td> <td key={index}>{typeof item === 'number' ? item.toLocaleString('ko-KR', { maximumFractionDigits: 4 }) : item}</td>
// <td className="al-r">{item.amount}</td> // <td className="al-r">{item.amount}</td>
))} ))}
</tr> </tr>

3
src/components/floor-plan/modal/placementShape/PlacementShapeDrawing.jsx
View File

@ -142,7 +142,6 @@ export default function PlacementShapeDrawing({ id, pos = { x: 50, y: 230 } }) {
))} ))}
</div> </div>
<div className="properties-setting-wrap outer"> <div className="properties-setting-wrap outer">
<div className="setting-tit">{getMessage('setting')}</div>
{buttonAct === 1 && <OuterLineWall props={outerLineProps} />} {buttonAct === 1 && <OuterLineWall props={outerLineProps} />}
{buttonAct === 2 && <RightAngle props={rightAngleProps} />} {buttonAct === 2 && <RightAngle props={rightAngleProps} />}
{buttonAct === 3 && <DoublePitch props={doublePitchProps} />} {buttonAct === 3 && <DoublePitch props={doublePitchProps} />}
@ -155,7 +154,7 @@ export default function PlacementShapeDrawing({ id, pos = { x: 50, y: 230 } }) {
{getMessage('modal.cover.outline.rollback')} {getMessage('modal.cover.outline.rollback')}
</button> </button>
<button className="btn-frame modal act" onClick={handleFix}> <button className="btn-frame modal act" onClick={handleFix}>
{getMessage('modal.cover.outline.fix')} {getMessage('modal.placement.surface.drawing.fix')}
</button> </button>
</div> </div>
</div> </div>

1
src/components/floor-plan/modal/roofShape/RoofShapeSetting.jsx
View File

@ -108,7 +108,6 @@ export default function RoofShapeSetting({ id, pos = { x: 50, y: 230 } }) {
))} ))}
</div> </div>
<div className="properties-setting-wrap"> <div className="properties-setting-wrap">
<div className="setting-tit">{getMessage('setting')}</div>
{shapeNum === 1 && <Ridge {...ridgeProps} />} {shapeNum === 1 && <Ridge {...ridgeProps} />}
{(shapeNum === 2 || shapeNum === 3) && <Pattern {...patternProps} />} {(shapeNum === 2 || shapeNum === 3) && <Pattern {...patternProps} />}
{shapeNum === 4 && <Side {...sideProps} />} {shapeNum === 4 && <Side {...sideProps} />}

2
src/components/header/Header.jsx
View File

@ -221,7 +221,7 @@ export default function Header(props) {
return ( return (
<> <>
{!isGlobalLoading && !(pathName.includes('login') || pathName.includes('join') || sessionState.pwdInitYn === 'N') && ( {!(pathName.includes('login') || pathName.includes('join') || sessionState.pwdInitYn === 'N') && (
<header className={isDimmed}> <header className={isDimmed}>
<div className="header-inner"> <div className="header-inner">
<div className="header-right"> <div className="header-right">

54
src/components/main/MainContents.jsx
View File

@ -15,6 +15,7 @@ import { QcastContext } from '@/app/QcastProvider'
import { useSwal } from '@/hooks/useSwal' import { useSwal } from '@/hooks/useSwal'
import BoardDetailModal from '../community/modal/BoardDetailModal' import BoardDetailModal from '../community/modal/BoardDetailModal'
import { handleFileDown } from '@/util/board-utils'
export default function MainContents() { export default function MainContents() {
const { swalFire } = useSwal() const { swalFire } = useSwal()
@ -22,8 +23,7 @@ export default function MainContents() {
const { getMessage } = useMessage() const { getMessage } = useMessage()
const router = useRouter() const router = useRouter()
const globalLocaleState = useRecoilValue(globalLocaleStore) const globalLocaleState = useRecoilValue(globalLocaleStore)
const { promiseGet } = useAxios(globalLocaleState) const { promiseGet, get } = useAxios(globalLocaleState)
//공지사항 //공지사항
const [recentNoticeList, setRecentNoticeList] = useState([]) const [recentNoticeList, setRecentNoticeList] = useState([])
@ -33,15 +33,42 @@ export default function MainContents() {
const { qcastState, setIsGlobalLoading } = useContext(QcastContext) const { qcastState, setIsGlobalLoading } = useContext(QcastContext)
const { fetchObjectList, initObjectList } = useMainContentsController() const { fetchObjectList, initObjectList } = useMainContentsController()
//첨부파일
const [boardList, setBoardList] = useState([])
useEffect(() => { useEffect(() => {
fetchObjectList() fetchObjectList()
fetchNoticeList() fetchNoticeList()
fetchFaqList() fetchFaqList()
//첨부파일 목록 호출
fetchArchiveList()
return () => { return () => {
initObjectList() initObjectList()
} }
}, []) }, [])
//첨부파일 목록 호출
const fetchArchiveList = async () => {
const url = `/api/board/list`
const params = new URLSearchParams({
schNoticeTpCd: 'QC',
schNoticeClsCd: 'DOWN',
startRow: 1,
endRow: 2,
})
const apiUrl = `${url}?${params.toString()}`
const resultData = await get({ url: apiUrl })
if (resultData) {
if (resultData.result.code === 200) {
setBoardList(resultData.data)
} else {
alert(resultData.result.message)
}
}
}
//공지사항 호출 //공지사항 호출
const fetchNoticeList = async () => { const fetchNoticeList = async () => {
try { try {
@ -114,7 +141,7 @@ export default function MainContents() {
> >
<div className="item-inner"> <div className="item-inner">
<span className="time">{dayjs(row.lastEditDatetime).format('YYYY.MM.DD HH:mm:ss')}</span> <span className="time">{dayjs(row.lastEditDatetime).format('YYYY.MM.DD HH:mm:ss')}</span>
<span>{row.tempFlg === '0' ? row.objectNo : getMessage('stuff.gridData.tempObjectNo')}</span> <span className="product">{row.tempFlg === '0' ? row.objectNo : getMessage('stuff.gridData.tempObjectNo')}</span>
<span>{row.objectName ? row.objectName : '-'}</span> <span>{row.objectName ? row.objectName : '-'}</span>
<span>{row.saleStoreName}</span> <span>{row.saleStoreName}</span>
</div> </div>
@ -183,14 +210,19 @@ export default function MainContents() {
)} )}
</ProductItem> </ProductItem>
<ProductItem num={4} name={'Data Download'}> <ProductItem num={4} name={'Data Download'}>
<div className="data-download-wrap"> {boardList.length > 0 ? (
<button className="data-down" type="button" onClick={() => swalFire({ text: getMessage('main.content.alert.noFile'), type: 'alert' })}> <div className="data-download-wrap">
<span>{getMessage('main.content.download1')}</span> {boardList?.map((board) => (
</button> <button type="button" className="data-down" onClick={() => handleFileDown(board.noticeNo, 'Y')}>
<button className="data-down" type="button" onClick={() => swalFire({ text: getMessage('main.content.alert.noFile'), type: 'alert' })}> <span>{board.title}</span>
<span>{getMessage('main.content.download2')}</span> </button>
</button> ))}
</div> </div>
) : (
<div className="file-down-nodata">
<h3>{getMessage('common.message.no.data')}</h3>
</div>
)}
</ProductItem> </ProductItem>
<ProductItem num={5} name={'Sales Contact info'}> <ProductItem num={5} name={'Sales Contact info'}>
<ul className="contact-info-list"> <ul className="contact-info-list">

15
src/components/management/Stuff.jsx
View File

@ -222,7 +222,6 @@ export default function Stuff() {
if (!params.saleStoreId) { if (!params.saleStoreId) {
params.saleStoreId = session.storeId params.saleStoreId = session.storeId
} }
async function fetchData() { async function fetchData() {
const apiUrl = `/api/object/list?${queryStringFormatter(params)}` const apiUrl = `/api/object/list?${queryStringFormatter(params)}`
await get({ await get({
@ -278,6 +277,13 @@ export default function Stuff() {
if (!stuffSearchParams.saleStoreId) { if (!stuffSearchParams.saleStoreId) {
stuffSearchParams.saleStoreId = session.storeId stuffSearchParams.saleStoreId = session.storeId
} }
if (stuffSearchParams.schMyDataCheck) {
if (session.storeLvl === '1') {
//schOtherSelSaleStoreId 초기화 schSelSaleStoreId 에 saleStoreId 담아서 보내기
stuffSearchParams.schOtherSelSaleStoreId = ''
stuffSearchParams.schSelSaleStoreId = session.storeId
}
}
async function fetchData() { async function fetchData() {
const apiUrl = `/api/object/list?${queryStringFormatter(stuffSearchParams)}` const apiUrl = `/api/object/list?${queryStringFormatter(stuffSearchParams)}`
@ -312,6 +318,12 @@ export default function Stuff() {
if (!params.saleStoreId) { if (!params.saleStoreId) {
stuffSearchParams.saleStoreId = session.storeId stuffSearchParams.saleStoreId = session.storeId
} }
if (stuffSearchParams.schMyDataCheck) {
//schOtherSelSaleStoreId 초기화 schSelSaleStoreId 에 saleStoreId 담아서 보내기
stuffSearchParams.schOtherSelSaleStoreId = ''
stuffSearchParams.schSelSaleStoreId = session.storeId
}
async function fetchData() { async function fetchData() {
const apiUrl = `/api/object/list?${queryStringFormatter(stuffSearchParams)}` const apiUrl = `/api/object/list?${queryStringFormatter(stuffSearchParams)}`
await get({ url: apiUrl }).then((res) => { await get({ url: apiUrl }).then((res) => {
@ -347,6 +359,7 @@ export default function Stuff() {
code: 'S', code: 'S',
pageNo: 1, pageNo: 1,
pageSize: 100, pageSize: 100,
schMyDataCheck: false,
} }
setStuffSearch({ setStuffSearch({

67
src/components/management/StuffDetail.jsx
View File

@ -4,7 +4,6 @@ import { useState, useEffect, useRef, useContext } from 'react'
import { useRouter, useSearchParams } from 'next/navigation' import { useRouter, useSearchParams } from 'next/navigation'
import { Button } from '@nextui-org/react' import { Button } from '@nextui-org/react'
import Select, { components } from 'react-select' import Select, { components } from 'react-select'
import Link from 'next/link'
import { useAxios } from '@/hooks/useAxios' import { useAxios } from '@/hooks/useAxios'
import { globalLocaleStore } from '@/store/localeAtom' import { globalLocaleStore } from '@/store/localeAtom'
import { isEmptyArray, isNotEmptyArray, isObjectNotEmpty, queryStringFormatter } from '@/util/common-utils' import { isEmptyArray, isNotEmptyArray, isObjectNotEmpty, queryStringFormatter } from '@/util/common-utils'
@ -289,10 +288,12 @@ export default function StuffDetail() {
display: 'none', display: 'none',
} }
} }
// if (managementState?.createUser === 'T01' && session?.userId !== 'T01') { if (managementState?.createUser === 'T01') {
//createUser가 T01인데 로그인사용자가 T01이 아니면 버튼숨기기 적용할지 미정!!!!!!!! if (session.userId !== 'T01') {
//buttonStyle = { display: 'none' } // #474
// } buttonStyle = { display: 'none' }
}
}
return ( return (
<> <>
<div className="grid-cell-btn"> <div className="grid-cell-btn">
@ -301,7 +302,6 @@ export default function StuffDetail() {
type="button" type="button"
className="grid-btn" className="grid-btn"
onClick={() => { onClick={() => {
//mid:5(견적서), /pid:플랜번호
setFloorPlanObjectNo({ floorPlanObjectNo: params.data.objectNo }) setFloorPlanObjectNo({ floorPlanObjectNo: params.data.objectNo })
setIsGlobalLoading(true) setIsGlobalLoading(true)
setMenuNumber(5) setMenuNumber(5)
@ -1025,6 +1025,8 @@ export default function StuffDetail() {
const _objectNameOmit = watch('objectNameOmit') const _objectNameOmit = watch('objectNameOmit')
// saleStoreId: '', //1차 판매점ID // saleStoreId: '', //1차 판매점ID
const _saleStoreId = watch('saleStoreId') const _saleStoreId = watch('saleStoreId')
// 2차 판매점명
const _otherSaleStoreId = watch('otherSaleStoreId')
// zipNo: '', //우편번호 // zipNo: '', //우편번호
const _zipNo = watch('zipNo') const _zipNo = watch('zipNo')
// prefId: '', //도도부현 // prefId: '', //도도부현
@ -1043,6 +1045,7 @@ export default function StuffDetail() {
useEffect(() => { useEffect(() => {
if (editMode === 'NEW') { if (editMode === 'NEW') {
const formData = form.getValues() const formData = form.getValues()
let errors = {} let errors = {}
if (!formData.receiveUser || formData.receiveUser.trim().length === 0) { if (!formData.receiveUser || formData.receiveUser.trim().length === 0) {
errors.receiveUser = true errors.receiveUser = true
@ -1057,6 +1060,12 @@ export default function StuffDetail() {
errors.saleStoreId = true errors.saleStoreId = true
} }
if (session?.storeLvl === '2') {
if (!formData.otherSaleStoreId) {
errors.otherSaleStoreId = true
}
}
if (!formData.zipNo) { if (!formData.zipNo) {
errors.zipNo = true errors.zipNo = true
} }
@ -1099,6 +1108,12 @@ export default function StuffDetail() {
errors.saleStoreId = true errors.saleStoreId = true
} }
if (session?.storeLvl === '2') {
if (!formData.otherSaleStoreId) {
errors.otherSaleStoreId = true
}
}
if (!formData.zipNo) { if (!formData.zipNo) {
errors.zipNo = true errors.zipNo = true
} }
@ -1130,6 +1145,7 @@ export default function StuffDetail() {
_objectName, _objectName,
_objectNameOmit, _objectNameOmit,
_saleStoreId, _saleStoreId,
_otherSaleStoreId,
_zipNo, _zipNo,
_prefId, _prefId,
_address, _address,
@ -1368,13 +1384,12 @@ export default function StuffDetail() {
setIsGlobalLoading(true) setIsGlobalLoading(true)
//상세화면으로 전환 //상세화면으로 전환
if (res.status === 201) { if (res.status === 201) {
setIsGlobalLoading(false)
setFloorPlanObjectNo({ floorPlanObjectNo: objectNo }) setFloorPlanObjectNo({ floorPlanObjectNo: objectNo })
swalFire({ swalFire({
text: getMessage('stuff.detail.save'), text: getMessage('stuff.detail.save'),
type: 'alert', type: 'alert',
confirmFn: () => { confirmFn: () => {
setIsGlobalLoading(false)
router.push(`/management/stuff/detail?objectNo=${res.data.objectNo.toString()}`, { scroll: false }) router.push(`/management/stuff/detail?objectNo=${res.data.objectNo.toString()}`, { scroll: false })
}, },
}) })
@ -1391,12 +1406,12 @@ export default function StuffDetail() {
setIsGlobalLoading(true) setIsGlobalLoading(true)
if (res.status === 201) { if (res.status === 201) {
setIsGlobalLoading(false)
setFloorPlanObjectNo({ floorPlanObjectNo: res.data.objectNo }) setFloorPlanObjectNo({ floorPlanObjectNo: res.data.objectNo })
swalFire({ swalFire({
text: getMessage('stuff.detail.save'), text: getMessage('stuff.detail.save'),
type: 'alert', type: 'alert',
confirmFn: () => { confirmFn: () => {
setIsGlobalLoading(false)
router.push(`/management/stuff/detail?objectNo=${res.data.objectNo.toString()}`, { scroll: false }) router.push(`/management/stuff/detail?objectNo=${res.data.objectNo.toString()}`, { scroll: false })
}, },
}) })
@ -1468,11 +1483,11 @@ export default function StuffDetail() {
.then((res) => { .then((res) => {
setIsGlobalLoading(true) setIsGlobalLoading(true)
if (res.status === 201) { if (res.status === 201) {
setIsGlobalLoading(false)
swalFire({ swalFire({
text: getMessage('stuff.detail.tempSave.message1'), text: getMessage('stuff.detail.tempSave.message1'),
type: 'alert', type: 'alert',
confirmFn: () => { confirmFn: () => {
setIsGlobalLoading(false)
router.push(`/management/stuff/tempdetail?objectNo=${res.data.objectNo.toString()}`, { scroll: false }) router.push(`/management/stuff/tempdetail?objectNo=${res.data.objectNo.toString()}`, { scroll: false })
}, },
}) })
@ -1487,11 +1502,11 @@ export default function StuffDetail() {
.then((res) => { .then((res) => {
setIsGlobalLoading(true) setIsGlobalLoading(true)
if (res.status === 201) { if (res.status === 201) {
setIsGlobalLoading(false)
swalFire({ swalFire({
text: getMessage('stuff.detail.tempSave.message1'), text: getMessage('stuff.detail.tempSave.message1'),
type: 'alert', type: 'alert',
confirmFn: () => { confirmFn: () => {
setIsGlobalLoading(false)
router.push(`/management/stuff/tempdetail?objectNo=${res.data.objectNo.toString()}`, { scroll: false }) router.push(`/management/stuff/tempdetail?objectNo=${res.data.objectNo.toString()}`, { scroll: false })
}, },
}) })
@ -1519,7 +1534,7 @@ export default function StuffDetail() {
confirmFn: () => { confirmFn: () => {
setFloorPlanObjectNo({ floorPlanObjectNo: '' }) setFloorPlanObjectNo({ floorPlanObjectNo: '' })
del({ url: `/api/object/${objectNo}?${queryStringFormatter(delParams)}` }) del({ url: `/api/object/${objectNo}?${queryStringFormatter(delParams)}` })
.then((res) => { .then(() => {
setIsGlobalLoading(true) setIsGlobalLoading(true)
setFloorPlanObjectNo({ floorPlanObjectNo: '' }) setFloorPlanObjectNo({ floorPlanObjectNo: '' })
if (session.storeId === 'T01') { if (session.storeId === 'T01') {
@ -1595,6 +1610,13 @@ export default function StuffDetail() {
// 그리드 더블 클릭 해당플랜의 도면작성 화면으로 이동 // 그리드 더블 클릭 해당플랜의 도면작성 화면으로 이동
const getCellDoubleClicked = (params) => { const getCellDoubleClicked = (params) => {
//#474정책
if (managementState.createUser === 'T01') {
if (session.userId !== 'T01') {
return false
}
}
if (params?.column?.colId !== 'estimateDate') { if (params?.column?.colId !== 'estimateDate') {
if (params?.data?.planNo && params?.data?.objectNo) { if (params?.data?.planNo && params?.data?.objectNo) {
let objectNo = params?.data?.objectNo let objectNo = params?.data?.objectNo
@ -2462,6 +2484,7 @@ export default function StuffDetail() {
<td> <td>
<div className="flx-box"> <div className="flx-box">
<div className="select-wrap mr5" style={{ width: '567px' }}> <div className="select-wrap mr5" style={{ width: '567px' }}>
상세
<Select <Select
id="long-value-select2" id="long-value-select2"
instanceId="long-value-select2" instanceId="long-value-select2"
@ -2473,16 +2496,18 @@ export default function StuffDetail() {
onChange={onSelectionChange2} onChange={onSelectionChange2}
getOptionLabel={(x) => x.saleStoreName} getOptionLabel={(x) => x.saleStoreName}
getOptionValue={(x) => x.saleStoreId} getOptionValue={(x) => x.saleStoreId}
// isDisabled={ isDisabled={
// managementState?.tempFlg === '0' managementState?.tempFlg === '0'
// ? true ? true
// : session?.storeLvl === '1' && form.watch('saleStoreId') != '' : session?.storeLvl === '1'
// ? false ? otherSaleStoreList.length > 0
// : false ? false
// } : true
isDisabled={managementState?.tempFlg === '0' ? true : false} : otherSaleStoreList.length === 1
? true
: false
}
isClearable={managementState?.tempFlg === '0' ? false : true} isClearable={managementState?.tempFlg === '0' ? false : true}
// isClearable={managementState?.tempFlg === '0' ? false : session?.storeLvl === '1' ? true : true}
value={otherSaleStoreList.filter(function (option) { value={otherSaleStoreList.filter(function (option) {
return option.saleStoreId === otherSelOptions return option.saleStoreId === otherSelOptions
})} })}

121
src/components/management/StuffSearchCondition.jsx
View File

@ -343,7 +343,7 @@ export default function StuffSearchCondition() {
}) })
} else { } else {
if (session?.storeLvl === '2') { if (session?.storeLvl === '2') {
if (otherSaleStoreList.length > 1) { if (otherSaleStoreList.length === 1) {
setOtherSaleStoreId(session.storeId) setOtherSaleStoreId(session.storeId)
stuffSearch.schOtherSelSaleStoreId = session.storeId stuffSearch.schOtherSelSaleStoreId = session.storeId
stuffSearch.schObjectNo = '' stuffSearch.schObjectNo = ''
@ -356,6 +356,24 @@ export default function StuffSearchCondition() {
stuffSearch.schTempFlg = '' stuffSearch.schTempFlg = ''
stuffSearch.schMyDataCheck = false stuffSearch.schMyDataCheck = false
stuffSearch.startRow = 1
stuffSearch.endRow = 100
stuffSearch.schSortType = 'U'
stuffSearch.pageNo = 1
stuffSearch.pageSize = 100
} else if (otherSaleStoreList.length > 1) {
setOtherSaleStoreId('')
stuffSearch.schOtherSelSaleStoreId = session.storeId
stuffSearch.schObjectNo = ''
stuffSearch.schAddress = ''
stuffSearch.schObjectName = ''
stuffSearch.schSaleStoreName = ''
stuffSearch.schReceiveUser = ''
stuffSearch.schDispCompanyName = ''
stuffSearch.schDateType = 'U'
stuffSearch.schTempFlg = ''
stuffSearch.schMyDataCheck = false
stuffSearch.startRow = 1 stuffSearch.startRow = 1
stuffSearch.endRow = 100 stuffSearch.endRow = 100
stuffSearch.schSortType = 'U' stuffSearch.schSortType = 'U'
@ -504,13 +522,23 @@ export default function StuffSearchCondition() {
}) })
} else { } else {
if (stuffSearch.code === 'S') { if (stuffSearch.code === 'S') {
setOtherSaleStoreId(session?.storeId) if (otherList.length === 1) {
setStuffSearch({ setOtherSaleStoreId(session?.storeId)
...stuffSearch, setStuffSearch({
code: 'S', ...stuffSearch,
schSelSaleStoreId: res[0].saleStoreId, code: 'S',
schOtherSelSaleStoreId: otherList[0].saleStoreId, schSelSaleStoreId: res[0].saleStoreId,
}) schOtherSelSaleStoreId: otherList[0].saleStoreId,
})
} else {
setOtherSaleStoreId('')
setStuffSearch({
...stuffSearch,
code: 'S',
schSelSaleStoreId: res[0].saleStoreId,
schOtherSelSaleStoreId: '',
})
}
} else { } else {
setOtherSaleStoreId(stuffSearch?.schOtherSelSaleStoreId) setOtherSaleStoreId(stuffSearch?.schOtherSelSaleStoreId)
setStuffSearch({ setStuffSearch({
@ -561,7 +589,6 @@ export default function StuffSearchCondition() {
setOtherSaleStoreId('') setOtherSaleStoreId('')
setSchSelSaleStoreId(key.saleStoreId) setSchSelSaleStoreId(key.saleStoreId)
stuffSearch.schSelSaleStoreId = key.saleStoreId stuffSearch.schSelSaleStoreId = key.saleStoreId
//T01아닌 1차점은 본인으로 디폴트셋팅이고 수정할수없어서 여기안옴
//고른 1차점의 saleStoreId로 2차점 API호출하기 //고른 1차점의 saleStoreId로 2차점 API호출하기
let url = `/api/object/saleStore/${key.saleStoreId}/list?firstFlg=0&userId=${session?.userId}` let url = `/api/object/saleStore/${key.saleStoreId}/list?firstFlg=0&userId=${session?.userId}`
let otherList let otherList
@ -720,19 +747,61 @@ export default function StuffSearchCondition() {
setMyDataCheck(stuffSearch.schMyDataCheck) setMyDataCheck(stuffSearch.schMyDataCheck)
} }
} else { } else {
setStartDate(stuffSearch?.schFromDt ? stuffSearch.schFromDt : dayjs(new Date()).add(-1, 'year').format('YYYY-MM-DD')) if (stuffSearch.code === 'DELETE') {
setEndDate(stuffSearch?.schToDt ? stuffSearch.schToDt : dayjs(new Date()).format('YYYY-MM-DD')) //1차점인경우
setObjectNo(stuffSearch.schObjectNo ? stuffSearch.schObjectNo : objectNo) if (session.storeLvl === '1') {
setSaleStoreName(stuffSearch.schSaleStoreName ? stuffSearch.schSaleStoreName : saleStoreName) stuffSearch.schOtherSelSaleStoreId = ''
setAddress(stuffSearch.schAddress ? stuffSearch.schAddress : address) setOtherSaleStoreId('')
setobjectName(stuffSearch.schObjectName ? stuffSearch.schObjectName : objectName) } else {
setDispCompanyName(stuffSearch.schDispCompanyName ? stuffSearch.schDispCompanyName : dispCompanyName) //2차점 본인하나인경우
setReceiveUser(stuffSearch.schReceiveUser ? stuffSearch.schReceiveUser : receiveUser) //34있는경우
setDateType(stuffSearch.schDateType ? stuffSearch.schDateType : dateType) stuffSearch.schOtherSelSaleStoreId = ''
setTempFlg(stuffSearch.schTempFlg ? stuffSearch.schTempFlg : tempFlg) setOtherSaleStoreId('')
setMyDataCheck(stuffSearch.schMyDataCheck) }
if (session.storeLvl !== '1') {
stuffSearch.schSelSaleStoreId = '' setObjectNo('')
setSaleStoreName('')
setAddress('')
setobjectName('')
setDispCompanyName('')
setReceiveUser('')
objectNoRef.current.value = ''
saleStoreNameRef.current.value = ''
addressRef.current.value = ''
objectNameRef.current.value = ''
dispCompanyNameRef.current.value = ''
receiveUserRef.current.value = ''
stuffSearch.schObjectNo = ''
stuffSearch.schAddress = ''
stuffSearch.schObjectName = ''
stuffSearch.schSaleStoreName = ''
stuffSearch.schReceiveUser = ''
stuffSearch.schDispCompanyName = ''
stuffSearch.schDateType = 'U'
stuffSearch.schTempFlg = ''
stuffSearch.schMyDataCheck = false
stuffSearch.schFromDt = dayjs(new Date()).add(-1, 'year').format('YYYY-MM-DD')
stuffSearch.schToDt = dayjs(new Date()).format('YYYY-MM-DD')
stuffSearch.startRow = 1
stuffSearch.endRow = 100
stuffSearch.schSortType = 'U'
stuffSearch.pageNo = 1
stuffSearch.pageSize = 100
} else {
setStartDate(stuffSearch?.schFromDt ? stuffSearch.schFromDt : dayjs(new Date()).add(-1, 'year').format('YYYY-MM-DD'))
setEndDate(stuffSearch?.schToDt ? stuffSearch.schToDt : dayjs(new Date()).format('YYYY-MM-DD'))
setObjectNo(stuffSearch.schObjectNo ? stuffSearch.schObjectNo : objectNo)
setSaleStoreName(stuffSearch.schSaleStoreName ? stuffSearch.schSaleStoreName : saleStoreName)
setAddress(stuffSearch.schAddress ? stuffSearch.schAddress : address)
setobjectName(stuffSearch.schObjectName ? stuffSearch.schObjectName : objectName)
setDispCompanyName(stuffSearch.schDispCompanyName ? stuffSearch.schDispCompanyName : dispCompanyName)
setReceiveUser(stuffSearch.schReceiveUser ? stuffSearch.schReceiveUser : receiveUser)
setDateType(stuffSearch.schDateType ? stuffSearch.schDateType : dateType)
setTempFlg(stuffSearch.schTempFlg ? stuffSearch.schTempFlg : tempFlg)
setMyDataCheck(stuffSearch.schMyDataCheck)
if (session.storeLvl !== '1') {
stuffSearch.schSelSaleStoreId = ''
}
} }
} }
@ -802,10 +871,12 @@ export default function StuffSearchCondition() {
if (e.target.checked) { if (e.target.checked) {
stuffSearch.schMyDataCheck = e.target.value stuffSearch.schMyDataCheck = e.target.value
setMyDataCheck(true) setMyDataCheck(true)
if (otherSaleStoreList.length > 1) { if (otherSaleStoreList.length > 1) {
stuffSearch.schSelSaleStoreId = otherSaleStoreId stuffSearch.schOtherSelSaleStoreId = session.storeId
stuffSearch.schOtherSelSaleStoreId = '' setOtherSaleStoreId(session.storeId)
} else {
stuffSearch.schSelSaleStoreId = ''
stuffSearch.schOtherSelSaleStoreId = session.storeId
} }
} else { } else {
setMyDataCheck(false) setMyDataCheck(false)

160
src/components/management/StuffSubHeader.jsx
View File

@ -66,87 +66,85 @@ export default function StuffSubHeader({ type }) {
} }
return ( return (
!isGlobalLoading && ( <>
<> <div className="sub-header">
<div className="sub-header"> <div className="sub-header-inner">
<div className="sub-header-inner"> {type === 'list' && (
{type === 'list' && ( <>
<> <Link href={'#'}>
<Link href={'#'}> <h1 className="sub-header-title">{getMessage('header.menus.management')}</h1>
<h1 className="sub-header-title">{getMessage('header.menus.management')}</h1> </Link>
</Link> <ul className="sub-header-location">
<ul className="sub-header-location"> <li className="location-item">
<li className="location-item"> <span className="home">
<span className="home"> <Image src="/static/images/main/home_icon.svg" alt="react" width={16} height={16} />
<Image src="/static/images/main/home_icon.svg" alt="react" width={16} height={16} /> </span>
</span> </li>
</li> <li className="location-item">
<li className="location-item"> <span>{getMessage('header.menus.management')}</span>
<span>{getMessage('header.menus.management')}</span> </li>
</li> <li className="location-item">
<li className="location-item"> <span>{getMessage('header.menus.management.stuffList')}</span>
<span>{getMessage('header.menus.management.stuffList')}</span> </li>
</li> </ul>
</ul> </>
</> )}
)} {type === 'temp' && (
{type === 'temp' && ( <>
<> <ul className="sub-header-title-wrap">
<ul className="sub-header-title-wrap"> <li className="title-item">
<li className="title-item"> <Link className="sub-header-title" href={'#'}>
<Link className="sub-header-title" href={'#'}> {getMessage('stuff.temp.subTitle')}
{getMessage('stuff.temp.subTitle')} </Link>
</Link> </li>
</li> </ul>
</ul> <ul className="sub-header-location">
<ul className="sub-header-location"> <li className="location-item">
<li className="location-item"> <span className="home">
<span className="home"> <Image src="/static/images/main/home_icon.svg" alt="react" width={16} height={16} />
<Image src="/static/images/main/home_icon.svg" alt="react" width={16} height={16} /> </span>
</span> </li>
</li> <li className="location-item">
<li className="location-item"> <span>{getMessage('header.menus.management')}</span>
<span>{getMessage('header.menus.management')}</span> </li>
</li> <li className="location-item">
<li className="location-item"> <span>{getMessage('header.menus.management.newStuff')}</span>
<span>{getMessage('header.menus.management.newStuff')}</span> </li>
</li> </ul>
</ul> </>
</> )}
)} {type === 'detail' && (
{type === 'detail' && ( <>
<> <ul className="sub-header-title-wrap">
<ul className="sub-header-title-wrap"> <li className="title-item">
<li className="title-item"> <Link className="sub-header-title" href={'#'}>
<Link className="sub-header-title" href={'#'}> {getMessage('stuff.temp.subTitle')}
{getMessage('stuff.temp.subTitle')} </Link>
</Link> </li>
</li> <li className="title-item" style={{ display: buttonStyle }}>
<li className="title-item" style={{ display: buttonStyle }}> <a className="sub-header-title" onClick={moveFloorPlan}>
<a className="sub-header-title" onClick={moveFloorPlan}> <span className="icon drawing"></span>
<span className="icon drawing"></span> {getMessage('stuff.temp.subTitle2')}
{getMessage('stuff.temp.subTitle2')} </a>
</a> </li>
</li> </ul>
</ul> <ul className="sub-header-location">
<ul className="sub-header-location"> <li className="location-item">
<li className="location-item"> <span className="home">
<span className="home"> <Image src="/static/images/main/home_icon.svg" alt="react" width={16} height={16} />
<Image src="/static/images/main/home_icon.svg" alt="react" width={16} height={16} /> </span>
</span> </li>
</li> <li className="location-item">
<li className="location-item"> <span>{getMessage('header.menus.management')}</span>
<span>{getMessage('header.menus.management')}</span> </li>
</li> <li className="location-item">
<li className="location-item"> <span>{getMessage('header.menus.management.detail')}</span>
<span>{getMessage('header.menus.management.detail')}</span> </li>
</li> </ul>
</ul> </>
</> )}
)}
</div>
</div> </div>
</> </div>
) </>
) )
} }

13
src/hooks/common/useCanvasPopupStatusController.js
View File

@ -43,6 +43,10 @@ export function useCanvasPopupStatusController(param = 1) {
break break
case 4: case 4:
break break
case 5:
break
case 6:
break
default: default:
} }
} else { } else {
@ -56,6 +60,15 @@ export function useCanvasPopupStatusController(param = 1) {
roofConstructions: [], roofConstructions: [],
}) })
break break
case 3:
break
case 4:
break
case 5:
break
case 6:
break
default:
} }
} }
}, [popupStatus]) }, [popupStatus])

77
src/hooks/common/useMasterController.js
View File

@ -169,6 +169,82 @@ export function useMasterController() {
}) })
} }
/**
* PCS 승압설정 정보 조회
* @param {Max접속(과적)여부} maxConnYn
* @param {동일회로도여부} smpCirYn
* @param {한랭지여부} coldZoneYn
* @param {사용된 모듈아이템 목록} useModuleItemList
* @param {지붕면 목록} roofSurfaceList
* @param {PCS 아이템 목록} pcsItemList
* @returns
*/
const getPcsVoltageStepUpList = async (params2 = null) => {
const params = {
maxConnYn: 'N',
smpCirYn: 'Y',
coldZoneYn: 'N',
useModuleItemList: [{ itemId: '107077', mixMatlNo: '0' }],
roofSurfaceList: [
{
roofSurfaceId: '1',
roofSurface: '남서',
roofSurfaceIncl: '5',
moduleList: [
{ itemId: '107077' },
{ itemId: '107077' },
{ itemId: '107077' },
{ itemId: '107077' },
{ itemId: '107077' },
{ itemId: '107077' },
{ itemId: '107077' },
{ itemId: '107077' },
{ itemId: '107077' },
],
},
{
roofSurfaceId: '2',
roofSurface: '남서',
roofSurfaceIncl: '5',
moduleList: [
{ itemId: '107077' },
{ itemId: '107077' },
{ itemId: '107077' },
{ itemId: '107077' },
{ itemId: '107077' },
{ itemId: '107077' },
],
},
{
roofSurfaceId: '3',
roofSurface: '남',
roofSurfaceIncl: '3',
moduleList: [
{ itemId: '107077' },
{ itemId: '107077' },
{ itemId: '107077' },
{ itemId: '107077' },
{ itemId: '107077' },
{ itemId: '107077' },
{ itemId: '107077' },
{ itemId: '107077' },
{ itemId: '107077' },
],
},
],
pcsItemList: [
{ itemId: '106857', pcsMkrCd: 'MKR001', pcsSerCd: 'SER001' },
{ itemId: '106856', pcsMkrCd: 'MKR001', pcsSerCd: 'SER001' },
],
}
return await post({ url: '/api/v1/master/getPcsVoltageStepUpList', data: params }).then((res) => {
console.log('🚀🚀 ~ getPcsVoltageStepUpList ~ res:', res)
return res
})
}
return { return {
getRoofMaterialList, getRoofMaterialList,
getModuleTypeItemList, getModuleTypeItemList,
@ -178,5 +254,6 @@ export function useMasterController() {
getPcsMakerList, getPcsMakerList,
getPcsModelList, getPcsModelList,
getPcsAutoRecommendList, getPcsAutoRecommendList,
getPcsVoltageStepUpList,
} }
} }

21
src/hooks/module/useModuleBasicSetting.js
View File

@ -1,4 +1,4 @@
import { useRecoilState, useRecoilValue } from 'recoil' import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil'
import { canvasState, checkedModuleState, isManualModuleSetupState, selectedModuleState } from '@/store/canvasAtom' import { canvasState, checkedModuleState, isManualModuleSetupState, selectedModuleState } from '@/store/canvasAtom'
import { rectToPolygon, polygonToTurfPolygon, calculateVisibleModuleHeight, getDegreeByChon } from '@/util/canvas-util' import { rectToPolygon, polygonToTurfPolygon, calculateVisibleModuleHeight, getDegreeByChon } from '@/util/canvas-util'
import { basicSettingState, roofDisplaySelector } from '@/store/settingAtom' import { basicSettingState, roofDisplaySelector } from '@/store/settingAtom'
@ -32,7 +32,7 @@ export function useModuleBasicSetting() {
const [basicSetting, setBasicSettings] = useRecoilState(basicSettingState) const [basicSetting, setBasicSettings] = useRecoilState(basicSettingState)
const checkedModule = useRecoilValue(checkedModuleState) const checkedModule = useRecoilValue(checkedModuleState)
const [isManualModuleSetup, setIsManualModuleSetup] = useRecoilState(isManualModuleSetupState) const [isManualModuleSetup, setIsManualModuleSetup] = useRecoilState(isManualModuleSetupState)
const [moduleStatistics, setModuleStatistics] = useRecoilState(moduleStatisticsState) const setModuleStatistics = useSetRecoilState(moduleStatisticsState)
useEffect(() => { useEffect(() => {
// console.log('basicSetting', basicSetting) // console.log('basicSetting', basicSetting)
@ -512,6 +512,7 @@ export function useModuleBasicSetting() {
let manualModule = new QPolygon(tempModule.points, { ...moduleOptions, moduleInfo: checkedModule[0] }) let manualModule = new QPolygon(tempModule.points, { ...moduleOptions, moduleInfo: checkedModule[0] })
canvas?.add(manualModule) canvas?.add(manualModule)
manualDrawModules.push(manualModule) manualDrawModules.push(manualModule)
getModuleStatistics()
} else { } else {
swalFire({ text: getMessage('module.place.overlab') }) swalFire({ text: getMessage('module.place.overlab') })
} }
@ -1871,6 +1872,8 @@ export function useModuleBasicSetting() {
} }
}) })
} }
getModuleStatistics()
} }
const autoFlatroofModuleSetup = (placementFlatRef) => { const autoFlatroofModuleSetup = (placementFlatRef) => {
@ -2261,7 +2264,7 @@ export function useModuleBasicSetting() {
}) })
moduleSetupSurface.set({ modules: setupedModules }) moduleSetupSurface.set({ modules: setupedModules })
getModuleStatistics()
// console.log('moduleSetupSurface', moduleSetupSurface) // console.log('moduleSetupSurface', moduleSetupSurface)
// console.log('setupedModules', setupedModules) // console.log('setupedModules', setupedModules)
@ -2333,12 +2336,14 @@ export function useModuleBasicSetting() {
}) })
return { return {
...rowObject, // 총 발전량 = 발전량 * 모듈 개수 ...rowObject, // 총 발전량 = 발전량 * 모듈 개수
...surface,
name: canvas.getObjects().filter((obj) => obj.id === surface.parentId)[0].directionText, // 지붕면 name: canvas.getObjects().filter((obj) => obj.id === surface.parentId)[0].directionText, // 지붕면
// powerGeneration: wpOut.toLocaleString('ko-KR', { maximumFractionDigits: 4 }), // powerGeneration: wpOut.toLocaleString('ko-KR', { maximumFractionDigits: 4 }),
wpOut: wpOut, wpOut: wpOut,
} }
}) })
console.log('🚀 ~ getModuleStatistics ~ rows:', rows)
console.log('🚀 ~ getModuleStatistics ~ moduleInfo:', moduleInfo) console.log('🚀 ~ getModuleStatistics ~ moduleInfo:', moduleInfo)
const header = [ const header = [
{ name: getMessage('modal.panel.batch.statistic.roof.shape'), prop: 'name' }, { name: getMessage('modal.panel.batch.statistic.roof.shape'), prop: 'name' },
@ -2359,15 +2364,7 @@ export function useModuleBasicSetting() {
footer.push(footerData[key]) footer.push(footerData[key])
}) })
footer.push(totalWpout) footer.push(totalWpout)
// const footer = [ console.log({ header: header, rows, footer: footer })
// '합계',
// ...Object.keys(moduleInfo).map((key) => {
// return { name: moduleInfo[key].name, prop: moduleInfo[key] }
// }),
// totalWpout,
// ]
// const footer = []
console.log('@@@@@@@@@@', header, rows, footer)
setModuleStatistics({ header: header, rows, footer: footer }) setModuleStatistics({ header: header, rows, footer: footer })
} }

1
src/hooks/module/useModulePlace.js
View File

@ -51,6 +51,7 @@ export function useModulePlace() {
useEffect(() => { useEffect(() => {
//지붕을 가져옴 //지붕을 가져옴
console.log('🚀 ~ trestleDetailList.forEach ~ trestleDetailList:', trestleDetailList)
canvas canvas
.getObjects() .getObjects()
.filter((roof) => roof.name === 'roof') .filter((roof) => roof.name === 'roof')

10
src/hooks/option/useCanvasSetting.js
View File

@ -316,7 +316,7 @@ export function useCanvasSetting() {
roofsArray = res.map((item) => { roofsArray = res.map((item) => {
return { return {
roofApply: item.roofApply, roofApply: item.roofApply,
roofSeq: 0, roofSeq: item.roofSeq,
roofMatlCd: item.roofMatlCd, roofMatlCd: item.roofMatlCd,
roofWidth: item.roofWidth, roofWidth: item.roofWidth,
roofHeight: item.roofHeight, roofHeight: item.roofHeight,
@ -381,16 +381,16 @@ export function useCanvasSetting() {
roofSizeSet: roofsRow[0].roofSizeSet, roofSizeSet: roofsRow[0].roofSizeSet,
roofAngleSet: roofsRow[0].roofAngleSet, roofAngleSet: roofsRow[0].roofAngleSet,
roofsData: roofsArray, roofsData: roofsArray,
selectedRoofMaterial: addRoofs[0], selectedRoofMaterial: addRoofs.find((roof) => roof.selected),
}) })
}) })
} catch (error) { } catch (error) {
console.error('Data fetching error:', error) console.error('Data fetching error:', error)
} }
if (!(Object.keys(canvasSetting).length === 0 && canvasSetting.constructor === Object)) { // if (!(Object.keys(canvasSetting).length === 0 && canvasSetting.constructor === Object)) {
setBasicSettings({ ...canvasSetting }) // setBasicSettings({ ...canvasSetting })
} // }
setCanvasSetting({ ...basicSetting }) setCanvasSetting({ ...basicSetting })
} }

3
src/hooks/roofcover/useRoofAllocationSetting.js
View File

@ -169,6 +169,7 @@ export function useRoofAllocationSetting(id) {
roofSizeSet: res[0].roofSizeSet, roofSizeSet: res[0].roofSizeSet,
roofAngleSet: res[0].roofAngleSet, roofAngleSet: res[0].roofAngleSet,
roofsData: roofsArray, roofsData: roofsArray,
selectedRoofMaterial: selectRoofs.find((roof) => roof.selected),
}) })
setBasicInfo({ setBasicInfo({
roofSizeSet: '' + res[0].roofSizeSet, roofSizeSet: '' + res[0].roofSizeSet,
@ -188,7 +189,7 @@ export function useRoofAllocationSetting(id) {
roofSizeSet: Number(basicSetting.roofSizeSet), roofSizeSet: Number(basicSetting.roofSizeSet),
roofAngleSet: basicSetting.roofAngleSet, roofAngleSet: basicSetting.roofAngleSet,
roofAllocationList: currentRoofList.map((item, index) => ({ roofAllocationList: currentRoofList.map((item, index) => ({
roofApply: item.selected === null || item.selected === undefined ? 'true' : item.selected, roofApply: item.selected,
roofSeq: index, roofSeq: index,
roofMatlCd: item.roofMatlCd === null || item.roofMatlCd === undefined ? 'ROOF_ID_WA_53A' : item.roofMatlCd, roofMatlCd: item.roofMatlCd === null || item.roofMatlCd === undefined ? 'ROOF_ID_WA_53A' : item.roofMatlCd,
roofWidth: item.width === null || item.width === undefined ? 0 : Number(item.width), roofWidth: item.width === null || item.width === undefined ? 0 : Number(item.width),

2
src/hooks/usePlan.js
View File

@ -181,6 +181,7 @@ export function usePlan(params = {}) {
setPlans((plans) => [...plans, { id: res.data, objectNo: objectNo, planNo: planNo, userId: userId, canvasStatus: canvasStatus }]) setPlans((plans) => [...plans, { id: res.data, objectNo: objectNo, planNo: planNo, userId: userId, canvasStatus: canvasStatus }])
} }
updateCurrentPlan(res.data) updateCurrentPlan(res.data)
swalFire({ text: getMessage('plan.message.save') })
}) })
.catch((error) => { .catch((error) => {
swalFire({ text: error.message, icon: 'error' }) swalFire({ text: error.message, icon: 'error' })
@ -200,6 +201,7 @@ export function usePlan(params = {}) {
await promisePut({ url: '/api/canvas-management/canvas-statuses', data: planData }) await promisePut({ url: '/api/canvas-management/canvas-statuses', data: planData })
.then((res) => { .then((res) => {
setPlans((plans) => plans.map((plan) => (plan.id === currentCanvasPlan.id ? { ...plan, canvasStatus: canvasStatus } : plan))) setPlans((plans) => plans.map((plan) => (plan.id === currentCanvasPlan.id ? { ...plan, canvasStatus: canvasStatus } : plan)))
swalFire({ text: getMessage('plan.message.save') })
}) })
.catch((error) => { .catch((error) => {
swalFire({ text: error.message, icon: 'error' }) swalFire({ text: error.message, icon: 'error' })

12
src/locales/ja.json
View File

@ -281,6 +281,12 @@
"modal.object.setting.direction.select": "方向の選択", "modal.object.setting.direction.select": "方向の選択",
"modal.placement.surface.setting.info": "ⓘ ①の長さ入力後に対角線の長さを入力すると、②の長さを自動計算します。", "modal.placement.surface.setting.info": "ⓘ ①の長さ入力後に対角線の長さを入力すると、②の長さを自動計算します。",
"modal.placement.surface.setting.diagonal.length": "斜めの長さ", "modal.placement.surface.setting.diagonal.length": "斜めの長さ",
"modal.placement.surface.drawing.straight.line": "직선(JA)",
"modal.placement.surface.drawing.right.angle": "직각(JA)",
"modal.placement.surface.drawing.double.pitch": "이구배(JA)",
"modal.placement.surface.drawing.angle": "각도(JA)",
"modal.placement.surface.drawing.diagonal": "대각선(JA)",
"modal.placement.surface.drawing.fix": "배치면 확정(JA)",
"modal.color.picker.title": "色の設定", "modal.color.picker.title": "色の設定",
"modal.color.picker.default.color": "基本色", "modal.color.picker.default.color": "基本色",
"modal.size.setting": "サイズ変更", "modal.size.setting": "サイズ変更",
@ -305,6 +311,9 @@
"plan.message.confirm.delete": "PLAN을 삭제하시겠습니까?", "plan.message.confirm.delete": "PLAN을 삭제하시겠습니까?",
"plan.message.save": "저장되었습니다.", "plan.message.save": "저장되었습니다.",
"plan.message.delete": "삭제되었습니다.", "plan.message.delete": "삭제되었습니다.",
"plan.message.leave": "물건현황(목록)으로 이동하시겠습니까? [예]를 선택한 경우, 저장하고 이동합니다.",
"plan.message.confirm.yes": "예",
"plan.message.confirm.no": "아니오",
"setting": "設定", "setting": "設定",
"delete": "삭제(JA)", "delete": "삭제(JA)",
"delete.all": "전체 삭제(JA)", "delete.all": "전체 삭제(JA)",
@ -970,5 +979,6 @@
"can.not.copy.module": "모듈을 복사할 수 없습니다.(JA)", "can.not.copy.module": "모듈을 복사할 수 없습니다.(JA)",
"can.not.remove.module": "모듈을 삭제할 수 없습니다.(JA)", "can.not.remove.module": "모듈을 삭제할 수 없습니다.(JA)",
"can.not.insert.module": "모듈을 삽입할 수 없습니다.(JA)", "can.not.insert.module": "모듈을 삽입할 수 없습니다.(JA)",
"can.not.align.module": "모듈을 정렬할 수 없습니다.(JA)" "can.not.align.module": "모듈을 정렬할 수 없습니다.(JA)",
"menu.validation.canvas.roof": "패널을 배치하려면 지붕면을 입력해야 합니다."
} }

7
src/locales/ko.json
View File

@ -80,6 +80,7 @@
"modal.placement.surface.drawing.double.pitch": "이구배", "modal.placement.surface.drawing.double.pitch": "이구배",
"modal.placement.surface.drawing.angle": "각도", "modal.placement.surface.drawing.angle": "각도",
"modal.placement.surface.drawing.diagonal": "대각선", "modal.placement.surface.drawing.diagonal": "대각선",
"modal.placement.surface.drawing.fix": "배치면 확정",
"plan.menu.placement.surface.arrangement": "면형상 배치", "plan.menu.placement.surface.arrangement": "면형상 배치",
"plan.menu.placement.surface.object": "오브젝트 배치", "plan.menu.placement.surface.object": "오브젝트 배치",
"plan.menu.placement.surface.all.remove": "배치면 전체 삭제", "plan.menu.placement.surface.all.remove": "배치면 전체 삭제",
@ -311,6 +312,9 @@
"plan.message.confirm.delete": "PLAN을 삭제하시겠습니까?", "plan.message.confirm.delete": "PLAN을 삭제하시겠습니까?",
"plan.message.save": "저장되었습니다.", "plan.message.save": "저장되었습니다.",
"plan.message.delete": "삭제되었습니다.", "plan.message.delete": "삭제되었습니다.",
"plan.message.leave": "물건현황(목록)으로 이동하시겠습니까? [예]를 선택한 경우, 저장하고 이동합니다.",
"plan.message.corfirm.yes": "예",
"plan.message.confirm.no": "아니오",
"setting": "설정", "setting": "설정",
"delete": "삭제", "delete": "삭제",
"delete.all": "전체 삭제", "delete.all": "전체 삭제",
@ -990,5 +994,6 @@
"module.place.select.one.module": "모듈은 하나만 선택해주세요.", "module.place.select.one.module": "모듈은 하나만 선택해주세요.",
"batch.canvas.delete.all": "배치면 내용을 전부 삭제하시겠습니까?", "batch.canvas.delete.all": "배치면 내용을 전부 삭제하시겠습니까?",
"module.not.found": "설치 모듈을 선택하세요.", "module.not.found": "설치 모듈을 선택하세요.",
"construction.length.difference": "지붕면 공법을 전부 선택해주세요." "construction.length.difference": "지붕면 공법을 전부 선택해주세요.",
"menu.validation.canvas.roof": "패널을 배치하려면 지붕면을 입력해야 합니다."
} }

25
src/store/circuitTrestleAtom.js
View File

@ -1,20 +1,30 @@
import { useMessage } from '@/hooks/useMessage' import { useMessage } from '@/hooks/useMessage'
import { atom } from 'recoil' import { atom } from 'recoil'
export const makerState = atom({ export const makersState = atom({
key: 'makerState', key: 'makersState',
default: { makers: [], selectedMaker: null }, default: [],
dangerouslyAllowMutability: true, dangerouslyAllowMutability: true,
}) })
export const selectedMakerState = atom({
key: 'selectedMakerState',
default: null,
})
export const seriesState = atom({ export const seriesState = atom({
key: 'seriesState', key: 'seriesState',
default: { series: [], selectedSeries: [] }, default: [],
}) })
export const modelState = atom({ export const selectedSeriesState = atom({
key: 'selectedSeriesState',
default: null,
})
export const modelsState = atom({
key: 'modelState', key: 'modelState',
default: { models: [], selectedModels: [] }, default: [],
}) })
export const pcsCheckState = atom({ export const pcsCheckState = atom({
@ -30,6 +40,7 @@ export const moduleStatisticsState = atom({
{ name: `발전량(kW)`, prop: 'amount' }, { name: `발전량(kW)`, prop: 'amount' },
], ],
rows: [], rows: [],
footer: ['합계', 0], footer: ['합계', '0'],
}, },
dangerouslyAllowMutability: true,
}) })

5
src/styles/_canvasside.scss
View File

@ -37,7 +37,7 @@
border: 1px solid #3D3D3D; border: 1px solid #3D3D3D;
padding: 20px; padding: 20px;
.penal-table{ .penal-table{
table-layout: fixed; table-layout: auto;
border-collapse: collapse; border-collapse: collapse;
thead{ thead{
th{ th{
@ -45,8 +45,11 @@
background-color:rgba(255, 255, 255, 0.05); background-color:rgba(255, 255, 255, 0.05);
font-size: 12px; font-size: 12px;
font-weight: 500; font-weight: 500;
min-width: 140px;
padding: 0 15px;
color: #fff; color: #fff;
border: 1px solid #505050; border: 1px solid #505050;
white-space: nowrap;
} }
} }
tbody{ tbody{

3957
src/styles/_modal.scss
View File

File diff suppressed because it is too large Load Diff

9
src/styles/_reset.scss
View File

@ -414,6 +414,15 @@ button{
transform: translateY(-50%) rotate(-180deg); transform: translateY(-50%) rotate(-180deg);
} }
} }
&.disabled{
cursor: default;
p{
color: #aaa;
}
&::after{
opacity: 0.7;
}
}
} }
.select-light{ .select-light{

6
src/styles/spinner.scss
View File

@ -1,10 +1,14 @@
.spinner-wrap{ .spinner-wrap{
position: fixed;
top: 0;
left: 0;
width: 100%; width: 100%;
height: 100vh; height: 100vh;
display: flex; display: flex;
align-items: center; align-items: center;
justify-content: center; justify-content: center;
background-color: #fff; background-color: rgba($color: #101010, $alpha: 0.2);
z-index: 2000000;
.loader { .loader {
font-size: 10px; font-size: 10px;
width: 1.2em; width: 1.2em;

4
src/util/common-utils.js
View File

@ -149,3 +149,7 @@ export const unescapeString = (str) => {
return str.replace(regex, (matched) => chars[matched] || matched) return str.replace(regex, (matched) => chars[matched] || matched)
} }
} }
export const isNullOrUndefined = (value) => {
return value === null || value === undefined
}