blob: 55fc969ef82ff19db213cacbe399b4d6b9f3dec1 (
plain)
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
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
|
# 통화 선택기 컴포넌트
## 개요
Oracle 데이터베이스에서 통화 목록을 조회하고 선택할 수 있는 공통 컴포넌트입니다.
## 데이터 조회
통화 목록을 조회하고, 코드와 설명을 함께 제공해 선택하게 만듭니다.
```sql
SELECT CD.CD , NM.GRP_DSC
FROM CMCTB_CD CD , CMCTB_CDNM NM
WHERE CD.CD_CLF = NM.CD_CLF
AND CD.CD = NM.CD
AND CD.CD2 = NM.CD2
AND CD.CD3 = NM.CD3
AND CD.CD_CLF = 'SPB032'
ORDER BY USR_DF_CHAR_8 ASC, CD.CD ASC
```
## 소수점 자리수
각 통화별 입력가능 소수점 자리수를 자동으로 반환합니다.
- 원화(KRW): 0자리 (정수)
- 엔화(JPY): 0자리 (정수)
- 기타 통화: 2자리
## 컴포넌트 구성
### 1. CurrencySelector
기본 선택기 컴포넌트 (버튼 + 다이얼로그 통합형)
```tsx
import { CurrencySelector } from '@/components/common/selectors/currency'
<CurrencySelector
selectedCurrency={selectedCurrency}
onCurrencySelect={(currency) => {
console.log(currency.CURRENCY_CODE)
console.log(currency.CURRENCY_NAME)
console.log(currency.DECIMAL_PLACES) // 소수점 자리수
}}
placeholder="통화를 선택하세요"
disabled={false}
/>
```
### 2. CurrencySelectorSingleDialog
단일 선택 다이얼로그 (open 상태를 외부에서 제어)
```tsx
import { CurrencySelectorSingleDialog } from '@/components/common/selectors/currency'
<CurrencySelectorSingleDialog
open={isOpen}
onOpenChange={setIsOpen}
selectedCurrency={selectedCurrency}
onCurrencySelect={(currency) => console.log(currency)}
showConfirmButtons={true}
onConfirm={(currency) => console.log('확인:', currency)}
onCancel={() => console.log('취소')}
/>
```
### 3. CurrencySelectorMultiDialog
다중 선택 다이얼로그
```tsx
import { CurrencySelectorMultiDialog } from '@/components/common/selectors/currency'
<CurrencySelectorMultiDialog
open={isOpen}
onOpenChange={setIsOpen}
selectedCurrencies={selectedCurrencies}
onCurrenciesSelect={(currencies) => console.log(currencies)}
maxSelection={5}
onConfirm={(currencies) => console.log('확인:', currencies)}
onCancel={() => console.log('취소')}
/>
```
## Currency 타입
```typescript
interface Currency {
CURRENCY_CODE: string // 통화 코드 (예: KRW, USD, JPY)
CURRENCY_NAME: string // 통화 이름/설명
DECIMAL_PLACES: number // 입력가능 소수점 자리수
}
```
## 유틸리티 함수
### getDecimalPlaces
통화 코드에 따른 소수점 자리수를 반환합니다.
```tsx
import { getDecimalPlaces } from '@/components/common/selectors/currency'
const places = getDecimalPlaces('KRW') // 0
const places2 = getDecimalPlaces('USD') // 2
```
|
