적용버튼 수행 후 팝업 닫는 로직 수정

test

.env.development

@@ -1,8 +1,10 @@
+NEXT_PUBLIC_RUN_MODE="development"
+
 NEXT_PUBLIC_API_SERVER_PATH="https://dev-api.hanasys.jp"
 
 NEXT_PUBLIC_HOST_URL="//1.248.227.176:4000"
 
-NEXT_PUBLIC_API_HOST_URL="http://1.248.227.176:5000"
+NEXT_PUBLIC_API_HOST_URL="https://dev.hanasys.jp"
 
 SESSION_SECRET="i3iHH1yp2/2SpQSIySQ4bpyc4g0D+zCF9FAn5xUG0+Y="
 
@@ -25,4 +27,6 @@ AWS_REGION="ap-northeast-1"
 AMPLIFY_BUCKET="files.hanasys.jp"
 AWS_ACCESS_KEY_ID="AKIA3K4QWLZHFZRJOM2E"
 AWS_SECRET_ACCESS_KEY="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"
-NEXT_PUBLIC_AWS_S3_BASE_URL="//files.hanasys.jp"
+NEXT_PUBLIC_AWS_S3_BASE_URL="//files.hanasys.jp"
+
+S3_PROFILE="dev"

.env.local.dev

@@ -0,0 +1,32 @@
+NEXT_PUBLIC_RUN_MODE="local.dev"
+
+NEXT_PUBLIC_API_SERVER_PATH="https://dev-api.hanasys.jp"
+
+NEXT_PUBLIC_HOST_URL="//1.248.227.176:4000"
+
+NEXT_PUBLIC_API_HOST_URL="http://1.248.227.176:5000"
+
+SESSION_SECRET="i3iHH1yp2/2SpQSIySQ4bpyc4g0D+zCF9FAn5xUG0+Y="
+
+# NEXT_PUBLIC_CONVERTER_API_URL="https://v2.convertapi.com/convert/dwg/to/png?Secret=secret_bV5zuYMyyIYFlOb3"
+# NEXT_PUBLIC_CONVERTER_API_URL="https://v2.convertapi.com/convert/dwg/to/png?Secret=secret_yAS4QDalL9jgQ7vS"
+NEXT_PUBLIC_CONVERTER_API_URL="https://v2.convertapi.com/convert/dwg/to/png?Secret=secret_a0FLEK6M2oTpXInK"
+
+NEXT_PUBLIC_Q_ORDER_AUTO_LOGIN_URL="http://q-order-stg.q-cells.jp:8120/eos/login/autoLogin"
+NEXT_PUBLIC_Q_MUSUBI_AUTO_LOGIN_URL="http://q-musubi-stg.q-cells.jp:8120/qm/login/autoLogin"
+
+# 테스트용
+# AWS_REGION="ap-northeast-2"
+# AMPLIFY_BUCKET="interplug"
+# AWS_ACCESS_KEY_ID="AKIAVWMWJCUXFHEAZ4FR"
+# AWS_SECRET_ACCESS_KEY="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"
+# NEXT_PUBLIC_AWS_S3_BASE_URL="https://interplug.s3.ap-northeast-2.amazonaws.com"
+
+# 실제 일본 서버
+AWS_REGION="ap-northeast-1"
+AMPLIFY_BUCKET="files.hanasys.jp"
+AWS_ACCESS_KEY_ID="AKIA3K4QWLZHFZRJOM2E"
+AWS_SECRET_ACCESS_KEY="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"
+NEXT_PUBLIC_AWS_S3_BASE_URL="//files.hanasys.jp"
+
+S3_PROFILE="dev"

.env.localhost

@@ -0,0 +1,32 @@
+NEXT_PUBLIC_RUN_MODE="local"
+
+NEXT_PUBLIC_API_SERVER_PATH="https://dev-api.hanasys.jp"
+
+NEXT_PUBLIC_HOST_URL="//1.248.227.176:4000"
+
+NEXT_PUBLIC_API_HOST_URL="http://localhost:3000"
+
+SESSION_SECRET="i3iHH1yp2/2SpQSIySQ4bpyc4g0D+zCF9FAn5xUG0+Y="
+
+# NEXT_PUBLIC_CONVERTER_API_URL="https://v2.convertapi.com/convert/dwg/to/png?Secret=secret_bV5zuYMyyIYFlOb3"
+# NEXT_PUBLIC_CONVERTER_API_URL="https://v2.convertapi.com/convert/dwg/to/png?Secret=secret_yAS4QDalL9jgQ7vS"
+NEXT_PUBLIC_CONVERTER_API_URL="https://v2.convertapi.com/convert/dwg/to/png?Secret=secret_a0FLEK6M2oTpXInK"
+
+NEXT_PUBLIC_Q_ORDER_AUTO_LOGIN_URL="http://q-order-stg.q-cells.jp:8120/eos/login/autoLogin"
+NEXT_PUBLIC_Q_MUSUBI_AUTO_LOGIN_URL="http://q-musubi-stg.q-cells.jp:8120/qm/login/autoLogin"
+
+# 테스트용
+# AWS_REGION="ap-northeast-2"
+# AMPLIFY_BUCKET="interplug"
+# AWS_ACCESS_KEY_ID="AKIAVWMWJCUXFHEAZ4FR"
+# AWS_SECRET_ACCESS_KEY="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"
+# NEXT_PUBLIC_AWS_S3_BASE_URL="https://interplug.s3.ap-northeast-2.amazonaws.com"
+
+# 실제 일본 서버
+AWS_REGION="ap-northeast-1"
+AMPLIFY_BUCKET="files.hanasys.jp"
+AWS_ACCESS_KEY_ID="AKIA3K4QWLZHFZRJOM2E"
+AWS_SECRET_ACCESS_KEY="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"
+NEXT_PUBLIC_AWS_S3_BASE_URL="//files.hanasys.jp"
+
+S3_PROFILE="dev"

.env.production

@@ -1,3 +1,5 @@
+NEXT_PUBLIC_RUN_MODE="production"
+
 NEXT_PUBLIC_API_SERVER_PATH="https://api.hanasys.jp/"
 
 NEXT_PUBLIC_HOST_URL="//1.248.227.176:4000"
@@ -15,8 +17,17 @@ NEXT_PUBLIC_CONVERTER_API_URL="https://v2.convertapi.com/convert/dwg/to/png?Secr
 NEXT_PUBLIC_Q_ORDER_AUTO_LOGIN_URL="http://q-order-stg.q-cells.jp:8120/eos/login/autoLogin"
 NEXT_PUBLIC_Q_MUSUBI_AUTO_LOGIN_URL="http://q-musubi-stg.q-cells.jp:8120/qm/login/autoLogin"
 
-AWS_REGION="ap-northeast-2"
-AMPLIFY_BUCKET="interplug"
-AWS_ACCESS_KEY_ID="AKIAVWMWJCUXFHEAZ4FR"
-AWS_SECRET_ACCESS_KEY="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"
-NEXT_PUBLIC_AWS_S3_BASE_URL="//files.hanasys.jp"
+# AWS_REGION="ap-northeast-2"
+# AMPLIFY_BUCKET="interplug"
+# AWS_ACCESS_KEY_ID="AKIAVWMWJCUXFHEAZ4FR"
+# AWS_SECRET_ACCESS_KEY="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"
+# NEXT_PUBLIC_AWS_S3_BASE_URL="//files.hanasys.jp"
+
+# 실제 일본 서버
+AWS_REGION="ap-northeast-1"
+AMPLIFY_BUCKET="files.hanasys.jp"
+AWS_ACCESS_KEY_ID="AKIA3K4QWLZHFZRJOM2E"
+AWS_SECRET_ACCESS_KEY="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"
+NEXT_PUBLIC_AWS_S3_BASE_URL="//files.hanasys.jp"
+
+S3_PROFILE="prd"

dev.ecosystem.config.js

@@ -6,7 +6,7 @@ module.exports = {
       instances: 1,
       exec_mode: 'fork',
       env: {
-        NODE_ENV: 'development',
+        PORT: 5010,
       },
     },
   ],

dev.local.ecosystem.config.js

@@ -0,0 +1,13 @@
+module.exports = {
+  apps: [
+    {
+      name: 'qcast-front-local-development',
+      script: 'node_modules/next/dist/bin/next',
+      instances: 1,
+      exec_mode: 'fork',
+      env: {
+        PORT: 5000,
+      },
+    },
+  ],
+}

