bw-pro-table 0.0.1 → 0.0.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +827 -151
- package/dist/bw-pro-table.css +1 -1
- package/dist/bw-pro-table.js +2638 -2112
- package/dist/bw-pro-table.umd.cjs +9 -9
- package/dist/types/BwProTable.vue.d.ts +35 -12
- package/dist/types/BwProTableBatchEditModal.vue.d.ts +4 -4
- package/dist/types/BwProTableColumnSearch.vue.d.ts +3 -3
- package/dist/types/BwProTableColumnSetting.vue.d.ts +4 -4
- package/dist/types/BwProTableCore.vue.d.ts +8 -5
- package/dist/types/BwProTableImportModal.vue.d.ts +40 -0
- package/dist/types/BwProTableSearch.vue.d.ts +5 -5
- package/dist/types/BwProTableToolbar.vue.d.ts +18 -6
- package/dist/types/composables/useBwKeyboard.d.ts +1 -1
- package/dist/types/composables/useBwPermission.d.ts +2 -2
- package/dist/types/composables/useBwRowEdit.d.ts +10 -8
- package/dist/types/composables/useBwRowSelection.d.ts +2 -2
- package/dist/types/composables/useColumnHeaderSearch.d.ts +2 -2
- package/dist/types/composables/useContextMenu.d.ts +4 -2
- package/dist/types/composables/useDragSort.d.ts +2 -2
- package/dist/types/composables/useExportExcel.d.ts +14 -7
- package/dist/types/composables/useImportExcel.d.ts +14 -8
- package/dist/types/composables/useLocale.d.ts +8 -4
- package/dist/types/composables/usePersistence.d.ts +4 -2
- package/dist/types/composables/useQueryParams.d.ts +2 -2
- package/dist/types/composables/useTableView.d.ts +4 -2
- package/dist/types/constants.d.ts +7 -3
- package/dist/types/drag-icon.vue.d.ts +3 -3
- package/dist/types/index.d.ts +1 -1
- package/dist/types/injection-keys.d.ts +7 -10
- package/dist/types/locales/zh-CN.d.ts +1 -4
- package/dist/types/renderers/action-renderer.d.ts +2 -2
- package/dist/types/renderers/avatar-renderer.d.ts +1 -1
- package/dist/types/renderers/boolean-renderer.d.ts +1 -1
- package/dist/types/renderers/currency-renderer.d.ts +1 -1
- package/dist/types/renderers/date-renderer.d.ts +1 -1
- package/dist/types/renderers/image-renderer.d.ts +1 -1
- package/dist/types/renderers/index-renderer.d.ts +1 -1
- package/dist/types/renderers/index.d.ts +1 -9
- package/dist/types/renderers/link-renderer.d.ts +1 -1
- package/dist/types/renderers/number-renderer.d.ts +1 -1
- package/dist/types/renderers/progress-renderer.d.ts +1 -1
- package/dist/types/renderers/registry.d.ts +6 -2
- package/dist/types/renderers/tag-enum-renderer.d.ts +1 -1
- package/dist/types/renderers/text-renderer.d.ts +1 -1
- package/dist/types/types.d.ts +69 -8
- package/locales/zh-CN.ts +1 -0
- package/package.json +12 -11
- package/dist/types/BwProTableAdvancedFilter.vue.d.ts +0 -17
- package/dist/types/BwProTableContextMenu.vue.d.ts +0 -20
|
@@ -1,8 +1,5 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
*/
|
|
4
|
-
import type { InjectionKey, Ref, ComputedRef } from 'vue';
|
|
5
|
-
import type { TableState } from './types';
|
|
1
|
+
import { InjectionKey, Ref, ComputedRef } from 'vue';
|
|
2
|
+
import { TableState } from './types';
|
|
6
3
|
export interface BwProTableContext {
|
|
7
4
|
/** 表格唯一标识 */
|
|
8
5
|
tableId: ComputedRef<string | undefined>;
|
|
@@ -35,10 +32,10 @@ export interface BwProTableContext {
|
|
|
35
32
|
isCellEditing: (key: string | number, field: string) => boolean;
|
|
36
33
|
getDraftValue: (key: string | number, field: string) => any;
|
|
37
34
|
setDraftValue: (key: string | number, field: string, value: any) => void;
|
|
38
|
-
startCellEdit: (key: string | number, field: string) => void
|
|
39
|
-
startRowEdit: (key: string | number) => void
|
|
35
|
+
startCellEdit: (key: string | number, field: string) => Promise<void>;
|
|
36
|
+
startRowEdit: (key: string | number) => Promise<void>;
|
|
40
37
|
saveEdit: (key: string | number) => Promise<boolean>;
|
|
41
|
-
cancelEdit: (key: string | number) => void;
|
|
38
|
+
cancelEdit: (key: string | number, field?: string) => void;
|
|
42
39
|
deleteRow: (key: string | number) => Promise<void>;
|
|
43
40
|
getFieldError: (key: string | number, field: string) => string | undefined;
|
|
44
41
|
undo: () => void;
|
|
@@ -49,8 +46,8 @@ export interface BwProTableContext {
|
|
|
49
46
|
columnDraggable?: Ref<boolean>;
|
|
50
47
|
/** 表头拖拽后重排列(fromDataIndex → toDataIndex) */
|
|
51
48
|
reorderColumns?: (fromDataIndex: string, toDataIndex: string) => void;
|
|
52
|
-
/** 跨页选中 key
|
|
53
|
-
crossPageKeys?: Ref<Set<string | number
|
|
49
|
+
/** 跨页选中 key 集合(仅跨页模式时注入,computed 确保模式切换时响应式更新) */
|
|
50
|
+
crossPageKeys?: Ref<Set<string | number>> | ComputedRef<Set<string | number> | undefined>;
|
|
54
51
|
/** 选中计数(computed,跨页模式下为全量数) */
|
|
55
52
|
selectionCount?: ComputedRef<number>;
|
|
56
53
|
/** 清空所有跨页选择 */
|
|
@@ -1,6 +1,6 @@
|
|
|
1
|
-
import
|
|
1
|
+
import { RendererFn } from './registry';
|
|
2
2
|
/**
|
|
3
3
|
* 操作列渲染器 — valueType: 'action'
|
|
4
|
-
* 渲染按钮组,自动 fixed:'right'
|
|
4
|
+
* 渲染按钮组,自动 fixed:'right',支持 Popconfirm 气泡确认
|
|
5
5
|
*/
|
|
6
6
|
export declare const actionRenderer: RendererFn;
|
|
@@ -1,11 +1,3 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* 渲染器统一导出 + 内置渲染器注册
|
|
3
|
-
*
|
|
4
|
-
* 使用方式:
|
|
5
|
-
* - 通过 ensureRenderers() 惰性初始化所有内置 valueType 渲染器
|
|
6
|
-
* - 通过 defineColumnType() 注册自定义 valueType
|
|
7
|
-
* - 初次调用 getRenderer/hasRenderer 前自动初始化
|
|
8
|
-
*/
|
|
9
1
|
import { getRenderer } from './registry';
|
|
10
2
|
/**
|
|
11
3
|
* 惰性初始化所有内置渲染器(幂等,仅执行一次)
|
|
@@ -19,7 +11,7 @@ export declare const initBuiltinRenderers: typeof ensureRenderers;
|
|
|
19
11
|
* 获取渲染器(自动确保内置渲染器已初始化)
|
|
20
12
|
*/
|
|
21
13
|
export declare function getRendererSafe(type: string): ReturnType<typeof getRenderer>;
|
|
22
|
-
export { registerRenderer, getRenderer, hasRenderer, defineColumnType } from './registry';
|
|
14
|
+
export { registerRenderer, getRenderer, hasRenderer, defineColumnType, clearRendererRegistry } from './registry';
|
|
23
15
|
export type { RendererFn, RendererContext } from './registry';
|
|
24
16
|
/**
|
|
25
17
|
* 重置渲染器注册表(仅用于测试隔离)
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
1
|
+
import { ProColumnType } from '../types';
|
|
2
|
+
import { VNode } from 'vue';
|
|
3
3
|
/**
|
|
4
4
|
* 渲染器上下文 — 每个 valueType 渲染器都接收此上下文
|
|
5
5
|
*/
|
|
@@ -39,3 +39,7 @@ export declare function defineColumnType(type: string, renderer: RendererFn): vo
|
|
|
39
39
|
* 获取渲染器注册表(仅用于调试)
|
|
40
40
|
*/
|
|
41
41
|
export declare function getRendererRegistry(): ReadonlyMap<string, RendererFn>;
|
|
42
|
+
/**
|
|
43
|
+
* 清空渲染器注册表(仅用于测试隔离)
|
|
44
|
+
*/
|
|
45
|
+
export declare function clearRendererRegistry(): void;
|
package/dist/types/types.d.ts
CHANGED
|
@@ -1,13 +1,55 @@
|
|
|
1
|
-
import
|
|
2
|
-
import
|
|
3
|
-
|
|
1
|
+
import { VNode, CSSProperties } from 'vue';
|
|
2
|
+
import { TableColumnType, TablePaginationConfig } from 'ant-design-vue';
|
|
3
|
+
/** 行 key 获取函数 */
|
|
4
|
+
export type GetRowKey<RecordType = any> = (record: RecordType, index?: number) => string | number;
|
|
5
|
+
/** 行选择配置(对齐 ant-design-vue TableRowSelection 接口) */
|
|
6
|
+
export interface TableRowSelection<RecordType = any> {
|
|
7
|
+
type?: 'checkbox' | 'radio';
|
|
8
|
+
selectedRowKeys?: (string | number)[];
|
|
9
|
+
onChange?: (selectedRowKeys: (string | number)[], selectedRows: RecordType[]) => void;
|
|
10
|
+
getCheckboxProps?: (record: RecordType) => any;
|
|
11
|
+
selections?: any[] | boolean;
|
|
12
|
+
columnWidth?: number | string;
|
|
13
|
+
fixed?: boolean;
|
|
14
|
+
hideSelectAll?: boolean;
|
|
15
|
+
preserveSelectedRowKeys?: boolean;
|
|
16
|
+
checkStrictly?: boolean;
|
|
17
|
+
renderCell?: (value: boolean, record: RecordType, index: number, originNode: VNode) => VNode;
|
|
18
|
+
onSelect?: (record: RecordType, selected: boolean, selectedRows: RecordType[], nativeEvent: Event) => void;
|
|
19
|
+
onSelectAll?: (selected: boolean, selectedRows: RecordType[], changeRows: RecordType[]) => void;
|
|
20
|
+
onSelectInvert?: (selectedRowKeys: (string | number)[]) => void;
|
|
21
|
+
onSelectNone?: () => void;
|
|
22
|
+
}
|
|
23
|
+
/** 可展开行配置(对齐 ant-design-vue ExpandableConfig 接口) */
|
|
24
|
+
export interface ExpandableConfig<RecordType = any> {
|
|
25
|
+
expandedRowKeys?: (string | number)[];
|
|
26
|
+
defaultExpandedRowKeys?: (string | number)[];
|
|
27
|
+
expandedRowRender?: (props: {
|
|
28
|
+
record: RecordType;
|
|
29
|
+
index: number;
|
|
30
|
+
indent: number;
|
|
31
|
+
expanded: boolean;
|
|
32
|
+
}) => VNode;
|
|
33
|
+
expandRowByClick?: boolean;
|
|
34
|
+
expandIcon?: (props: {
|
|
35
|
+
expanded: boolean;
|
|
36
|
+
onExpand: (record: RecordType, e: Event) => void;
|
|
37
|
+
record: RecordType;
|
|
38
|
+
}) => VNode;
|
|
39
|
+
rowExpandable?: (record: RecordType) => boolean;
|
|
40
|
+
onExpand?: (expanded: boolean, record: RecordType) => void;
|
|
41
|
+
onExpandedRowsChange?: (expandedRows: (string | number)[]) => void;
|
|
42
|
+
expandedRowClassName?: (record: RecordType, index: number, indent: number) => string;
|
|
43
|
+
indentSize?: number;
|
|
44
|
+
columnWidth?: number | string;
|
|
45
|
+
fixed?: boolean | 'left' | 'right';
|
|
46
|
+
}
|
|
4
47
|
/** 排序方向 */
|
|
5
48
|
export type SortOrder = 'ascend' | 'descend' | null;
|
|
6
49
|
/** 筛选值类型 */
|
|
7
50
|
export type FilterValue = (string | number)[] | null;
|
|
8
51
|
/** 行 Key 类型 */
|
|
9
52
|
export type Key = string | number;
|
|
10
|
-
import type { CSSProperties } from 'vue';
|
|
11
53
|
/** 支持的 valueType 预设值 */
|
|
12
54
|
export type ValueType = 'text' | 'number' | 'date' | 'tag' | 'image' | 'link' | 'progress' | 'avatar' | 'action' | 'index' | 'currency' | 'boolean';
|
|
13
55
|
/** valueEnum 映射定义 */
|
|
@@ -124,6 +166,7 @@ export interface ActionItem<RecordType = any> {
|
|
|
124
166
|
/** 危险操作样式,对应 ant-design-vue Button 的 danger 属性 */
|
|
125
167
|
danger?: boolean;
|
|
126
168
|
icon?: string;
|
|
169
|
+
/** 气泡确认文案,设置后点击按钮会先弹出 Popconfirm 确认 */
|
|
127
170
|
confirm?: string;
|
|
128
171
|
authority?: string | string[];
|
|
129
172
|
disabled?: boolean | ((record: RecordType) => boolean);
|
|
@@ -140,6 +183,11 @@ export interface FormRule {
|
|
|
140
183
|
pattern?: RegExp;
|
|
141
184
|
validator?: (value: any, record: any) => Promise<void> | void;
|
|
142
185
|
}
|
|
186
|
+
/** 导入校验规则 — 继承 FormRule 并附加必填 field 字段 */
|
|
187
|
+
export interface ImportValidateRule extends FormRule {
|
|
188
|
+
/** 校验目标字段名(必填) */
|
|
189
|
+
field: string;
|
|
190
|
+
}
|
|
143
191
|
export interface EditConfig<RecordType = any> {
|
|
144
192
|
/** 编辑模式 */
|
|
145
193
|
mode?: 'cell' | 'row';
|
|
@@ -240,14 +288,25 @@ export interface ExportConfig {
|
|
|
240
288
|
type?: 'xlsx' | 'csv';
|
|
241
289
|
/** 自定义列映射 */
|
|
242
290
|
columnMapping?: Record<string, string>;
|
|
243
|
-
/**
|
|
291
|
+
/** 导出前回调,返回 false 可阻止导出 */
|
|
244
292
|
beforeExport?: () => Promise<boolean> | boolean;
|
|
293
|
+
/**
|
|
294
|
+
* Request 模式下导出全量数据回调。
|
|
295
|
+
* 不提供时仅导出当前页数据;提供后可通过此回调获取全部数据。
|
|
296
|
+
* 接收当前搜索/筛选/排序参数,返回全量数据数组。
|
|
297
|
+
*/
|
|
298
|
+
onExportAll?: (params: Record<string, any>) => Promise<any[]> | any[];
|
|
299
|
+
/**
|
|
300
|
+
* Request 模式下导出选中行回调(跨页选择时选中行数据可能不完整)。
|
|
301
|
+
* 接收选中的 rowKey 数组,返回对应的行数据数组。
|
|
302
|
+
*/
|
|
303
|
+
onExportSelected?: (keys: (string | number)[]) => Promise<any[]> | any[];
|
|
245
304
|
}
|
|
246
305
|
export interface ImportConfig {
|
|
247
306
|
/** 列映射 */
|
|
248
307
|
columnMapping?: Record<string, string>;
|
|
249
308
|
/** 校验规则 */
|
|
250
|
-
validateRules?:
|
|
309
|
+
validateRules?: ImportValidateRule[];
|
|
251
310
|
/** 导入前回调 */
|
|
252
311
|
beforeImport?: (data: any[]) => Promise<any[]> | any[];
|
|
253
312
|
/** 导入回调 */
|
|
@@ -288,6 +347,7 @@ export interface BwProTableLocale {
|
|
|
288
347
|
exitFullscreen: string;
|
|
289
348
|
columnSetting: string;
|
|
290
349
|
export: string;
|
|
350
|
+
import: string;
|
|
291
351
|
clearFilter: string;
|
|
292
352
|
search: string;
|
|
293
353
|
border: string;
|
|
@@ -514,6 +574,8 @@ export interface BwProTableProps<RecordType = any> {
|
|
|
514
574
|
class?: string;
|
|
515
575
|
/** 表格样式 */
|
|
516
576
|
style?: CSSProperties;
|
|
577
|
+
/** 行 className 函数(覆盖内置斑马纹/选中行样式) */
|
|
578
|
+
rowClassName?: (record: RecordType, index: number) => string;
|
|
517
579
|
}
|
|
518
580
|
export type TableStatus = 'loading' | 'success' | 'error';
|
|
519
581
|
export interface TableState {
|
|
@@ -527,8 +589,7 @@ export interface PersistedColumnState {
|
|
|
527
589
|
order: number;
|
|
528
590
|
width?: number;
|
|
529
591
|
}
|
|
530
|
-
/** 当前持久化数据版本(已迁移到 constants.ts
|
|
531
|
-
export { PERSISTED_DATA_VERSION } from './constants';
|
|
592
|
+
/** 当前持久化数据版本(已迁移到 constants.ts,请从 constants 直接导入) */
|
|
532
593
|
export interface PersistedTableState {
|
|
533
594
|
/** 数据版本号,用于版本迁移 */
|
|
534
595
|
version: string;
|
package/locales/zh-CN.ts
CHANGED
package/package.json
CHANGED
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "bw-pro-table",
|
|
3
|
-
"version": "0.0.
|
|
3
|
+
"version": "0.0.2",
|
|
4
|
+
"author": {"name": "ZM"},
|
|
4
5
|
"description": "基于 ant-design-vue 的高级业务表格组件(ProTable),支持请求/数据源双模式、行内编辑、搜索筛选、列拖拽排序、导出导入、跨页多选、持久化等",
|
|
5
6
|
"type": "module",
|
|
6
7
|
"main": "./dist/bw-pro-table.umd.cjs",
|
|
@@ -37,16 +38,16 @@
|
|
|
37
38
|
],
|
|
38
39
|
"scripts": {
|
|
39
40
|
"dev": "vite --open dev/index.html",
|
|
40
|
-
"build": "vite build
|
|
41
|
-
"build:
|
|
41
|
+
"build": "vite build",
|
|
42
|
+
"build:vue-tsc": "vite build && vue-tsc --project tsconfig.build.json --emitDeclarationOnly",
|
|
42
43
|
"build:types": "vue-tsc --project tsconfig.build.json --emitDeclarationOnly",
|
|
43
44
|
"typecheck": "vue-tsc --project tsconfig.build.json --noEmit",
|
|
44
45
|
"lint": "eslint . --ext .vue,.ts",
|
|
45
46
|
"prepublishOnly": "npm run build"
|
|
46
47
|
},
|
|
47
48
|
"peerDependencies": {
|
|
48
|
-
"@ant-design/icons-vue": "^
|
|
49
|
-
"ant-design-vue": "^
|
|
49
|
+
"@ant-design/icons-vue": "^7.0.0",
|
|
50
|
+
"ant-design-vue": "^4.0.0",
|
|
50
51
|
"dayjs": "^1.11.0",
|
|
51
52
|
"screenfull": "^6.0.0",
|
|
52
53
|
"vue": "^3.3.0",
|
|
@@ -63,19 +64,19 @@
|
|
|
63
64
|
},
|
|
64
65
|
"devDependencies": {
|
|
65
66
|
"@ant-design/icons-vue": "^7.0.1",
|
|
66
|
-
"@types/node": "^
|
|
67
|
+
"@types/node": "^26.0.0",
|
|
67
68
|
"@vitejs/plugin-vue": "^6.0.7",
|
|
68
|
-
"@vue/language-core": "^3.3.
|
|
69
|
+
"@vue/language-core": "^3.3.5",
|
|
69
70
|
"ant-design-vue": "^4.2.6",
|
|
70
71
|
"dayjs": "^1.11.21",
|
|
71
|
-
"less": "^4.6.
|
|
72
|
+
"less": "^4.6.6",
|
|
72
73
|
"screenfull": "^6.0.2",
|
|
73
74
|
"typescript": "^6.0.3",
|
|
74
75
|
"vite": "^8.0.16",
|
|
75
76
|
"vite-plugin-dts": "^5.0.2",
|
|
76
|
-
"vue": "^3.5.
|
|
77
|
-
"vue-i18n": "^11.4.
|
|
78
|
-
"vue-tsc": "^3.3.
|
|
77
|
+
"vue": "^3.5.38",
|
|
78
|
+
"vue-i18n": "^11.4.6",
|
|
79
|
+
"vue-tsc": "^3.3.5",
|
|
79
80
|
"xlsx": "^0.18.5"
|
|
80
81
|
},
|
|
81
82
|
"keywords": [
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import type { AdvancedFilterCondition, ProColumnsType } from './types';
|
|
2
|
-
interface Props {
|
|
3
|
-
visible: boolean;
|
|
4
|
-
columns: ProColumnsType<any>;
|
|
5
|
-
initialConditions?: AdvancedFilterCondition[];
|
|
6
|
-
}
|
|
7
|
-
declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
8
|
-
reset: () => any;
|
|
9
|
-
"update:visible": (value: boolean) => any;
|
|
10
|
-
apply: (conditions: AdvancedFilterCondition[]) => any;
|
|
11
|
-
}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
|
|
12
|
-
onReset?: (() => any) | undefined;
|
|
13
|
-
"onUpdate:visible"?: ((value: boolean) => any) | undefined;
|
|
14
|
-
onApply?: ((conditions: AdvancedFilterCondition[]) => any) | undefined;
|
|
15
|
-
}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
16
|
-
declare const _default: typeof __VLS_export;
|
|
17
|
-
export default _default;
|
|
@@ -1,20 +0,0 @@
|
|
|
1
|
-
import type { ContextMenuItem } from './types';
|
|
2
|
-
interface Props {
|
|
3
|
-
visible: boolean;
|
|
4
|
-
x: number;
|
|
5
|
-
y: number;
|
|
6
|
-
items: ContextMenuItem[];
|
|
7
|
-
/** 菜单宽度 */
|
|
8
|
-
width?: number;
|
|
9
|
-
}
|
|
10
|
-
declare const __VLS_export: import("vue").DefineComponent<Props, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
|
|
11
|
-
click: (key: string, item: ContextMenuItem) => any;
|
|
12
|
-
close: () => any;
|
|
13
|
-
}, string, import("vue").PublicProps, Readonly<Props> & Readonly<{
|
|
14
|
-
onClick?: ((key: string, item: ContextMenuItem) => any) | undefined;
|
|
15
|
-
onClose?: (() => any) | undefined;
|
|
16
|
-
}>, {
|
|
17
|
-
width: number;
|
|
18
|
-
}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
|
|
19
|
-
declare const _default: typeof __VLS_export;
|
|
20
|
-
export default _default;
|