From 470104f05883b6b4912f66ebabbd5c2dfc5869e7 Mon Sep 17 00:00:00 2001
From: "hyojun.choi" <chlgkwk123@nate.com>
Date: Thu, 19 Sep 2024 16:45:41 +0900
Subject: [PATCH] =?UTF-8?q?=EC=A0=90=202=EA=B0=9C=20=EC=9D=B4=EC=83=81=20?=
 =?UTF-8?q?=EC=83=9D=EC=84=B1=20=EC=8B=9C=20guide=20line=20=EC=B6=94?=
 =?UTF-8?q?=EA=B0=80?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../modal/outerlinesetting/OuterLineWall.jsx  | 50 ++++++++++++++++++-
 1 file changed, 49 insertions(+), 1 deletion(-)

diff --git a/src/components/floor-plan/modal/outerlinesetting/OuterLineWall.jsx b/src/components/floor-plan/modal/outerlinesetting/OuterLineWall.jsx
index ba50f80d..01c621d1 100644
--- a/src/components/floor-plan/modal/outerlinesetting/OuterLineWall.jsx
+++ b/src/components/floor-plan/modal/outerlinesetting/OuterLineWall.jsx
@@ -116,6 +116,12 @@ export default function OuterLineWall(props) {
         canvas?.remove(obj)
         removeLineText(obj)
       })
+
+    canvas
+      ?.getObjects()
+      .filter((obj) => obj.name === 'helpGuideLine' || (obj.name === 'lengthTxt' && obj.parent?.name === 'helpGuideLine'))
+      .forEach((obj) => canvas?.remove(obj))
+
     canvas?.remove(canvas?.getObjects().find((obj) => obj.name === 'startPoint'))
 
     // point가 변경 될때마다 이벤트 리스너를 제거하고 다시 등록
@@ -145,13 +151,55 @@ export default function OuterLineWall(props) {
         }
         drawLine(points[idx - 1], point, idx)
       })
+
+      const lastPoint = points[points.length - 1]
+      const firstPoint = points[0]
+
+      if (points.length < 3) {
+        return
+      }
+
+      if (lastPoint.x === firstPoint.x && lastPoint.y === firstPoint.y) {
+        return
+      }
+
+      if (lastPoint.x === firstPoint.x || lastPoint.y === firstPoint.y) {
+        const line = new QLine([lastPoint.x, lastPoint.y, firstPoint.x, firstPoint.y], {
+          stroke: 'grey',
+          strokeWidth: 1,
+          selectable: false,
+          name: 'helpGuideLine',
+        })
+
+        canvas?.add(line)
+        addLineText(line)
+      } else {
+        const guideLine1 = new QLine([lastPoint.x, lastPoint.y, lastPoint.x, firstPoint.y], {
+          stroke: 'grey',
+          strokeWidth: 1,
+          strokeDashArray: [1, 1, 1],
+          name: 'helpGuideLine',
+        })
+
+        const guideLine2 = new QLine([guideLine1.x2, guideLine1.y2, firstPoint.x, firstPoint.y], {
+          stroke: 'grey',
+          strokeWidth: 1,
+          strokeDashArray: [1, 1, 1],
+          name: 'helpGuideLine',
+        })
+        canvas?.add(guideLine1)
+        canvas?.add(guideLine2)
+
+        addLineText(guideLine1)
+        addLineText(guideLine2)
+      }
     }
   }, [points])
 
   const drawLine = (point1, point2, idx) => {
     const line = new QLine([point1.x, point1.y, point2.x, point2.y], {
       stroke: 'black',
-      strokeWidth: 1,
+      strokeWidth: 3,
       idx: idx,
       selectable: false,
       name: 'outerLine',