fix(RepeaterTable): 숫자 필드 포맷팅 로직 개선

- 정수/소수점 자동 구분 처리
- 천 단위 구분자(toLocaleString) 적용
- null/undefined/NaN 예외 처리 추가
This commit is contained in:
SeongHyun Kim 2025-12-17 17:04:45 +09:00
parent 52db6fd43c
commit 6dcace3135
1 changed files with 28 additions and 4 deletions

View File

@ -347,12 +347,23 @@ export function RepeaterTable({
// 계산 필드는 편집 불가 // 계산 필드는 편집 불가
if (column.calculated || !column.editable) { if (column.calculated || !column.editable) {
// 숫자 포맷팅 함수: 정수/소수점 자동 구분
const formatNumber = (val: any): string => {
if (val === undefined || val === null || val === "") return "0";
const num = typeof val === "number" ? val : parseFloat(val);
if (isNaN(num)) return "0";
// 정수면 소수점 없이, 소수면 소수점 유지
if (Number.isInteger(num)) {
return num.toLocaleString("ko-KR");
} else {
return num.toLocaleString("ko-KR");
}
};
return ( return (
<div className="px-2 py-1"> <div className="px-2 py-1">
{column.type === "number" {column.type === "number"
? typeof value === "number" ? formatNumber(value)
? value.toLocaleString()
: value || "0"
: value || "-"} : value || "-"}
</div> </div>
); );
@ -361,10 +372,23 @@ export function RepeaterTable({
// 편집 가능한 필드 // 편집 가능한 필드
switch (column.type) { switch (column.type) {
case "number": case "number":
// 숫자 표시: 정수/소수점 자동 구분
const displayValue = (() => {
if (value === undefined || value === null || value === "") return "";
const num = typeof value === "number" ? value : parseFloat(value);
if (isNaN(num)) return "";
// 정수면 소수점 없이, 소수면 소수점 유지
if (Number.isInteger(num)) {
return num.toString();
} else {
return num.toString();
}
})();
return ( return (
<Input <Input
type="number" type="number"
value={value || ""} value={displayValue}
onChange={(e) => onChange={(e) =>
handleCellEdit(rowIndex, column.field, parseFloat(e.target.value) || 0) handleCellEdit(rowIndex, column.field, parseFloat(e.target.value) || 0)
} }