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

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

Browse Source
This commit is contained in:
yoosangwook 2025-02-07 21:09:54 +09:00
commit ffb4df42a6
18 changed files with 377 additions and 326 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/components/floor-plan/modal/basic/BasicSetting.jsx
View File

@ -38,7 +38,7 @@ export default function BasicSetting({ id, pos = { x: 50, y: 230 } }) {
const [isClosePopup, setIsClosePopup] = useState({ close: false, id: 0 })
// const { initEvent } = useContext(EventContext)
const { manualModuleSetup, autoModuleSetup, manualFlatroofModuleSetup, autoFlatroofModuleSetup } = useModuleBasicSetting(1)
const { manualModuleSetup, autoModuleSetup, manualFlatroofModuleSetup, autoFlatroofModuleSetup } = useModuleBasicSetting(tabNum)
const { updateObjectDate } = useMasterController()
const handleBtnNextStep = () => {
if (tabNum === 1) {

4
src/components/floor-plan/modal/basic/step/Module.jsx
View File

@ -58,8 +58,8 @@ export default function Module({ setTabNum }) {
useEffect(() => {
if (tempModuleSelectionData.roofConstructions.length > 0) {
if (tempModuleSelectionData.common.moduleItemId && isObjectNotEmpty(tempModuleSelectionData.module)) {
setModuleSelectionData(tempModuleSelectionData)
//저장된 temp데이터가 지붕재(addedRoofs) 개수와 같으면 모듈 선택 저장
setModuleSelectionData(tempModuleSelectionData)
if (tempModuleSelectionData.roofConstructions.length === addedRoofs.length) {
moduleSelectedDataTrigger(tempModuleSelectionData)
}
@ -83,7 +83,7 @@ export default function Module({ setTabNum }) {
header: [
{ name: getMessage('module'), width: 150, prop: 'module', type: 'color-box' },
{
name: `${getMessage('높이')} (mm)`,
name: `${getMessage('height')} (mm)`,
prop: 'height',
},
{ name: `${getMessage('width')} (mm)`, prop: 'width' },

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

@ -47,7 +47,7 @@ export default function CircuitTrestleSetting({ id }) {
// 회로할당(승합설정)에서 선택된 값들을 저장할 상태 추가
const [selectedStepUpValues, setSelectedStepUpValues] = useState({})
const [getStepUpSelections, setGetStepUpSelections] = useState(null)
const { trigger: setCircuitData } = useCanvasPopupStatusController(4)
// const { trigger: setCircuitData } = useCanvasPopupStatusController(4)
// const [stepUpListData, setStepUpListData] = useRecoilState(stepUpListDataState)
const [stepUpListData, setStepUpListData] = useState([])
const [seletedOption, setSeletedOption] = useState(null)
@ -75,19 +75,19 @@ export default function CircuitTrestleSetting({ id }) {
getModuleList,
removeNotAllocationModules,
} = useCircuitTrestle()
// const { trigger: moduleSelectedDataTrigger } = useCanvasPopupStatusController(2)
useEffect(() => {
if (!managementState) {
setManagementState(managementStateLoaded)
}
setCircuitData({
makers,
selectedMaker,
series,
models,
selectedModels,
pcsCheck,
})
// setCircuitData({
// makers,
// selectedMaker,
// series,
// models,
// selectedModels,
// pcsCheck,
// })
}, [])
// 수동할당 시 모듈 삭제
@ -141,7 +141,7 @@ export default function CircuitTrestleSetting({ id }) {
...getOptYn(),
useModuleItemList: getUseModuleItemList(),
roofSurfaceList: getRoofSurfaceList(),
pcsItemList: getPcsItemList(),
pcsItemList: pcsItemList,
}
// 추천 목록 선택
setSelectedModels(pcsItemList)
@ -249,10 +249,6 @@ export default function CircuitTrestleSetting({ id }) {
// 파워컨디셔너 추천 목록 조회
getPcsAutoRecommendList(params).then((res) => {
if (res.data?.pcsItemList) {
const itemList = models.filter((model) => {
return res.data?.pcsItemList.map((item) => item.itemId).includes(model.itemId)
})
let pcsItemList = []
let pcsObj = {}
models.forEach((model) => {
@ -356,21 +352,25 @@ export default function CircuitTrestleSetting({ id }) {
// 이전 버튼 클릭 시
const onClickPrev = () => {
setAllocationType(ALLOCATION_TYPE.AUTO)
// setAllocationType(ALLOCATION_TYPE.AUTO)
swalFire({
text: '할당한 회로 번호가 초기화됩니다.',
type: 'alert',
icon: 'warning',
confirmFn: () => {
const circuitModules = canvas
.getObjects()
.filter((obj) => obj.name === 'module' && selectedModels.map((model) => model.id).includes(obj.circuit?.circuitInfo?.id))
const circuitModules = canvas.getObjects().filter((obj) => obj.name === 'module')
canvas.remove(...circuitModules.map((module) => module.circuit))
circuitModules.forEach((obj) => {
obj.circuit = null
obj.pcsItemId = null
})
setAllocationType(ALLOCATION_TYPE.AUTO)
if (allocationType === ALLOCATION_TYPE.PASSIVITY) {
setAllocationType(ALLOCATION_TYPE.AUTO)
} else {
setTabNum(1)
}
canvas.renderAll()
},
})
@ -516,7 +516,7 @@ export default function CircuitTrestleSetting({ id }) {
)}
{tabNum === 2 && (
<div className="grid-btn-wrap">
<button className="btn-frame modal mr5" onClick={() => setTabNum(1)}>
<button className="btn-frame modal mr5" onClick={() => onClickPrev()}>
{getMessage('modal.common.prev')}
</button>
{/* <button className="btn-frame modal act" onClick={() => apply()}> */}

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

@ -37,6 +37,7 @@ export default function PowerConditionalSelect(props) {
const { getPcsMakerList, getPcsModelList } = useMasterController()
const selectedModules = useRecoilValue(selectedModuleState)
const { swalFire } = useSwal()
// const [moduleSelectionData, setModuleSelectionData] = useRecoilState(moduleSelectionDataState)
const modelHeader = [
{ name: getMessage('시리즈'), width: '15%', prop: 'pcsSerNm', type: 'color-box' },
{ name: getMessage('명칭'), width: '15%', prop: 'goodsNo', type: 'color-box' },
@ -129,12 +130,7 @@ export default function PowerConditionalSelect(props) {
const pcsSerList = selectedSeries.map((series) => {
return { pcsSerCd: series.pcsSerCd }
})
const moduleItemList = selectedModules.itemList?.map((module) => {
return {
itemId: module.itemId,
mixMatlNo: module.mixMatlNo,
}
})
const moduleItemList = getUseModuleItemList()
getPcsModelList({ pcsMkrCd, pcsSerList, moduleItemList }).then((res) => {
if (res?.result.code === 200 && res?.data) {
setModels(

12
src/components/floor-plan/modal/module/PanelEdit.jsx
View File

@ -52,6 +52,18 @@ export default function PanelEdit(props) {
})
return
}
const completeSurfaces = canvas.getObject().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE && obj.isComplete)
if (completeSurfaces.length > 0) {
swalFire({
title: getMessage('modal.module.can.not.edit'),
type: 'alert',
icon: 'error',
})
return
}
switch (type) {
case PANEL_EDIT_TYPE.MOVE:
moduleMove(length, direction)

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

@ -7,6 +7,9 @@ import { moduleStatisticsState } from '@/store/circuitTrestleAtom'
import { useRecoilValue, useResetRecoilState } from 'recoil'
import { useModule } from '@/hooks/module/useModule'
import { useEavesGableEdit } from '@/hooks/roofcover/useEavesGableEdit'
import { canvasState } from '@/store/canvasAtom'
import { POLYGON_TYPE } from '@/common/common'
import { useCircuitTrestle } from '@/hooks/useCirCuitTrestle'
export default function PanelBatchStatistics() {
const { getMessage } = useMessage()
@ -15,11 +18,18 @@ export default function PanelBatchStatistics() {
x: 0,
y: 30,
})
const canvas = useRecoilValue(canvasState)
const { header, rows, footer } = useRecoilValue(moduleStatisticsState)
const { setModuleStatisticsData } = useModule()
const { setModuleStatisticsData } = useCircuitTrestle()
useEffect(() => {
const roofSurfaces = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
console.log('🚀 ~ useEffect ~ roofSurfaces1:', roofSurfaces)
setModuleStatisticsData()
console.log(
'🚀 ~ useEffect ~ roofSurfaces2:',
canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE),
)
}, [])
return (

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

@ -137,16 +137,6 @@ export function useMasterController() {
* @returns
*/
const getPcsModelList = async (params = null) => {
const test = {
pcsMkrCd: 'MKR003',
pcsSerList: [{ pcsSerCd: 'SER007' }, { pcsSerCd: 'SER009' }, { pcsSerCd: 'SER010' }],
moduleItemList: [
{ itemId: '107015', mixMatlNo: null },
{ itemId: '107077', mixMatlNo: null },
{ itemId: '107015', mixMatlNo: null },
],
}
return await post({ url: '/api/v1/master/getPcsSeriesItemList', data: params }).then((res) => {
return res
})

12
src/hooks/floorPlan/useImgLoader.js
View File

@ -11,7 +11,6 @@ import { POLYGON_TYPE } from '@/common/common'
*/
export function useImgLoader() {
const canvas = useRecoilValue(canvasState)
const { removeMouseLines } = useCanvas()
const { currentCanvasPlan } = usePlan()
const { post } = useAxios()
@ -66,5 +65,16 @@ export function useImgLoader() {
console.log('🚀 ~ handleCanvasToPng ~ res:', res)
}
/**
* 마우스 포인터의 가이드라인을 제거합니다.
*/
const removeMouseLines = () => {
if (canvas?._objects.length > 0) {
const mouseLines = canvas?._objects.filter((obj) => obj.name === 'mouseLine')
mouseLines.forEach((item) => canvas?.remove(item))
}
canvas?.renderAll()
}
return { handleCanvasToPng }
}

91
src/hooks/module/useModule.js
View File

@ -9,6 +9,7 @@ import { useModuleBasicSetting } from './useModuleBasicSetting'
import { useMessage } from '../useMessage'
import { selectedModuleState } from '@/store/selectedModuleOptions'
import { moduleStatisticsState } from '@/store/circuitTrestleAtom'
import { useCircuitTrestle } from '../useCirCuitTrestle'
export const MODULE_REMOVE_TYPE = {
LEFT: 'left',
@ -38,7 +39,7 @@ export function useModule() {
const { getMessage } = useMessage()
const { checkModuleDisjointObjects } = useModuleBasicSetting()
const selectedModules = useRecoilValue(selectedModuleState)
const setModuleStatistics = useSetRecoilState(moduleStatisticsState)
const { setModuleStatisticsData } = useCircuitTrestle()
const moduleMove = (length, direction) => {
const selectedObj = canvas.getActiveObjects() //선택된 객체들을 가져옴
@ -979,93 +980,6 @@ export function useModule() {
.filter((obj) => [BATCH_TYPE.OPENING, BATCH_TYPE.TRIANGLE_DORMER, BATCH_TYPE.PENTAGON_DORMER, BATCH_TYPE.SHADOW].includes(obj.name))
}
const setModuleStatisticsData = () => {
if (selectedModules?.length === 0) return
const tempHeader = [
{ name: getMessage('simulator.table.sub1'), prop: 'name' },
{ name: getMessage('modal.circuit.trestle.setting.circuit.allocation.passivity.circuit'), prop: 'circuit' },
...selectedModules?.itemList?.map((module) => {
return {
name: module.itemNm,
prop: module.itemId,
}
}),
{ name: `${getMessage('modal.panel.batch.statistic.power.generation.amount')}(kW)`, prop: 'wpOut' },
]
const surfaceObjects = {}
const surfaces = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
const rows = surfaces.map((surface) => {
surfaceObjects[surface.id] = {
roofSurface: canvas.getObjects().filter((obj) => obj.id === surface.parentId)[0].directionText,
circuit: '-',
amount: 0,
wpOut: 0,
circuits: {},
}
surface.modules.forEach((module) => {
if (!surfaceObjects[surface.id][module.moduleInfo.itemId]) {
// 지붕면에 모듈 존재 여부
surfaceObjects[surface.id][module.moduleInfo.itemId] = 0 // 모듈 초기화
}
surfaceObjects[surface.id][module.moduleInfo.itemId]++
surfaceObjects[surface.id].wpOut += +module.moduleInfo.wpOut
if (module.circuit) {
if (!surfaceObjects[surface.id].circuits[module.circuitNumber]) {
surfaceObjects[surface.id].circuits[module.circuitNumber] = {
circuit: module.circuitNumber,
wpOut: 0,
circuits: { wpOut: 0 },
}
}
if (!surfaceObjects[surface.id].circuits[module.circuitNumber].circuits[module.moduleInfo.itemId]) {
surfaceObjects[surface.id].circuits[module.circuitNumber].circuits[module.moduleInfo.itemId] = 0
}
surfaceObjects[surface.id].circuits[module.circuitNumber].circuits[module.moduleInfo.itemId]++
surfaceObjects[surface.id].circuits[module.circuitNumber].circuits.wpOut += +module.moduleInfo.wpOut
surfaceObjects[surface.id].wpOut -= +module.moduleInfo.wpOut
surfaceObjects[surface.id][module.moduleInfo.itemId]--
}
})
})
let tempRows = []
Object.keys(surfaceObjects).forEach((key) => {
let tempRow = {
name: surfaceObjects[key].roofSurface,
circuit: surfaceObjects[key].circuit,
wpOut: parseFloat(surfaceObjects[key].wpOut / 1000),
}
selectedModules.itemList.forEach((module) => {
tempRow[module.itemId] = surfaceObjects[key][module.itemId]
})
tempRows.push(tempRow)
Object.keys(surfaceObjects[key].circuits).forEach((circuit) => {
let row = {
name: surfaceObjects[key].roofSurface,
circuit: surfaceObjects[key].circuits[circuit].circuit,
wpOut: parseFloat(surfaceObjects[key].circuits[circuit].circuits.wpOut / 1000),
}
selectedModules.itemList.forEach((module) => {
row[module.itemId] = surfaceObjects[key].circuits[circuit].circuits[module.itemId]
})
tempRows.push(row)
})
})
const tempFooter = {
name: getMessage('modal.panel.batch.statistic.total'),
circuit: '-',
wpOut: tempRows.reduce((acc, row) => acc + row.wpOut, 0),
}
selectedModules.itemList.forEach((module) => {
tempFooter[module.itemId] = tempRows.reduce((acc, row) => acc + row[module.itemId], 0)
})
setModuleStatistics({ header: tempHeader, rows: tempRows.filter((row) => row.wpOut !== 0), footer: tempFooter })
}
return {
moduleMove,
moduleMultiMove,
@ -1080,6 +994,5 @@ export function useModule() {
modulesRemove,
moduleRoofRemove,
alignModule,
setModuleStatisticsData,
}
}

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

@ -64,6 +64,7 @@ export function useModuleBasicSetting(tabNum) {
if (canvasSetting.roofSizeSet !== '3') {
const common = moduleSelectionData.common
const roofConstructions = moduleSelectionData.roofConstructions
const listParams = roofConstructions.map((item) => {
return {
...common,
@ -78,6 +79,7 @@ export function useModuleBasicSetting(tabNum) {
inclCd: String(item.addRoof.pitch),
roofIndex: item.addRoof.index,
workingWidth: item.addRoof.lenBase,
raftBaseCd: item.trestle.raftBaseCd,
}
})
setTrestleDetailParams(listParams)
@ -142,174 +144,180 @@ export function useModuleBasicSetting(tabNum) {
const makeModuleInstArea = (roof, trestleDetail) => {
//지붕 객체 반환
if (!roof) {
return
}
//도머등 오브젝트 객체가 있으면 아웃라인 낸다
const batchObjects = canvas
?.getObjects()
.filter(
(obj) =>
obj.name === BATCH_TYPE.OPENING ||
obj.name === BATCH_TYPE.SHADOW ||
obj.name === BATCH_TYPE.TRIANGLE_DORMER ||
obj.name === BATCH_TYPE.PENTAGON_DORMER,
) //도머s 객체
//도머도 외곽을 따야한다
const batchObjectOptions = {
stroke: 'red',
fill: 'transparent',
strokeDashArray: [10, 4],
strokeWidth: 1,
lockMovementX: true,
lockMovementY: true,
lockRotation: true,
lockScalingX: true,
lockScalingY: true,
selectable: true,
name: POLYGON_TYPE.OBJECT_SURFACE,
originX: 'center',
originY: 'center',
}
//도머등 오브젝트 객체가 있으면 아웃라인 낸다
batchObjects.forEach((obj) => {
//도머일때
if (obj.name === BATCH_TYPE.TRIANGLE_DORMER || obj.name === BATCH_TYPE.PENTAGON_DORMER) {
const groupPoints = obj.groupPoints
const offsetObjects = offsetPolygon(groupPoints, 10)
const dormerOffset = new QPolygon(offsetObjects, batchObjectOptions)
dormerOffset.setViewLengthText(false)
canvas.add(dormerOffset) //모듈설치면 만들기
} else {
//개구, 그림자일때
const points = obj.points
const offsetObjects = offsetPolygon(points, 10)
const offset = new QPolygon(offsetObjects, batchObjectOptions)
offset.setViewLengthText(false)
canvas.add(offset) //모듈설치면 만들기
}
})
const isExistSurface = canvas.getObjects().find((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE && obj.parentId === roof.id)
canvas.remove(isExistSurface)
let offsetLength = canvasSetting.roofSizeSet === '3' ? -30 : (trestleDetail.eaveIntvl / 10) * -1
setSurfaceShapePattern(roof, roofDisplay.column, true) //패턴 변경
const offsetPoints = offsetPolygon(roof.points, offsetLength) //안쪽 offset
//모듈설치영역?? 생성
const surfaceId = uuidv4()
let isNorth = false
if (canvasSetting.roofSizeSet !== '3') {
//북면이 있지만
if (roof.directionText && roof.directionText.indexOf('北') > -1) {
//북쪽일때 해당 서북서, 동북동은 제외한다고 한다
if (!(roof.directionText.indexOf('西北西') > -1 || roof.directionText.indexOf('東北東') > -1)) {
isNorth = true
}
}
}
//모듈설치면 생성
let setupSurface = new QPolygon(offsetPoints, {
stroke: 'red',
fill: 'rgba(255,255,255,0.1)',
strokeDashArray: [10, 4],
strokeWidth: 1,
lockMovementX: true,
lockMovementY: true,
lockRotation: true,
lockScalingX: true,
lockScalingY: true,
selectable: true,
parentId: roof.id, //가대 폴리곤의 임시 인덱스를 넣어줌
name: POLYGON_TYPE.MODULE_SETUP_SURFACE,
flowDirection: roof.direction,
direction: roof.direction,
flipX: roof.flipX,
flipY: roof.flipY,
surfaceId: surfaceId,
originX: 'center',
originY: 'center',
modules: [],
roofMaterial: roof.roofMaterial,
trestleDetail: trestleDetail,
isNorth: isNorth,
perPixelTargetFind: true,
// angle: -compasDeg,
})
setupSurface.setViewLengthText(false)
canvas.add(setupSurface) //모듈설치면 만들기
//지붕면 선택 금지
roof.set({
selectable: false, //선택 금지
// evented: false, //클릭 이벤트도 금지
})
canvas.renderAll()
//바로 들어올때
const setupModules = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE)
setupModules.forEach((obj) => {
canvas.bringToFront(obj)
})
//모듈설치면 클릭이벤트
addTargetMouseEventListener('mousedown', setupSurface, function () {
toggleSelection(setupSurface)
})
}
let selectedModuleInstSurfaceArray = []
//설치 범위 지정 클릭 이벤트
const toggleSelection = (setupSurface) => {
const isExist = selectedModuleInstSurfaceArray.some((obj) => obj.parentId === setupSurface.parentId)
//최초 선택일때
if (!isExist) {
//설치면이 북면이고 북면설치 허용점이 아니면
if (setupSurface.isNorth && !saleStoreNorthFlg) {
swalFire({ text: getMessage('module.not.batch.north'), icon: 'warning' })
if (tabNum == 3) {
if (!roof) {
return
}
//기본 선택이랑 스트로크 굵기가 같으면 선택 안됨으로 봄
setupSurface.set({
...setupSurface,
strokeWidth: 3,
strokeDashArray: [0],
fill: 'rgba(255,255,255,0.1)',
})
canvas.discardActiveObject() // 객체의 활성 상태 해제
//중복으로 들어가는걸 방지하기 위한 코드
//도머등 오브젝트 객체가 있으면 아웃라인 낸다
const batchObjects = canvas
?.getObjects()
.filter(
(obj) =>
obj.name === BATCH_TYPE.OPENING ||
obj.name === BATCH_TYPE.SHADOW ||
obj.name === BATCH_TYPE.TRIANGLE_DORMER ||
obj.name === BATCH_TYPE.PENTAGON_DORMER,
) //도머s 객체
canvas?.renderAll()
selectedModuleInstSurfaceArray.push(setupSurface)
setCurrentObject({ name: 'moduleSetupSurface', arrayData: [...selectedModuleInstSurfaceArray] })
} else {
//선택후 재선택하면 선택안됨으로 변경
setupSurface.set({
...setupSurface,
fill: 'rgba(255,255,255,0.1)',
//도머도 외곽을 따야한다
const batchObjectOptions = {
stroke: 'red',
fill: 'transparent',
strokeDashArray: [10, 4],
strokeWidth: 1,
})
canvas.discardActiveObject() // 객체의 활성 상태 해제
lockMovementX: true,
lockMovementY: true,
lockRotation: true,
lockScalingX: true,
lockScalingY: true,
selectable: true,
name: POLYGON_TYPE.OBJECT_SURFACE,
originX: 'center',
originY: 'center',
}
//폴리곤에 커스텀 인덱스를 가지고 해당 배열 인덱스를 찾아 삭제함
const removeIndex = setupSurface.parentId
const removeArrayIndex = selectedModuleInstSurfaceArray.findIndex((obj) => obj.parentId === removeIndex)
selectedModuleInstSurfaceArray.splice(removeArrayIndex, 1)
setCurrentObject({ name: 'moduleSetupSurface', arrayData: [...selectedModuleInstSurfaceArray] })
//도머등 오브젝트 객체가 있으면 아웃라인 낸다
batchObjects.forEach((obj) => {
//도머일때
if (obj.name === BATCH_TYPE.TRIANGLE_DORMER || obj.name === BATCH_TYPE.PENTAGON_DORMER) {
const groupPoints = obj.groupPoints
const offsetObjects = offsetPolygon(groupPoints, 10)
const dormerOffset = new QPolygon(offsetObjects, batchObjectOptions)
dormerOffset.setViewLengthText(false)
canvas.add(dormerOffset) //모듈설치면 만들기
} else {
//개구, 그림자일때
const points = obj.points
const offsetObjects = offsetPolygon(points, 10)
const offset = new QPolygon(offsetObjects, batchObjectOptions)
offset.setViewLengthText(false)
canvas.add(offset) //모듈설치면 만들기
}
})
const isExistSurface = canvas.getObjects().find((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE && obj.parentId === roof.id)
if (isExistSurface) {
addTargetMouseEventListener('mousedown', isExistSurface, function () {
toggleSelection(isExistSurface)
})
} else {
let offsetLength = canvasSetting.roofSizeSet === '3' ? -30 : (trestleDetail.eaveIntvl / 10) * -1
setSurfaceShapePattern(roof, roofDisplay.column, true) //패턴 변경
const offsetPoints = offsetPolygon(roof.points, offsetLength) //안쪽 offset
//모듈설치영역?? 생성
const surfaceId = uuidv4()
let isNorth = false
if (canvasSetting.roofSizeSet !== '3') {
//북면이 있지만
if (roof.directionText && roof.directionText.indexOf('北') > -1) {
//북쪽일때 해당 서북서, 동북동은 제외한다고 한다
if (!(roof.directionText.indexOf('西北西') > -1 || roof.directionText.indexOf('東北東') > -1)) {
isNorth = true
}
}
}
//모듈설치면 생성
let setupSurface = new QPolygon(offsetPoints, {
stroke: 'red',
fill: 'rgba(255,255,255,0.1)',
strokeDashArray: [10, 4],
strokeWidth: 1,
lockMovementX: true,
lockMovementY: true,
lockRotation: true,
lockScalingX: true,
lockScalingY: true,
selectable: true,
parentId: roof.id, //가대 폴리곤의 임시 인덱스를 넣어줌
name: POLYGON_TYPE.MODULE_SETUP_SURFACE,
flowDirection: roof.direction,
direction: roof.direction,
flipX: roof.flipX,
flipY: roof.flipY,
surfaceId: surfaceId,
originX: 'center',
originY: 'center',
modules: [],
roofMaterial: roof.roofMaterial,
trestleDetail: trestleDetail,
isNorth: isNorth,
perPixelTargetFind: true,
// angle: -compasDeg,
})
setupSurface.setViewLengthText(false)
canvas.add(setupSurface) //모듈설치면 만들기
//지붕면 선택 금지
roof.set({
selectable: false, //선택 금지
// evented: false, //클릭 이벤트도 금지
})
canvas.renderAll()
//바로 들어올때
const setupModules = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE)
setupModules.forEach((obj) => {
canvas.bringToFront(obj)
})
//모듈설치면 클릭이벤트
addTargetMouseEventListener('mousedown', setupSurface, function () {
toggleSelection(setupSurface)
})
}
}
canvas?.renderAll()
setModuleSetupSurface([...selectedModuleInstSurfaceArray])
let selectedModuleInstSurfaceArray = []
//설치 범위 지정 클릭 이벤트
const toggleSelection = (setupSurface) => {
const isExist = selectedModuleInstSurfaceArray.some((obj) => obj.parentId === setupSurface.parentId)
//최초 선택일때
if (!isExist) {
//설치면이 북면이고 북면설치 허용점이 아니면
if (setupSurface.isNorth && !saleStoreNorthFlg) {
swalFire({ text: getMessage('module.not.batch.north'), icon: 'warning' })
return
}
//기본 선택이랑 스트로크 굵기가 같으면 선택 안됨으로 봄
setupSurface.set({
...setupSurface,
strokeWidth: 3,
strokeDashArray: [0],
fill: 'rgba(255,255,255,0.1)',
})
canvas.discardActiveObject() // 객체의 활성 상태 해제
//중복으로 들어가는걸 방지하기 위한 코드
canvas?.renderAll()
selectedModuleInstSurfaceArray.push(setupSurface)
setCurrentObject({ name: 'moduleSetupSurface', arrayData: [...selectedModuleInstSurfaceArray] })
} else {
//선택후 재선택하면 선택안됨으로 변경
setupSurface.set({
...setupSurface,
fill: 'rgba(255,255,255,0.1)',
strokeDashArray: [10, 4],
strokeWidth: 1,
})
canvas.discardActiveObject() // 객체의 활성 상태 해제
//폴리곤에 커스텀 인덱스를 가지고 해당 배열 인덱스를 찾아 삭제함
const removeIndex = setupSurface.parentId
const removeArrayIndex = selectedModuleInstSurfaceArray.findIndex((obj) => obj.parentId === removeIndex)
selectedModuleInstSurfaceArray.splice(removeArrayIndex, 1)
setCurrentObject({ name: 'moduleSetupSurface', arrayData: [...selectedModuleInstSurfaceArray] })
}
canvas?.renderAll()
setModuleSetupSurface([...selectedModuleInstSurfaceArray])
}
}
//모듈,회로에서 다른메뉴 -> 배치면으로 갈 경수 초기화

2
src/hooks/module/useModuleSelection.js
View File

@ -114,7 +114,9 @@ export function useModuleSelection(props) {
}
//데이터가 있으면 모듈 자동 선택
//1번 모듈 리스트 조회
useEffect(() => {
//모듈리스트의 데이터가 변경 되면 모듈 선택으로 이벤트
if (moduleList.length > 0 && isObjectNotEmpty(moduleSelectionData.module)) {
handleChangeModule(moduleSelectionData.module)
}

58
src/hooks/module/useModuleTabContents.js
View File

@ -29,7 +29,7 @@ export function useModuleTabContents({ tabIndex, addRoof, setAddedRoofs, roofTab
const [roofBaseParams, setRoofBaseParams] = useState({}) //지붕밑바탕 관련 api호출 파라메터
const moduleSelectionInitParams = useRecoilValue(moduleSelectionInitParamsState) //모듈 기본 데이터 ex) 면조도, 높이등등
const moduleSelectionInitOriginData = useRef(moduleSelectionInitParams)
const moduleSelectionInitOriginData = useRef({})
const { getTrestleList, getConstructionList } = useMasterController()
@ -95,8 +95,6 @@ export function useModuleTabContents({ tabIndex, addRoof, setAddedRoofs, roofTab
})
setRaftCodes(raftCodeList)
console.log('addRoof', addRoof)
if (addRoof.raft) {
setSelectedRaftBase({
...selectedRaftBase,
@ -155,6 +153,7 @@ export function useModuleTabContents({ tabIndex, addRoof, setAddedRoofs, roofTab
useEffect(() => {
//lengbase는 무조건 있다고 가정 하고 최초에 실행 방지
if (selectedModules) {
//여기서부터 시작
//가대메이커 파라메터 만들기
setTrestleParams({
moduleTpCd: selectedModules.itemTp,
@ -174,6 +173,7 @@ export function useModuleTabContents({ tabIndex, addRoof, setAddedRoofs, roofTab
//가대메이커 변경 함수
const handleChangeTrestle = (option) => {
option.raftBaseCd = selectedRaftBase.raftBaseCd
setSelectedTrestle(option) //선택값 저장
setConstructionParams({ ...trestleParams, trestleMkrCd: option.trestleMkrCd, constMthdCd: '', roofBaseCd: '' })
}
@ -266,32 +266,30 @@ export function useModuleTabContents({ tabIndex, addRoof, setAddedRoofs, roofTab
//공법 선택시 이후 프로세스
useEffect(() => {
if (isObjectNotEmpty(selectedRoofBase) && isObjectNotEmpty(selectedConstruction)) {
if (tabIndex === roofTab) {
const common = { ...moduleSelectionInitParams }
const module = { ...selectedModules }
const newRoofConstructions = {
roofIndex: tabIndex,
addRoof: addRoof,
trestle: selectedRoofBase,
construction: selectedConstruction,
}
const common = { ...moduleSelectionInitParams }
const module = { ...selectedModules }
const newRoofConstructions = {
roofIndex: tabIndex,
addRoof: addRoof,
trestle: selectedRoofBase,
construction: selectedConstruction,
}
const index = tempModuleSelectionData.roofConstructions.findIndex((obj) => obj.roofIndex === tabIndex)
const index = tempModuleSelectionData.roofConstructions.findIndex((obj) => obj.roofIndex === tabIndex)
if (index > -1) {
const newArray = [
...tempModuleSelectionData.roofConstructions.slice(0, index),
newRoofConstructions,
...tempModuleSelectionData.roofConstructions.slice(index + 1),
]
setTempModuleSelectionData({ common: common, module: module, roofConstructions: newArray })
} else {
setTempModuleSelectionData({
common: common,
module: module,
roofConstructions: [...tempModuleSelectionData.roofConstructions, { ...newRoofConstructions }],
})
}
if (index > -1) {
const newArray = [
...tempModuleSelectionData.roofConstructions.slice(0, index),
newRoofConstructions,
...tempModuleSelectionData.roofConstructions.slice(index + 1),
]
setTempModuleSelectionData({ common: common, module: module, roofConstructions: newArray })
} else {
setTempModuleSelectionData({
common: common,
module: module,
roofConstructions: [...tempModuleSelectionData.roofConstructions, { ...newRoofConstructions }],
})
}
}
}, [selectedConstruction])
@ -299,8 +297,6 @@ export function useModuleTabContents({ tabIndex, addRoof, setAddedRoofs, roofTab
//거대메이커, 공법, 지붕밑바탕 api 조회
const getModuleOptionsListData = async (params, type) => {
const optionsList = await getTrestleList(params)
console.log('optionsList', optionsList)
if (optionsList.data.length > 0) {
if (type === 'trestle') {
//가대 메이커일때
@ -340,6 +336,10 @@ export function useModuleTabContents({ tabIndex, addRoof, setAddedRoofs, roofTab
resetSelected()
}
}
if (moduleSelectionInitParams.moduleItemId && moduleSelectionInitParams.moduleTpCd) {
moduleSelectionInitOriginData.current = moduleSelectionInitParams
}
}, [moduleSelectionInitParams])
const handleHajebichiAndLength = (e, type) => {

5
src/hooks/module/useTrestle.js
View File

@ -80,7 +80,6 @@ export const useTrestle = () => {
const modules = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE)
modules.forEach((module) => {
module.fire('polygonMoved')
const { x, y } = module.getCenterPoint()
const isExposedBottom = result.exposedBottomPoints.some((point) => Math.abs(point.x - x) < 2 && Math.abs(point.y - y) < 2)
const isLeftExposedHalfBottom = result.leftExposedHalfBottomPoints.some((point) => Math.abs(point.x - x) < 2 && Math.abs(point.y - y) < 2)
@ -130,7 +129,7 @@ export const useTrestle = () => {
// 처마력바설치 true인 경우 설치
exposedBottomModules.forEach((module) => {
//TODO : 방향별로 처마력바 설치해야함
const bottomPoints = findTopTwoPoints([...module.points], direction)
const bottomPoints = findTopTwoPoints([...module.getCurrentPoints()], direction)
if (!bottomPoints) return
const eaveBar = new fabric.Line([bottomPoints[0].x, bottomPoints[0].y, bottomPoints[1].x, bottomPoints[1].y], {
parent: surface,
@ -148,7 +147,7 @@ export const useTrestle = () => {
if (isChidory && cvrPlvrYn === 'Y') {
leftExposedHalfBottomModules.forEach((module) => {
const bottomPoints = findTopTwoPoints([...module.points], direction)
const bottomPoints = findTopTwoPoints([...module.getCurrentPoints()], direction)
let barPoints = []
//설치해야할 반처마커버 포인트를 방향에 따라 설정

2
src/hooks/object/useObjectBatch.js
View File

@ -26,7 +26,7 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
useEffect(() => {
if (canvas) {
dbClickEvent()
// dbClickEvent()
}
return () => {

6
src/hooks/surface/useSurfaceShapeBatch.js
View File

@ -85,6 +85,10 @@ export function useSurfaceShapeBatch({ isHidden, setIsHidden }) {
canvas?.remove(...canvas?.getObjects().filter((obj) => obj.name === MENU.BATCH_CANVAS.SURFACE_SHAPE_BATCH_TEMP))
points = getSurfaceShape(surfaceId, pointer, { length1, length2, length3, length4, length5 })
console.log('surfaceRefs.xInversion', surfaceRefs.xInversion)
console.log('surfaceRefs.yInversion', surfaceRefs.yInversion)
console.log('surfaceRefs.rotate', surfaceRefs.rotate)
const options = {
fill: 'transparent',
stroke: 'black',
@ -100,7 +104,7 @@ export function useSurfaceShapeBatch({ isHidden, setIsHidden }) {
name: MENU.BATCH_CANVAS.SURFACE_SHAPE_BATCH_TEMP,
flipX: surfaceRefs.yInversion,
flipY: surfaceRefs.xInversion,
angle: surfaceRefs.rotate,
angle: Math.abs(surfaceRefs.rotate),
originX: 'center',
originY: 'center',
pitch: globalPitch,

108
src/hooks/useCirCuitTrestle.js
View File

@ -1,10 +1,19 @@
import { GlobalDataContext } from '@/app/GlobalDataProvider'
import { POLYGON_TYPE } from '@/common/common'
import { canvasState } from '@/store/canvasAtom'
import { makersState, modelsState, pcsCheckState, selectedMakerState, selectedModelsState, seriesState } from '@/store/circuitTrestleAtom'
import {
makersState,
modelsState,
moduleStatisticsState,
pcsCheckState,
selectedMakerState,
selectedModelsState,
seriesState,
} from '@/store/circuitTrestleAtom'
import { selectedModuleState } from '@/store/selectedModuleOptions'
import { useContext } from 'react'
import { useRecoilState, useRecoilValue } from 'recoil'
import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil'
import { useMessage } from './useMessage'
export function useCircuitTrestle() {
const [makers, setMakers] = useRecoilState(makersState)
@ -16,6 +25,9 @@ export function useCircuitTrestle() {
const selectedModules = useRecoilValue(selectedModuleState)
const { managementState, setManagementState, managementStateLoaded } = useContext(GlobalDataContext)
const canvas = useRecoilValue(canvasState)
const setModuleStatistics = useSetRecoilState(moduleStatisticsState)
const { getMessage } = useMessage()
const getOptYn = () => {
return {
maxConnYn: pcsCheck.max ? 'Y' : 'N',
@ -47,6 +59,7 @@ export function useCircuitTrestle() {
// 사용된 모듈아이템 목록
const getUseModuleItemList = () => {
console.log('🚀 ~ getUseModuleItemList ~ selectedModules:', selectedModules)
return selectedModules?.itemList?.map((m) => {
return {
itemId: m.itemId,
@ -163,6 +176,96 @@ export function useCircuitTrestle() {
const setPowerConditionerData = () => {}
const setModuleStatisticsData = () => {
console.log(canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE))
if (selectedModules?.length === 0) return
const tempHeader = [
{ name: getMessage('simulator.table.sub1'), prop: 'name' },
{ name: getMessage('modal.circuit.trestle.setting.circuit.allocation.passivity.circuit'), prop: 'circuit' },
...selectedModules?.itemList?.map((module) => {
return {
name: module.itemNm,
prop: module.itemId,
}
}),
{ name: `${getMessage('modal.panel.batch.statistic.power.generation.amount')}(kW)`, prop: 'wpOut' },
]
const surfaceObjects = {}
const surfaces = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
surfaces.forEach((surface) => {
surfaceObjects[surface.id] = {
roofSurface: canvas.getObjects().filter((obj) => obj.id === surface.parentId)[0].directionText,
circuit: '-',
amount: 0,
wpOut: 0,
circuits: {},
}
surface.modules.forEach((module) => {
if (!surfaceObjects[surface.id][module.moduleInfo.itemId]) {
// 지붕면에 모듈 존재 여부
surfaceObjects[surface.id][module.moduleInfo.itemId] = 0 // 모듈 초기화
}
surfaceObjects[surface.id][module.moduleInfo.itemId]++
surfaceObjects[surface.id].wpOut += +module.moduleInfo.wpOut
if (module.circuit) {
if (!surfaceObjects[surface.id].circuits[module.circuitNumber]) {
surfaceObjects[surface.id].circuits[module.circuitNumber] = {
circuit: module.circuitNumber,
wpOut: 0,
circuits: { wpOut: 0 },
}
}
if (!surfaceObjects[surface.id].circuits[module.circuitNumber].circuits[module.moduleInfo.itemId]) {
surfaceObjects[surface.id].circuits[module.circuitNumber].circuits[module.moduleInfo.itemId] = 0
}
surfaceObjects[surface.id].circuits[module.circuitNumber].circuits[module.moduleInfo.itemId]++
surfaceObjects[surface.id].circuits[module.circuitNumber].circuits.wpOut += +module.moduleInfo.wpOut
surfaceObjects[surface.id].wpOut -= +module.moduleInfo.wpOut
surfaceObjects[surface.id][module.moduleInfo.itemId]--
}
})
})
let tempRows = []
Object.keys(surfaceObjects).forEach((key) => {
let tempRow = {
name: surfaceObjects[key].roofSurface,
circuit: surfaceObjects[key].circuit,
wpOut: parseFloat(surfaceObjects[key].wpOut / 1000),
}
selectedModules.itemList.forEach((module) => {
tempRow[module.itemId] = surfaceObjects[key][module.itemId]
})
tempRows.push(tempRow)
Object.keys(surfaceObjects[key].circuits).forEach((circuit) => {
let row = {
name: surfaceObjects[key].roofSurface,
circuit: surfaceObjects[key].circuits[circuit].circuit,
wpOut: parseFloat(surfaceObjects[key].circuits[circuit].circuits.wpOut / 1000),
}
selectedModules.itemList.forEach((module) => {
row[module.itemId] = surfaceObjects[key].circuits[circuit].circuits[module.itemId]
})
tempRows.push(row)
})
})
const tempFooter = {
name: getMessage('modal.panel.batch.statistic.total'),
circuit: '-',
wpOut: tempRows.reduce((acc, row) => acc + row.wpOut, 0),
}
selectedModules.itemList.forEach((module) => {
tempFooter[module.itemId] = tempRows.reduce((acc, row) => acc + row[module.itemId], 0)
})
canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.MODULE_SETUP_SURFACE)
setModuleStatistics({ header: tempHeader, rows: tempRows.filter((row) => row.wpOut !== 0), footer: tempFooter })
}
return {
makers,
setMakers,
@ -183,5 +286,6 @@ export function useCircuitTrestle() {
getRoofSurfaceList,
getModuleList,
removeNotAllocationModules,
setModuleStatisticsData,
}
}

1
src/locales/ja.json
View File

@ -417,6 +417,7 @@
"modal.module.circuit.number.edit": "モジュール一括回路番号の変更",
"modal.module.circuit.number.edit.info": "回路番号を入力してください。",
"modal.module.circuit.number": "回路番号",
"modal.module.can.not.edit": "회로 구성을 완료한 모듈은 변경할 수 없습니다.(JA)",
"modal.line.property.change": "変更する属性を選択してください。",
"modal.line.property.change.unselect": "変更するラインを選択してください。",
"modal.line.property.change.confirm": "プロパティを変更しますか？",

2
src/locales/ko.json
View File

@ -417,6 +417,7 @@
"modal.module.circuit.number.edit": "모듈 일괄 회로 번호 변경",
"modal.module.circuit.number.edit.info": "회로 번호를 입력해주세요.",
"modal.module.circuit.number": "회로 번호",
"modal.module.can.not.edit": "회로 구성을 완료한 모듈은 변경할 수 없습니다.",
"modal.line.property.change": "변경할 속성을 선택해 주세요.",
"modal.line.property.change.unselect": "변경할 라인을 선택해 주세요.",
"modal.line.property.change.confirm": "속성을 변경하시겠습니까?",
@ -858,6 +859,7 @@
"surface.shape.validate.size.1to2": "①길이는 ②보다 큰 값을 넣어주세요.",
"surface.shape.validate.size.1to3": "①길이는 ③보다 큰 값을 넣어주세요.",
"surface.shape.validate.size.1to23": "①길이는 ②+③보다 큰 값을 넣어주세요.",
"surface.shape.validate.size.1to23low": "②+③길이는 ①보다 큰 값을 넣어주세요.",
"surface.shape.validate.size.2to3": "②길이는 ③보다 큰 값을 넣어주세요.",
"surface.shape.validate.size.3to2": "③길이는 ②보다 큰 값을 넣어주세요.",
"surface.shape.validate.size.3to4": "③길이는 ④보다 큰 값을 넣어주세요.",