iter(g264): 数据表格可自定义空状态文案

This commit is contained in:
HIsheR
2026-10-26 22:26:53 +08:00
parent 80671f846f
commit fe9f1fb9ec
6 changed files with 19 additions and 5 deletions
+1 -1
View File
@@ -140,7 +140,7 @@ export function dataTable<T extends { id: RowKey }>(props: DataTableProps<T>): H
if (busy()) return skeletonRows(); // 加载态优先:不看数据,避免闪出旧行
const sel = state().selection; // 读入依赖:选择变化即整表重绘(行数 = pageSize,代价可控)
const rows = visible().rows;
if (!rows.length) return [emptyRow(colspan, keyword, () => table.dispatch({ type: 'setFilter', key: filterKey, value: '' }))]; // 空状态:筛选词与内核筛选一起清
if (!rows.length) return [emptyRow(colspan, keyword, () => table.dispatch({ type: 'setFilter', key: filterKey, value: '' }), props.emptyText)]; // 空状态:筛选词与内核筛选一起清
return rows.map((row, i) => {
const key = visible().keys[i];
const selected = sel.includes(key);
+2 -2
View File
@@ -3,7 +3,7 @@ import type { Signal } from '@ui-arch/frame';
import { button } from './button.js';
/*** 表格空状态行:有筛选词说明是筛掉的并给一键清除,没有筛选词就是真没数据;两种语义不该混成一句话 ***/
export function emptyRow(colspan: number, keyword: Signal<string>, onClear: () => void): HTMLElement {
export function emptyRow(colspan: number, keyword: Signal<string>, onClear: () => void, emptyText = '暂无数据'): HTMLElement {
const q = keyword().trim(); // 读信号:筛选词变化时整表重绘会带上新文案
return h(
'tr',
@@ -11,7 +11,7 @@ export function emptyRow(colspan: number, keyword: Signal<string>, onClear: () =
h(
'td',
{ colspan },
h('span', { class: 'ua-empty-tip' }, q ? `没有符合「${q}」的行` : '暂无数据'),
h('span', { class: 'ua-empty-tip' }, q ? `没有符合「${q}」的行` : emptyText), // 无筛选词时用调用方文案,缺省「暂无数据」
q ? button({ label: '清除筛选', variant: 'ghost', onClick: () => { keyword(''); onClear(); } }) : null, // 清空信号与内核筛选
),
);
+1
View File
@@ -66,6 +66,7 @@ export interface DataTableProps<T> {
filterKey?: string; // 工具栏筛选的列;缺省取第一列
pageSize?: number; // 每页行数;缺省 5
pageSizes?: number[]; // 分页条「每页条数」候选;缺省 [5, 10, 20],当前 pageSize 不在候选里会自动补进去
emptyText?: string; // 无数据时的空状态文案(有筛选词时仍显示「没有符合「x」的行」);缺省「暂无数据」
selectable?: boolean; // 是否启用行选择列(含全选三态与已选计数);缺省 false
page?: Signal<number>; // 受控页码信号:与内核分页双向同步,可接独立 pagination 组件联动
loading?: boolean | Signal<boolean>; // 加载态:为真时数据行换成骨架行,筛选与翻页禁用
+6
View File
@@ -1920,6 +1920,12 @@
"d": "分页条「每页条数」候选档;缺省 [5, 10, 20],当前 pageSize 不在候选里会自动补进去",
"df": "[5, 10, 20]"
},
{
"n": "emptyText",
"t": "string",
"d": "无数据时的空状态文案;有筛选词时仍显示「没有符合「x」的行」并给一键清除(两种语义不混用)",
"df": "暂无数据"
},
{
"n": "selectable",
"t": "boolean",