feat: fileUploadFrom.tsx 파일명 width 수정 및 페이지 적용

apps/sn/app/components/ui/fileUploadForm.tsx

@@ -43,7 +43,7 @@ const FileUploadForm = ({ onSubmit, showButton = true, showPreview = false, acce
         <div> {/* 컴포넌트 루트 div */}
             <div className="card p-6"> {/* 카드 스타일링 */}
                 <div className='flex items-center gap-2'> {/* FileUploader와 Button을 정렬하는 메인 flex 컨테이너 */}
-                    <div className="w-[220px] mr-4"> {/* FileUploader의 너비와 오른쪽 여백을 제어하는 컨테이너 */}
+                    <div className="w-[300px] mr-4"> {/* FileUploader의 너비와 오른쪽 여백을 제어하는 컨테이너 */}
                         <FileUploader
                             id={uniqueId}
                             className="!h-auto !max-w-none flex-row items-center gap-2"

apps/sn/app/components/ui/operFileUploadForm.tsx

@@ -6,6 +6,7 @@ import type { HttpResponse, Upload } from "tus-js-client";
 import { FileUploader } from "@common/components";
 import { handleUpload } from "@utils";
 import { set } from 'react-hook-form';
+import FileUploadForm from './fileUploadForm';
 
 const operFileUploadForm = ({ title, onSubmit }: { title: string, onSubmit: (files: string, year: string, quarter: string, code:string, id:string) => void }) => {
     const [atflCd, setAtflCd] = useState<string | null>(null);
@@ -52,53 +53,11 @@ const operFileUploadForm = ({ title, onSubmit }: { title: string, onSubmit: (fil
                             selectArray={quater}
                             onSelectValue={(value: string | number) => setSelectedQuarter(String(value))}
                         />
-                        <div className='flex ml-5 items-center'>
-                            <div className="w-[80px] mr-4">
-                                <FileUploader
-                                id="atflCd"
-                                className="!h-auto !max-w-none flex-col !items-start"
-                                accept=".jpeg,.jpg,.png"
-                                onUpload={(e) => {
-                                    const selectedFiles = e.target.files;
-                                    if (!selectedFiles) return;
-
-                                    setFiles(selectedFiles);
-                                    if (selectedFiles[0]) {
-                                        handleUpload(selectedFiles, {
-                                            handleUploadStart: setUpload,
-                                            handleSuccess: setUpload,
-                                            handleResponse: handleUploadResponse(selectedFiles[0]),
-                                        });
-                                    }
-
-                                }}
-                                customPreview={<></>}
-                                />
-                            </div>
-                            <Button
-                                className="px-4 py-2 bg-blue-600 text-white rounded-sm text-sm font-medium hover:bg-blue-700"
-                                size="sm"
-                                onClick={() => {
-                                    console.log(files?.[0]?.name)
-                                    if (!files) {
-                                        alert('파일을 선택해주세요.');
-                                        return;
-                                    }
-                                    if (!selectedYear) {
-                                        alert('등록년도를 선택해주세요.');
-                                        return;
-                                    }
-                                    if (!selectedQuarter) {
-                                        alert('분기를 선택해주세요.');
-                                        return;
-                                    }
-                                    const fileNm = files?.[0]?.name || '';
-                                    onSubmit(fileNm, selectedYear, selectedQuarter, atflCd || '', atflId || '');
-                                }}
-                            >
-                                등록
-                            </Button>
-                        </div>
+                        <FileUploadForm
+                            onSubmit={onSubmit}
+                            showButton={true}
+                            showPreview={true}
+                            accept={""} />
                     </div>
                 </div>
             </div>