1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
|
'use client'
import * as React from 'react'
import { importExcel } from '@/lib/s-erp-import/actions'
import { RPAInfo } from './rpa-info'
export function ImportButton({ tableName, count }: { tableName: string; count: number }) {
const [pending, setPending] = React.useState(false)
const [currentCount, setCurrentCount] = React.useState(count)
const [statusMsg, setStatusMsg] = React.useState<string | null>(null)
const fileInputRef = React.useRef<HTMLInputElement>(null)
const onClickImport = () => fileInputRef.current?.click()
const onFileChange = async (e: React.ChangeEvent<HTMLInputElement>) => {
const file = e.target.files?.[0]
if (!file) return
setPending(true)
try {
console.log(`[SAP Import] 시작: ${tableName}, 파일: ${file.name}, 크기: ${file.size} bytes`)
const res = await importExcel(tableName, file)
if (res?.success) {
setCurrentCount((c) => c + (res.inserted ?? 0))
console.log(`[SAP Import] 성공: ${tableName}, 입력 건수: ${res.inserted ?? 0}`)
setStatusMsg(`${res.inserted ?? 0}건`)
} else {
console.error(`[SAP Import] 실패: ${tableName}, 사유: ${res?.message ?? '임포트 실패'}`)
if ((res as any)?.unknownHeaders) {
console.error(`[SAP Import] 매핑 실패 헤더:`, (res as any).unknownHeaders)
}
if ((res as any)?.errors) {
console.error(`[SAP Import] 유효성 오류 상세:`, (res as any).errors)
}
setStatusMsg(`데이터 저장에 실패하였습니다.`)
}
} catch (err: any) {
console.error(`[SAP Import] 예외 발생: ${tableName}, 에러: ${err?.message ?? err}`)
setStatusMsg(`데이터 저장에 실패하였습니다.`)
} finally {
console.log(`[SAP Import] 종료: ${tableName}`)
setPending(false)
e.target.value = ''
}
}
return (
<div
className="border rounded p-4"
data-testid={`import-controls-${tableName}`}
data-table-name={tableName}
data-current-count={currentCount}
>
<div className="flex items-center gap-6">
<button
onClick={onClickImport}
disabled={pending}
className="w-[300px] py-2 border rounded hover:bg-gray-100 transition-colors duration-200"
data-testid={`upload-button-${tableName}`}
data-table-name={tableName}
data-action="upload"
data-status={pending ? 'uploading' : 'idle'}
data-button-text={tableName}
>
{tableName}
</button>
{statusMsg && (
<span
className="text-base"
data-testid={`status-message-${tableName}`}
data-table-name={tableName}
data-message={statusMsg}
>
{statusMsg}
</span>
)}
<input
ref={fileInputRef}
type="file"
accept=".xlsx,.xls"
className="hidden"
onChange={onFileChange}
data-testid={`file-input-${tableName}`}
data-table-name={tableName}
data-file-types=".xlsx,.xls"
/>
</div>
<RPAInfo tableName={tableName} count={currentCount} />
</div>
)
}
|
