admin/ocr-nextjs
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

파일 업로드 수정, css 고치기

Browse Source
This commit is contained in:
root
2026-01-25 17:10:02 +09:00
parent 497ac11f26
commit 48f706cc42
3 changed files with 20 additions and 13 deletions
Download Patch File Download Diff File Expand all files Collapse all files

26
src/app/components/ImgInputForm.client.tsx
View File

@@ -11,40 +11,48 @@ const ImgInputForm_client = () => {
isLogin isLogin
}) })
const fileRef = useRef(null) const fileRef = useRef<HTMLInputElement|null>(null)
const [fileName, setFileName] = useState('') const [fileName, setFileName] = useState('')
const [preview, setPreview] = useState<String|null>()
const imgInput = (e: React.ChangeEvent<HTMLInputElement>) => { const imgInput = (e: React.ChangeEvent<HTMLInputElement>) => {
const selected = e.target.files?.[0]; const selected = e.target.files?.[0];
if (selected != null) { if (selected != null) {
setFileName(selected?.name) setFileName(selected?.name)
setPreview(URL.createObjectURL(selected))
} }
} }
const inputFileClick = () => {
const file = fileRef.current;
if (file) file.click()
}
const confirm = () => { const confirm = () => {
} }
return ( return (
<> <>
<div className="flex items-center gap-3">
{ preview &&
<img src={preview} />
}
</div>
<div className="flex items-center gap-3"> <div className="flex items-center gap-3">
<input type="text" <input type="text"
readOnly readOnly
onClick={() => { value={fileName}
if (fileRef != null) { onClick={inputFileClick}
fileRef.current.click() className="w-lg px-3 py-2 border rounded h-10
}
}}
className="w-full px-3 py-2 border rounded
cursor-pointer cursor-pointer
bg-white bg-white
text-gray-700 text-gray-700
focus:outline-none focus:outline-none
focus:ring-2 focus:ring-indigo-500" /> focus:ring-2 focus:ring-indigo-500" />
<input type="file" ref={fileRef} className="hidden" accept="image/*" onChange={imgInput} /> <input type="file" ref={fileRef} className="hidden" accept="image/*" onChange={imgInput} />
<input type="button" value={'확인'} onClick={confirm}/> <button onClick={confirm} className="w-10 h-10 border rounded text-gray-700">확인</button>
</div> </div>
</> </>

1
src/app/globals.css
View File

@@ -3,6 +3,7 @@
:root { :root {
--background: #ffffff; --background: #ffffff;
--foreground: #171717; --foreground: #171717;
height: 100%;
} }
@theme inline { @theme inline {

6
src/app/layout.tsx
View File

@@ -23,10 +23,8 @@ export default function RootLayout({
children: React.ReactNode; children: React.ReactNode;
}>) { }>) {
return ( return (
<html lang="en"> <html lang="ko" className="h-full">
<body <body className={`${geistSans.variable} ${geistMono.variable} antialiased h-full min-h-screen`} >
className={`${geistSans.variable} ${geistMono.variable} antialiased`}
>
{children} {children}
</body> </body>
</html> </html>