diff --git a/src/components/fabric/QLine.js b/src/components/fabric/QLine.js index e9049ca8..7881712e 100644 --- a/src/components/fabric/QLine.js +++ b/src/components/fabric/QLine.js @@ -1,6 +1,7 @@ import { fabric } from 'fabric' import { v4 as uuidv4 } from 'uuid' import { getDirectionByPoint } from '@/util/canvas-util' +import { calcLinePlaneSize } from '@/util/qpolygon-utils' export const QLine = fabric.util.createClass(fabric.Line, { type: 'QLine', @@ -31,14 +32,16 @@ export const QLine = fabric.util.createClass(fabric.Line, { this.direction = options.direction ?? getDirectionByPoint({ x: this.x1, y: this.y1 }, { x: this.x2, y: this.y2 }) this.textMode = options.textMode ?? 'plane' // plane:복시도, actual:실측, none:표시안함 this.textVisible = options.textVisible ?? true - if (length !== 0) { - this.length = length - } else { - this.setLength() - } this.startPoint = { x: this.x1, y: this.y1 } this.endPoint = { x: this.x2, y: this.y2 } + try { + this.setLength() + } catch (e) { + setTimeout(() => { + this.setLength() + }, 100) + } }, init: function () { @@ -66,23 +69,7 @@ export const QLine = fabric.util.createClass(fabric.Line, { }, setLength() { - if (this.attributes?.actualSize !== undefined && this.attributes?.planeSize !== undefined) { - if (this.textMode === 'plane') { - this.length = this.attributes.planeSize / 10 - } else if (this.textMode === 'actual') { - this.length = this.attributes.actualSize / 10 - } - } else { - const scaleX = this.scaleX - const scaleY = this.scaleY - const x1 = this.left - const y1 = this.top - const x2 = this.left + this.width * scaleX - const y2 = this.top + this.height * scaleY - const dx = x2 - x1 - const dy = y2 - y1 - this.length = Number(Math.sqrt(dx * dx + dy * dy).toFixed(1)) - } + this.length = calcLinePlaneSize(this) / 10 }, addLengthText() { diff --git a/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx b/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx index 2ab64736..d6bab594 100644 --- a/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx +++ b/src/components/floor-plan/modal/placementShape/PlacementShapeSetting.jsx @@ -20,6 +20,7 @@ import { canvasState } from '@/store/canvasAtom' import { useRoofFn } from '@/hooks/common/useRoofFn' import { usePlan } from '@/hooks/usePlan' import { normalizeDecimal, normalizeDigits } from '@/util/input-utils' +import { logger } from '@/util/logger' /** * 지붕 레이아웃 @@ -207,6 +208,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla * 배치면초기설정 저장 버튼 클릭 */ const handleSaveBtn = async () => { + const roofInfo = { ...currentRoof, planNo: basicSetting.planNo, @@ -224,7 +226,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla newAddedRoofs[0] = { ...roofInfo } setAddedRoofs(newAddedRoofs) - console.log('save Info', { + logger.debug('save Info', { ...basicSetting, selectedRoofMaterial: { ...newAddedRoofs[0], diff --git a/src/hooks/option/useCanvasSetting.js b/src/hooks/option/useCanvasSetting.js index 150d53f4..e2742ff2 100644 --- a/src/hooks/option/useCanvasSetting.js +++ b/src/hooks/option/useCanvasSetting.js @@ -527,7 +527,7 @@ export function useCanvasSetting(executeEffect = true) { roofGap: params.selectedRoofMaterial.raft === null || params.selectedRoofMaterial.raft === undefined ? params.selectedRoofMaterial.raftBaseCd - : params.roofsData.raft, + : params.roofsData.roofGap, roofLayout: params.roofsData.roofLayout === null || params.roofsData.roofLayout === undefined ? 'P' : params.roofsData.roofLayout, roofPitch: params.roofsData.roofPitch === null || params.roofsData.roofPitch === undefined || params.roofsData.roofPitch === '' diff --git a/src/hooks/usePolygon.js b/src/hooks/usePolygon.js index 86c9a2b9..12d7e188 100644 --- a/src/hooks/usePolygon.js +++ b/src/hooks/usePolygon.js @@ -230,28 +230,28 @@ export const usePolygon = () => { case 'south': // lines중 가장 아래에 있는 라인을 찾는다. const line = lines.reduce((acc, cur) => { - return acc.y2 > cur.y2 ? acc : cur + return acc.y2 + acc.y1 > cur.y2 + cur.y1 ? acc : cur }, lines[0]) centerPoint = { x: (line.x2 + line.x1) / 2, y: Math.max(line.y1, line.y2) } break case 'north': // lines중 가장 위에 있는 라인을 찾는다. const line2 = lines.reduce((acc, cur) => { - return acc.y2 < cur.y2 ? acc : cur + return acc.y2 + acc.y1 < cur.y2 + cur.y1 ? acc : cur }, lines[0]) centerPoint = { x: (line2.x2 + line2.x1) / 2, y: Math.min(line2.y1, line2.y2) } break case 'west': // lines중 가장 왼쪽에 있는 라인을 찾는다. const line3 = lines.reduce((acc, cur) => { - return acc.x2 < cur.x2 ? acc : cur + return acc.x2 + acc.x1 < cur.x2 + cur.x1 ? acc : cur }, lines[0]) centerPoint = { x: Math.min(line3.x1, line3.x2), y: (line3.y1 + line3.y2) / 2 } break case 'east': // lines중 가장 오른쪽에 있는 라인을 찾는다. const line4 = lines.reduce((acc, cur) => { - return acc.x2 > cur.x2 ? acc : cur + return acc.x2 + acc.x1 > cur.x2 + cur.x1 ? acc : cur }, lines[0]) centerPoint = { x: Math.max(line4.x1, line4.x2), y: (line4.y1 + line4.y2) / 2 } break