From b4dfc2211f39a41c1dbe6fde9b7562e03f0e858d Mon Sep 17 00:00:00 2001
From: keyy1315 <lovelina1315@gmail.com>
Date: Wed, 14 May 2025 11:06:24 +0900
Subject: [PATCH] feat: modify inquiry save requestParameter to formdata add
 files

---
 src/app/api/qna/detail/route.ts       |  1 +
 src/app/api/qna/file/route.ts         | 15 +++++++++++++++
 src/app/api/qna/list/route.ts         |  2 +-
 src/app/api/qna/save/route.ts         | 20 ++++++++++++++------
 src/components/inquiry/Answer.tsx     |  5 +++--
 src/components/inquiry/Detail.tsx     |  6 +++---
 src/components/inquiry/RegistForm.tsx |  6 +++---
 src/hooks/useInquiry.ts               | 21 ++++++++++++++++++---
 8 files changed, 58 insertions(+), 18 deletions(-)
 create mode 100644 src/app/api/qna/file/route.ts

diff --git a/src/app/api/qna/detail/route.ts b/src/app/api/qna/detail/route.ts
index c91931a..da709c0 100644
--- a/src/app/api/qna/detail/route.ts
+++ b/src/app/api/qna/detail/route.ts
@@ -13,6 +13,7 @@ export async function GET(request: Request) {
 
   try {
     const response = await axios.get(`${process.env.NEXT_PUBLIC_INQUIRY_API_URL}/api/qna/detail?${queryStringFormatter(params)}`)
+    console.log('response.data detail:: ', response.data)
     if (response.status === 200) {
       return NextResponse.json(response.data)
     }
diff --git a/src/app/api/qna/file/route.ts b/src/app/api/qna/file/route.ts
new file mode 100644
index 0000000..2c4556a
--- /dev/null
+++ b/src/app/api/qna/file/route.ts
@@ -0,0 +1,15 @@
+import axios from 'axios'
+import { NextResponse } from 'next/server'
+
+export async function GET(request: Request) {
+  const { searchParams } = new URL(request.url)
+  const encodeFileNo = searchParams.get('encodeFileNo')
+
+  if (!encodeFileNo) {
+    return NextResponse.json({ error: 'fileNo is required' }, { status: 400 })
+  }
+  const response = await axios.get(`${process.env.NEXT_PUBLIC_INQUIRY_API_URL}/api/file/downloadFile?encodeFileNo=${encodeFileNo}`)
+  console.log('response.data:: ', response.data)
+
+  return NextResponse.json(response.data)
+}
diff --git a/src/app/api/qna/list/route.ts b/src/app/api/qna/list/route.ts
index 2a63a3c..901aa20 100644
--- a/src/app/api/qna/list/route.ts
+++ b/src/app/api/qna/list/route.ts
@@ -17,7 +17,7 @@ export async function GET(request: Request) {
 
   try {
     const response = await axios.get(`${process.env.NEXT_PUBLIC_INQUIRY_API_URL}/api/qna/list?${queryStringFormatter(params)}`)
-
+    console.log('response.data:: ', response.data)
     if (response.status === 200) {
       return NextResponse.json(response.data)
     }
diff --git a/src/app/api/qna/save/route.ts b/src/app/api/qna/save/route.ts
index e16593a..dd4edaa 100644
--- a/src/app/api/qna/save/route.ts
+++ b/src/app/api/qna/save/route.ts
@@ -2,13 +2,21 @@ import axios from 'axios'
 import { NextResponse } from 'next/server'
 
 export async function POST(request: Request) {
-  const body = await request.json()
+  const formData = await request.formData()
+  console.log('formData:: ', formData)
+  // const body = await request.json()
+  // console.log('body:: ', body)
 
-  const response = await axios.post(`${process.env.NEXT_PUBLIC_INQUIRY_API_URL}/api/qna/save`, body)
+  try {
+    const response = await axios.post(`${process.env.NEXT_PUBLIC_INQUIRY_API_URL}/api/qna/save`, formData)
+    console.log('response.data:: ', response.data)
 
-  if (response.status === 200) {
-    return NextResponse.json(response.data)
+    if (response.status === 200) {
+      return NextResponse.json(response.data)
+    }
+    return NextResponse.json({ error: response.data }, { status: response.status })
+  } catch (error) {
+    console.error('error:: ', error)
+    return NextResponse.json({ error: 'Failed to save qna' }, { status: 500 })
   }
-
-  return NextResponse.json({ error: 'Failed to save qna' }, { status: response.status })
 }
diff --git a/src/components/inquiry/Answer.tsx b/src/components/inquiry/Answer.tsx
index 485abde..4b44eb3 100644
--- a/src/components/inquiry/Answer.tsx
+++ b/src/components/inquiry/Answer.tsx
@@ -1,8 +1,9 @@
 'use client'
 
+import { useInquiry } from '@/hooks/useInquiry'
 import { Inquiry } from '@/types/Inquiry'
 
-export default function Answer({ inquiryDetail }: { inquiryDetail: Inquiry}) {
+export default function Answer({ inquiryDetail, downloadFile }: { inquiryDetail: Inquiry; downloadFile: (encodeFileNo: number) => Promise<File> }) {
   return (
     <>
       <div className="inquiry-answer-wrap">
@@ -21,7 +22,7 @@ export default function Answer({ inquiryDetail }: { inquiryDetail: Inquiry}) {
           <ul className="file-list">
             {inquiryDetail?.ansListFile?.map((file) => (
               <li className="file-item" key={file.fileNo}>
-                <button className="file-item-bx">
+                <button className="file-item-bx" onClick={() => downloadFile(Number(file.encodeFileNo))}>
                   <div className="file-item-name">{file.srcFileNm} </div>
                 </button>
               </li>
diff --git a/src/components/inquiry/Detail.tsx b/src/components/inquiry/Detail.tsx
index a983bca..717b714 100644
--- a/src/components/inquiry/Detail.tsx
+++ b/src/components/inquiry/Detail.tsx
@@ -12,7 +12,7 @@ export default function Detail() {
   const params = useParams()
   const id = params.id
 
-  const { inquiryDetail } = useInquiry(Number(id), '5200')
+  const { inquiryDetail, downloadFile } = useInquiry(Number(id), '5200')
   const router = useRouter()
 
   return (
@@ -66,7 +66,7 @@ export default function Detail() {
             <ul className="file-list">
               {inquiryDetail?.listFile?.map((file) => (
                 <li className="file-item">
-                  <button className="file-item-bx">
+                  <button className="file-item-bx" onClick={() => downloadFile(Number(file.encodeFileNo))}>
                     <div className="file-item-name">{file.srcFileNm} </div>
                   </button>
                 </li>
@@ -75,7 +75,7 @@ export default function Detail() {
           </div>
         </div>
 
-        {inquiryDetail?.answerYn === 'Y' && inquiryDetail && <Answer inquiryDetail={inquiryDetail} />}
+        {inquiryDetail?.answerYn === 'Y' && inquiryDetail && <Answer inquiryDetail={inquiryDetail} downloadFile={downloadFile} />}
 
         <div className="sale-edit-btn">
           <button className="btn-frame n-blue icon" onClick={() => router.push('/inquiry/list')}>
diff --git a/src/components/inquiry/RegistForm.tsx b/src/components/inquiry/RegistForm.tsx
index db2d92f..9245e9a 100644
--- a/src/components/inquiry/RegistForm.tsx
+++ b/src/components/inquiry/RegistForm.tsx
@@ -11,7 +11,7 @@ export default function RegistForm() {
   const { session } = useSessionStore()
   const router = useRouter()
 
-  /// TODO: 세션 정보 적용
+  // TODO: 세션 정보 적용 | 현재는 test용 정보 적용
   // useEffect(() => {
   //   setInquiryRequest({ ...inquiryRequest, regId: session?.userId ?? '', regUserNm: session?.userNm ?? '' })
   // }, [session])
@@ -24,7 +24,7 @@ export default function RegistForm() {
     qnaClsSmlCd: null,
     title: '',
     contents: null,
-    regId: '',
+    regId: 'X112',
     regUserNm: 'TEST',
     regUserTelNo: null,
     storeId: null,
@@ -46,7 +46,7 @@ export default function RegistForm() {
 
   const handleSubmit = async () => {
     if (confirm('お問い合わせを登録しますか？ Hanwha Japanの担当者にお問い合わせメールが送信されます。')) {
-      const res = await saveInquiry(inquiryRequest)
+      const res = await saveInquiry({ inquiryRequest, files: attachedFiles })
       alert('保存されました。')
       router.push(`/inquiry/${res.qnaNo}`)
     }
diff --git a/src/hooks/useInquiry.ts b/src/hooks/useInquiry.ts
index 17c3099..1314dee 100644
--- a/src/hooks/useInquiry.ts
+++ b/src/hooks/useInquiry.ts
@@ -12,7 +12,8 @@ export function useInquiry(
   inquiryDetail: Inquiry | null
   isLoadingInquiryDetail: boolean
   isSavingInquiry: boolean
-  saveInquiry: (inquiryRequest: InquiryRequest) => Promise<InquirySaveResponse>
+  saveInquiry: (params: { inquiryRequest: InquiryRequest; files: File[] }) => Promise<InquirySaveResponse>
+  downloadFile: (encodeFileNo: number) => Promise<File>
 } {
   const { session } = useSessionStore()
   const queryClient = useQueryClient()
@@ -50,8 +51,16 @@ export function useInquiry(
   })
 
   const { mutateAsync: saveInquiry, isPending: isSavingInquiry } = useMutation({
-    mutationFn: async (inquiryRequest: InquiryRequest) => {
-      const resp = await axiosInstance(null).post<{ data: InquirySaveResponse }>('/api/qna/save', inquiryRequest)
+    mutationFn: async ({ inquiryRequest, files }: { inquiryRequest: InquiryRequest; files: File[] }) => {
+      const formData = new FormData()
+      Object.entries(inquiryRequest).forEach(([key, value]) => {
+        formData.append(key, value ?? '')
+      })
+      files.forEach((file) => {
+        formData.append('files', file)
+      })
+
+      const resp = await axiosInstance(null).post<{ data: InquirySaveResponse }>('/api/qna/save', formData)
       return resp.data.data
     },
     onSuccess: () => {
@@ -59,6 +68,11 @@ export function useInquiry(
     },
   })
 
+  const downloadFile = async (encodeFileNo: number) => {
+    const resp = await axiosInstance(null).get<File>(`/api/qna/file`, { params: { encodeFileNo } })
+    return resp.data
+  }
+
   return {
     inquiryList: inquiryList ?? [],
     inquiryDetail: inquiryDetail ?? null,
@@ -66,5 +80,6 @@ export function useInquiry(
     isLoadingInquiryDetail,
     isSavingInquiry,
     saveInquiry,
+    downloadFile,
   }
 }