diff --git a/apps/wr/app/store/ruseFcltMng/fcltReg/pbnstReg/index.tsx b/apps/wr/app/store/ruseFcltMng/fcltReg/pbnstReg/index.tsx index a616c8041..35458abd5 100644 --- a/apps/wr/app/store/ruseFcltMng/fcltReg/pbnstReg/index.tsx +++ b/apps/wr/app/store/ruseFcltMng/fcltReg/pbnstReg/index.tsx @@ -69,6 +69,7 @@ type pubFacActions = { pbnstInsert(pbnstRes: customPbnst): Promise; fileDelete: (atflCd: string) => void; fileDownLoad: (atflCd: string) => void; + fileDownLoadName: (atflCd: string, fileName: string) => void; pbnstRuseFcltUpdate: (ruseRes: customPbnst[]) => void; pbnstRuseBizUpdate: (ruseRes: fcBizType[]) => void; pubHasuSearch: (page: string, sggOrCity: string, searchTxt: string) => void; @@ -297,6 +298,34 @@ export const pubFacActionsExport: (set: any) => pubFacActions = (set: any) => { throw new Error(`Error downloading file: ${error}`); } }, + // 파일다운로드(원본 파일명 지정) : 화면에 보여지는 파일명으로 저장 + fileDownLoadName: async (atflCd: string, fileName: string) => { + try { + const response = await fetch( + `/attach-service/api/v1/atflcd/download/${atflCd}`, + { + method: "GET", + headers: { + accept: "application/octet-stream", + }, + } + ); + if (!response.ok) { + throw new Error(`오류 발생: ${response.status}`); + } + console.log(response); + const blob = await response.blob(); + const blobUrl = window.URL.createObjectURL(blob); + const a = document.createElement("a"); + a.href = blobUrl; + a.download = fileName || "downloaded_file"; + a.click(); + window.URL.revokeObjectURL(blobUrl); + } catch (error) { + console.error("Error downloading file with name:", error); + throw new Error(`Error downloading file with name: ${error}`); + } + }, //원수취수 팝업의 하수처리 시설 리스트 조회 getFcOrgwts: async (fcltPkList: string[], size: number) => { const fcOrgwtsNmList = await postFectch( diff --git a/apps/wr/components/ui/form/fcltReg/pbnstReg/mngReg/mngRegForm.tsx b/apps/wr/components/ui/form/fcltReg/pbnstReg/mngReg/mngRegForm.tsx index eef115a5c..85364f0d1 100644 --- a/apps/wr/components/ui/form/fcltReg/pbnstReg/mngReg/mngRegForm.tsx +++ b/apps/wr/components/ui/form/fcltReg/pbnstReg/mngReg/mngRegForm.tsx @@ -44,7 +44,7 @@ const diagramFileTypes = ".pdf,.jpg,.jpeg,.png,.bmp"; * - with-layout 적용 * - 하수처리시설에 하수재이용 시설 시설 정보를 등록한다. * - form으로 시설정보 및 차수별 정보의 컴포넌트 데이터를 관리한다 - * indexMng: 시설정보 + * indexMng: 재이용시설정보 * indexBiz: 차수별 정보 * 로 하수재이용 시설에 등록된 시설 및 차수별 정보를 관리한다. * */ @@ -61,7 +61,7 @@ export function PbnstMngForm({ setIndexMng: (index: number) => void; readonly: boolean; }) { - const { code, pbnst, fileDelete, fileDownLoad } = useWrStore( + const { code, pbnst, fileDelete, fileDownLoadName } = useWrStore( (state) => state ); const [planFiles, setPlanFiles] = useState(null); @@ -150,10 +150,10 @@ export function PbnstMngForm({ } else { fileList?.forEach((item, index) => { const idx = files?.indexOf(item.file); - if (idx < 0) { - setReFiles.splice(index); - fileDelete(item.atflCd as string); - } + if (idx < 0) { + setReFiles.splice(index, 1); + fileDelete(item.atflCd as string); + } }); } // eslint-disable-next-line @typescript-eslint/no-unused-expressions @@ -183,7 +183,7 @@ export function PbnstMngForm({ useEffect(() => { setRelationFiles([]); setPlanFiles([]); - console.log("indexMng ", indexMng); + // console.log("indexMng ", indexMng); const currentItem = form.getValues(`items.${indexMng}`); const defaultFiles = currentItem?.fcFiles || []; @@ -443,7 +443,7 @@ export function PbnstMngForm({ fileDownLoad(item.atflCd)} + onClick={() => fileDownLoadName(item.atflCd, item.file.name)} > {item.file.name} @@ -462,11 +462,12 @@ export function PbnstMngForm({ }} fileTypes={diagramFileTypes} onFileClick={(index) => { - fileDownLoad( - relationfiles?.find( - (item, fileIndex) => fileIndex === index - )?.atflCd as string + const target = relationfiles?.find( + (item, fileIndex) => fileIndex === index ); + if (target?.atflCd) { + fileDownLoadName(target.atflCd, target.file.name); + } }} > @@ -481,7 +482,7 @@ export function PbnstMngForm({ fileDownLoad(item.atflCd)} + onClick={() => fileDownLoadName(item.atflCd, item.file.name)} > {item.file.name} @@ -500,11 +501,12 @@ export function PbnstMngForm({ }} fileTypes={diagramFileTypes} onFileClick={(index) => { - fileDownLoad( - planFiles?.find( - (item, fileIndex) => fileIndex === index - )?.atflCd as string + const target = planFiles?.find( + (item, fileIndex) => fileIndex === index ); + if (target?.atflCd) { + fileDownLoadName(target.atflCd, target.file.name); + } }} > diff --git a/packages/common/business_components/src/ui/file-upload/lib/file_upload.tsx b/packages/common/business_components/src/ui/file-upload/lib/file_upload.tsx index 030ddda95..ede52a538 100644 --- a/packages/common/business_components/src/ui/file-upload/lib/file_upload.tsx +++ b/packages/common/business_components/src/ui/file-upload/lib/file_upload.tsx @@ -37,6 +37,7 @@ type FileUploaderContextType = { const FileUploaderContext = createContext(null); +//현재 value 배열에서 해당 index만 뺀 newFiles 생성 export const useFileUpload = () => { const context = useContext(FileUploaderContext); if (!context) { @@ -348,13 +349,16 @@ export const FileUploaderItem = forwardRef< {children}