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

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

Browse Source
This commit is contained in:
yoosangwook 2024-12-10 09:58:04 +09:00
commit 9c5e21aa41
6 changed files with 200 additions and 1217 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
src/components/fabric/QPolygon.js
View File

@ -186,12 +186,6 @@ export const QPolygon = fabric.util.createClass(fabric.Polygon, {
})
},
containsPoint: function (point) {
const isInside = this.inPolygon(point)
this.set('selectable', isInside)
return isInside
},
// 보조선 그리기
drawHelpLine() {
// drawHelpLineInHexagon(this, pitch)

22
src/components/floor-plan/modal/movement/type/FlowLine.jsx
View File

@ -1,6 +1,5 @@
import { useMessage } from '@/hooks/useMessage'
import { useEffect, useState } from 'react'
import { useEvent } from '@/hooks/useEvent'
import { useState } from 'react'
const FLOW_LINE_TYPE = {
DOWN_LEFT: 'downLeft',
@ -11,16 +10,6 @@ export default function FlowLine({ FLOW_LINE_REF }) {
const { getMessage } = useMessage()
const [type, setType] = useState(FLOW_LINE_TYPE.DOWN_LEFT)
useEffect(() => {
if (type === FLOW_LINE_TYPE.DOWN_LEFT) {
FLOW_LINE_REF.UP_RIGHT_INPUT_REF.current.value = ''
FLOW_LINE_REF.DOWN_LEFT_INPUT_REF.current.focus()
} else {
FLOW_LINE_REF.DOWN_LEFT_INPUT_REF.current.value = ''
FLOW_LINE_REF.UP_RIGHT_INPUT_REF.current.focus()
}
}, [type])
return (
<>
<div className="outline-wrap">
@ -45,7 +34,7 @@ export default function FlowLine({ FLOW_LINE_REF }) {
<div className="eaves-keraba-td">
<div className="outline-form">
<div className="input-grid mr5" style={{ width: '100px' }}>
<input type="text" className="input-origin block" readOnly={true} ref={FLOW_LINE_REF.DOWN_LEFT_INPUT_REF} />
{/*<input type="text" className="input-origin block" readOnly={true} ref={FLOW_LINE_REF.POINTER_INPUT_REF} />*/}
</div>
</div>
</div>
@ -68,12 +57,7 @@ export default function FlowLine({ FLOW_LINE_REF }) {
<div className="eaves-keraba-td">
<div className="outline-form">
<div className="input-grid mr5" style={{ width: '100px' }}>
<input
type="text"
className="input-origin block"
readOnly={type !== FLOW_LINE_TYPE.UP_RIGHT}
ref={FLOW_LINE_REF.UP_RIGHT_INPUT_REF}
/>
<input type="text" className="input-origin block" ref={FLOW_LINE_REF.FILLED_INPUT_REF} />
</div>
<span className="thin">mm</span>
</div>

30
src/components/main/ChangePasswordPop.jsx
View File

@ -72,21 +72,25 @@ export default function ChangePasswordPop(props) {
chgPwd: _password1,
}
await patch({ url: '/api/login/v1.0/user/change-password', data: param }).then((res) => {
if (res.result.code === 200) {
if (res.result.resultCode === 'S') {
alert(getMessage('main.popup.login.success'))
setSessionState({ ...sessionState, pwdInitYn: 'Y' })
//메인으로 이동
props.setChagePasswordPopOpen(false)
router.push('/')
await patch({ url: '/api/login/v1.0/user/change-password', data: param })
.then((res) => {
if (res?.result?.code === 200) {
if (res?.result?.resultCode === 'S') {
alert(getMessage('main.popup.login.success'))
//로그인 화면으로 이동해서 다시 로그인해야되서 setSessionState필요없음
// setSessionState({ ...sessionState, pwdInitYn: 'Y' })
props.setChagePasswordPopOpen(false)
router.push('/login')
} else {
alert(res?.result?.resultMsg)
}
} else {
alert(res.result.resultMsg)
console.log('code not 200 error')
}
} else {
console.log('error')
}
})
})
.catch((error) => {
console.log('catch::::::::', error)
})
}
return (

263
src/hooks/roofcover/useMovementSetting.js
View File

@ -4,8 +4,7 @@ import { usePopup } from '@/hooks/usePopup'
import { useMessage } from '@/hooks/useMessage'
import { useEffect, useRef, useState } from 'react'
import { useEvent } from '@/hooks/useEvent'
import { POLYGON_TYPE } from '@/common/common'
import { OUTER_LINE_TYPE } from '@/store/outerLineAtom'
import { LINE_TYPE, POLYGON_TYPE } from '@/common/common'
//동선이동 형 올림 내림
export function useMovementSetting(id) {
@ -28,8 +27,8 @@ export function useMovementSetting(id) {
const typeRef = useRef(type)
const FLOW_LINE_REF = {
DOWN_LEFT_INPUT_REF: useRef(null),
UP_RIGHT_INPUT_REF: useRef(null),
POINTER_INPUT_REF: useRef(null),
FILLED_INPUT_REF: useRef(null),
DOWN_LEFT_RADIO_REF: useRef(null),
UP_RIGHT_RADIO_REF: useRef(null),
}
@ -42,37 +41,42 @@ export function useMovementSetting(id) {
}
useEffect(() => {
removeFlowLine()
typeRef.current = type
const outerLines = canvas.getObjects().filter((obj) => obj.name === 'outerLine') // 기존 outerLine의 selectable true
outerLines.forEach((line) => {
line.set({ stroke: 'black' })
line.set({ visible: false })
})
canvas.getObjects().forEach((obj) => {
obj.set({ selectable: false })
})
const roofs = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.ROOF) // 기존 wallLine의 visible false
roofs.forEach((roof) => {
roof.set({ selectable: false })
roof.set({ strokeWidth: 1 })
roof.set({ stroke: '#000000' })
roof.innerLines.forEach((line) => {
line.bringToFront()
line.set({ selectable: false })
line.set({ strokeWidth: 1 })
line.set({ stroke: '#000000' })
})
roof.separatePolygon?.forEach((polygon) => {
polygon.bringToFront()
polygon.set({ selectable: false })
polygon.set({ strokeWidth: 1 })
polygon.set({ stroke: '#000000' })
})
})
if (type === TYPE.FLOW_LINE) {
roofs.forEach((roof) => {
roof.innerLines.forEach((line) => {
line.bringToFront()
line.set({ selectable: true })
line.set({ strokeWidth: 4 })
if (line.name === LINE_TYPE.SUBLINE.RIDGE) {
line.bringToFront()
line.set({ selectable: true })
line.set({ strokeWidth: 4 })
line.set({ stroke: '#1083E3' })
}
})
})
} else if (type === TYPE.UP_DOWN) {
const outerLines = canvas.getObjects().filter((obj) => obj.name === 'outerLine') // 기존 outerLine의 selectable true
outerLines.forEach((line) => {
line.set({ stroke: 'black' })
line.set({ visible: true })
const wallLine = canvas.getObjects().filter((obj) => obj.name === 'wallLine') // 기존 outerLine의 selectable true
wallLine.forEach((line) => {
line.bringToFront()
line.set({ selectable: true })
})
@ -81,26 +85,48 @@ export function useMovementSetting(id) {
}, [type])
useEffect(() => {
/*const wallLines = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.WALL) // 기존 wallLine의 visible false
wallLines.forEach((line) => {
line.set({ visible: false })
})*/
canvas.renderAll()
addCanvasMouseEventListener('mouse:move', mouseMoveEvent)
addCanvasMouseEventListener('mouse:down', mouseDownEvent)
return () => {
initEvent()
removeFlowLine()
const wallLines = canvas.getObjects().filter((obj) => obj.name === POLYGON_TYPE.WALL)
wallLines.forEach((line) => {
line.set({ visible: true })
})
const outerLines = canvas.getObjects().filter((obj) => obj.name === 'outerLine') // 기존 outerLine의 selectable true
outerLines.forEach((line) => {
line.set({ stroke: 'black' })
line.set({ visible: false })
const wallLine = canvas.getObjects().filter((obj) => obj.name === 'wallLine') // 기존 outerLine의 selectable true
wallLine.forEach((line) => {
let wallStroke, wallStrokeWidth
switch (line.attributes.type) {
case LINE_TYPE.WALLLINE.EAVES:
wallStroke = '#45CD7D'
wallStrokeWidth = 4
break
case LINE_TYPE.WALLLINE.HIPANDGABLE:
wallStroke = '#45CD7D'
wallStrokeWidth = 4
break
case LINE_TYPE.WALLLINE.GABLE:
wallStroke = '#3FBAE6'
wallStrokeWidth = 4
break
case LINE_TYPE.WALLLINE.JERKINHEAD:
wallStroke = '#3FBAE6'
wallStrokeWidth = 4
break
case LINE_TYPE.WALLLINE.SHED:
wallStroke = '#000000'
wallStrokeWidth = 4
break
case LINE_TYPE.WALLLINE.WALL:
wallStroke = '#000000'
wallStrokeWidth = 4
break
}
line.set({ selectable: false, stroke: wallStroke, strokeWidth: wallStrokeWidth })
})
canvas.renderAll()
@ -108,19 +134,14 @@ export function useMovementSetting(id) {
}, [])
useEffect(() => {
const outerLines = canvas.getObjects().filter((obj) => obj.name === 'outerLine') // 기존 outerLine의 selectable true
outerLines.forEach((line) => {
line.set({ stroke: 'black' })
})
selectedObject.current = null
if (!currentObject) {
return
}
clearRef()
selectedObject.current = currentObject
if (currentObject.name === OUTER_LINE_TYPE.OUTER_LINE) {
if (currentObject.name === 'wallLine') {
currentObject.set({ stroke: '#EA10AC' })
currentObject.bringToFront()
}
@ -129,34 +150,26 @@ export function useMovementSetting(id) {
const clearRef = () => {
if (type === TYPE.FLOW_LINE) {
FLOW_LINE_REF.DOWN_LEFT_INPUT_REF.current.value = ''
FLOW_LINE_REF.UP_RIGHT_INPUT_REF.current.value = ''
FLOW_LINE_REF.DOWN_LEFT_RADIO_REF.current.checked = false
FLOW_LINE_REF.FILLED_INPUT_REF.current.value = ''
FLOW_LINE_REF.DOWN_LEFT_RADIO_REF.current.checked = true
FLOW_LINE_REF.UP_RIGHT_RADIO_REF.current.checked = false
}
if (type === TYPE.UP_DOWN) {
UP_DOWN_REF.UP_INPUT_REF.current.value = ''
UP_DOWN_REF.DOWN_INPUT_REF.current.value = ''
UP_DOWN_REF.UP_RADIO_REF.current.checked = false
UP_DOWN_REF.UP_RADIO_REF.current.checked = true
UP_DOWN_REF.DOWN_RADIO_REF.current.checked = false
}
}
const mouseDownEvent = (e) => {
if (typeRef.current === TYPE.FLOW_LINE) {
flowLineDownEvent(e)
saveFlowLine(e)
} else {
updownDownEvent(e)
}
}
const removeFlowLine = () => {
const flowLine = canvas.getObjects().filter((obj) => obj.name === 'flowLine')
flowLine.forEach((line) => {
canvas.remove(line)
})
}
const mouseMoveEvent = (e) => {
if (typeRef.current === TYPE.FLOW_LINE) {
flowLineMoveEvent(e)
@ -165,61 +178,92 @@ export function useMovementSetting(id) {
}
}
//동선 이동 마우스 클릭 이벤트
const flowLineDownEvent = (e) => {
const saveFlowLine = (e) => {
const target = selectedObject.current
if (!target) {
return
}
const direction = target.direction
removeFlowLine()
let newPoint = []
if (direction === 'left' || direction === 'right') {
if (FLOW_LINE_REF.DOWN_LEFT_RADIO_REF.current.checked) {
newPoint = [
target.x1,
target.y1 + Number(FLOW_LINE_REF.DOWN_LEFT_INPUT_REF.current.value / 10),
target.x2,
target.y2 + Number(FLOW_LINE_REF.DOWN_LEFT_INPUT_REF.current.value / 10),
]
} else {
newPoint = [
target.x1,
target.y1 - Number(FLOW_LINE_REF.UP_RIGHT_INPUT_REF.current.value / 10),
target.x2,
target.y2 - Number(FLOW_LINE_REF.UP_RIGHT_INPUT_REF.current.value / 10),
]
}
if (Math.sign(target.x1 - target.x2) !== 0) {
newPoint = [
target.x1,
target.y1 - Number(FLOW_LINE_REF.FILLED_INPUT_REF.current.value / 10),
target.x2,
target.y2 - Number(FLOW_LINE_REF.FILLED_INPUT_REF.current.value / 10),
]
} else {
if (FLOW_LINE_REF.DOWN_LEFT_RADIO_REF.current.checked) {
newPoint = [
target.x1 - Number(FLOW_LINE_REF.DOWN_LEFT_INPUT_REF.current.value / 10),
target.y1,
target.x2 - Number(FLOW_LINE_REF.DOWN_LEFT_INPUT_REF.current.value / 10),
target.y2,
]
} else {
newPoint = [
target.x1 + Number(FLOW_LINE_REF.UP_RIGHT_INPUT_REF.current.value / 10),
target.y1,
target.x2 + Number(FLOW_LINE_REF.UP_RIGHT_INPUT_REF.current.value / 10),
target.y2,
]
}
newPoint = [
target.x1 + Number(FLOW_LINE_REF.FILLED_INPUT_REF.current.value / 10),
target.y1,
target.x2 + Number(FLOW_LINE_REF.FILLED_INPUT_REF.current.value / 10),
target.y2,
]
}
const cloned = new fabric.Line(newPoint, {
stroke: 'red',
strokeWidth: 4,
name: 'flowLine',
currentLine: target,
})
clearRef()
const cloned = new fabric.Line(newPoint, {})
let currentObject = selectedObject.current
const currentX1 = currentObject.x1,
currentY1 = currentObject.y1,
currentX2 = currentObject.x2,
currentY2 = currentObject.y2
const roof = canvas.getObjects().find((obj) => obj.id === currentObject.attributes.roofId)
if (roof.separatePolygon.length > 0) {
const separatePolygon = roof.separatePolygon
separatePolygon
.filter((polygon) =>
polygon.points.some((point) => (point.x === currentX1 && point.y === currentY1) || (point.x === currentX2 && point.y === currentY2)),
)
.forEach((polygon) => {
const newPoints = polygon.points.map((point) => {
if (point.x === currentX1 && point.y === currentY1) {
return { x: newPoint[0], y: newPoint[1] }
} else if (point.x === currentX2 && point.y === currentY2) {
return { x: newPoint[2], y: newPoint[3] }
} else {
return point
}
})
polygon.set({ points: newPoints })
})
} else {
roof.innerLines
.filter((line) => currentObject !== line)
.filter(
(line) =>
(line.x1 === currentX1 && line.y1 === currentY1) ||
(line.x2 === currentX1 && line.y2 === currentY1) ||
(line.x1 === currentX2 && line.y1 === currentY2) ||
(line.x2 === currentX2 && line.y2 === currentY2),
)
.forEach((line) => {
console.log('line : ', line)
if (line.x1 === currentX1 && line.y1 === currentY1) {
line.set({ x1: newPoint[0], y1: newPoint[1] })
} else if (line.x2 === currentX1 && line.y2 === currentY1) {
line.set({ x2: newPoint[0], y2: newPoint[1] })
} else if (line.x1 === currentX2 && line.y1 === currentY2) {
line.set({ x1: newPoint[2], y1: newPoint[3] })
} else if (line.x2 === currentX2 && line.y2 === currentY2) {
line.set({ x2: newPoint[2], y2: newPoint[3] })
}
line.setCoords()
})
}
currentObject.set({ x1: cloned.x1, y1: cloned.y1, x2: cloned.x2, y2: cloned.y2 })
currentObject.setCoords()
console.log('currentObject : ', currentObject.x1, currentObject.y1, currentObject.x2, currentObject.y2)
canvas.add(cloned)
canvas.renderAll()
canvas.discardActiveObject()
if (roof.separatePolygon.length > 0) {
console.log('roof.separatePolygon : ', roof.separatePolygon)
}
}
//형 올림내림 마우스 클릭 이벤트
@ -231,35 +275,25 @@ export function useMovementSetting(id) {
if (!target) {
return
}
const direction = target.direction
const { top: targetTop, left: targetLeft } = target
const currentX = canvas.getPointer(e.e).x
const currentY = Math.floor(canvas.getPointer(e.e).y)
if (direction === 'left' || direction === 'right') {
if (Math.sign(target.x1 - target.x2) !== 0) {
if (targetTop > currentY) {
console.log('targetTop > currentY')
FLOW_LINE_REF.UP_RIGHT_RADIO_REF.current.checked = true
FLOW_LINE_REF.DOWN_LEFT_INPUT_REF.current.value = ''
FLOW_LINE_REF.UP_RIGHT_INPUT_REF.current.value = Math.floor((Number(Math.abs(targetTop - currentY)) / 10000).toFixed(5) * 100000)
FLOW_LINE_REF.FILLED_INPUT_REF.current.value = Math.floor((Number(Math.round(targetTop - currentY)) / 10000).toFixed(5) * 100000)
} else {
FLOW_LINE_REF.DOWN_LEFT_RADIO_REF.current.checked = true
FLOW_LINE_REF.UP_RIGHT_INPUT_REF.current.value = ''
FLOW_LINE_REF.DOWN_LEFT_INPUT_REF.current.value = Math.floor((Number(Math.abs(targetTop - currentY)) / 10000).toFixed(5) * 100000)
FLOW_LINE_REF.FILLED_INPUT_REF.current.value = Math.floor((Number(Math.round(targetTop - currentY)) / 10000).toFixed(5) * 100000)
}
} else {
if (targetLeft > currentX) {
FLOW_LINE_REF.DOWN_LEFT_RADIO_REF.current.checked = true
FLOW_LINE_REF.UP_RIGHT_INPUT_REF.current.value = ''
FLOW_LINE_REF.DOWN_LEFT_INPUT_REF.current.value = Math.floor((Number(Math.abs(targetLeft - currentX)) / 10000).toFixed(5) * 100000)
} else {
FLOW_LINE_REF.UP_RIGHT_RADIO_REF.current.checked = true
FLOW_LINE_REF.DOWN_LEFT_INPUT_REF.current.value = ''
FLOW_LINE_REF.UP_RIGHT_INPUT_REF.current.value = Math.floor((Number(Math.abs(targetLeft - currentX)) / 10000).toFixed(5) * 100000)
FLOW_LINE_REF.FILLED_INPUT_REF.current.value = Math.floor((Number(Math.round(currentX - targetLeft)) / 10000).toFixed(5) * 100000)
} else {
FLOW_LINE_REF.DOWN_LEFT_RADIO_REF.current.checked = true
FLOW_LINE_REF.FILLED_INPUT_REF.current.value = Math.floor((Number(Math.round(currentX - targetLeft)) / 10000).toFixed(5) * 100000)
}
}
@ -307,24 +341,7 @@ export function useMovementSetting(id) {
const handleSave = () => {
if (type === TYPE.FLOW_LINE) {
const flowLine = canvas.getObjects().find((obj) => obj.name === 'flowLine')
const currentLine = flowLine.currentLine
if (!flowLine || !currentLine) {
return
}
currentLine.set({
x1: flowLine.x1,
y1: flowLine.y1,
x2: flowLine.x2,
y2: flowLine.y2,
})
currentLine.startPoint = { x: flowLine.x1, y: flowLine.y1 }
currentLine.endPoint = { x: flowLine.x2, y: flowLine.y2 }
canvas.remove(flowLine)
canvas.renderAll()
saveFlowLine()
} else {
// 형 올림내림
if (UP_DOWN_REF.UP_RADIO_REF.current.checked) {

3
src/hooks/useMode.js
View File

@ -1806,7 +1806,8 @@ export function useMode() {
break
}
const wallLine = new fabric.Line([line.x1, line.y1, line.x2, line.y2], {
attributes: { wallId: wall.id },
name: 'wallLine',
attributes: { wallId: wall.id, roofId: roof.id },
stroke: wallStroke,
strokeWidth: wallStrokeWidth,
selectable: false,

1093
src/util/qpolygon-utils.js
View File

File diff suppressed because it is too large Load Diff