feat: 테이블 card 모드 옵션 + pivot 풍부한 필드 타입 추가 (T2 인프라)
5 viewMode 통합 (table/split/grouped/pivot/card) 의 첫 단계. types.ts 만. 다음 단계에서 본체 흡수 + ConfigPanel UI + dead code 정리. card 모드 옵션 (TableConfig 신규) - cardsPerRow, cardSpacing - cardStyle: showTitle/Subtitle/Description/Image/imagePosition/Size/showActions - cardColumnMapping: titleColumn/subtitleColumn/descriptionColumn/imageColumn/ displayColumns/actionColumns pivot 모드 풍부한 필드 (TableConfig 의 pivotFields, PivotFieldConfig 신규) - area: row/column/data/filter - summaryType (sum/count/avg/min/max/countDistinct) - summaryDisplayMode 10종 (absoluteValue / percentOfColumnTotal / runningTotal 등) - groupInterval (year/quarter/month/week/day) - 기존 단순 pivotRows/pivotColumns/pivotValues 도 호환 유지 Codex 솔루션 정의 단계 GO + 단계별 commit 권고. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
This commit is contained in:
@@ -47,6 +47,87 @@ export interface TablePagination {
|
||||
pageSizeOptions?: number[];
|
||||
}
|
||||
|
||||
// ─── card 모드 보조 타입 ─────────────────────────────────────────────
|
||||
|
||||
export interface TableCardStyleConfig {
|
||||
showTitle?: boolean;
|
||||
showSubtitle?: boolean;
|
||||
showDescription?: boolean;
|
||||
showImage?: boolean;
|
||||
maxDescriptionLength?: number;
|
||||
imagePosition?: "top" | "left" | "right";
|
||||
imageSize?: "small" | "medium" | "large";
|
||||
showActions?: boolean;
|
||||
showViewButton?: boolean;
|
||||
showEditButton?: boolean;
|
||||
showDeleteButton?: boolean;
|
||||
}
|
||||
|
||||
export interface TableCardColumnMapping {
|
||||
titleColumn?: string;
|
||||
subtitleColumn?: string;
|
||||
descriptionColumn?: string;
|
||||
imageColumn?: string;
|
||||
/** 본문에 한 줄씩 더 노출할 컬럼들 */
|
||||
displayColumns?: string[];
|
||||
/** 액션 버튼 셀로 표시할 컬럼들 */
|
||||
actionColumns?: string[];
|
||||
}
|
||||
|
||||
// ─── pivot 모드 풍부한 필드 정의 ───────────────────────────────────
|
||||
|
||||
export type PivotAreaType = "row" | "column" | "data" | "filter";
|
||||
export type PivotAggregationType =
|
||||
| "sum"
|
||||
| "count"
|
||||
| "avg"
|
||||
| "min"
|
||||
| "max"
|
||||
| "countDistinct";
|
||||
export type PivotSummaryDisplayMode =
|
||||
| "absoluteValue"
|
||||
| "percentOfColumnTotal"
|
||||
| "percentOfRowTotal"
|
||||
| "percentOfGrandTotal"
|
||||
| "percentOfColumnGrandTotal"
|
||||
| "percentOfRowGrandTotal"
|
||||
| "runningTotalByRow"
|
||||
| "runningTotalByColumn"
|
||||
| "differenceFromPrevious"
|
||||
| "percentDifferenceFromPrevious";
|
||||
export type PivotDateGroupInterval = "year" | "quarter" | "month" | "week" | "day";
|
||||
export type PivotSortDirection = "asc" | "desc" | "none";
|
||||
export type PivotFieldDataType = "string" | "number" | "date" | "boolean";
|
||||
|
||||
export interface PivotFieldFormat {
|
||||
type: "number" | "currency" | "percent" | "date" | "text";
|
||||
precision?: number;
|
||||
thousandSeparator?: boolean;
|
||||
prefix?: string;
|
||||
suffix?: string;
|
||||
dateFormat?: string;
|
||||
}
|
||||
|
||||
export interface PivotFieldConfig {
|
||||
field: string;
|
||||
caption: string;
|
||||
area: PivotAreaType;
|
||||
areaIndex?: number;
|
||||
dataType?: PivotFieldDataType;
|
||||
summaryType?: PivotAggregationType;
|
||||
summaryDisplayMode?: PivotSummaryDisplayMode;
|
||||
showValuesAs?: PivotSummaryDisplayMode;
|
||||
sortBy?: "value" | "caption";
|
||||
sortOrder?: PivotSortDirection;
|
||||
sortBySummary?: string;
|
||||
groupInterval?: PivotDateGroupInterval;
|
||||
groupName?: string;
|
||||
visible?: boolean;
|
||||
width?: number;
|
||||
expanded?: boolean;
|
||||
format?: PivotFieldFormat;
|
||||
}
|
||||
|
||||
export interface TableConfig extends ComponentConfig {
|
||||
/** 연결된 테이블명 (DB) */
|
||||
selectedTable?: string;
|
||||
@@ -90,6 +171,22 @@ export interface TableConfig extends ComponentConfig {
|
||||
pivotColumns?: string[];
|
||||
/** pivot 모드: 값 집계 */
|
||||
pivotValues?: { column: string; aggregation: "sum" | "count" | "avg" | "min" | "max" }[];
|
||||
/**
|
||||
* pivot 모드: 풍부한 필드 정의 (PivotFieldConfig).
|
||||
* row/column/data/filter 영역 + summaryDisplayMode (10종) + groupInterval 등.
|
||||
* 단순 pivotRows/pivotColumns/pivotValues 보다 우선 사용 (있으면).
|
||||
*/
|
||||
pivotFields?: PivotFieldConfig[];
|
||||
|
||||
// ─── card 모드 전용 ───
|
||||
/** card 모드: 한 줄에 표시할 카드 수 */
|
||||
cardsPerRow?: number;
|
||||
/** card 모드: 카드 간 간격 (px) */
|
||||
cardSpacing?: number;
|
||||
/** card 모드: 카드 시각 스타일 */
|
||||
cardStyle?: TableCardStyleConfig;
|
||||
/** card 모드: 데이터 컬럼 → 카드 영역 매핑 */
|
||||
cardColumnMapping?: TableCardColumnMapping;
|
||||
|
||||
// ─── 빈 상태 / 로딩 ───
|
||||
/** 빈 상태 메시지 */
|
||||
|
||||
Reference in New Issue
Block a user