From 127f4dc783d035dc94285c80289235fb54325e72 Mon Sep 17 00:00:00 2001 From: kjs Date: Thu, 4 Dec 2025 13:37:17 +0900 Subject: [PATCH] =?UTF-8?q?=EC=88=AB=EC=9E=90=EC=BB=AC=EB=9F=BC=20?= =?UTF-8?q?=EC=B2=9C=EB=8B=A8=EC=9C=84=20=EA=B5=AC=EB=B6=84=EC=9E=90=20?= =?UTF-8?q?=EC=84=A4=EC=A0=95=20=EC=B6=94=EA=B0=80?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../table-list/TableListComponent.tsx | 25 ++- .../table-list/TableListConfigPanel.tsx | 179 ++++++++++-------- .../registry/components/table-list/types.ts | 3 + 3 files changed, 124 insertions(+), 83 deletions(-) diff --git a/frontend/lib/registry/components/table-list/TableListComponent.tsx b/frontend/lib/registry/components/table-list/TableListComponent.tsx index 261fa108..7f6fded5 100644 --- a/frontend/lib/registry/components/table-list/TableListComponent.tsx +++ b/frontend/lib/registry/components/table-list/TableListComponent.tsx @@ -1906,12 +1906,16 @@ export const TableListComponent: React.FC = ({ return "-"; } - // 숫자 타입 포맷팅 + // 숫자 타입 포맷팅 (천단위 구분자 설정 확인) if (inputType === "number" || inputType === "decimal") { if (value !== null && value !== undefined && value !== "") { const numValue = typeof value === "string" ? parseFloat(value) : value; if (!isNaN(numValue)) { - return numValue.toLocaleString("ko-KR"); + // thousandSeparator가 false가 아닌 경우(기본값 true) 천단위 구분자 적용 + if (column.thousandSeparator !== false) { + return numValue.toLocaleString("ko-KR"); + } + return String(numValue); } } return String(value); @@ -1922,7 +1926,11 @@ export const TableListComponent: React.FC = ({ if (value !== null && value !== undefined && value !== "") { const numValue = typeof value === "string" ? parseFloat(value) : value; if (!isNaN(numValue)) { - return numValue.toLocaleString("ko-KR"); + // thousandSeparator가 false가 아닌 경우(기본값 true) 천단위 구분자 적용 + if (column.thousandSeparator !== false) { + return numValue.toLocaleString("ko-KR"); + } + return String(numValue); } } return String(value); @@ -1939,10 +1947,15 @@ export const TableListComponent: React.FC = ({ } } return "-"; - case "number": - return typeof value === "number" ? value.toLocaleString() : value; case "currency": - return typeof value === "number" ? `₩${value.toLocaleString()}` : value; + if (typeof value === "number") { + // thousandSeparator가 false가 아닌 경우(기본값 true) 천단위 구분자 적용 + if (column.thousandSeparator !== false) { + return `₩${value.toLocaleString()}`; + } + return `₩${value}`; + } + return value; case "boolean": return value ? "예" : "아니오"; default: diff --git a/frontend/lib/registry/components/table-list/TableListConfigPanel.tsx b/frontend/lib/registry/components/table-list/TableListConfigPanel.tsx index 9de2f6d8..6e6c414f 100644 --- a/frontend/lib/registry/components/table-list/TableListConfigPanel.tsx +++ b/frontend/lib/registry/components/table-list/TableListConfigPanel.tsx @@ -1074,86 +1074,111 @@ export const TableListConfigPanel: React.FC = ({ {/* 간결한 리스트 형식 컬럼 설정 */}
- {config.columns?.map((column, index) => ( -
- {/* 컬럼명 */} - - {availableColumns.find((col) => col.columnName === column.columnName)?.label || - column.displayName || - column.columnName} - + {config.columns?.map((column, index) => { + // 해당 컬럼의 input_type 확인 + const columnInfo = availableColumns.find((col) => col.columnName === column.columnName); + const isNumberType = columnInfo?.input_type === "number" || columnInfo?.input_type === "decimal"; + + return ( +
+
+ {/* 컬럼명 */} + + {columnInfo?.label || column.displayName || column.columnName} + + + {/* 숫자 타입인 경우 천단위 구분자 설정 */} + {isNumberType && ( +
+ { + updateColumn(column.columnName, { thousandSeparator: checked as boolean }); + }} + className="h-3 w-3" + /> + +
+ )} +
- {/* 필터 체크박스 + 순서 변경 + 삭제 버튼 */} -
- f.columnName === column.columnName) || false} - onCheckedChange={(checked) => { - const currentFilters = config.filter?.filters || []; - const columnLabel = - availableColumns.find((col) => col.columnName === column.columnName)?.label || - column.displayName || - column.columnName; + {/* 필터 체크박스 + 순서 변경 + 삭제 버튼 */} +
+ f.columnName === column.columnName) || false} + onCheckedChange={(checked) => { + const currentFilters = config.filter?.filters || []; + const columnLabel = + columnInfo?.label || column.displayName || column.columnName; - if (checked) { - // 필터 추가 - handleChange("filter", { - ...config.filter, - enabled: true, - filters: [ - ...currentFilters, - { - columnName: column.columnName, - label: columnLabel, - type: "text", - }, - ], - }); - } else { - // 필터 제거 - handleChange("filter", { - ...config.filter, - filters: currentFilters.filter((f) => f.columnName !== column.columnName), - }); - } - }} - className="h-3 w-3" - /> + if (checked) { + // 필터 추가 + handleChange("filter", { + ...config.filter, + enabled: true, + filters: [ + ...currentFilters, + { + columnName: column.columnName, + label: columnLabel, + type: "text", + }, + ], + }); + } else { + // 필터 제거 + handleChange("filter", { + ...config.filter, + filters: currentFilters.filter((f) => f.columnName !== column.columnName), + }); + } + }} + className="h-3 w-3" + /> +
+ + {/* 순서 변경 + 삭제 버튼 */} +
+ + + +
- - {/* 순서 변경 + 삭제 버튼 */} -
- - - -
-
- ))} + ); + })}
)} diff --git a/frontend/lib/registry/components/table-list/types.ts b/frontend/lib/registry/components/table-list/types.ts index 0322926b..b69b9238 100644 --- a/frontend/lib/registry/components/table-list/types.ts +++ b/frontend/lib/registry/components/table-list/types.ts @@ -59,6 +59,9 @@ export interface ColumnConfig { isEntityJoin?: boolean; // Entity 조인된 컬럼인지 여부 entityJoinInfo?: EntityJoinInfo; // Entity 조인 상세 정보 + // 숫자 포맷팅 설정 + thousandSeparator?: boolean; // 천단위 구분자 사용 여부 (기본: true) + // 🎯 엔티티 컬럼 표시 설정 (화면별 동적 설정) entityDisplayConfig?: { displayColumns: string[]; // 표시할 컬럼들 (기본 테이블 + 조인 테이블)