src/hooks/module/useModuleBasicSetting.js

@@ -520,6 +520,7 @@ export function useModuleBasicSetting(tabNum) {
         lockScalingX: true, // X 축 크기 조정 잠금
         lockScalingY: true, // Y 축 크기 조정 잠금
         name: POLYGON_TYPE.MODULE,
+        opacity: 0.85,
       }
 
       if (moduleSetupSurfaces.length !== 0) {
@@ -895,6 +896,7 @@ export function useModuleBasicSetting(tabNum) {
                 })
 
                 canvas?.add(manualModule)
+                canvas.bringToFront(manualModule)
                 manualDrawModules.push(manualModule)
                 setModuleStatisticsData()
 
@@ -993,6 +995,7 @@ export function useModuleBasicSetting(tabNum) {
         lockScalingX: true, // X 축 크기 조정 잠금
         lockScalingY: true, // Y 축 크기 조정 잠금
         name: POLYGON_TYPE.MODULE,
+        opacity: 0.85,
       }
 
       const objectsIncludeSurface = (turfModuleSetupSurface) => {
@@ -1453,6 +1456,7 @@ export function useModuleBasicSetting(tabNum) {
                         //오브젝트와 겹치지 않으면 넣는다
                         if (isDisjoint) {
                           canvas?.add(manualModule)
+                          canvas.bringToFront(manualModule)
                           canvas?.renderAll()
                           manualDrawModules.push(manualModule)
                           setModuleStatisticsData()
@@ -1877,6 +1881,8 @@ export function useModuleBasicSetting(tabNum) {
       lockScalingX: true, // X 축 크기 조정 잠금
       lockScalingY: true, // Y 축 크기 조정 잠금
       name: POLYGON_TYPE.MODULE,
+      //투명도 추가
+      opacity: 0.85,
     }
 
     //선택된 지붕안에 오브젝트(도머, 개구등)이 있는지 확인하는 로직 포함되면 배열 반환
@@ -1895,6 +1901,14 @@ export function useModuleBasicSetting(tabNum) {
       return containsBatchObjects
     }
 
+    const addModule = (tempModule, moduleSetupArray, moduleArray) => {
+      canvas?.add(tempModule)
+      canvas.bringToFront(tempModule)
+      moduleSetupArray.push(tempModule)
+      moduleArray.push(tempModule)
+      canvas.renderAll()
+    }
+
     /**
      * 배치면 안에 있는지 확인
      * @param {*} squarePolygon
@@ -2170,10 +2184,7 @@ export function useModuleBasicSetting(tabNum) {
             if (disjointFromTrestle && isDisjoint) {
               //최초 한번은 그냥 그린다
               //겹치는지 확인해서 포함된 모듈만 그린다
-              canvas?.add(tempModule)
-              moduleSetupArray.push(tempModule)
-              moduleArray.push(tempModule)
-              canvas.renderAll()
+              addModule(tempModule, moduleSetupArray, moduleArray)
 
               // ++installedModuleHeightCount
 
@@ -2349,10 +2360,7 @@ export function useModuleBasicSetting(tabNum) {
             let isDisjoint = checkModuleDisjointObjects(squarePolygon, containsBatchObjects)
 
             if (disjointFromTrestle && isDisjoint) {
-              canvas?.add(tempModule)
-              moduleSetupArray.push(tempModule)
-              moduleArray.push(tempModule)
-              canvas.renderAll()
+              addModule(tempModule, moduleSetupArray, moduleArray)
 
               isInstall = true
 
@@ -2534,10 +2542,7 @@ export function useModuleBasicSetting(tabNum) {
             if (disjointFromTrestle && isDisjoint) {
               //최초 한번은 그냥 그린다
               //겹치는지 확인해서 포함된 모듈만 그린다
-              canvas?.add(tempModule)
-              moduleSetupArray.push(tempModule)
-              moduleArray.push(tempModule)
-              canvas.renderAll()
+              addModule(tempModule, moduleSetupArray, moduleArray)
 
               // ++installedModuleHeightCount
 
@@ -2721,10 +2726,7 @@ export function useModuleBasicSetting(tabNum) {
             if (disjointFromTrestle && isDisjoint) {
               //최초 한번은 그냥 그린다
               //겹치는지 확인해서 포함된 모듈만 그린다
-              canvas?.add(tempModule)
-              moduleSetupArray.push(tempModule)
-              moduleArray.push(tempModule)
-              canvas.renderAll()
+              addModule(tempModule, moduleSetupArray, moduleArray)
 
               isInstall = true
               //마지막에 설치된 모듈의 Y 좌표