모듈 자동설치 관련 작업

src/hooks/module/useModuleBasicSetting.js

@@ -9,9 +9,9 @@ import { QLine } from '@/components/fabric/QLine'
 import { moduleSetupSurfaceState, moduleIsSetupState } from '@/store/canvasAtom'
 import { useEvent } from '@/hooks/useEvent'
 import { POLYGON_TYPE, BATCH_TYPE } from '@/common/common'
-
 import * as turf from '@turf/turf'
 import { EventContext } from '@/app/floor-plan/EventProvider'
+import { v4 as uuidv4 } from 'uuid'
 
 export function useModuleBasicSetting() {
   const canvas = useRecoilValue(canvasState)
@@ -20,7 +20,6 @@ export function useModuleBasicSetting() {
   const [moduleIsSetup, setModuleIsSetup] = useRecoilState(moduleIsSetupState)
   const { addTargetMouseEventListener, addCanvasMouseEventListener, initEvent } = useEvent()
   // const { addTargetMouseEventListener, addCanvasMouseEventListener, initEvent } = useContext(EventContext)
-  const [flowModuleLine, setFlowModuleLine] = useState({})
   let selectedModuleInstSurfaceArray = []
 
   const makeModuleInstArea = () => {
@@ -35,6 +34,9 @@ export function useModuleBasicSetting() {
       setSurfaceShapePattern(roof, roofDisplay.column, true) //패턴 변경
       const offsetPoints = offsetPolygon(roof.points, -20) //안쪽 offset
       //모듈설치영역?? 생성
+
+      const surfaceId = uuidv4()
+
       let setupSurface = new QPolygon(offsetPoints, {
         stroke: 'red',
         fill: 'transparent',
@@ -51,15 +53,20 @@ export function useModuleBasicSetting() {
         flowDirection: roof.direction,
         flipX: roof.flipX,
         flipY: roof.flipY,
+        surfaceId: surfaceId,
       })
 
       setupSurface.setViewLengthText(false)
       canvas.add(setupSurface) //모듈설치면 만들기
 
       if (setupSurface.flowDirection === 'south' || setupSurface.flowDirection === 'north') {
-        setFlowModuleLine(bottomTopFlowLine(setupSurface))
+        setupSurface.set({
+          flowLines: bottomTopFlowLine(setupSurface),
+        })
       } else {
-        setFlowModuleLine(leftRightFlowLine(setupSurface))
+        setupSurface.set({
+          flowLines: leftRightFlowLine(setupSurface),
+        })
       }
 
       //지붕면 선택 금지
@@ -423,6 +430,13 @@ export function useModuleBasicSetting() {
       })
     }
 
+    //어짜피 자동으로 누르면 선택안된데도 다 날아간다
+    canvas.getObjects().forEach((obj) => {
+      if (obj.name === 'module') {
+        canvas.remove(obj)
+      }
+    })
+
     notSelectedTrestlePolygons.forEach((obj) => {
       if (obj.modules) {
         obj.modules.forEach((module) => {
@@ -437,16 +451,18 @@ export function useModuleBasicSetting() {
       stroke: 'black',
       strokeWidth: 0.1,
       selectable: false, // 선택 가능하게 설정
-      lockMovementX: false, // X 축 이동 잠금
+      lockMovementX: true, // X 축 이동 잠금
-      lockMovementY: false, // Y 축 이동 잠금
+      lockMovementY: true, // Y 축 이동 잠금
-      lockRotation: false, // 회전 잠금
+      lockRotation: true, // 회전 잠금
-      lockScalingX: false, // X 축 크기 조정 잠금
+      lockScalingX: true, // X 축 크기 조정 잠금
-      lockScalingY: false, // Y 축 크기 조정 잠금
+      lockScalingY: true, // Y 축 크기 조정 잠금
       opacity: 0.8,
       parentId: moduleSetupSurface.parentId,
       name: 'module',
     }
 
+    let leftMargin, bottomMargin, square, chidoriLength
+
     //선택된 지붕안에 오브젝트(도머, 개구등)이 있는지 확인하는 로직 포함되면 배열 반환
     const objectsIncludeSurface = (turfModuleSetupSurface) => {
       let containsBatchObjects = []
@@ -510,6 +526,173 @@ export function useModuleBasicSetting() {
       return turf.booleanContains(turfModuleSetupSurface, squarePolygon) || turf.booleanWithin(squarePolygon, turfModuleSetupSurface)
     }
 
+    const downFlowSetupModule = (surfaceMaxLines, width, height, moduleSetupArray, flowModuleLine) => {
+      const maxLeftEndPoint = surfaceMaxLines.left.x1 //최 좌측
+      const maxRightEndPoint = surfaceMaxLines.right.x1 //최 우측
+      const maxTopEndPoint = surfaceMaxLines.top.y1 //최 상단
+
+      let startPoint = flowModuleLine.find((obj) => obj.target === 'bottom')
+
+      let totalLeftEndPoint = maxLeftEndPoint - startPoint.x1
+      let totalTopEndPoint = maxTopEndPoint - startPoint.y1
+      let totalWidth = Math.ceil(Math.abs(maxRightEndPoint - maxLeftEndPoint) / width)
+      let diffLeftEndPoint = Math.abs(totalLeftEndPoint / width)
+      let diffTopEndPoint = Math.abs(totalTopEndPoint / height)
+      let startColPoint = Math.abs(width * Math.ceil(diffLeftEndPoint) - startPoint.x1)
+
+      for (let j = 0; j < diffTopEndPoint; j++) {
+        bottomMargin = j === 0 ? 1 : 0
+        for (let i = 0; i <= totalWidth; i++) {
+          leftMargin = i === 0 ? 1 : 0 //숫자가 0이면 0, 1이면 1로 바꾸기
+          chidoriLength = 0
+          if (isChidori) {
+            chidoriLength = j % 2 === 0 ? 0 : width / 2
+          }
+
+          square = [
+            [startColPoint + width * i - chidoriLength, startPoint.y1 - height * j - bottomMargin],
+            [startColPoint + width * i + width - chidoriLength, startPoint.y1 - height * j - bottomMargin],
+            [startColPoint + width * i + width - chidoriLength, startPoint.y1 - height * j - height - bottomMargin],
+            [startColPoint + width * i - chidoriLength, startPoint.y1 - height * j - height - bottomMargin],
+            [startColPoint + width * i - chidoriLength, startPoint.y1 - height * j - bottomMargin],
+          ]
+
+          let squarePolygon = turf.polygon([square])
+          let turfCoordnates = squarePolygon.geometry.coordinates[0].slice(0, -1)
+          let points = turfCoordnates.map((coord) => ({ x: coord[0], y: coord[1] }))
+
+          // if (disjointFromTrestle && isDisjoint) {
+          let tempModule = new QPolygon(points, { ...moduleOptions, turfPoints: squarePolygon })
+          canvas?.add(tempModule)
+          moduleSetupArray.push(tempModule)
+        }
+      }
+    }
+
+    const leftFlowSetupModule = (surfaceMaxLines, width, height, moduleSetupArray, flowModuleLine) => {
+      let startPoint = flowModuleLine.find((obj) => obj.target === 'left')
+
+      const maxRightEndPoint = surfaceMaxLines.right.x1 //최 우측
+      const maxTopEndPoint = surfaceMaxLines.top.y1 //최 상단
+      const maxBottomEndPoint = surfaceMaxLines.bottom.y1 //최하단
+      let totalTopEndPoint = Math.abs(maxTopEndPoint - startPoint.y1) //전체 높이에서 현재 높이를 뺌
+      let diffTopEndPoint = Math.abs(totalTopEndPoint / height)
+      let totalHeight = Math.ceil(Math.abs(maxBottomEndPoint - maxTopEndPoint) / height)
+      let totalWidth = Math.abs(startPoint.x1 - maxRightEndPoint) / width
+      let startRowPoint = startPoint.y1 - height * Math.ceil(diffTopEndPoint)
+
+      for (let j = 0; j < totalHeight; j++) {
+        bottomMargin = j === 0 ? 1 : 0
+        for (let i = 0; i <= totalWidth; i++) {
+          leftMargin = 1
+          chidoriLength = 0
+          if (isChidori) {
+            chidoriLength = i % 2 === 0 ? 0 : height / 2
+          }
+
+          square = [
+            [startPoint.x1 + width * i + leftMargin, startRowPoint + height * j + bottomMargin - chidoriLength],
+            [startPoint.x1 + width * i + width + leftMargin, startRowPoint + height * j + bottomMargin - chidoriLength],
+            [startPoint.x1 + width * i + width + leftMargin, startRowPoint + height * j + height + bottomMargin - chidoriLength],
+            [startPoint.x1 + width * i + leftMargin, startRowPoint + height * j + height + bottomMargin - chidoriLength],
+            [startPoint.x1 + width * i + leftMargin, startRowPoint + height * j + bottomMargin - chidoriLength],
+          ]
+
+          console.log('square', square)
+
+          let squarePolygon = turf.polygon([square])
+          let turfCoordnates = squarePolygon.geometry.coordinates[0].slice(0, -1)
+          let points = turfCoordnates.map((coord) => ({ x: coord[0], y: coord[1] }))
+
+          // if (disjointFromTrestle && isDisjoint) {
+          let tempModule = new QPolygon(points, { ...moduleOptions, turfPoints: squarePolygon })
+          canvas?.add(tempModule)
+          moduleSetupArray.push(tempModule)
+        }
+      }
+    }
+
+    const topFlowSetupModule = (surfaceMaxLines, width, height, moduleSetupArray, flowModuleLine) => {
+      let startPoint = flowModuleLine.find((obj) => obj.target === 'top')
+      const maxLeftEndPoint = surfaceMaxLines.left.x1 //최 좌측
+      const maxRightEndPoint = surfaceMaxLines.right.x1 //최 우측
+
+      const maxBottomEndPoint = surfaceMaxLines.bottom.y1 //최하단
+      let totalLeftEndPoint = maxLeftEndPoint - startPoint.x1
+      let totalRightEndPoint = maxLeftEndPoint - maxRightEndPoint
+      let totalBottomEndPoint = maxBottomEndPoint - startPoint.y1
+      let diffLeftEndPoint = Math.abs(totalLeftEndPoint / width)
+      let diffRightEndPoint = Math.abs(totalRightEndPoint / width)
+      let diffBottomEndPoint = Math.abs(totalBottomEndPoint / height)
+      let startColPoint = Math.abs(width * Math.ceil(diffLeftEndPoint) - startPoint.x1)
+
+      for (let j = 0; j < diffBottomEndPoint; j++) {
+        for (let i = 0; i < diffRightEndPoint; i++) {
+          chidoriLength = 0
+          if (isChidori) {
+            chidoriLength = j % 2 === 0 ? 0 : width / 2
+          }
+          square = [
+            [startColPoint + width * i + chidoriLength, startPoint.y1 + height * j + 1],
+            [startColPoint + width * i + chidoriLength, startPoint.y1 + height * j + height + 1],
+            [startColPoint + width * i + width + chidoriLength, startPoint.y1 + height * j + height + 1],
+            [startColPoint + width * i + width + chidoriLength, startPoint.y1 + height * j + 1],
+            [startColPoint + width * i + chidoriLength, startPoint.y1 + height * j + 1],
+          ]
+
+          let squarePolygon = turf.polygon([square])
+          let turfCoordnates = squarePolygon.geometry.coordinates[0].slice(0, -1)
+          let points = turfCoordnates.map((coord) => ({ x: coord[0], y: coord[1] }))
+
+          // if (disjointFromTrestle && isDisjoint) {
+          let tempModule = new QPolygon(points, { ...moduleOptions, turfPoints: squarePolygon })
+          canvas?.add(tempModule)
+          moduleSetupArray.push(tempModule)
+        }
+      }
+    }
+
+    const rightFlowSetupModule = (surfaceMaxLines, width, height, moduleSetupArray, flowModuleLine) => {
+      let startPoint = flowModuleLine.find((obj) => obj.target === 'right')
+      const maxLeftEndPoint = surfaceMaxLines.left.x1 //최 좌측
+
+      const maxTopEndPoint = surfaceMaxLines.top.y1 //최 상단
+      const maxBottomEndPoint = surfaceMaxLines.bottom.y1 //최하단
+      let totalTopEndPoint = Math.abs(maxTopEndPoint - startPoint.y1) //전체 높이에서 현재 높이를 뺌
+      let diffTopEndPoint = Math.abs(totalTopEndPoint / height)
+      let totalHeight = Math.ceil(Math.abs(maxBottomEndPoint - maxTopEndPoint) / height)
+      let totalWidth = Math.abs(startPoint.x1 - maxLeftEndPoint) / width
+      let startRowPoint = startPoint.y1 - height * Math.ceil(diffTopEndPoint)
+
+      for (let j = 0; j < totalHeight; j++) {
+        bottomMargin = j === 0 ? 1 : 0
+        for (let i = 0; i <= totalWidth; i++) {
+          leftMargin = 1
+          chidoriLength = 0
+          if (isChidori) {
+            chidoriLength = i % 2 === 0 ? 0 : height / 2
+          }
+
+          square = [
+            [startPoint.x1 - width * i - leftMargin, startRowPoint + height * j + bottomMargin + chidoriLength],
+            [startPoint.x1 - width * i - width - leftMargin, startRowPoint + height * j + bottomMargin + chidoriLength],
+            [startPoint.x1 - width * i - width - leftMargin, startRowPoint + height * j + height + bottomMargin + chidoriLength],
+            [startPoint.x1 - width * i - leftMargin, startRowPoint + height * j + height + bottomMargin + chidoriLength],
+            [startPoint.x1 - width * i - leftMargin, startRowPoint + height * j + bottomMargin + chidoriLength],
+          ]
+
+          let squarePolygon = turf.polygon([square])
+          let turfCoordnates = squarePolygon.geometry.coordinates[0].slice(0, -1)
+          let points = turfCoordnates.map((coord) => ({ x: coord[0], y: coord[1] }))
+
+          // if (disjointFromTrestle && isDisjoint) {
+          let tempModule = new QPolygon(points, { ...moduleOptions, turfPoints: squarePolygon })
+          canvas?.add(tempModule)
+          moduleSetupArray.push(tempModule)
+        }
+      }
+    }
+
     moduleSetupSurfaces.forEach((moduleSetupSurface, index) => {
       moduleSetupSurface.fire('mousedown')
       const moduleSetupArray = []
@@ -531,166 +714,34 @@ export function useModuleBasicSetting() {
       }
 
       const surfaceMaxLines = findSetupSurfaceMaxLines(moduleSetupSurface)
-      const maxLeftEndPoint = surfaceMaxLines.left.x1 //최 좌측
-      const maxRightEndPoint = surfaceMaxLines.right.x1 //최 우측
-      const maxTopEndPoint = surfaceMaxLines.top.y1 //최 상단
-      const maxBottomEndPoint = surfaceMaxLines.bottom.y1 //최 하단
-      let leftMargin, bottomMargin, square, chidoriLength
 
       //처마면 배치
       if (setupLocation === 'eaves') {
         // 흐름방향이 남쪽일때
         if (moduleSetupSurface.flowDirection === 'south') {
-          let startPoint = flowModuleLine.find((obj) => obj.target === 'bottom')
+          downFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines)
-          let totalLeftEndPoint = maxLeftEndPoint - startPoint.x1
-          let totalTopEndPoint = maxTopEndPoint - startPoint.y1
-          let totalWidth = Math.ceil(Math.abs(maxRightEndPoint - maxLeftEndPoint) / width)
-          let diffLeftEndPoint = Math.abs(totalLeftEndPoint / width)
-          let diffTopEndPoint = Math.abs(totalTopEndPoint / height)
-          let startColPoint = Math.abs(width * Math.ceil(diffLeftEndPoint) - startPoint.x1)
-
-          for (let j = 0; j < diffTopEndPoint; j++) {
-            bottomMargin = j === 0 ? 1 : 0
-            for (let i = 0; i <= totalWidth; i++) {
-              leftMargin = i === 0 ? 1 : 0 //숫자가 0이면 0, 1이면 1로 바꾸기
-              chidoriLength = 0
-              if (isChidori) {
-                chidoriLength = j % 2 === 0 ? 0 : width / 2
-              }
-
-              square = [
-                [startColPoint + width * i - chidoriLength, startPoint.y1 - height * j - bottomMargin],
-                [startColPoint + width * i + width - chidoriLength, startPoint.y1 - height * j - bottomMargin],
-                [startColPoint + width * i + width - chidoriLength, startPoint.y1 - height * j - height - bottomMargin],
-                [startColPoint + width * i - chidoriLength, startPoint.y1 - height * j - height - bottomMargin],
-                [startColPoint + width * i - chidoriLength, startPoint.y1 - height * j - bottomMargin],
-              ]
-
-              let squarePolygon = turf.polygon([square])
-              let turfCoordnates = squarePolygon.geometry.coordinates[0].slice(0, -1)
-              let points = turfCoordnates.map((coord) => ({ x: coord[0], y: coord[1] }))
-
-              // if (disjointFromTrestle && isDisjoint) {
-              let tempModule = new QPolygon(points, { ...moduleOptions, turfPoints: squarePolygon })
-              canvas?.add(tempModule)
-              moduleSetupArray.push(tempModule)
-            }
-          }
         }
-
         if (moduleSetupSurface.flowDirection === 'west') {
-          let startPoint = flowModuleLine.find((obj) => obj.target === 'left')
+          leftFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines)
-          let totalTopEndPoint = Math.abs(maxTopEndPoint - startPoint.y1) //전체 높이에서 현재 높이를 뺌
+        }
-          let diffTopEndPoint = Math.abs(totalTopEndPoint / height)
+        if (moduleSetupSurface.flowDirection === 'east') {
-          let totalHeight = Math.ceil(Math.abs(maxBottomEndPoint - maxTopEndPoint) / height)
+          rightFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines)
-          let totalWidth = Math.abs(startPoint.x1 - maxRightEndPoint) / width
+        }
-          let startRowPoint = startPoint.y1 - height * Math.ceil(diffTopEndPoint)
+        if (moduleSetupSurface.flowDirection === 'north') {
-
+          topFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines)
-          for (let j = 0; j < totalHeight; j++) {
-            bottomMargin = j === 0 ? 1 : 0
-            for (let i = 0; i <= totalWidth; i++) {
-              leftMargin = 1
-              chidoriLength = 0
-              if (isChidori) {
-                chidoriLength = i % 2 === 0 ? 0 : height / 2
-              }
-
-              square = [
-                [startPoint.x1 + width * i + leftMargin, startRowPoint + height * j + bottomMargin - chidoriLength],
-                [startPoint.x1 + width * i + width + leftMargin, startRowPoint + height * j + bottomMargin - chidoriLength],
-                [startPoint.x1 + width * i + width + leftMargin, startRowPoint + height * j + height + bottomMargin - chidoriLength],
-                [startPoint.x1 + width * i + leftMargin, startRowPoint + height * j + height + bottomMargin - chidoriLength],
-                [startPoint.x1 + width * i + leftMargin, startRowPoint + height * j + bottomMargin - chidoriLength],
-              ]
-
-              let squarePolygon = turf.polygon([square])
-              let turfCoordnates = squarePolygon.geometry.coordinates[0].slice(0, -1)
-              let points = turfCoordnates.map((coord) => ({ x: coord[0], y: coord[1] }))
-
-              // if (disjointFromTrestle && isDisjoint) {
-              let tempModule = new QPolygon(points, { ...moduleOptions, turfPoints: squarePolygon })
-              canvas?.add(tempModule)
-              moduleSetupArray.push(tempModule)
-            }
-          }
         }
       } else if (setupLocation === 'ridge') {
         if (moduleSetupSurface.flowDirection === 'south') {
-          let startPoint = flowModuleLine.find((obj) => obj.target === 'top')
+          topFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines)
-          let totalLeftEndPoint = maxLeftEndPoint - startPoint.x1
-          let totalRightEndPoint = maxLeftEndPoint - maxRightEndPoint
-          let totalBottomEndPoint = maxBottomEndPoint - startPoint.y1
-          let diffLeftEndPoint = Math.abs(totalLeftEndPoint / width)
-          let diffRightEndPoint = Math.abs(totalRightEndPoint / width)
-          let diffBottomEndPoint = Math.abs(totalBottomEndPoint / height)
-          let startColPoint = Math.abs(width * Math.ceil(diffLeftEndPoint) - startPoint.x1)
-
-          for (let j = 0; j < diffBottomEndPoint; j++) {
-            for (let i = 0; i < diffRightEndPoint; i++) {
-              chidoriLength = 0
-              if (isChidori) {
-                chidoriLength = j % 2 === 0 ? 0 : width / 2
-              }
-              square = [
-                [startColPoint + width * i + chidoriLength, startPoint.y1 + height * j],
-                [startColPoint + width * i + chidoriLength, startPoint.y1 + height * j + height],
-                [startColPoint + width * i + width + chidoriLength, startPoint.y1 + height * j + height],
-                [startColPoint + width * i + width + chidoriLength, startPoint.y1 + height * j],
-                [startColPoint + width * i + chidoriLength, startPoint.y1 + height * j],
-              ]
-
-              let squarePolygon = turf.polygon([square])
-              let turfCoordnates = squarePolygon.geometry.coordinates[0].slice(0, -1)
-              let points = turfCoordnates.map((coord) => ({ x: coord[0], y: coord[1] }))
-
-              // if (disjointFromTrestle && isDisjoint) {
-              let tempModule = new QPolygon(points, { ...moduleOptions, turfPoints: squarePolygon })
-              canvas?.add(tempModule)
-              moduleSetupArray.push(tempModule)
-            }
-          }
         }
         if (moduleSetupSurface.flowDirection === 'west') {
-          let startPoint = flowModuleLine.find((obj) => obj.target === 'right')
+          rightFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines)
-          //계산하기 편하게 그냥 y1을 작은수로 만든다
+        }
-          let correctPoint =
+        if (moduleSetupSurface.flowDirection === 'east') {
-            startPoint.y1 > startPoint.y2
+          leftFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines)
-              ? { x1: startPoint.x2, x2: startPoint.x1, y1: startPoint.y2, y2: startPoint.y1 }
+        }
-              : { x1: startPoint.x1, x2: startPoint.x2, y1: startPoint.y1, y2: startPoint.y2 }
+        if (moduleSetupSurface.flowDirection === 'north') {
-
+          downFlowSetupModule(surfaceMaxLines, width, height, moduleSetupArray, moduleSetupSurface.flowLines)
-          let totalTopEndPoint = Math.abs(maxTopEndPoint - startPoint.y1) //전체 높이에서 현재 높이를 뺌
-          let diffTopEndPoint = Math.abs(totalTopEndPoint / height)
-          let totalHeight = Math.ceil(Math.abs(maxBottomEndPoint - maxTopEndPoint) / height)
-          let totalWidth = Math.abs(startPoint.x1 - maxLeftEndPoint) / width
-          let startRowPoint = startPoint.y1 - height * Math.ceil(diffTopEndPoint)
-
-          for (let j = 0; j < totalHeight; j++) {
-            bottomMargin = j === 0 ? 1 : 0
-            for (let i = 0; i <= totalWidth; i++) {
-              leftMargin = 1
-              chidoriLength = 0
-              if (isChidori) {
-                chidoriLength = i % 2 === 0 ? 0 : height / 2
-              }
-
-              square = [
-                [startPoint.x1 - width * i - leftMargin, startRowPoint + height * j - bottomMargin + chidoriLength],
-                [startPoint.x1 - width * i - width - leftMargin, startRowPoint + height * j - bottomMargin + chidoriLength],
-                [startPoint.x1 - width * i - width - leftMargin, startRowPoint + height * j + height - bottomMargin + chidoriLength],
-                [startPoint.x1 - width * i - leftMargin, startRowPoint + height * j + height - bottomMargin + chidoriLength],
-                [startPoint.x1 - width * i - leftMargin, startRowPoint + height * j - bottomMargin + chidoriLength],
-              ]
-
-              let squarePolygon = turf.polygon([square])
-              let turfCoordnates = squarePolygon.geometry.coordinates[0].slice(0, -1)
-              let points = turfCoordnates.map((coord) => ({ x: coord[0], y: coord[1] }))
-
-              // if (disjointFromTrestle && isDisjoint) {
-              let tempModule = new QPolygon(points, { ...moduleOptions, turfPoints: squarePolygon })
-              canvas?.add(tempModule)
-              moduleSetupArray.push(tempModule)
-            }
-          }
         }
       } else {
       }
@@ -872,9 +923,8 @@ export function useModuleBasicSetting() {
     )
     flowArray.push(topFlow)
 
-    let idx = 0
     let rtnObjArray = []
-    flowArray.forEach((center) => {
+    flowArray.forEach((center, index) => {
       const linesArray = new Array()
 
       surface.lines.filter((line) => {
@@ -926,33 +976,40 @@ export function useModuleBasicSetting() {
       })
       canvas?.add(finalLine)
       canvas?.renderAll()
-      let rtnObj
 
+      let rtnObj
+      //평평하면
       if (alpha === 0 || beta === 0 || h === 0 || sign === 0) {
         //꼭지점이 없고 평평할때 ex) 네모
         let standardLine
-        if (center.index === 0) {
+        if (index === 0) {
+          //bottom
           standardLine = surface.lines.reduce((acc, line, index) => {
-            if (line.y1 < acc.y1 || (line.y1 === acc.y1 && line.x1 < acc.x1)) {
+            if (line.y1 > acc.y1 || (line.y1 === acc.y1 && line.y2 > acc.y2)) {
               return { x1: line.x1, y1: line.y1, index: index }
             }
             return acc
           })
         } else {
           standardLine = surface.lines.reduce((acc, line, index) => {
-            if (line.y1 > acc.y1) {
+            if (line.y1 < acc.y1 || (line.y1 === acc.y1 && line.y2 < acc.y2)) {
               return { x1: line.x1, y1: line.y1, index: index }
             }
             return acc
           })
         }
-        rtnObj = { target: idx === 0 ? 'bottom' : 'top', x1: standardLine.x1, y1: pointY1, x2: standardLine.x1 + charlie, y2: pointY2 }
+        rtnObj = {
+          target: index === 0 ? 'bottom' : 'top',
+          x1: standardLine.x1,
+          y1: standardLine.y1,
+          x2: standardLine.x1 + charlie,
+          y2: standardLine.y1,
+        }
       } else {
-        rtnObj = { target: idx === 0 ? 'bottom' : 'top', x1: pointX1, y1: pointY1, x2: pointX2, y2: pointY2 }
+        rtnObj = { target: index === 0 ? 'bottom' : 'top', x1: pointX1, y1: pointY1, x2: pointX2, y2: pointY2 }
       }
 
       rtnObjArray.push(rtnObj)
-      ++idx
     })
 
     return rtnObjArray
@@ -984,7 +1041,7 @@ export function useModuleBasicSetting() {
 
     let idx = 0
     let rtnObjArray = []
-    flowArray.forEach((center) => {
+    flowArray.forEach((center, index) => {
       const linesArray = surface.lines.filter((line) => {
         if ((center.x1 === line.x1 && center.y1 === line.y1) || (center.x1 === line.x2 && center.y1 === line.y2)) {
           return line
@@ -1043,9 +1100,38 @@ export function useModuleBasicSetting() {
       canvas?.add(finalLine)
       canvas?.renderAll()
 
-      const rtnObj = { target: idx === 0 ? 'left' : 'right', x1: pointX1, y1: pointY1, x2: pointX2, y2: pointY2 }
+      let rtnObj
+      //평평하면
+      if (alpha === 0 || beta === 0 || h === 0 || sign === 0) {
+        //꼭지점이 없고 평평할때 ex) 네모
+        let standardLine
+        if (index === 0) {
+          //bottom
+          standardLine = surface.lines.reduce((acc, line, index) => {
+            if (line.x1 < acc.x1 || (line.x1 === acc.x1 && line.y1 < acc.y1)) {
+              return { x1: line.x1, y1: line.y1, index: index }
+            }
+            return acc
+          })
+        } else {
+          standardLine = surface.lines.reduce((acc, line, index) => {
+            if (line.x1 > acc.x1 || (line.x1 === acc.x1 && line.y1 > acc.y1)) {
+              return { x1: line.x1, y1: line.y1, index: index }
+            }
+            return acc
+          })
+        }
+        rtnObj = {
+          target: index === 0 ? 'left' : 'right',
+          x1: standardLine.x1,
+          y1: standardLine.y1,
+          x2: standardLine.x1,
+          y2: standardLine.y1 + charlie,
+        }
+      } else {
+        rtnObj = { target: idx === 0 ? 'left' : 'right', x1: pointX1, y1: pointY1, x2: pointX2, y2: pointY2 }
+      }
       rtnObjArray.push(rtnObj)
-      ++idx
     })
     return rtnObjArray
   }