package.json

@@ -3,11 +3,14 @@
   "version": "0.1.0",
   "private": true,
   "scripts": {
-    "dev": "next dev",
-    "build": "next build",
-    "start:cluster1": "next start -p 5000",
-    "start:cluster2": "next start -p 5001",
-    "start:dev": "next start -p 5010",
+    "dev": "env-cmd -f .env.localhost next dev",
+    "local:dev": "env-cmd -f .env.local.dev next dev",
+    "build": "env-cmd -f .env.production next build",
+    "build:dev": "env-cmd -f .env.development next build",
+    "build:local.dev": "env-cmd -f .env.local.dev next build",
+    "start:cluster1": "env-cmd -f .env.production next start -p 5000",
+    "start:cluster2": "env-cmd -f .env.production next start -p 5001",
+    "start:dev": "env-cmd -f .env.development next start -p 5010",
     "lint": "next lint",
     "serve": "node server.js"
   },
@@ -18,10 +21,12 @@
     "big.js": "^6.2.2",
     "chart.js": "^4.4.6",
     "dayjs": "^1.11.13",
+    "env-cmd": "^10.1.0",
     "fabric": "^5.3.0",
     "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",

prd1.ecosystem.config.js

@@ -0,0 +1,13 @@
+module.exports = {
+  apps: [
+    {
+      name: 'qcast-front-production-1',
+      script: 'node_modules/next/dist/bin/next',
+      instances: 1,
+      exec_mode: 'fork',
+      env: {
+        PORT: 5000,
+      },
+    },
+  ],
+}

prd2.ecosystem.config.js

@@ -0,0 +1,13 @@
+module.exports = {
+  apps: [
+    {
+      name: 'qcast-front-production-2',
+      script: 'node_modules/next/dist/bin/next',
+      instances: 1,
+      exec_mode: 'fork',
+      env: {
+        PORT: 5001,
+      },
+    },
+  ],
+}

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

