diff --git a/src/components/community/ArchiveTable.jsx b/src/components/community/ArchiveTable.jsx index 371ae454..51664c8a 100644 --- a/src/components/community/ArchiveTable.jsx +++ b/src/components/community/ArchiveTable.jsx @@ -1,6 +1,6 @@ 'use client' -import { useEffect, useState } from 'react' +import { useEffect, useState, useContext } from 'react' import { useRecoilState } from 'recoil' import { useAxios } from '@/hooks/useAxios' @@ -9,7 +9,12 @@ import { useMessage } from '@/hooks/useMessage' import { handleFileDown } from '@/util/board-utils' +import { QcastContext } from '@/app/QcastProvider' + export default function ArchiveTable({ clsCode }) { + // global 로딩바 + const { setIsGlobalLoading } = useContext(QcastContext) + const { getMessage } = useMessage() // api 조회 관련 @@ -20,6 +25,7 @@ export default function ArchiveTable({ clsCode }) { // 목록 조회 useEffect(() => { async function fetchData() { + setIsGlobalLoading(true) const url = `/api/board/list` const params = new URLSearchParams({ schNoticeTpCd: 'QC', @@ -42,6 +48,7 @@ export default function ArchiveTable({ clsCode }) { alert(resultData.result.message) } } + setIsGlobalLoading(false) } fetchData() diff --git a/src/components/community/Table.jsx b/src/components/community/Table.jsx index ffe68fa6..e7a06d53 100644 --- a/src/components/community/Table.jsx +++ b/src/components/community/Table.jsx @@ -1,6 +1,6 @@ 'use client' -import { useEffect, useState } from 'react' +import { useEffect, useState, useContext } from 'react' import { useRecoilState } from 'recoil' import { searchState } from '@/store/boardAtom' @@ -10,7 +10,12 @@ import { useMessage } from '@/hooks/useMessage' import BoardDetailModal from '../community/modal/BoardDetailModal' +import { QcastContext } from '@/app/QcastProvider' + export default function Table({ clsCode }) { + // global 로딩바 + const { setIsGlobalLoading } = useContext(QcastContext) + const { getMessage } = useMessage() // api 조회 관련 @@ -25,6 +30,7 @@ export default function Table({ clsCode }) { // 목록 조회 useEffect(() => { async function fetchData() { + setIsGlobalLoading(true) const startRow = (search.currentPage - 1) * search.pageBlock > 0 ? (search.currentPage - 1) * search.pageBlock + 1 : 1 const endRow = search.currentPage * search.pageBlock @@ -53,6 +59,7 @@ export default function Table({ clsCode }) { alert(resultData.result.message) } } + setIsGlobalLoading(false) } fetchData() diff --git a/src/components/fabric/QLine.js b/src/components/fabric/QLine.js index 67c02d62..17892dfe 100644 --- a/src/components/fabric/QLine.js +++ b/src/components/fabric/QLine.js @@ -153,4 +153,13 @@ export const QLine = fabric.util.createClass(fabric.Line, { } return this }, + + setLengthText(text) { + const thisText = this.canvas.getObjects().find((obj) => obj.name === 'lengthText' && obj.parentId === this.id) + if (thisText) { + thisText.set({ text: text.toString() }) + this.canvas.renderAll() + } + return this + }, }) diff --git a/src/util/qpolygon-utils.js b/src/util/qpolygon-utils.js index 7f552dcb..4ed06608 100644 --- a/src/util/qpolygon-utils.js +++ b/src/util/qpolygon-utils.js @@ -305,14 +305,14 @@ export const drawGabledRoof = (roofId, canvas) => { return } - const roofPoints = roof.points - const minX = Math.min(...roofPoints.map((point) => point.x)) - const maxX = Math.max(...roofPoints.map((point) => point.x)) - const minY = Math.min(...roofPoints.map((point) => point.y)) - const maxY = Math.max(...roofPoints.map((point) => point.y)) + // const roofPoints = roof.points + // const minX = Math.min(...roofPoints.map((point) => point.x)) + // const maxX = Math.max(...roofPoints.map((point) => point.x)) + // const minY = Math.min(...roofPoints.map((point) => point.y)) + // const maxY = Math.max(...roofPoints.map((point) => point.y)) // 맞은편 라인을 찾기 위해 현재 polygon 으로 만들수 있는 최대한의 길이를 구한다. - const checkLength = Math.abs(Math.sqrt(Math.pow(maxX - minX, 2) + Math.pow(maxY - minY, 2))) + // const checkLength = Math.abs(Math.sqrt(Math.pow(maxX - minX, 2) + Math.pow(maxY - minY, 2))) // 처마라인의 기본속성 입력 const eaves = [] @@ -324,7 +324,7 @@ export const drawGabledRoof = (roofId, canvas) => { const ridges = [] eaves.sort((a, b) => a.length - b.length) - eaves.forEach((eave, i) => { + eaves.forEach((eave) => { const index = eave.index, currentRoof = eave.roof const currentWall = wallLines[index] @@ -390,7 +390,7 @@ export const drawGabledRoof = (roofId, canvas) => { }) }) // 처마마다 지붕 polygon 을 그린다. - eaves.forEach((eave, i) => { + eaves.forEach((eave) => { const index = eave.index, currentRoof = eave.roof const currentWall = wallLines[index] @@ -574,6 +574,52 @@ export const drawGabledRoof = (roofId, canvas) => { } //기준선 제거 // ridges.forEach((ridge) => canvas.remove(ridge)) + + eaves.forEach((eave) => { + const currentRoof = eave.roof + let currentRidges = ridges.filter((ridge) => ridge.attributes.currentRoof.includes(currentRoof.id)) + if (Math.sign(currentRoof.x1 - currentRoof.x2) === 0) { + currentRidges = currentRidges.reduce((farthest, ridge) => { + const currentDistance = Math.abs(ridge.x1 - currentRoof.x1) + const farthestDistance = farthest ? Math.abs(farthest.x1 - currentRoof.x1) : 0 + return currentDistance > farthestDistance ? ridge : farthest + }, null) + } else { + currentRidges = currentRidges.reduce((farthest, ridge) => { + const currentDistance = Math.abs(ridge.y1 - currentRoof.y1) + const farthestDistance = farthest ? Math.abs(farthest.y1 - currentRoof.y1) : 0 + return currentDistance > farthestDistance ? ridge : farthest + }, null) + } + if (currentRidges) { + const ridgeMidX = (currentRidges.x1 + currentRidges.x2) / 2 + const ridgeMidY = (currentRidges.y1 + currentRidges.y2) / 2 + const x2 = Math.sign(currentRidges.x1 - currentRidges.x2) === 0 ? currentRoof.x1 : ridgeMidX + const y2 = Math.sign(currentRidges.x1 - currentRidges.x2) === 0 ? ridgeMidY : currentRoof.y1 + + const centerLine = new QLine([ridgeMidX, ridgeMidY, x2, y2], { + stroke: '#000000', + strokeWidth: 2, + strokeDashArray: [5, 5], + selectable: false, + fontSize: roof.fontSize, + attributes: { + roofId: roof.id, + type: 'pitchSizeLine', + }, + }) + const adjust = Math.sqrt( + Math.pow(Math.round(Math.abs(centerLine.x1 - centerLine.x2) * 10), 2) + Math.pow(Math.round(Math.abs(centerLine.y1 - centerLine.y2) * 10), 2), + ) + const currentDegree = currentRoof.attributes.pitch > 0 ? getDegreeByChon(currentRoof.attributes.pitch) : currentRoof.attributes.degree + const height = Math.tan(currentDegree * (Math.PI / 180)) * adjust + const lengthText = Math.round(Math.sqrt(Math.pow(adjust, 2) + Math.pow(height, 2))) + canvas.add(centerLine) + canvas.renderAll() + centerLine.setLengthText(lengthText) + roof.innerLines.push(centerLine) + } + }) } /** @@ -583,14 +629,15 @@ export const drawGabledRoof = (roofId, canvas) => { */ export const drawShedRoof = (roofId, canvas) => { const roof = canvas?.getObjects().find((object) => object.id === roofId) - const hasNonParallelLines = roof.lines.filter((line) => line.x1 !== line.x2 && line.y1 !== line.y2) + const hasNonParallelLines = roof.lines.filter((line) => Math.abs(line.x1 - line.x2) > 1 && Math.abs(line.y1 - line.y2) > 1) if (hasNonParallelLines.length > 0) { alert('대각선이 존재합니다.') return } - const sheds = roof.lines.filter((line) => line.attributes !== undefined && line.attributes.type === LINE_TYPE.WALLLINE.SHED) - const gables = roof.lines.filter((line) => line.attributes !== undefined && line.attributes.type === LINE_TYPE.WALLLINE.GABLE) + const sheds = roof.lines.filter((line) => line.attributes?.type === LINE_TYPE.WALLLINE.SHED) + const gables = roof.lines.filter((line) => line.attributes?.type === LINE_TYPE.WALLLINE.GABLE) + const eaves = roof.lines.filter((line) => line.attributes?.type === LINE_TYPE.WALLLINE.EAVES) let shedDegree = sheds[0].attributes.degree || 0 const shedChon = sheds[0].attributes.pitch || 0 @@ -607,6 +654,60 @@ export const drawShedRoof = (roofId, canvas) => { const height = getHeight(adjust, shedDegree) gable.attributes.actualSize = Math.round(Math.sqrt(Math.pow(adjust, 2) + Math.pow(height, 2))) }) + + const pitchSizeLines = [] + + sheds.forEach((shed) => { + let points = [] + let x1, y1, x2, y2 + const signX = Math.sign(shed.x1 - shed.x2) + if (signX !== 0) { + points.push(shed.x1, shed.x2) + y1 = shed.y1 + } else { + points.push(shed.y1, shed.y2) + x1 = shed.x1 + } + eaves.forEach((eave) => { + if (signX !== 0) { + points.push(eave.x1, eave.x2) + points.sort((a, b) => a - b) + x1 = (points[1] + points[2]) / 2 + x2 = (points[1] + points[2]) / 2 + y2 = eave.y1 + } else { + points.push(eave.y1, eave.y2) + points.sort((a, b) => a - b) + y1 = (points[1] + points[2]) / 2 + y2 = (points[1] + points[2]) / 2 + x2 = eave.x1 + } + points.sort((a, b) => a - b) + const line = new QLine([x1, y1, x2, y2], { + stroke: '#000000', + strokeWidth: 2, + strokeDashArray: [5, 5], + selectable: false, + fontSize: roof.fontSize, + attributes: { + roofId: roof.id, + type: 'pitchSizeLine', + }, + }) + pitchSizeLines.push(line) + }) + }) + + const maxLine = pitchSizeLines.reduce((prev, current) => (prev.length > current.length ? prev : current), pitchSizeLines[0]) + canvas.add(maxLine) + canvas.renderAll() + + const adjust = Math.sqrt( + Math.pow(Math.round(Math.abs(maxLine.x1 - maxLine.x2) * 10), 2) + Math.pow(Math.round(Math.abs(maxLine.y1 - maxLine.y2) * 10), 2), + ) + const height = getHeight(adjust, shedDegree) + const lengthText = Math.round(Math.sqrt(Math.pow(adjust, 2) + Math.pow(height, 2))) + maxLine.setLengthText(lengthText) } export const drawRidgeRoof = (roofId, canvas) => {