package.json

@@ -26,7 +26,6 @@
     "framer-motion": "^11.2.13",
     "fs": "^0.0.1-security",
     "iron-session": "^8.0.2",
-    "jimp": "^1.6.0",
     "js-cookie": "^3.0.5",
     "mathjs": "^13.0.2",
     "mssql": "^11.0.1",

src/app/api/image/canvas/route.js

@@ -1,8 +1,7 @@
 import { NextResponse } from 'next/server'
-import { DeleteObjectCommand, GetObjectCommand, PutObjectCommand, S3Client } from '@aws-sdk/client-s3'
+import { S3Client, PutObjectCommand, DeleteObjectCommand, GetObjectCommand } from '@aws-sdk/client-s3'
+import sharp from 'sharp'
 import { v4 as uuidv4 } from 'uuid'
-import { Jimp } from 'jimp'
-
 const Bucket = process.env.AMPLIFY_BUCKET
 const s3 = new S3Client({
   region: process.env.AWS_REGION,
@@ -24,6 +23,8 @@ const checkArea = (obj) => {
 
 const cropImage = async (Key, width, height, left, top) => {
   try {
+    const checkResult = checkArea({ width, height, left, top })
+
     // Get the image from S3
     const { Body } = await s3.send(
       new GetObjectCommand({
@@ -32,45 +33,28 @@ const cropImage = async (Key, width, height, left, top) => {
       }),
     )
 
+    // Convert stream to buffer
     const chunks = []
     for await (const chunk of Body) {
       chunks.push(chunk)
     }
-    const buffer = Buffer.concat(chunks)
+    const imageBuffer = Buffer.concat(chunks)
 
-    const image = await Jimp.read(buffer)
-
-    image.autocrop({ tolerance: 0.0002, leaveBorder: 10 })
-    return await image.getBuffer('image/png')
-
-    // Convert stream to buffer
-    // const chunks = []
-    // for await (const chunk of Body) {
-    //   chunks.push(chunk)
-    // }
-    // const imageBuffer = Buffer.concat(chunks)
-
-    // const image = await Jimp.read(Body)
-
-    // if (!checkResult) {
-    //   processedImage = await image.toBuffer()
-    // }
-
-    //let processedImage
-    // if (!checkResult) {
-    //   processedImage = await sharp(imageBuffer).toBuffer()
-    // } else {
-    //   processedImage = await sharp(imageBuffer)
-    //     .extract({
-    //       width: parseInt(width),
-    //       height: parseInt(height),
-    //       left: parseInt(left),
-    //       top: parseInt(top),
-    //     })
-    //     .png()
-    //     .toBuffer()
-    // }
-    // return processedImage
+    let processedImage
+    if (!checkResult) {
+      processedImage = await sharp(imageBuffer).toBuffer()
+    } else {
+      processedImage = await sharp(imageBuffer)
+        .extract({
+          width: parseInt(width),
+          height: parseInt(height),
+          left: parseInt(left),
+          top: parseInt(top),
+        })
+        .png()
+        .toBuffer()
+    }
+    return processedImage
   } catch (error) {
     console.error('Error processing image:', error)
     throw error

src/components/floor-plan/CanvasMenu.jsx

@@ -4,7 +4,7 @@ import { useContext, useEffect, useState } from 'react'
 
 import { usePathname, useRouter, useSearchParams } from 'next/navigation'
 
-import { useRecoilState, useRecoilValue, useResetRecoilState, useSetRecoilState } from 'recoil'
+import { useRecoilState, useRecoilValue, useSetRecoilState } from 'recoil'
 
 import { v4 as uuidv4 } from 'uuid'
 
@@ -98,7 +98,7 @@ export default function CanvasMenu(props) {
   const [lockButtonStyle, setLockButtonStyle] = useState('') //잠금 버튼
 
   const setFloorPlanObjectNo = useSetRecoilState(floorPlanObjectState) //견적서 화면용 물건번호리코일
-  const resetCommonUtils = useResetRecoilState(commonUtilsState)
+
   // 발전시뮬레이션 메뉴 이동
   const { objectNo, pid } = floorPlanState
 
@@ -166,7 +166,6 @@ export default function CanvasMenu(props) {
   }
 
   const onClickNav = async (menu) => {
-    resetCommonUtils()
     switch (menu.type) {
       case 'drawing':
         swalFire({
@@ -242,7 +241,7 @@ export default function CanvasMenu(props) {
           return
         }
         setIsGlobalLoading(true)
-        promiseGet({ url: `/api/estimate/${objectNo}/${selectedPlan?.planNo ?? pid}/detail` }).then((res) => {
+        promiseGet({ url: `/api/estimate/${objectNo}/${selectedPlan?.planNo??pid}/detail` }).then((res) => {
           if (res.status === 200) {
             const estimateDetail = res.data
             if (estimateDetail.estimateDate !== null) {
@@ -250,7 +249,7 @@ export default function CanvasMenu(props) {
               setCurrentMenu(menu.title)
               setFloorPlanObjectNo({ floorPlanObjectNo: objectNo })
               setIsGlobalLoading(false)
-              router.push(`/floor-plan/estimate/5?pid=${selectedPlan?.planNo ?? pid}&objectNo=${objectNo}`)
+              router.push(`/floor-plan/estimate/5?pid=${selectedPlan?.planNo??pid}&objectNo=${objectNo}`)
               if (pathname === '/floor-plan/estimate/5') {
                 setIsGlobalLoading(false)
               }
@@ -263,13 +262,13 @@ export default function CanvasMenu(props) {
         break
       case 'simulation':
         setIsGlobalLoading(true)
-        promiseGet({ url: `/api/estimate/${objectNo}/${selectedPlan?.planNo ?? pid}/detail` }).then((res) => {
+        promiseGet({ url: `/api/estimate/${objectNo}/${selectedPlan?.planNo??pid}/detail` }).then((res) => {
           if (res.status === 200) {
             const estimateDetail = res.data
             if (estimateDetail.estimateDate !== null && estimateDetail.docNo) {
               setSelectedMenu(menu.type)
               setCurrentMenu(menu.title)
-              router.push(`/floor-plan/simulator/6?pid=${selectedPlan?.planNo ?? pid}&objectNo=${objectNo}`)
+              router.push(`/floor-plan/simulator/6?pid=${selectedPlan?.planNo??pid}&objectNo=${objectNo}`)
               if (pathname === '/floor-plan/simulator/6') {
                 setIsGlobalLoading(false)
               }

src/components/floor-plan/MenuDepth01.jsx

@@ -5,10 +5,9 @@ import { useEffect } from 'react'
 import { useMessage } from '@/hooks/useMessage'
 import useMenu from '@/hooks/common/useMenu'
 import { canvasState, currentMenuState } from '@/store/canvasAtom'
-import { useRecoilState, useRecoilValue, useResetRecoilState } from 'recoil'
+import { useRecoilState, useRecoilValue } from 'recoil'
 import { subMenusState } from '@/store/menuAtom'
 import { useCanvasMenu } from '@/hooks/common/useCanvasMenu'
-import { commonUtilsState } from '@/store/commonUtilsAtom'
 
 export default function MenuDepth01() {
   const canvas = useRecoilValue(canvasState)
@@ -17,10 +16,8 @@ export default function MenuDepth01() {
   const { selectedMenu, setSelectedMenu } = useCanvasMenu()
   const [currentMenu, setCurrentMenu] = useRecoilState(currentMenuState)
   const subMenus = useRecoilValue(subMenusState)
-  const resetCommonUtils = useResetRecoilState(commonUtilsState)
 
   const onClickMenu = ({ id, menu }) => {
-    resetCommonUtils()
     if (menu === currentMenu) {
       handleMenu(selectedMenu)
     } else {

src/components/floor-plan/modal/circuitTrestle/CircuitTrestleSetting.jsx

@@ -25,8 +25,6 @@ import { useCanvasPopupStatusController } from '@/hooks/common/useCanvasPopupSta
 import { useImgLoader } from '@/hooks/floorPlan/useImgLoader'
 import { usePlan } from '@/hooks/usePlan'
 import { QcastContext } from '@/app/QcastProvider'
-import { fabric } from 'fabric'
-import { fontSelector } from '@/store/fontAtom'
 
 const ALLOCATION_TYPE = {
   AUTO: 'auto',
@@ -46,9 +44,6 @@ export default function CircuitTrestleSetting({ id }) {
   const { managementState, setManagementState } = useContext(GlobalDataContext)
   const selectedModules = useRecoilValue(selectedModuleState)
   const { getPcsAutoRecommendList, getPcsVoltageChk, getPcsVoltageStepUpList, getPcsManualConfChk } = useMasterController()
-  const flowText = useRecoilValue(fontSelector('flowText'))
-  const lengthText = useRecoilValue(fontSelector('lengthText'))
-  const circuitNumberText = useRecoilValue(fontSelector('circuitNumberText'))
 
   // 회로할당(승합설정)에서 선택된 값들을 저장할 상태 추가
   const [selectedStepUpValues, setSelectedStepUpValues] = useState({})
@@ -107,26 +102,10 @@ export default function CircuitTrestleSetting({ id }) {
     }
   }, [])
 
-  // 캡쳐 전 처리
-  const beforeCapture = () => {
-    // setCanvasZoom(100)
-    const x = canvas.width / 2
-    const y = canvas.height / 2
-    canvas.zoomToPoint(new fabric.Point(x, y), 0.5)
-    changeFontSize('lengthText', '28')
-    changeFontSize('circuitNumber', '28')
-    changeFontSize('flowText', '28')
-    canvas.renderAll()
-  }
-
-  // 캡쳐 후 처리
-  const afterCapture = () => {
+  const handleZoomClear = () => {
     setCanvasZoom(100)
     canvas.set({ zoom: 1 })
     canvas.viewportTransform = [1, 0, 0, 1, 0, 0]
-    changeFontSize('lengthText', lengthText.fontSize.value)
-    changeFontSize('circuitNumber', circuitNumberText.fontSize.value)
-    changeFontSize('flowText', flowText.fontSize.value)
     canvas.renderAll()
   }
 
@@ -371,7 +350,7 @@ export default function CircuitTrestleSetting({ id }) {
 
   // 회로할당(승압설정) 저장 버튼 클릭 시
   const onApply = async () => {
-    beforeCapture()
+    handleZoomClear()
     setAllModuleSurfaceIsComplete(false)
 
     setIsGlobalLoading(true)
@@ -382,9 +361,12 @@ export default function CircuitTrestleSetting({ id }) {
         obj.pcses = getStepUpListData()
       })
 
+    setViewCircuitNumberTexts(false)
+
     handleCanvasToPng(1)
 
     //회로할당 저장 시 result=null인 경우에도 회로번호 텍스트 표시 유지 처리
+    setViewCircuitNumberTexts(true)
 
     // 회로할당 저장 클릭 시
     // 가대 및 지지금구 설치
@@ -400,7 +382,6 @@ export default function CircuitTrestleSetting({ id }) {
 
     if (result) {
       handleCanvasToPng(2)
-      afterCapture()
       // 견적서 저장
       await saveEstimate(result)
     } else {
@@ -410,16 +391,6 @@ export default function CircuitTrestleSetting({ id }) {
     // removeNotAllocationModules()
   }
 
-  const changeFontSize = (name, size) => {
-    const textObjs = canvas?.getObjects().filter((obj) => obj.name === name)
-    textObjs.forEach((obj) => {
-      obj.set({
-        fontSize: size,
-      })
-    })
-    canvas.renderAll()
-  }
-
   // 이전 버튼 클릭 시
   const onClickPrev = () => {
     // setAllocationType(ALLOCATION_TYPE.AUTO)

src/components/management/StuffSubHeader.jsx

@@ -56,20 +56,19 @@ export default function StuffSubHeader({ type }) {
    */
   const moveFloorPlan = () => {
     setFloorPlanObjectNo({ floorPlanObjectNo: objectNo })
-
     const param = {
-      pid: managementState?.planList?.length > 0 ? managementState?.planList[0].planNo : '1',
+      pid: managementState?.planList?.length === 0 ? '1' : managementState?.planList[0].planNo,
       objectNo: objectNo,
     }
 
-    if (managementState?.planList?.length > 0) {
+    if (managementState?.planList?.length === 0) {
+      setSelectedMenu('surface')
+    } else {
       if (managementState?.planList[0].estimateDate) {
         setSelectedMenu('module')
       } else {
         setSelectedMenu('surface')
       }
-    } else {
-      setSelectedMenu('surface')
     }
 
     const url = `/floor-plan?${queryStringFormatter(param)}`

src/hooks/common/useCommonUtils.js

@@ -1,11 +1,11 @@
 import { useEffect } from 'react'
-import { useRecoilState, useRecoilValue, useResetRecoilState } from 'recoil'
+import { useRecoilState, useRecoilValue } from 'recoil'
 import { wordDisplaySelector } from '@/store/settingAtom'
 import { useEvent } from '@/hooks/useEvent'
 import { checkLineOrientation, getDistance } from '@/util/canvas-util'
 import { commonUtilsState, dimensionLineSettingsState } from '@/store/commonUtilsAtom'
 import { fontSelector } from '@/store/fontAtom'
-import { canvasState, currentMenuState } from '@/store/canvasAtom'
+import { canvasState } from '@/store/canvasAtom'
 import { v4 as uuidv4 } from 'uuid'
 import { usePopup } from '@/hooks/usePopup'
 import Distance from '@/components/floor-plan/modal/distance/Distance'
@@ -16,7 +16,7 @@ import { BATCH_TYPE } from '@/common/common'
 export function useCommonUtils() {
   const canvas = useRecoilValue(canvasState)
   const wordDisplay = useRecoilValue(wordDisplaySelector)
-  const { addCanvasMouseEventListener, addDocumentEventListener, initEvent, removeMouseEvent } = useEvent()
+  const { addCanvasMouseEventListener, addDocumentEventListener, initEvent } = useEvent()
   const dimensionSettings = useRecoilValue(dimensionLineSettingsState)
   const dimensionLineTextFont = useRecoilValue(fontSelector('dimensionLineText'))
   const lengthTextFont = useRecoilValue(fontSelector('lengthText'))
@@ -27,14 +27,12 @@ export function useCommonUtils() {
   const { applyDormers } = useObjectBatch({})
 
   useEffect(() => {
-    commonTextMode()
-    if (commonUtils.dimension) {
+    if (commonUtils.text || !commonUtils.text) {
+      commonTextMode()
+    } else if (commonUtils.dimension) {
       commonDimensionMode()
-      return
-    }
-    if (commonUtils.distance) {
+    } else if (commonUtils.distance) {
       commonDistanceMode()
-      return
     }
   }, [commonUtils, dimensionSettings, commonTextFont, dimensionLineTextFont])
 
@@ -74,17 +72,8 @@ export function useCommonUtils() {
         })
       }, 100)
     } else {
-      removeMouseEvent('mouse:down')
       const activeObject = canvas?.getActiveObject()
-      const commonTexts = canvas?.getObjects().filter((obj) => obj.name === 'commonText')
-      if (commonTexts) {
-        commonTexts.forEach((text) => {
-          if (text.text === '') {
-            canvas?.remove(text)
-          }
-        })
-      }
-      /*if (activeObject && activeObject.name === 'commonText') {
+      if (activeObject && activeObject.name === 'commonText') {
         if (activeObject && activeObject.isEditing) {
           if (activeObject.text === '') {
             canvas?.remove(activeObject)
@@ -98,7 +87,7 @@ export function useCommonUtils() {
           })
           canvas.renderAll()
         }
-      }*/
+      }
 
       initEvent()
     }

src/hooks/roofcover/useRoofAllocationSetting.js

@@ -314,8 +314,7 @@ export function useRoofAllocationSetting(id) {
     setSurfaceShapePattern(currentObject, roofDisplay.column, false, selectedRoofMaterial, true)
     drawDirectionArrow(currentObject)
     modifyModuleSelectionData()
-    // closeAll()
-    closePopup(id)
+    closeAll()
     basicSettingSave()
     setModuleSelectionData({ ...moduleSelectionData, roofConstructions: newRoofList })
   }

src/hooks/usePopup.js

@@ -1,7 +1,5 @@
-import { useRecoilState, useResetRecoilState } from 'recoil'
+import { useRecoilState } from 'recoil'
 import { contextPopupState, popupState } from '@/store/popupAtom'
-import { useEffect } from 'react'
-import { commonUtilsState } from '@/store/commonUtilsAtom'
 
 /**
  * 팝업 관리 훅