TableThemeConfig
/**
* 表格主题配置
*/
export interface TableThemeConfig {
border: boolean | string;
stripe: boolean;
isCurrent: boolean;
isHover: boolean;
/**
* 表格列主题配置
*/
column: Partial<TableColumnThemeConfig>;
}
/**
* 表格列主题配置
*/
export interface TableColumnThemeConfig {
/**
* <h3>最小宽度</h3>
* <ul>
* <li>boolean: enabled column width auto compute</li>
* <li>number: using css width (default: px)</li>
* <li>string: using css width</li>
* <li>
* object: auto compute width for label by default function
* <ul>
* <li>min: min min width (default: 120)</li>
* <li>max: max min width (default: 432)</li>
* <li>chineseWidth: chinese width (default: 14 -> fontSize: 14px)</li>
* <li>otherWidth: non chinese width (default: 9 -> fontSize: 14px)</li>
* <li>sortableFixWidth: sortable handle width (default: 40)</li>
* <li>nonSortableFixWidth: non sortable fix width (default: 22)</li>
* </ul>
* </li>
* <li>function: auto compute width for label by function</li>
* </ul>
*/
minWidth: boolean | number | string | Partial<TableColumnMinWidthComputeConfig> | TableColumnMinWidthComputeFunction;
/**
* 操作列
*/
operation: {
/**
* 宽度 (default: 165)
*/
width?: number | string;
/**
* 最小宽度 (default: 120)
*/
minWidth?: number | string;
};
}
export interface TableColumnMinWidthComputeConfig {
min: number;
max: number;
chineseWidth: number;
otherWidth: number;
sortableFixWidth: number;
nonSortableFixWidth: number;
}
export type TableColumnMinWidthComputeConfigContext = TableColumnMinWidthComputeConfig & {
sortable: boolean;
};
export type TableColumnMinWidthComputeFunction = (
label: string,
config: TableColumnMinWidthComputeConfigContext
) => number;自定义主题配置
theme.ts
export const themeName = 'customTheme';
export const themeCssVars = {
'table-config': {
......
}
};PS：注册方法参考OioProvider详解（v4.3.0）
Oinone社区 作者：数式-海波原创文章，如若转载，请注明出处：https://doc.oinone.top/frontend/44.html
访问Oinone官网:https://www.oinone.top获取数式Oinone低代码应用平台体验
