fix:분개 모달 금액 입력에 자동 콤마 포맷팅 추가
- 금액 입력 시 3자리마다 콤마 자동 추가 - type="number" → type="text"로 변경 - 금액 우측 정렬 (text-right) - formatAmountInput/parseAmountInput 헬퍼 함수 추가 Co-Authored-By: Claude Opus 4.5 <noreply@anthropic.com>
This commit is contained in:
@@ -366,6 +366,18 @@ className={`px-3 py-1.5 text-xs cursor-pointer hover:bg-purple-50 ${
|
||||
|
||||
const formatCurrency = (val) => new Intl.NumberFormat('ko-KR').format(val || 0);
|
||||
|
||||
// 금액 입력 포맷팅 (콤마 추가)
|
||||
const formatAmountInput = (value) => {
|
||||
if (!value && value !== 0) return '';
|
||||
return new Intl.NumberFormat('ko-KR').format(value);
|
||||
};
|
||||
|
||||
// 금액 입력값 파싱 (콤마 제거)
|
||||
const parseAmountInput = (value) => {
|
||||
const cleaned = String(value).replace(/[^0-9.-]/g, '');
|
||||
return parseFloat(cleaned) || 0;
|
||||
};
|
||||
|
||||
return (
|
||||
<div className="fixed inset-0 bg-black/50 flex items-center justify-center z-50">
|
||||
<div className="bg-white rounded-xl shadow-xl w-full max-w-2xl max-h-[90vh] overflow-hidden">
|
||||
@@ -402,10 +414,11 @@ className={`px-3 py-1.5 text-xs cursor-pointer hover:bg-purple-50 ${
|
||||
<div>
|
||||
<label className="block text-xs text-stone-500 mb-1">금액</label>
|
||||
<input
|
||||
type="number"
|
||||
value={split.amount}
|
||||
onChange={(e) => updateSplit(index, { amount: parseFloat(e.target.value) || 0 })}
|
||||
className="w-full px-3 py-2 border border-stone-200 rounded-lg text-sm focus:ring-2 focus:ring-purple-500 outline-none"
|
||||
type="text"
|
||||
value={formatAmountInput(split.amount)}
|
||||
onChange={(e) => updateSplit(index, { amount: parseAmountInput(e.target.value) })}
|
||||
className="w-full px-3 py-2 border border-stone-200 rounded-lg text-sm text-right focus:ring-2 focus:ring-purple-500 outline-none"
|
||||
placeholder="0"
|
||||
/>
|
||||
</div>
|
||||
<div>
|
||||
|
||||
Reference in New Issue
Block a user