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-03-07 12:39:27 +09:00
commit bdeb6a1905
3 changed files with 128 additions and 42 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
src/hooks/main/useMainContentsController.js
View File

@ -16,7 +16,7 @@ export const useMainContentsController = () => {
useEffect(() => {
checkSession().then((res) => {
if (!res) {
router.replace('/login')
router.replace('/login', undefined, { shallow: true })
}
})
setIsGlobalLoading(true)

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

@ -12,6 +12,7 @@ import {
triangleToPolygon,
getDegreeByChon,
toFixedWithoutRounding,
getTrianglePoints,
} from '@/util/canvas-util'
import { useSwal } from '@/hooks/useSwal'
import * as turf from '@turf/turf'
@ -28,13 +29,11 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
const { addCanvasMouseEventListener, initEvent, addDocumentEventListener } = useEvent()
// const { addCanvasMouseEventListener, initEvent, addDocumentEventListener } = useContext(EventContext)
const { swalFire } = useSwal()
const { drawDirectionArrow } = usePolygon()
const { drawDirectionArrow, addPolygon, addLengthText } = usePolygon()
const { setSurfaceShapePattern } = useRoofFn()
const lengthTextFont = useRecoilValue(fontSelector('lengthText'))
const roofDisplay = useRecoilValue(roofDisplaySelector)
const { addPolygon } = usePolygon()
useEffect(() => {
if (canvas) {
// dbClickEvent()
@ -419,7 +418,7 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
addCanvasMouseEventListener('mouse:up', (e) => {
if (dormer) {
const trianglePolygon = pointsToTurfPolygon(triangleToPolygon(dormer))
const trianglePolygon = pointsToTurfPolygon(offsetRef > 0 ? getTrianglePoints(dormerOffset) : getTrianglePoints(dormer))
const selectedSurfacePolygon = polygonToTurfPolygon(selectedSurface)
//지붕 밖으로 그렸을때
@ -448,8 +447,8 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
direction = 'north'
}
let { leftPoints, rightPoints, groupPoints } =
offsetRef > 0 ? splitDormerTriangle(dormerOffset, directionRef) : splitDormerTriangle(dormer, directionRef)
let { leftPoints, rightPoints, groupPoints, dormerPoints } =
offsetRef > 0 ? splitDormerTriangle(dormerOffset, directionRef, dormer) : splitDormerTriangle(dormer, directionRef)
canvas?.remove(offsetRef > 0 ? dormerOffset : dormer)
if (offsetRef > 0)
@ -512,10 +511,6 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
false,
)
leftTriangle.texts.forEach((text) => {
text.bringToFront()
})
const rightTriangle = addPolygon(
rightPoints,
{
@ -587,7 +582,7 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
canvas?.remove(dormer)
offsetPolygon = addPolygon(
triangleToPolygon(dormer),
dormerPoints,
{
selectable: true,
lockMovementX: true, // X 축 이동 잠금
@ -604,7 +599,7 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
fontSize: lengthTextFont.fontSize.value,
fontStyle: lengthTextFont.fontWeight.value.toLowerCase().includes('italic') ? 'italic' : 'normal',
fontWeight: lengthTextFont.fontWeight.value,
angle: originAngle,
// angle: originAngle,
pitch: pitch,
dormerAttributes: {
height: height,
@ -639,6 +634,10 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
)
}
addLengthText(leftTriangle)
addLengthText(rightTriangle)
addLengthText(offsetPolygon)
const groupPolygon = offsetPolygon ? [leftTriangle, rightTriangle, offsetPolygon] : [leftTriangle, rightTriangle]
const objectGroup = new fabric.Group(groupPolygon, {
@ -667,9 +666,6 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
}
})
} else if (buttonAct === 4) {
const heightLength = height - (width / 2) * (pitch * 0.25)
const heightOffsetLength = height + offsetRef - (width / 2 + offsetWidthRef) * (pitch * 0.25)
addCanvasMouseEventListener('mouse:move', (e) => {
isDown = true
if (!isDown) return
@ -774,7 +770,7 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
addCanvasMouseEventListener('mouse:up', (e) => {
if (dormer) {
const pentagonPolygon = pointsToTurfPolygon(dormer.points)
const pentagonPolygon = pointsToTurfPolygon(offsetRef > 0 ? dormerOffset.getCurrentPoints() : dormer.getCurrentPoints())
const selectedSurfacePolygon = polygonToTurfPolygon(selectedSurface)
//지붕 밖으로 그렸을때
@ -804,11 +800,8 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
direction = 'north'
}
const offsetMode = offsetRef > 0 || offsetWidthRef > 0 ? 'offset' : 'normal'
let { leftPoints, rightPoints, groupPoints } =
offsetRef > 0 || offsetWidthRef > 0
? splitDormerPentagon(dormerOffset, directionRef, offsetMode)
: splitDormerPentagon(dormer, directionRef, offsetMode)
offsetRef > 0 || offsetWidthRef > 0 ? splitDormerPentagon(dormerOffset, directionRef) : splitDormerPentagon(dormer, directionRef)
canvas?.remove(offsetRef > 0 || offsetWidthRef > 0 ? dormerOffset : dormer)
if (offsetRef > 0)
@ -948,7 +941,7 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
canvas?.remove(dormer)
offsetPolygon = addPolygon(
dormer.points,
dormer.getCurrentPoints(),
{
selectable: true,
lockMovementX: true, // X 축 이동 잠금
@ -965,7 +958,7 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
fontSize: lengthTextFont.fontSize.value,
fontStyle: lengthTextFont.fontWeight.value.toLowerCase().includes('italic') ? 'italic' : 'normal',
fontWeight: lengthTextFont.fontWeight.value,
angle: originAngle,
// angle: originAngle,
groupPoints: groupPoints,
dormerAttributes: {
height: height,
@ -1012,6 +1005,10 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
)
}
addLengthText(leftPentagon)
addLengthText(rightPentagon)
addLengthText(offsetPolygon)
const groupPolygon = offsetPolygon ? [leftPentagon, rightPentagon, offsetPolygon] : [leftPentagon, rightPentagon]
const objectGroup = new fabric.Group(groupPolygon, {
@ -1058,13 +1055,18 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
if (setIsHidden) setIsHidden(false)
}
const splitDormerTriangle = (triangle, direction) => {
const splitDormerTriangle = (triangle, direction, dormer = null) => {
const halfWidth = triangle.width / 2
let dormerPoints = []
let leftPoints = []
let rightPoints = []
let groupPoints = []
if (dormer) {
dormerPoints = getTrianglePoints(dormer)
}
if (direction === 'down') {
leftPoints = [
{ x: triangle.left, y: triangle.top },
@ -1122,23 +1124,23 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
} else if (direction === 'right') {
leftPoints = [
{ x: triangle.left, y: triangle.top },
{ x: triangle.left + triangle.height, y: triangle.top + halfWidth },
{ x: triangle.left + triangle.height, y: triangle.top },
{ x: triangle.left + triangle.height, y: triangle.top + triangle.height },
]
rightPoints = [
{ x: triangle.left, y: triangle.top },
{ x: triangle.left + triangle.height, y: triangle.top + triangle.height },
{ x: triangle.left + triangle.height, y: triangle.top - triangle.height },
{ x: triangle.left + triangle.height, y: triangle.top },
{ x: triangle.left + triangle.height, y: triangle.top - halfWidth },
]
groupPoints = [
{ x: triangle.left, y: triangle.top },
{ x: triangle.left + triangle.height, y: triangle.top + triangle.height },
{ x: triangle.left + triangle.height, y: triangle.top - triangle.height },
{ x: triangle.left + triangle.height, y: triangle.top + halfWidth },
{ x: triangle.left + triangle.height, y: triangle.top - halfWidth },
]
}
return { leftPoints, rightPoints, groupPoints }
return { leftPoints, rightPoints, groupPoints, dormerPoints }
}
const splitDormerPentagon = (pentagon, direction, offsetMode) => {
@ -1326,15 +1328,24 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
const reGroupObject = (groupObj) => {
groupObj._restoreObjectsState() //이건 실행만 되도 그룹이 변경됨
console.log('groupObj', groupObj)
const reGroupObjects = []
groupObj._objects.forEach((obj) => {
const newObj = new QPolygon(obj.getCurrentPoints(), {
const newObj = addPolygon(
obj.getCurrentPoints(),
{
...obj,
points: obj.getCurrentPoints(),
scaleX: 1,
scaleY: 1,
texts: [],
})
lines: obj.lines ?? [],
groupPoints: groupObj.groupPoints ?? [],
groupId: groupObj.groupId ?? '',
},
false,
)
reGroupObjects.push(newObj)
canvas.remove(obj)
if (newObj.direction) {
@ -1342,6 +1353,7 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
}
newObj.fire('modified')
})
const reGroup = new fabric.Group(reGroupObjects, {
subTargetCheck: true,
name: groupObj.name,
@ -1350,10 +1362,20 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
parentId: groupObj.parentId,
originX: 'center',
originY: 'center',
groupPoints: groupObj.groupPoints ?? [],
groupId: groupObj.groupId ?? '',
})
canvas?.add(reGroup)
canvas?.remove(groupObj)
reGroup._objects.forEach((obj) => {
if (obj.hasOwnProperty('texts')) {
obj.texts.forEach((text) => {
text.bringToFront()
})
}
})
return reGroup
}
@ -1368,6 +1390,10 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
})
const originObj = { ...obj }
const turfSurface = pointsToTurfPolygon(parentSurface.points)
const originLeft = obj.left
const originTop = obj.top
addCanvasMouseEventListener('mouse:up', (e) => {
//개구, 그림자 타입일 경우 폴리곤 타입 변경
if (BATCH_TYPE.OPENING === obj.name || BATCH_TYPE.SHADOW === obj.name) {
@ -1375,7 +1401,6 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
points: rectToPolygon(obj),
})
const turfSurface = pointsToTurfPolygon(parentSurface.points)
const turfObject = pointsToTurfPolygon(obj.points)
if (turf.booleanWithin(turfObject, turfSurface)) {
@ -1398,8 +1423,36 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
lockMovementY: true,
})
if (obj.name === BATCH_TYPE.TRIANGLE_DORMER || obj.name === BATCH_TYPE.PENTAGON_DORMER) {
const calcLeft = obj.left - originLeft
const calcTop = obj.top - originTop
const currentDormerPoints = obj.groupPoints.map((item) => {
return {
x: item.x + calcLeft,
y: item.y + calcTop,
}
})
const turfObject = pointsToTurfPolygon(currentDormerPoints)
if (turf.booleanWithin(turfObject, turfSurface)) {
obj.set({
lockMovementX: true,
lockMovementY: true,
groupPoints: currentDormerPoints,
})
if (obj.type === 'group') reGroupObject(obj)
obj.setCoords()
} else {
swalFire({
title: getMessage('batch.object.outside.roof'),
icon: 'warning',
})
obj.set({ ...originObj, lockMovementX: true, lockMovementY: true })
}
}
}
canvas.discardActiveObject()
initEvent()
@ -1512,8 +1565,27 @@ export function useObjectBatch({ isHidden, setIsHidden }) {
length2 = parseInt(length2) / 10
const dormer = canvas.getActiveObject()
if (length1) dormer.top = arrow1 === 'down' ? dormer.top + length1 : dormer.top - length1
if (length2) dormer.left = arrow2 === 'left' ? dormer.left - length2 : dormer.left + length2
if (length1) {
if (!arrow1) {
swalFire({
title: getMessage('length.direction.is.required'),
icon: 'warning',
})
} else {
dormer.top = arrow1 === 'down' ? dormer.top + length1 : dormer.top - length1
}
}
if (length2) {
if (!arrow2) {
swalFire({
title: getMessage('length.direction.is.required'),
icon: 'warning',
})
} else {
dormer.left = arrow2 === 'left' ? dormer.left - length2 : dormer.left + length2
}
}
if (dormer.type === 'group') {
const newDormer = reGroupObject(dormer)

14
src/util/canvas-util.js
View File

@ -1040,3 +1040,17 @@ export function calculateVisibleModuleHeight(sourceWidth, sourceHeight, angle, d
export function toFixedWithoutRounding(number, decimals) {
return Math.floor(number * Math.pow(10, decimals)) / Math.pow(10, decimals)
}
export function getTrianglePoints(triangle) {
const matrix = triangle.calcTransformMatrix()
const w = triangle.width / 2
const h = triangle.height / 2
const points = [
{ x: 0, y: -h },
{ x: -w, y: h },
{ x: w, y: h },
]
return points.map((point) => fabric.util.transformPoint(point, matrix))
}