From 66b95b565c3d271a2212254ff21dd9d3657aa180 Mon Sep 17 00:00:00 2001
From: "hyojun.choi" <chlgkwk123@nate.com>
Date: Mon, 10 Feb 2025 17:03:43 +0900
Subject: [PATCH] =?UTF-8?q?=EC=A7=80=EC=A7=80=EA=B8=88=EA=B5=AC=20?=
 =?UTF-8?q?=EC=84=A4=EC=B9=98=20=EC=9C=84=EC=B9=98=20=EC=A1=B0=EC=A0=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/hooks/module/useTrestle.js | 18 ++++++++++++------
 1 file changed, 12 insertions(+), 6 deletions(-)

diff --git a/src/hooks/module/useTrestle.js b/src/hooks/module/useTrestle.js
index c7c67d70..ff13e305 100644
--- a/src/hooks/module/useTrestle.js
+++ b/src/hooks/module/useTrestle.js
@@ -1171,7 +1171,7 @@ export const useTrestle = () => {
                   seq,
                   smartRackId,
                   rackId: itemId,
-                  direction: 'right',
+                  direction: 'bottom',
                 })
                 canvas.add(rack)
                 canvas.renderAll()
@@ -1231,16 +1231,17 @@ export const useTrestle = () => {
     canvas.renderAll()
 
     racks.forEach((rack) => {
-      const { x1, y1, x2, y2, direction, supFitQty, supFitIntvlPct, rackLen, name } = rack
+      let { x1, y1, x2, y2, direction, supFitQty, supFitIntvlPct, rackLen, name } = rack
 
       const bracketLength = 10
 
       if (direction === 'top') {
         const result = getBracketPoints(supFitQty, supFitIntvlPct)
         result.forEach((percent) => {
+          const len = name === 'smartRack' ? y2 - (y2 - y1) * percent - bracketLength / 2 : y2 - (y2 - y1) * percent - bracketLength / 2
           const bracket = new fabric.Rect({
             left: x2 - bracketLength / 3,
-            top: name === 'smartRack' ? y2 + rackLen * percent : y2 + (rackLen / 10) * percent,
+            top: len,
             fill: 'green',
             name: 'bracket',
             parentId: rack.parentId,
@@ -1258,8 +1259,10 @@ export const useTrestle = () => {
         const result = getBracketPoints(supFitQty, supFitIntvlPct)
 
         result.forEach((percent) => {
+          const len =
+            name === 'smartRack' ? x1 - Math.abs(x2 - x1) * percent - bracketLength / 2 : x1 - Math.abs(x2 - x1) * percent - bracketLength / 2
           const bracket = new fabric.Rect({
-            left: name === 'smartRack' ? x2 + rackLen * percent : x2 + (rackLen / 10) * percent,
+            left: len,
             top: y2 - bracketLength / 3,
             fill: 'green',
             name: 'bracket',
@@ -1278,8 +1281,10 @@ export const useTrestle = () => {
         const result = getBracketPoints(supFitQty, supFitIntvlPct)
 
         result.forEach((percent) => {
+          const len =
+            name === 'smartRack' ? x2 - Math.abs(x2 - x1) * percent - bracketLength / 2 : x2 - Math.abs(x2 - x1) * percent - bracketLength / 2
           const bracket = new fabric.Rect({
-            left: name === 'smartRack' ? x2 - rackLen * percent : x2 - (rackLen / 10) * percent,
+            left: len,
             top: y2 - bracketLength / 3,
             fill: 'green',
             parentId: rack.parentId,
@@ -1298,9 +1303,10 @@ export const useTrestle = () => {
         const result = getBracketPoints(supFitQty, supFitIntvlPct)
 
         result.forEach((percent) => {
+          const len = name === 'smartRack' ? y2 - (y2 - y1) * percent - bracketLength / 2 : y2 - (y2 - y1) * percent - bracketLength / 2
           const bracket = new fabric.Rect({
             left: x2 - bracketLength / 3,
-            top: name === 'smartRack' ? y2 - rackLen * percent : y2 - (rackLen / 10) * percent,
+            top: len,
             fill: 'green',
             name: 'bracket',
             parentId: rack.parentId,