44 lines
1.4 KiB
TypeScript
44 lines
1.4 KiB
TypeScript
/* =============================================================================
|
|
* E03_StabSection_UI_Table.ts
|
|
* E03 표 하나(553-4) — 표 부품(`ui_template_table` · 데이터표 줄 28)을 부르고 촬영 장면 · 시험이 잡는
|
|
* 걸이(`table.e03-table[data-role]` · `tr`)만 얹음. 모양은 부품 · 여기는 CSS 없음.
|
|
* ========================================================================== */
|
|
|
|
import { createTable, type Cell } from "@ui/ui_template_table";
|
|
|
|
export interface E03Column {
|
|
label: string;
|
|
/** 수 칸 — 오른쪽 맞춤 */
|
|
num?: boolean;
|
|
/** 마우스 글 */
|
|
title?: string;
|
|
}
|
|
|
|
export interface E03TableHandle {
|
|
/** 표 감싸개(`.ui-table-wrap`) */
|
|
root: HTMLElement;
|
|
table: HTMLTableElement;
|
|
rows: HTMLTableRowElement[];
|
|
}
|
|
|
|
export function e03Table(
|
|
columns: E03Column[],
|
|
rows: Cell[][],
|
|
role?: string,
|
|
extraClass?: string,
|
|
): E03TableHandle {
|
|
const root = createTable(
|
|
columns.map((c) => ({ label: c.label, ...(c.num ? { align: "end" as const } : {}) })),
|
|
rows,
|
|
{ density: "data" },
|
|
);
|
|
const table = root.querySelector("table") as HTMLTableElement;
|
|
table.classList.add("e03-table");
|
|
if (extraClass) table.classList.add(...extraClass.split(" "));
|
|
if (role) table.dataset.role = role;
|
|
columns.forEach((c, i) => {
|
|
if (c.title) table.tHead?.rows[0].cells[i].setAttribute("title", c.title);
|
|
});
|
|
return { root, table, rows: [...table.tBodies[0].rows] };
|
|
}
|