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

버튼 제거 및 21,22번 추가

Browse Source
This commit is contained in:
hyojun.choi 2024-09-03 16:26:44 +09:00
parent 761a155a52
commit 905ddd07b3
2 changed files with 191 additions and 1212 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1204
src/components/Roof2.jsx
View File

File diff suppressed because it is too large Load Diff

199
src/components/ui/SurfaceShape.jsx
View File

@ -5,6 +5,7 @@ import { modalState } from '@/store/modalAtom'
import { QPolygon } from '@/components/fabric/QPolygon'
import { fontSizeState, roofMaterialState } from '@/store/canvasAtom'
import { degreesToRadians } from '@turf/turf'
import { getIntersectionPoint } from '@/util/canvas-util'
/**
* 면형상 배치 모달
@ -39,6 +40,10 @@ export const SurfaceShapeModal = ({ canvas }) => {
}
const onSave = () => {
if (!checkValid()) {
alert('안됨')
return
}
let isDrawing = true
let obj = null
let points = []
@ -303,7 +308,136 @@ export const SurfaceShapeModal = ({ canvas }) => {
]
break
}
case 21: {
const pointsArray = [
{ x: 0, y: 0 },
{ x: 0, y: 0 },
{ x: 0, y: 0 },
{ x: 0, y: 0 },
{ x: 0, y: 0 },
]
const tmpPolygon = new QPolygon(
[
{ x: 0, y: length3 },
{ x: length1 - length2, y: length3 },
{ x: (length1 - length2) / 2, y: length3 - length3 },
],
{
fill: 'transparent',
stroke: 'black', //black
strokeWidth: 2,
selectable: true,
fontSize: 0,
},
)
const coord = getIntersectionPoint(tmpPolygon.lines[1].startPoint, tmpPolygon.lines[2].startPoint, length3 - length4)
const scale = (length1 - length2) / coord.x
tmpPolygon.set({ scaleX: scale })
pointsArray[0].x = 0
pointsArray[0].y = length3 //바닥면부터 시작하게
pointsArray[1].x = pointsArray[0].x + length1
pointsArray[1].y = pointsArray[0].y
pointsArray[2].x = pointsArray[1].x
pointsArray[2].y = pointsArray[1].y - length4
pointsArray[3].x = pointsArray[2].x - length2
pointsArray[3].y = pointsArray[2].y
pointsArray[4].x = tmpPolygon.getCurrentPoints()[2].x
pointsArray[4].y = tmpPolygon.getCurrentPoints()[2].y
points = [
{
x: pointer.x - length1 / 2,
y: pointer.y + length4 / 2,
},
{
x: pointer.x + length1 / 2,
y: pointer.y + length4 / 2,
},
{
x: pointer.x + length1 / 2,
y: pointer.y - length4 / 2,
},
{
x: pointer.x - (length2 - length1 / 2),
y: pointer.y - length4 / 2,
},
{
x: pointer.x - length1 / 2 + pointsArray[4].x,
y: pointer.y - length3 + length4 / 2,
},
]
break
}
case 22: {
const pointsArray = [
{ x: 0, y: 0 },
{ x: 0, y: 0 },
{ x: 0, y: 0 },
{ x: 0, y: 0 },
{ x: 0, y: 0 },
]
const tmpPolygon = new QPolygon(
[
{ x: 0, y: length3 },
{ x: length1 - length2, y: length3 },
{ x: (length1 - length2) / 2, y: length3 - length3 },
],
{
fill: 'transparent',
stroke: 'black', //black
strokeWidth: 2,
selectable: true,
fontSize: 0,
},
)
const coord = getIntersectionPoint(tmpPolygon.lines[1].startPoint, tmpPolygon.lines[2].startPoint, length3 - length4)
const scale = (length1 - length2) / coord.x
tmpPolygon.set({ scaleX: scale })
pointsArray[0].x = 0
pointsArray[0].y = length3 //바닥면부터 시작하게
pointsArray[1].x = pointsArray[0].x + length1
pointsArray[1].y = pointsArray[0].y
pointsArray[2].x = pointsArray[1].x
pointsArray[2].y = pointsArray[1].y - length4
pointsArray[3].x = pointsArray[2].x - length2
pointsArray[3].y = pointsArray[2].y
pointsArray[4].x = tmpPolygon.getCurrentPoints()[2].x
pointsArray[4].y = tmpPolygon.getCurrentPoints()[2].y
points = [
{
x: pointer.x - length1 / 2,
y: pointer.y + length4 / 2,
},
{
x: pointer.x + length1 / 2,
y: pointer.y + length4 / 2,
},
{
x: pointer.x + length1 / 2,
y: pointer.y - length4 / 2,
},
{
x: pointer.x - (length2 - length1 / 2),
y: pointer.y - length4 / 2,
},
{
x: pointer.x - length1 / 2 + pointsArray[4].x,
y: pointer.y - length3 + length4 / 2,
},
]
break
}
case 23: {
points = [
{ x: pointer.x - length1 / 2 + length2, y: pointer.y + length4 / 2 },
@ -462,14 +596,27 @@ export const SurfaceShapeModal = ({ canvas }) => {
break
}
}
obj = new QPolygon(points, {
fill: 'transparent',
stroke: 'black',
strokeWidth: 2,
selectable: false,
fontSize: fontSize,
name: 'guideTriangle',
})
if (type !== 22) {
obj = new QPolygon(points, {
fill: 'transparent',
stroke: 'black',
strokeWidth: 2,
selectable: false,
fontSize: fontSize,
name: 'guideTriangle',
})
} else {
obj = new QPolygon(points, {
fill: 'transparent',
stroke: 'black',
strokeWidth: 2,
selectable: false,
fontSize: fontSize,
name: 'guideTriangle',
flipX: true,
})
}
canvas?.add(obj)
setCurrentPattern(obj)
canvas?.renderAll()
@ -482,6 +629,42 @@ export const SurfaceShapeModal = ({ canvas }) => {
setOpen(false)
}
const checkValid = () => {
let result = true
switch (type) {
case 1: {
if (length3 !== 0 && length1 > length3) {
return false
}
break
}
case 21: {
if (length1 < length2) {
alert('1번보다 작게 입력해주세요.')
return false
}
if (length3 < length4) {
alert('3번보다 작게 입력해주세요.')
return false
}
}
case 22: {
if (length1 < length2) {
alert('1번보다 작게 입력해주세요.')
return false
}
if (length3 < length4) {
alert('3번보다 작게 입력해주세요.')
return false
}
}
}
return result
}
const setLength = (e) => {
let { name, value } = e.target
value = value.replace(/[^-0-9]/g, '')