@@ -11,9 +11,10 @@ const s3 = new S3Client({
 })
 
 const uploadImage = async (file) => {
+  console.log('🚀 ~ uploadImage ~ file:', file)
   const Body = Buffer.from(await file.arrayBuffer())
   const Key = `cads/${file.name}`
-  const ContentType = file.ContentType
+  const ContentType = 'image/png'
 
   await s3.send(
     new PutObjectCommand({

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

@@ -1,7 +1,8 @@
 import { NextResponse } from 'next/server'
-import { S3Client, PutObjectCommand, DeleteObjectCommand, GetObjectCommand } from '@aws-sdk/client-s3'
-import sharp from 'sharp'
+import { DeleteObjectCommand, GetObjectCommand, PutObjectCommand, S3Client } from '@aws-sdk/client-s3'
 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,
@@ -23,8 +24,6 @@ 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({
@@ -33,28 +32,45 @@ const cropImage = async (Key, width, height, left, top) => {
       }),
     )
 
-    // Convert stream to buffer
     const chunks = []
     for await (const chunk of Body) {
       chunks.push(chunk)
     }
-    const imageBuffer = Buffer.concat(chunks)
+    const buffer = Buffer.concat(chunks)
 
-    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
+    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
   } catch (error) {
     console.error('Error processing image:', error)
     throw error
@@ -96,7 +112,7 @@ export async function POST(req) {
     /**
      * 크롭 이미지 이름을 결정한다.
      */
-    const Key = `Drawing/${objectNo}_${planNo}_${type}.png`
+    const Key = `Drawing/${process.env.S3_PROFILE}/${objectNo}_${planNo}_${type}.png`
 
     /**
      * 크롭이 완료된 이미지를 업로드한다.

src/app/api/image/estimate-image-copy/route.js

@@ -0,0 +1,59 @@
+import { NextResponse } from 'next/server'
+import { S3Client, CopyObjectCommand, GetObjectCommand } from '@aws-sdk/client-s3'
+import sharp from 'sharp'
+import { v4 as uuidv4 } from 'uuid'
+const Bucket = process.env.AMPLIFY_BUCKET
+const s3 = new S3Client({
+  region: process.env.AWS_REGION,
+  credentials: {
+    accessKeyId: process.env.AWS_ACCESS_KEY_ID,
+    secretAccessKey: process.env.AWS_SECRET_ACCESS_KEY,
+  },
+})
+
+export async function POST(req) {
+  const { objectNo, planNo, newObjectNo, newPlanNo } = await req.json()
+
+  const responseArray = []
+
+  //견적서1 번 이미지
+  const isExistImage1 = await s3.send(
+    new GetObjectCommand({
+      Bucket,
+      Key: `Drawing/${process.env.S3_PROFILE}/${objectNo}_${planNo}_1.png`,
+    }),
+  )
+
+  //견적서2 번 이미지
+  const isExistImage2 = await s3.send(
+    new GetObjectCommand({
+      Bucket,
+      Key: `Drawing/${process.env.S3_PROFILE}/${objectNo}_${planNo}_2.png`,
+    }),
+  )
+
+  //견적서1,2 번 이미지 둘다 있어야함
+  if (isExistImage1.$metadata.httpStatusCode === 200 && isExistImage2.$metadata.httpStatusCode === 200) {
+    //견적서1 번 이미지 복사
+    const copyCommand = new CopyObjectCommand({
+      Bucket,
+      CopySource: encodeURI(`${Bucket}/Drawing/${process.env.S3_PROFILE}/${objectNo}_${planNo}_1.png`),
+      Key: `Drawing/${process.env.S3_PROFILE}/${newObjectNo}_${newPlanNo}_1.png`,
+    })
+
+    const response = await s3.send(copyCommand)
+
+    const copyCommand2 = new CopyObjectCommand({
+      Bucket,
+      CopySource: encodeURI(`${Bucket}/Drawing/${process.env.S3_PROFILE}/${objectNo}_${planNo}_2.png`),
+      Key: `Drawing/${process.env.S3_PROFILE}/${newObjectNo}_${newPlanNo}_2.png`,
+    })
+
+    const response2 = await s3.send(copyCommand2)
+
+    responseArray.push(response, response2)
+    return NextResponse.json({ message: '견적서 이미지 복사 성공', responseArray }, { status: 200 })
+  } else {
+    return NextResponse.json({ message: '견적서 이미지 복사 실패(존재하지 않는 이미지)', responseArray }, { status: 400 })
+  }
+}

src/app/floor-plan/FloorPlanProvider.js

@@ -45,8 +45,19 @@ const FloorPlanProvider = ({ children }) => {
   // const pathname = usePathname()
   // const setCorrentObjectNo = useSetRecoilState(correntObjectNoState)
   const searchParams = useSearchParams()
+  const path = usePathname()
   const objectNo = searchParams.get('objectNo')
   const pid = searchParams.get('pid')
+
+  useEffect(() => {
+    setFloorPlanState((prev) => {
+      return {
+        ...prev,
+        objectNo,
+        pid,
+      }
+    })
+  }, [path])
   // useEffect(() => {
   //   console.log('🚀 ~ useEffect ~ objectNo:')
   //   if (pathname === '/floor-plan') {

src/components/Main.jsx

@@ -14,6 +14,7 @@ import { sessionStore } from '@/store/commonAtom'
 import { isObjectNotEmpty } from '@/util/common-utils'
 
 import BoardDetailModal from './community/modal/BoardDetailModal'
+import Config from '@/config/config.export'
 
 export default function MainPage() {
   const [sessionState, setSessionState] = useRecoilState(sessionStore)

src/components/community/modal/QnaRegModal.jsx

@@ -13,6 +13,7 @@ import { QcastContext } from '@/app/QcastProvider'
 import { useAxios } from '@/hooks/useAxios'
 import { globalLocaleStore } from '@/store/localeAtom'
 import { e } from 'mathjs'
+import { set } from 'react-hook-form'
 
 
 export default function QnaRegModal({ setOpen, setReload, searchValue, selectPageBlock }) {
@@ -24,6 +25,7 @@ export default function QnaRegModal({ setOpen, setReload, searchValue, selectPag
   const [qnaData, setQnaData] = useState([])
   const [closeMdFlg, setCloseMdFlg] = useState(true)
   const [closeSmFlg, setCloseSmFlg] = useState(true)
+  const [hideSmFlg, setHideSmFlg] = useState(false)
   const qnaTypeLgCodeRef = useRef(null)
   const qnaTypeMdCodeRef = useRef(null)
   const qnaTypeSmCodeRef = useRef(null)
@@ -71,7 +73,7 @@ let fileCheck = false;
     regUserTelNoRef.current.value = ''
     qnaTypeLgCodeRef.current.setValue();
     qnaTypeMdCodeRef.current.setValue();
-    qnaTypeSmCodeRef.current.setValue();
+    qnaTypeSmCodeRef.current?.setValue();
     titleRef.current.value = ''
     contentsRef.current.value = ''
 
@@ -112,7 +114,7 @@ let fileCheck = false;
       setQnaData({ ...qnaData, qnaClsLrgCd:e.clCode})
       setCloseMdFlg(false)
       qnaTypeMdCodeRef.current.setValue();
-      qnaTypeSmCodeRef.current.setValue();
+      qnaTypeSmCodeRef.current?.setValue();
     }
 
   }
@@ -131,10 +133,20 @@ let fileCheck = false;
 
         }
       })
-      setQnaTypeSmCodeList(codeList)
+
+
       setQnaData({ ...qnaData, qnaClsMidCd: e.clCode })
       setCloseSmFlg(false)
-      qnaTypeSmCodeRef.current.setValue();
+      setQnaTypeSmCodeList(codeList)
+      qnaTypeSmCodeRef.current?.setValue();
+
+      if(codeList.length > 0) {
+        setHideSmFlg(false)
+      }else{
+        setHideSmFlg(true)
+      }
+
+
 
     }
 
@@ -393,6 +405,7 @@ let fileCheck = false;
                     />
                   </div>
                   <div className="select-wrap" >
+                    {!hideSmFlg && (
                     <Select  name="" ref={qnaTypeSmCodeRef}
                             options={qnaTypeSmCodeList}
                             placeholder="Select"
@@ -401,8 +414,8 @@ let fileCheck = false;
                             getOptionValue={(x) => x.clCode}
                             isClearable={false}
                             isSearchable={false}
-                             isDisabled={closeSmFlg}
-                    />
+                            isDisabled={closeSmFlg}
+                    />)}
                   </div>
                 </div>
                 <div className="input-wrap mt5">

src/components/estimate/Estimate.jsx

@@ -154,7 +154,7 @@ export default function Estimate({}) {
 
   useEffect(() => {
     // console.log('🚀 ~ Estimate ~ selectedPlan:', selectedPlan)
-    if (selectedPlan) initEstimate(selectedPlan.planNo)
+    if (selectedPlan) initEstimate(selectedPlan?.planNo?? currentPid)
   }, [selectedPlan])
 
   useEffect(() => {
@@ -1281,7 +1281,7 @@ export default function Estimate({}) {
               <div className="estimate-box">
                 <div className="estimate-tit">{getMessage('estimate.detail.objectNo')}</div>
                 <div className="estimate-name">
-                  {currentObjectNo} (Plan No: {planNo})
+                  {currentObjectNo} (Plan No: {currentPid})
                 </div>
               </div>
               <div className="estimate-box">

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, useSetRecoilState } from 'recoil'
+import { useRecoilState, useRecoilValue, useResetRecoilState, 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,6 +166,7 @@ export default function CanvasMenu(props) {
   }
 
   const onClickNav = async (menu) => {
+    resetCommonUtils()
     switch (menu.type) {
       case 'drawing':
         swalFire({
@@ -241,7 +242,7 @@ export default function CanvasMenu(props) {
           return
         }
         setIsGlobalLoading(true)
-        promiseGet({ url: `/api/estimate/${objectNo}/${selectedPlan.planNo}/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) {
@@ -249,7 +250,7 @@ export default function CanvasMenu(props) {
               setCurrentMenu(menu.title)
               setFloorPlanObjectNo({ floorPlanObjectNo: objectNo })
               setIsGlobalLoading(false)
-              router.push(`/floor-plan/estimate/5?pid=${selectedPlan.planNo}&objectNo=${objectNo}`)
+              router.push(`/floor-plan/estimate/5?pid=${selectedPlan?.planNo ?? pid}&objectNo=${objectNo}`)
               if (pathname === '/floor-plan/estimate/5') {
                 setIsGlobalLoading(false)
               }
@@ -262,13 +263,13 @@ export default function CanvasMenu(props) {
         break
       case 'simulation':
         setIsGlobalLoading(true)
-        promiseGet({ url: `/api/estimate/${objectNo}/${selectedPlan.planNo}/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}&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,9 +5,10 @@ import { useEffect } from 'react'
 import { useMessage } from '@/hooks/useMessage'
 import useMenu from '@/hooks/common/useMenu'
 import { canvasState, currentMenuState } from '@/store/canvasAtom'
-import { useRecoilState, useRecoilValue } from 'recoil'
+import { useRecoilState, useRecoilValue, useResetRecoilState } 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)
@@ -16,8 +17,10 @@ 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/basic/step/Placement.jsx

@@ -351,7 +351,7 @@ const Placement = forwardRef((props, refs) => {
             </div>
           )}
           {guideType === 'module' && (
-            <div className={`module-table-box mt10 ${useTab ? 'hide' : ''}`}>
+            <div className={`module-table-box mt10 ${!useTab ? 'hide' : ''}`}>
               <div className="module-table-inner">
                 <div className="roof-module-table">
                   <table className="">

src/components/floor-plan/modal/basic/step/Trestle.jsx

@@ -217,7 +217,7 @@ const Trestle = forwardRef((props, ref) => {
         stdWindSpeed: managementState?.standardWindSpeedId ?? '',
         stdSnowLd: managementState?.verticalSnowCover ?? '',
         inclCd: selectedRoof?.pitch ?? 0,
-        roofPitch: Math.round(selectedRoof?.roofPchBase ?? 0),
+        roofPitch: Math.round(hajebichi ?? 0),
       },
     })
   }
@@ -236,9 +236,9 @@ const Trestle = forwardRef((props, ref) => {
           illuminationTp: managementState?.surfaceTypeValue ?? '',
           instHt: managementState?.installHeight ?? '',
           stdWindSpeed: managementState?.standardWindSpeedId ?? '',
-          stdSnowLd: +managementState?.verticalSnowCover ?? '',
+          stdSnowLd: managementState?.verticalSnowCover ?? '',
           inclCd: selectedRoof?.pitch ?? 0,
-          roofPitch: Math.round(selectedRoof?.roofPchBase ?? 0),
+          roofPitch: Math.round(hajebichi ?? 0),
           constTp: constructionList[index].constTp,
           snowGdPossYn: constructionList[index].snowGdPossYn,
           cvrYn: constructionList[index].cvrYn,
@@ -304,6 +304,7 @@ const Trestle = forwardRef((props, ref) => {
           kerabaMargin,
           roofIndex: roof.index,
           raft: selectedRaftBase?.clCode,
+          hajebichi: hajebichi,
           trestle: {
             length: lengthBase,
             hajebichi: hajebichi,

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

@@ -13,7 +13,7 @@ import { useRecoilState } from 'recoil'
 import { makersState, modelsState, modelState, pcsCheckState, selectedMakerState, selectedModelsState, seriesState } from '@/store/circuitTrestleAtom'
 import { POLYGON_TYPE } from '@/common/common'
 import { useSwal } from '@/hooks/useSwal'
-import { canvasState } from '@/store/canvasAtom'
+import { canvasState, canvasZoomState } from '@/store/canvasAtom'
 
 import { useTrestle } from '@/hooks/module/useTrestle'
 import { selectedModuleState } from '@/store/selectedModuleOptions'
@@ -25,6 +25,8 @@ 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',
@@ -37,13 +39,16 @@ export default function CircuitTrestleSetting({ id }) {
   const { swalFire } = useSwal()
   const { saveEstimate } = useEstimate()
   const canvas = useRecoilValue(canvasState)
-
+  const [canvasZoom, setCanvasZoom] = useRecoilState(canvasZoomState)
   const [tabNum, setTabNum] = useState(1)
   const [allocationType, setAllocationType] = useState(ALLOCATION_TYPE.AUTO)
   const [circuitAllocationType, setCircuitAllocationType] = useState(1)
   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({})
@@ -102,6 +107,29 @@ 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 = () => {
+    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()
+  }
+
   // 수동할당 시 모듈 삭제
 
   // 시리즈중 자동으로 추천 PCS 정보 조회
@@ -343,6 +371,7 @@ export default function CircuitTrestleSetting({ id }) {
 
   // 회로할당(승압설정) 저장 버튼 클릭 시
   const onApply = async () => {
+    beforeCapture()
     setAllModuleSurfaceIsComplete(false)
 
     setIsGlobalLoading(true)
@@ -353,12 +382,9 @@ export default function CircuitTrestleSetting({ id }) {
         obj.pcses = getStepUpListData()
       })
 
-    setViewCircuitNumberTexts(false)
-
     handleCanvasToPng(1)
 
     //회로할당 저장 시 result=null인 경우에도 회로번호 텍스트 표시 유지 처리
-    setViewCircuitNumberTexts(true)
 
     // 회로할당 저장 클릭 시
     // 가대 및 지지금구 설치
@@ -374,6 +400,7 @@ export default function CircuitTrestleSetting({ id }) {
 
     if (result) {
       handleCanvasToPng(2)
+      afterCapture()
       // 견적서 저장
       await saveEstimate(result)
     } else {
@@ -383,6 +410,16 @@ 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/floor-plan/modal/placementShape/PlacementShapeSetting.jsx

@@ -227,7 +227,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
     console.log('save Info', {
       ...basicSetting,
       selectedRoofMaterial: {
-        roofInfo,
+        ...newAddedRoofs[0],
       },
     })
 
@@ -240,7 +240,7 @@ export default function PlacementShapeSetting({ id, pos = { x: 50, y: 180 }, pla
        * 선택된 지붕재 정보
        */
       selectedRoofMaterial: {
-        roofInfo,
+        ...newAddedRoofs[0],
       },
     })
 

src/components/simulator/Simulator.jsx

@@ -114,7 +114,7 @@ export default function Simulator() {
     setHatsudenryouPeakcutAllSnow([])
 
     if (objectNo && pid && selectedPlan) {
-      fetchObjectDetail(objectNo, selectedPlan.planNo)
+      fetchObjectDetail(objectNo, selectedPlan?.planNo??pid)
       fetchSimulatorNotice()
       setPwrGnrSimType('D')
       setPwrRecoil({ ...pwrRecoil, type: 'D' })

src/config/config.common.js

@@ -0,0 +1,11 @@
+// local, development, production 과 관계없이 동일한 값으로 반환되는 부분은 해당 함수의 return 되는 부분만 수정하면 됩니다. (달라져야 하는 값이 아닌, 같은 값에 대해서는 local, development, production 파일을 모두 수정할 필요가 없어지게 됩니다.)
+export default function getConfigs(params) {
+  // local, development, production 마다 달라지는 값
+  const { baseUrl, mode } = params
+
+  // 공통으로 반환되는 구조
+  return {
+    baseUrl,
+    mode,
+  }
+}

src/config/config.development.js

@@ -0,0 +1,13 @@
+import getConfigs from './config.common'
+
+// 환경마다 달라져야 할 변수, 값들을 정의합니다. (여기는 development 환경에 맞는 값을 지정합니다.)
+const baseUrl = 'https://dev.hanssys.jp'
+const mode = 'development'
+
+// 환경마다 달라져야 할 값들을 getConfig 함수에 전달합니다.
+const configDevelopment = getConfigs({
+  baseUrl,
+  mode,
+})
+
+export default configDevelopment

src/config/config.export.js

@@ -0,0 +1,23 @@
+import configDevelopment from './config.development'
+import configLocal from './config.local'
+import configLocalDev from './config.local.dev'
+import configProduction from './config.production'
+
+// 클라이언트에서는 이 함수를 사용하여 config 값을 참조합니다.
+const Config = () => {
+  console.log('🚀 ~ Config ~ process.env.NEXT_PUBLIC_RUN_MODE:', process.env.NEXT_PUBLIC_RUN_MODE)
+  switch (process.env.NEXT_PUBLIC_RUN_MODE) {
+    case 'local':
+      return configLocal
+    case 'local.dev':
+      return configLocalDev
+    case 'development':
+      return configDevelopment
+    case 'production':
+      return configProduction
+    default:
+      return configLocal
+  }
+}
+
+export default Config

src/config/config.local.dev.js

@@ -0,0 +1,13 @@
+import getConfigs from './config.common'
+
+// 환경마다 달라져야 할 변수, 값들을 정의합니다. (여기는 local 환경에 맞는 값을 지정합니다.)
+const baseUrl = 'http://1.248.227.176:5000'
+const mode = 'local.dev'
+
+// 환경마다 달라져야 할 값들을 getConfig 함수에 전달합니다.
+const configLocalDev = getConfigs({
+  baseUrl,
+  mode,
+})
+
+export default configLocalDev

src/config/config.local.js

@@ -0,0 +1,13 @@
+import getConfigs from './config.common'
+
+// 환경마다 달라져야 할 변수, 값들을 정의합니다. (여기는 local 환경에 맞는 값을 지정합니다.)
+const baseUrl = 'http://localhost:3000'
+const mode = 'local'
+
+// 환경마다 달라져야 할 값들을 getConfig 함수에 전달합니다.
+const configLocal = getConfigs({
+  baseUrl,
+  mode,
+})
+
+export default configLocal

src/config/config.production.js

@@ -0,0 +1,13 @@
+import getConfigs from './config.common'
+
+// 환경마다 달라져야 할 변수, 값들을 정의합니다. (여기는 production 환경에 맞는 값을 지정합니다.)
+const baseUrl = 'https://www.hanasys.jp'
+const mode = 'production'
+
+// 환경마다 달라져야 할 값들을 getConfig 함수에 전달합니다.
+const configProduction = getConfigs({
+  baseUrl,
+  mode,
+})
+
+export default configProduction

src/hooks/common/useCommonUtils.js

@@ -1,11 +1,11 @@
 import { useEffect } from 'react'
-import { useRecoilState, useRecoilValue } from 'recoil'
+import { useRecoilState, useRecoilValue, useResetRecoilState } 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 } from '@/store/canvasAtom'
+import { canvasState, currentMenuState } from '@/store/canvasAtom'
 import { v4 as uuidv4 } from 'uuid'
 import { usePopup } from '@/hooks/usePopup'
 import Distance from '@/components/floor-plan/modal/distance/Distance'
@@ -16,30 +16,33 @@ import { BATCH_TYPE } from '@/common/common'
 export function useCommonUtils() {
   const canvas = useRecoilValue(canvasState)
   const wordDisplay = useRecoilValue(wordDisplaySelector)
-  const { addCanvasMouseEventListener, addDocumentEventListener, initEvent } = useEvent()
+  const { addCanvasMouseEventListener, addDocumentEventListener, initEvent, removeMouseEvent } = useEvent()
   const dimensionSettings = useRecoilValue(dimensionLineSettingsState)
   const dimensionLineTextFont = useRecoilValue(fontSelector('dimensionLineText'))
   const lengthTextFont = useRecoilValue(fontSelector('lengthText'))
   const commonTextFont = useRecoilValue(fontSelector('commonText'))
   const [commonUtils, setCommonUtilsState] = useRecoilState(commonUtilsState)
-  const { addPopup, closeAll } = usePopup()
+  const { addPopup, closeAll, targetClose } = usePopup()
   const { drawDirectionArrow, addLengthText } = usePolygon()
   const { applyDormers } = useObjectBatch({})
 
   useEffect(() => {
-    if (commonUtils.text || !commonUtils.text) {
-      commonTextMode()
-    } else if (commonUtils.dimension) {
+    commonTextMode()
+    if (commonUtils.dimension) {
       commonDimensionMode()
-    } else if (commonUtils.distance) {
+      return
+    }
+    if (commonUtils.distance) {
       commonDistanceMode()
+      return
     }
   }, [commonUtils, dimensionSettings, commonTextFont, dimensionLineTextFont])
 
   const commonTextMode = () => {
     let textbox
-    closeAll()
+
     if (commonUtils.text) {
+      targetClose('other')
       setTimeout(() => {
         commonTextKeyEvent()
         addCanvasMouseEventListener('mouse:down', (event) => {
@@ -71,8 +74,17 @@ export function useCommonUtils() {
         })
       }, 100)
     } else {
+      removeMouseEvent('mouse:down')
       const activeObject = canvas?.getActiveObject()
-      if (activeObject && activeObject.name === 'commonText') {
+      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.isEditing) {
           if (activeObject.text === '') {
             canvas?.remove(activeObject)
@@ -86,7 +98,7 @@ export function useCommonUtils() {
           })
           canvas.renderAll()
         }
-      }
+      }*/
 
       initEvent()
     }

src/hooks/common/useRefFiles.js

@@ -8,6 +8,7 @@ import { useCanvas } from '@/hooks/useCanvas'
 import { deleteBackGroundImage, setBackGroundImage } from '@/lib/imageActions'
 import { settingModalFirstOptionsState } from '@/store/settingAtom'
 import { popSpinnerState } from '@/store/popupAtom'
+import Config from '@/config/config.export'
 
 /**
  * 배경 이미지 관리
@@ -97,7 +98,7 @@ export function useRefFiles() {
         setPopSpinnerStore(true)
         console.log('🚀 ~ handleFileDelete ~ handleFileDelete:', refImage)
         console.log('🚀 ~ handleFileDelete ~ currentCanvasPlan.bgImageName:', currentCanvasPlan.bgImageName)
-        await del({ url: `${process.env.NEXT_PUBLIC_API_HOST_URL}/api/image/upload?fileName=${currentCanvasPlan.bgImageName}` })
+        await del({ url: `${Config().baseUrl}/api/image/upload?fileName=${currentCanvasPlan.bgImageName}` })
         setCurrentBgImage(null)
         await deleteBackGroundImage({
           objectId: currentCanvasPlan.id,
@@ -118,7 +119,7 @@ export function useRefFiles() {
       confirmFn: async () => {
         console.log('🚀 ~ handleAddressDelete ~ handleAddressDelete:', refImage)
         console.log('🚀 ~ handleAddressDelete ~ currentCanvasPlan.bgImageName:', currentCanvasPlan.bgImageName)
-        await del({ url: `${process.env.NEXT_PUBLIC_API_HOST_URL}/api/image/map?fileName=${currentCanvasPlan.bgImageName}` })
+        await del({ url: `${Config().baseUrl}/api/image/map?fileName=${currentCanvasPlan.bgImageName}` })
         setMapPositionAddress('')
         setCurrentBgImage(null)
         await deleteBackGroundImage({
@@ -149,7 +150,7 @@ export function useRefFiles() {
     }))
 
     const res = await get({
-      url: `${process.env.NEXT_PUBLIC_API_HOST_URL}/api/image/map?q=${queryRef.current.value}&fileNm=${currentCanvasPlan.id}&zoom=20`,
+      url: `${Config().baseUrl}/api/image/map?q=${queryRef.current.value}&fileNm=${currentCanvasPlan.id}&zoom=20`,
     })
     console.log('🚀 ~ handleMapImageDown ~ res:', res)
     setCurrentBgImage(`${process.env.NEXT_PUBLIC_AWS_S3_BASE_URL}/${res.fileName}`)
@@ -208,7 +209,7 @@ export function useRefFiles() {
     formData.append('file', file)
 
     const res = await post({
-      url: `${process.env.NEXT_PUBLIC_API_HOST_URL}/api/image/upload`,
+      url: `${Config().baseUrl}/api/image/upload`,
       data: formData,
     })
     console.log('🚀 ~ handleUploadImageRefFile ~ res:', res)
@@ -238,14 +239,40 @@ export function useRefFiles() {
     const res = await post({ url: converterUrl, data: formData })
     console.log('🚀 ~ handleUploadConvertRefFile ~ res:', res)
 
+    // Convert Base64 to Blob
+    const base64Data = res.Files[0].FileData
+    const byteCharacters = atob(base64Data)
+    const byteArrays = []
+
+    for (let offset = 0; offset < byteCharacters.length; offset += 512) {
+      const slice = byteCharacters.slice(offset, offset + 512)
+      const byteNumbers = new Array(slice.length)
+
+      for (let i = 0; i < slice.length; i++) {
+        byteNumbers[i] = slice.charCodeAt(i)
+      }
+
+      const byteArray = new Uint8Array(byteNumbers)
+      byteArrays.push(byteArray)
+    }
+
+    const blob = new Blob(byteArrays, { type: 'image/png' })
+
+    // Create File object from Blob
+    const convertImg = new File([blob], res.Files[0].FileName, { type: 'image/png' })
+
+    const newFormData = new FormData()
+    newFormData.append('file', convertImg)
+
     /** 캐드 도면 파일 업로드 */
     const result = await post({
-      url: `${process.env.NEXT_PUBLIC_API_HOST_URL}/api/image/cad`,
-      data: res,
+      url: `${Config().baseUrl}/api/image/cad`,
+      data: newFormData,
     })
     console.log('🚀 ~ handleUploadConvertRefFile ~ result:', result)
 
-    setCurrentBgImage(`${process.env.NEXT_PUBLIC_AWS_S3_BASE_URL}/${res.fileName}`)
+    setCurrentBgImage(`${process.env.NEXT_PUBLIC_AWS_S3_BASE_URL}/${result.fileName}`)
+    // setCurrentBgImage(result.filePath)
     setRefImage(file)
 
     const params = {

src/hooks/floorPlan/estimate/useEstimateController.js

@@ -13,6 +13,8 @@ import { useSwal } from '@/hooks/useSwal'
 // Constants
 const ESTIMATE_API_ENDPOINT = '/api/estimate' // API 엔드포인트 정의
 
+import Config from '@/config/config.export'
+
 // Helper functions
 const updateItemInList = (itemList, dispOrder, updates) => {
   return itemList.map((item) => (item.dispOrder === dispOrder ? { ...item, ...updates } : item))
@@ -464,11 +466,13 @@ export const useEstimateController = (planNo, flag) => {
 
     setIsGlobalLoading(true)
     await promisePost({ url: '/api/estimate/save-estimate-copy', data: params })
-      .then((res) => {
+      .then(async (res) => {
         setIsGlobalLoading(false)
         if (res.status === 201) {
           if (isObjectNotEmpty(res.data)) {
             let newObjectNo = res.data.objectNo
+            const copyImage = await handleEstimateImageCopy(params.objectNo, params.planNo, newObjectNo, '1')
+
             swalFire({
               text: getMessage('estimate.detail.estimateCopyPopup.copy.alertMessage'),
               type: 'alert',
@@ -489,6 +493,27 @@ export const useEstimateController = (planNo, flag) => {
       })
   }
 
+  const handleEstimateImageCopy = async (objectNo, planNo, newObjectNo, newPlanNo) => {
+    await promisePost({ url: `${Config().baseUrl}/api/image/estimate-image-copy`, data: { objectNo, planNo, newObjectNo, newPlanNo } }).then(
+      (res) => {
+        return res
+      },
+    )
+  }
+
+  const handleDeleteEstimate = async (canvasStatus) => {
+    try {
+      setIsGlobalLoading(true)
+      await promisePost({ url: `${ESTIMATE_API_ENDPOINT}/delete-estimate`, data: canvasStatus }).then((res) => {
+        if (res.status === 201) {
+        }
+      })
+    } catch (e) {
+      console.error('error::::::::::::', e.response.data.message)
+    }
+    setIsGlobalLoading(false)
+  }
+
   /**
    * 전각20자 (반각40자)
    */
@@ -509,5 +534,7 @@ export const useEstimateController = (planNo, flag) => {
     fetchSetting,
     handleEstimateFileDownload,
     handleEstimateCopy,
+    handleDeleteEstimate,
+    handleEstimateImageCopy,
   }
 }

src/hooks/floorPlan/useImgLoader.js

@@ -5,6 +5,7 @@ import { usePlan } from '../usePlan'
 import { POLYGON_TYPE } from '@/common/common'
 import { QcastContext } from '@/app/QcastProvider'
 import { useContext } from 'react'
+import Config from '@/config/config.export'
 
 /**
  * 이미지 로더 hook
@@ -80,7 +81,7 @@ export function useImgLoader() {
       /** 이미지 크롭 요청 */
       const result = await post({
         // url: `${process.env.NEXT_PUBLIC_API_HOST_URL}/image/canvas`,
-        url: `${process.env.NEXT_PUBLIC_API_HOST_URL}/api/image/canvas`,
+        url: `${Config().baseUrl}/api/image/canvas`,
         data: formData,
       })
       console.log('🚀 ~ handleCanvasToPng ~ result:', result)

src/hooks/module/useModuleBasicSetting.js

@@ -661,7 +661,7 @@ export function useModuleBasicSetting(tabNum) {
 
                     //가운데 가운데
                     if (Math.abs(smallCenterY - holdCellCenterY) < snapDistance) {
-                      tempModule.top = holdCellCenterY - toFixedWithoutRounding(width / 2, 2)
+                      tempModule.top = holdCellCenterY - toFixedWithoutRounding(height / 2, 2)
                     }
 
                     if (isChidori) {

src/hooks/module/useModuleTrestle.js

@@ -209,7 +209,7 @@ export function useModuleTrestle(props) {
       stdSnowLd: trestleState.stdSnowLd ?? '',
       inclCd: trestleState.inclCd ?? '',
       raftBaseCd: trestleState.raft ?? '',
-      roofPitch: Math.round(trestleState.roofPitch) ?? '',
+      roofPitch: trestleState.hajebichi ? trestleState.hajebichi : (trestleState.roofPitch ?? ''),
     })
       .then((res) => {
         if (res?.data) setConstructionList(res.data)
@@ -236,7 +236,7 @@ export function useModuleTrestle(props) {
         inclCd: trestleState.inclCd ?? '',
         constTp: trestleState.constTp ?? '',
         mixMatlNo: trestleState.mixMatlNo ?? '',
-        roofPitch: trestleState.roofPitch ?? '',
+        roofPitch: trestleState.hajebichi ? trestleState.hajebichi : (trestleState.roofPitch ?? ''),
         // workingWidth: trestleState.length ?? '',
         workingWidth: lengthBase ?? '',
       },

src/hooks/module/useTrestle.js

@@ -1627,6 +1627,8 @@ export const useTrestle = () => {
   // 랙 없음의 지지금구를 그린다.
   const drawBracketWithOutRack = (module, rackIntvlPct, count, l, direction, moduleIntvlHor, moduleIntvlVer) => {
     const { leftFindModuleList, rightFindModuleList, centerFindModuleList } = module
+    rackIntvlPct = rackIntvlPct === 0 ? 1 : rackIntvlPct // 0인 경우 1로 변경
+    rackIntvlPct = 100 / rackIntvlPct // 퍼센트로 변경
 
     let { width, height, left, top } = module
     let startPointX
@@ -1641,14 +1643,14 @@ export const useTrestle = () => {
           break
         } else if (direction === 'east') {
           startPointX = left + width
-          startPointY = top + height - height / rackIntvlPct
+          startPointY = top + height - height / rackIntvlPct - 10
           break
         } else if (direction === 'west') {
           startPointX = left
           startPointY = top + height / rackIntvlPct
           break
         } else if (direction === 'north') {
-          startPointX = left + width - width / rackIntvlPct
+          startPointX = left + width - width / rackIntvlPct - 10
           startPointY = top
           break
         }
@@ -1657,7 +1659,7 @@ export const useTrestle = () => {
       case 'R': {
         // 오른쪽부분 시작 점
         if (direction === 'south') {
-          startPointX = left + width - width / rackIntvlPct
+          startPointX = left + width - width / rackIntvlPct - 10
           startPointY = top + height / 2 + height / 2
           break
         } else if (direction === 'east') {
@@ -1666,7 +1668,7 @@ export const useTrestle = () => {
           break
         } else if (direction === 'west') {
           startPointX = left
-          startPointY = top + height - height / rackIntvlPct
+          startPointY = top + height - height / rackIntvlPct - 10
           break
         } else if (direction === 'north') {
           startPointX = left + width / rackIntvlPct

src/hooks/option/useCanvasSetting.js

@@ -498,11 +498,26 @@ export function useCanvasSetting(executeEffect = true) {
             roofSeq: 0,
             roofMatlCd:
               params.roofsData.roofMatlCd === null || params.roofsData.roofMatlCd === undefined ? 'ROOF_ID_WA_53A' : params.roofsData.roofMatlCd,
-            roofWidth: params.roofsData.roofWidth === null || params.roofsData.roofWidth === undefined ? 0 : params.roofsData.roofWidth,
-            roofHeight: params.roofsData.roofHeight === null || params.roofsData.roofHeight === undefined ? 0 : params.roofsData.roofHeight,
+            roofWidth:
+              params.selectedRoofMaterial.width === null || params.selectedRoofMaterial.width === undefined
+                ? !params.selectedRoofMaterial.widBase
+                  ? 0
+                  : Number(params.roofsData.widBase)
+                : Number(params.selectedRoofMaterial.width),
+            roofHeight:
+              params.selectedRoofMaterial.height === null || params.selectedRoofMaterial.height === undefined
+                ? !params.selectedRoofMaterial.lenBase
+                  ? 0
+                  : Number(params.selectedRoofMaterial.lenBase)
+                : Number(params.roofsData.roofHeight),
             roofHajebichi:
-              params.roofsData.roofHajebichi === null || params.roofsData.roofHajebichi === undefined ? 0 : params.roofsData.roofHajebichi,
-            roofGap: params.roofsData.roofGap === null || params.roofsData.roofGap === undefined ? 'HEI_455' : params.roofsData.roofGap,
+              params.selectedRoofMaterial.hajebichi === null || params.selectedRoofMaterial.hajebichi === undefined
+                ? 0
+                : Number(params.selectedRoofMaterial.hajebichi),
+            roofGap:
+              params.selectedRoofMaterial.raft === null || params.selectedRoofMaterial.raft === undefined
+                ? params.selectedRoofMaterial.raftBaseCd
+                : params.roofsData.raft,
             roofLayout: params.roofsData.roofLayout === null || params.roofsData.roofLayout === undefined ? 'P' : params.roofsData.roofLayout,
             roofPitch: params.roofsData.roofPitch === null || params.roofsData.roofPitch === undefined ? 0 : params.roofsData.roofPitch,
             roofAngle: params.roofsData.roofAngle === null || params.roofsData.roofAngle === undefined ? 0 : params.roofsData.roofAngle,

src/hooks/roofcover/useRoofAllocationSetting.js

@@ -212,7 +212,6 @@ export function useRoofAllocationSetting(id) {
       }
 
       await post({ url: `/api/canvas-management/roof-allocation-settings`, data: patternData }).then((res) => {
-        swalFire({ text: getMessage(res.returnMessage) })
         setIsGlobalLoading(false)
       })
 
@@ -315,7 +314,8 @@ export function useRoofAllocationSetting(id) {
     setSurfaceShapePattern(currentObject, roofDisplay.column, false, selectedRoofMaterial, true)
     drawDirectionArrow(currentObject)
     modifyModuleSelectionData()
-    closeAll()
+    // closeAll()
+    closePopup(id)
     basicSettingSave()
     setModuleSelectionData({ ...moduleSelectionData, roofConstructions: newRoofList })
   }

src/hooks/useEvent.js

@@ -1,4 +1,4 @@
-import { useRef } from 'react'
+import { useEffect, useRef } from 'react'
 import { useRecoilValue, useSetRecoilState } from 'recoil'
 import { canvasState, canvasZoomState, currentMenuState, textModeState } from '@/store/canvasAtom'
 import { fabric } from 'fabric'
@@ -15,7 +15,8 @@ import { useDotLineGrid } from '@/hooks/useDotLineGrid'
 import { useTempGrid } from '@/hooks/useTempGrid'
 import { gridColorState } from '@/store/gridAtom'
 import { gridDisplaySelector } from '@/store/settingAtom'
-import { POLYGON_TYPE } from '@/common/common'
+import { MENU, POLYGON_TYPE } from '@/common/common'
+import useMenu from '@/hooks/common/useMenu'
 
 export function useEvent() {
   const canvas = useRecoilValue(canvasState)
@@ -25,6 +26,7 @@ export function useEvent() {
   const setCanvasZoom = useSetRecoilState(canvasZoomState)
   const gridColor = useRecoilValue(gridColorState)
   const isGridDisplay = useRecoilValue(gridDisplaySelector)
+  const zoom = useRecoilValue(canvasZoomState)
 
   const { adsorptionPointAddMode, adsorptionPointMode, adsorptionRange, getAdsorptionPoints, adsorptionPointAddModeStateEvent } = useAdsorptionPoint()
   const { dotLineGridSetting, interval, getClosestLineGrid } = useDotLineGrid()
@@ -59,6 +61,13 @@ export function useEvent() {
     addDefaultEvent()
   }
 
+  useEffect(() => {
+    const whiteMenus = [MENU.BATCH_CANVAS.SURFACE_SHAPE_BATCH, MENU.BATCH_CANVAS.OBJECT_BATCH, MENU.MODULE_CIRCUIT_SETTING.BASIC_SETTING]
+    if (canvas && !whiteMenus.includes(currentMenu)) {
+      addCanvasMouseEventListener('mouse:move', defaultMouseMoveEvent)
+    }
+  }, [zoom])
+
   const addDefaultEvent = () => {
     //default Event 추가
     addCanvasMouseEventListener('mouse:move', defaultMouseMoveEvent)
@@ -280,7 +289,7 @@ export function useEvent() {
   }
 
   const drawMouseLine = (pointer) => {
-    const horizontalLine = new fabric.Line([-4 * canvas.width, pointer.y, 4 * canvas.width, pointer.y], {
+    const horizontalLine = new fabric.Line([-2 * canvas.width, pointer.y, 2 * canvas.width, pointer.y], {
       stroke: 'red',
       strokeWidth: 1,
       selectable: false,
@@ -288,7 +297,7 @@ export function useEvent() {
     })
 
     // 세로선
-    const verticalLine = new fabric.Line([pointer.x, -4 * canvas.height, pointer.x, 4 * canvas.height], {
+    const verticalLine = new fabric.Line([pointer.x, -2 * canvas.height, pointer.x, 2 * canvas.height], {
       stroke: 'red',
       strokeWidth: 1,
       selectable: false,
@@ -392,7 +401,7 @@ export function useEvent() {
   const removeMouseEvent = (type) => {
     mouseEventListeners.current = mouseEventListeners.current.filter((event) => {
       if (event.eventType === type) {
-        canvas.off(type, event.handler)
+        canvas?.off(type, event.handler)
         return false
       }
       return true

src/hooks/useLine.js

@@ -159,5 +159,6 @@ export const useLine = () => {
     addPitchText,
     removePitchText,
     addPitchTextsByOuterLines,
+    getLengthByLine,
   }
 }

src/hooks/usePlan.js

@@ -30,6 +30,7 @@ import { useCanvasPopupStatusController } from './common/useCanvasPopupStatusCon
 import { useCanvasMenu } from './common/useCanvasMenu'
 import { QcastContext } from '@/app/QcastProvider'
 import { unescapeString } from '@/util/common-utils'
+import { useTrestle } from '@/hooks/module/useTrestle'
 
 /**
  * 플랜 처리 훅
@@ -54,7 +55,7 @@ export function usePlan(params = {}) {
   const { getMessage } = useMessage()
   const { get, post, promisePost, promisePut, promiseDel, promiseGet } = useAxios()
 
-  const { setEstimateContextState } = useEstimateController()
+  const { setEstimateContextState, handleDeleteEstimate, handleEstimateImageCopy } = useEstimateController()
 
   const resetOuterLinePoints = useResetRecoilState(outerLinePointsState)
   const resetPlacementShapeDrawingPoints = useResetRecoilState(placementShapeDrawingPointsState)
@@ -78,6 +79,7 @@ export function usePlan(params = {}) {
   const resetCurrentObject = useResetRecoilState(currentObjectState)
   //선택된 모듈 배치면 초기화
   const resetModuleSetupSurface = useResetRecoilState(moduleSetupSurfaceState)
+  const { isAllComplete } = useTrestle()
 
   /**
    * 마우스 포인터의 가이드라인 제거
@@ -172,7 +174,11 @@ export function usePlan(params = {}) {
    */
   const saveCanvas = async (saveAlert = true) => {
     const canvasStatus = currentCanvasData('save')
-    await putCanvasStatus(canvasStatus, saveAlert)
+    const result = await putCanvasStatus(canvasStatus, saveAlert)
+    //캔버스 저장 완료 후
+    if (result && !isAllComplete()) {
+      handleDeleteEstimate(currentCanvasPlan)
+    }
   }
 
   /**
@@ -301,6 +307,9 @@ export function usePlan(params = {}) {
         setModuleSelectionDataStore(copyData)
         if (copyData.module) setSelectedModules(copyData.module)
         setSelectedMenu(currentSelectedMenu)
+
+        //이미지 복사
+        handleEstimateImageCopy(planData.objectNo, planData.planNo, planData.objectNo, newPlan.planNo)
       } else {
         setSelectedMenu('placement')
       }
@@ -318,20 +327,24 @@ export function usePlan(params = {}) {
    * @param {boolean} saveAlert - 저장 완료 알림 표시 여부
    */
   const putCanvasStatus = async (canvasStatus, saveAlert = true) => {
+    let rtn = false
     const planData = {
       id: currentCanvasPlan.id,
       bgImageName: currentCanvasPlan?.bgImageName ?? null,
       mapPositionAddress: currentCanvasPlan?.mapPositionAddress ?? null,
       canvasStatus: canvasToDbFormat(canvasStatus),
     }
+
     await promisePut({ url: '/api/canvas-management/canvas-statuses', data: planData })
       .then((res) => {
         setPlans((plans) => plans.map((plan) => (plan.id === currentCanvasPlan.id ? { ...plan, canvasStatus: canvasStatus } : plan)))
         if (saveAlert) swalFire({ text: getMessage('plan.message.save') })
+        rtn = true
       })
       .catch((error) => {
         swalFire({ text: error.message, icon: 'error' })
       })
+    return rtn
   }
 
   /**
@@ -602,8 +615,10 @@ export function usePlan(params = {}) {
     if (pathname === '/floor-plan/estimate/5' || pathname === '/floor-plan/simulator/6') {
       await getCanvasByObjectNo(objectNo, planNo).then((res) => {
         if (res.length > 0) {
-          setCurrentCanvasPlan((prev) => ({ ...prev, canvasStatus: res.find((plan) => plan.planNo === planNo).canvasStatus }))
-          setPlans((plans) => plans.map((plan) => ({ ...plan, canvasStatus: res.find((resPlan) => resPlan.planNo === plan.planNo).canvasStatus })))
+          // setCurrentCanvasPlan((prev) => ({ ...prev, canvasStatus: res.find((plan) => plan.planNo === planNo).canvasStatus }))
+          // setPlans((plans) => plans.map((plan) => ({ ...plan, canvasStatus: res.find((resPlan) => resPlan.planNo === plan.planNo).canvasStatus })))
+          setCurrentCanvasPlan(res.find((plan) => plan.planNo === planNo))
+          setPlans(res)
         }
       })
     }

src/hooks/usePolygon.js

@@ -15,6 +15,7 @@ import { flowDisplaySelector } from '@/store/settingAtom'
 import { fontSelector } from '@/store/fontAtom'
 import { QLine } from '@/components/fabric/QLine'
 import { LINE_TYPE, POLYGON_TYPE } from '@/common/common'
+import { useLine } from '@/hooks/useLine'
 
 export const usePolygon = () => {
   const canvas = useRecoilValue(canvasState)
@@ -24,6 +25,8 @@ export const usePolygon = () => {
   const currentAngleType = useRecoilValue(currentAngleTypeSelector)
   const pitchText = useRecoilValue(pitchTextSelector)
 
+  const { getLengthByLine } = useLine()
+
   const addPolygon = (points, options, isAddCanvas = true) => {
     const polygon = new QPolygon(points, {
       ...options,
@@ -1093,25 +1096,37 @@ export const usePolygon = () => {
         })
 
         if (startFlag && endFlag) {
-          if (!representLines.includes(line)) {
+          if (!representLines.includes(line) && line.attributes.type === LINE_TYPE.WALLLINE.EAVES) {
             representLines.push(line)
           }
         }
       })
 
-      // blue로 생성된 것들은 대표라인이 될 수 없음.
-      // representLines = representLines.filter((line) => line.stroke !== 'blue')
       // representLines중 가장 긴 line을 찾는다.
       representLines.forEach((line) => {
         if (!representLine) {
           representLine = line
         } else {
-          if (representLine.length < line.length) {
+          if (getLengthByLine(representLine) < getLengthByLine(line)) {
             representLine = line
           }
         }
       })
-      const direction = polygon.direction ?? representLine?.direction
+
+      if (!representLine) {
+        representLines = representLines.filter((line) => line.stroke !== 'blue')
+        representLines.forEach((line) => {
+          if (!representLine) {
+            representLine = line
+          } else {
+            if (representLine.length < line.length) {
+              representLine = line
+            }
+          }
+        })
+      }
+
+      const direction = polygon.direction ?? representLine?.direction ?? ''
       const polygonDirection = polygon.direction
 
       switch (direction) {
@@ -1178,7 +1193,7 @@ export const usePolygon = () => {
       })
 
       canvas.add(roof)
-      // addLengthText(roof)
+      addLengthText(roof)
       canvas.remove(polygon)
       canvas.renderAll()
     })

src/hooks/usePopup.js

@@ -1,5 +1,7 @@
-import { useRecoilState } from 'recoil'
+import { useRecoilState, useResetRecoilState } from 'recoil'
 import { contextPopupState, popupState } from '@/store/popupAtom'
+import { useEffect } from 'react'
+import { commonUtilsState } from '@/store/commonUtilsAtom'
 
 /**
  * 팝업 관리 훅
@@ -128,11 +130,17 @@ export function usePopup() {
     }
   }
 
+  const targetClose = (type) => {
+    popup[type] = []
+    setPopup({ ...popup, [type]: [] })
+  }
+
   return {
     popup,
     addPopup,
     closePopup,
     closePopups,
     closeAll,
+    targetClose,
   }
 }

src/locales/ja.json

@@ -617,7 +617,7 @@
   "qna.reg.alert.select.type": "お問い合わせ区分を選択してください。",
   "qna.reg.alert.require.title": "タイトルを入力してください。",
   "qna.reg.alert.require.contents": "内容を入力してください。",
-  "qna.reg.confirm.save": "1:1お問い合わせを登録しますか? <br/>Hanwha Japan 担当者にお問い合わせメールが送信されます。",
+  "qna.reg.confirm.save": "お問い合わせを登録しますか? <br/>Hanwha Japan 担当者にお問い合わせメールが送信されます。",
   "qna.reg.alert.save": "保存されました。",
   "qna.reg.alert.saveFail": "保存に失敗しました。",
   "qna.list.header.regNm": "登録者",
@@ -666,9 +666,9 @@
   "join.sub1.title": "販売代理店情報",
   "join.sub1.comment": "※登録される販売店の会社名を入力してください。 （2次店は「○○販売株式会社（2次店：××設備株式会社）」でご記入ください。）",
   "join.sub1.storeQcastNm": "販売代理店名",
-  "join.sub1.storeQcastNm_placeholder": "株式会社エネルギーギアソリューションアンサービス(2次点：山口周期販売有限会社）",
+  "join.sub1.storeQcastNm_placeholder": "ハンファジャパン株式会社",
   "join.sub1.storeQcastNmKana": "販売代理店名フリガナ",
-  "join.sub1.storeQcastNmKana_placeholder": "株式会社エネルギーギアソリューション",
+  "join.sub1.storeQcastNmKana_placeholder": "ハンファジャパンカブシキカイシャ",
   "join.sub1.postCd": "郵便番号",
   "join.sub1.postCd_placeholder": "数字7桁",
   "join.sub1.addr": "住所",
@@ -681,7 +681,7 @@
   "join.sub2.title": "担当者情報",
   "join.sub2.userNm": "担当者名",
   "join.sub2.userNmKana": "担当者名ふりがな",
-  "join.sub2.userId": "申請ID",
+  "join.sub2.userId": "ユーザーID",
   "join.sub2.email": "メールアドレス",
   "join.sub2.telNo": "電話番号",
   "join.sub2.telNo_placeholder": "00 0000 0000",
@@ -689,12 +689,12 @@
   "join.sub2.fax_placeholder": "00 0000 0000",
   "join.sub2.category": "部署名",
   "join.btn.login_page": "ログイン画面に移動",
-  "join.btn.approval_request": "ID承認要求",
+  "join.btn.approval_request": "ID申請",
   "join.complete.title": "HANASYS設計ログインID発行申請完了",
   "join.complete.contents": "※申請したIDが承認されると、担当者情報に入力したEメールアドレスにログイン関連案内メールが送信されます。",
   "join.complete.email_comment": "担当者のメールアドレス",
   "join.validation.check1": "{0}形式を確認してください。",
-  "join.complete.save.confirm": "ハンファジャパンの担当者にID承認が要求された場合、これ以上情報を修正することはできません。申請しますか？",
+  "join.complete.save.confirm": "ID申請を完了後は申請情報の修正が出来ません。申請しますか？",
   "stuff.gridHeader.lastEditDatetime": "更新日時",
   "stuff.gridHeader.objectNo": "物件番号",
   "stuff.gridHeader.planTotCnt": "プラン数",

src/locales/ko.json

@@ -666,9 +666,9 @@
   "join.sub1.title": "판매대리점 정보",
   "join.sub1.comment": "※ 등록되는 리셀러의 회사 이름을 입력하십시오. (2차점은 「○○판매주식회사(2차점：××설비주식회사)」로 기입해 주세요.)",
   "join.sub1.storeQcastNm": "판매대리점명",
-  "join.sub1.storeQcastNm_placeholder": "주식회사 에너지 기어 솔루션 앤 서비스 (2차점: 야마구치 주기 판매 유한회사)",
+  "join.sub1.storeQcastNm_placeholder": "한화재팬 주식회사",
   "join.sub1.storeQcastNmKana": "판매대리점명 후리가나",
-  "join.sub1.storeQcastNmKana_placeholder": "주식회사 에너지 기어 솔루션",
+  "join.sub1.storeQcastNmKana_placeholder": "한화재팬 카부시키 카이샤",
   "join.sub1.postCd": "우편번호",
   "join.sub1.postCd_placeholder": "숫자 7자리",
   "join.sub1.addr": "주소",
@@ -681,7 +681,7 @@
   "join.sub2.title": "담당자 정보",
   "join.sub2.userNm": "담당자명",
   "join.sub2.userNmKana": "담당자명 후리가나",
-  "join.sub2.userId": "신청 ID",
+  "join.sub2.userId": "사용자 ID",
   "join.sub2.email": "이메일 주소",
   "join.sub2.telNo": "전화번호",
   "join.sub2.telNo_placeholder": "00 0000 0000",

src/store/menuAtom.js

@@ -37,11 +37,11 @@ export const subMenusState = atom({
       // 지붕덮개
       { id: 0, name: 'plan.menu.roof.cover.outline.drawing', menu: MENU.ROOF_COVERING.EXTERIOR_WALL_LINE },
       { id: 1, name: 'plan.menu.roof.cover.roof.shape.setting', menu: MENU.ROOF_COVERING.ROOF_SHAPE_SETTINGS },
-      {
-        id: 2,
-        name: 'plan.menu.roof.cover.roof.shape.passivity.setting',
-        menu: MENU.ROOF_COVERING.ROOF_SHAPE_PASSIVITY_SETTINGS,
-      },
+      // {
+      //   id: 2,
+      //   name: 'plan.menu.roof.cover.roof.shape.passivity.setting',
+      //   menu: MENU.ROOF_COVERING.ROOF_SHAPE_PASSIVITY_SETTINGS,
+      // },
       { id: 3, name: 'plan.menu.roof.cover.auxiliary.line.drawing', menu: MENU.ROOF_COVERING.HELP_LINE_DRAWING },
       { id: 4, name: 'plan.menu.roof.cover.eaves.kerava.edit', menu: MENU.ROOF_COVERING.EAVES_KERAVA_EDIT },
       { id: 5, name: 'plan.menu.roof.cover.movement.shape.updown', menu: MENU.ROOF_COVERING.MOVEMENT_SHAPE_UPDOWN },

startscript-cluster1.js

@@ -0,0 +1,2 @@
+var exec = require('child_process').exec
+exec('yarn start:cluster1', { windowsHide: true })

startscript-cluster2.js

@@ -0,0 +1,2 @@
+var exec = require('child_process').exec
+exec('yarn start:cluster2', { windowsHide: true })

startscript-dev.js

@@ -0,0 +1,2 @@
+var exec = require('child_process').exec
+exec('yarn start:dev', { windowsHide: true })

startscript.js

@@ -1,2 +1,2 @@
 var exec = require('child_process').exec
-exec('yarn dev -p 5000', { windowsHide: true })
+exec('yarn local:dev -p 5000', { windowsHide: true })