@sl-material/sl-table-sheet 1.0.0-beta1 → 1.0.0-beta3
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/config/config.d.ts +10 -0
- package/core/SheetTabs.d.ts +44 -0
- package/core/SlTableSheet.d.ts +64 -3
- package/core/TableSheet.d.ts +4 -8
- package/core/excel/ExcelParser.d.ts +9 -1
- package/core/excel/index.d.ts +13 -1
- package/core/excel/types.d.ts +24 -1
- package/core/managers/CellMarkManager.d.ts +9 -15
- package/core/managers/EventManager.d.ts +4 -0
- package/core/processors/DataProcessor.d.ts +3 -7
- package/core/processors/StyleProcessor.d.ts +10 -11
- package/index.d.ts +4 -2
- package/package.json +2 -8
- package/sl-table-sheet.cjs.js +2211 -7
- package/sl-table-sheet.es.js +94299 -795
- package/sl-table-sheet.umd.umd.js +2211 -7
package/config/config.d.ts
CHANGED
|
@@ -0,0 +1,44 @@
|
|
|
1
|
+
import { SheetData } from './excel/types';
|
|
2
|
+
|
|
3
|
+
export interface SheetTabsConfig {
|
|
4
|
+
container: HTMLElement;
|
|
5
|
+
sheets: SheetData[];
|
|
6
|
+
activeIndex?: number;
|
|
7
|
+
onTabChange?: (sheetData: SheetData, index: number) => void;
|
|
8
|
+
}
|
|
9
|
+
export declare class SheetTabs {
|
|
10
|
+
private container;
|
|
11
|
+
private tabsElement;
|
|
12
|
+
private sheets;
|
|
13
|
+
private activeIndex;
|
|
14
|
+
private onTabChange?;
|
|
15
|
+
constructor(config: SheetTabsConfig);
|
|
16
|
+
private init;
|
|
17
|
+
private injectStyles;
|
|
18
|
+
private render;
|
|
19
|
+
private createTab;
|
|
20
|
+
/**
|
|
21
|
+
* 设置当前激活的标签
|
|
22
|
+
*/
|
|
23
|
+
setActiveTab(index: number): void;
|
|
24
|
+
/**
|
|
25
|
+
* 更新 Sheet 数据
|
|
26
|
+
*/
|
|
27
|
+
updateSheets(sheets: SheetData[]): void;
|
|
28
|
+
/**
|
|
29
|
+
* 更新单个 Sheet 的错误数量
|
|
30
|
+
*/
|
|
31
|
+
updateSheetError(index: number, errorCount: number): void;
|
|
32
|
+
/**
|
|
33
|
+
* 获取当前激活的 Sheet 数据
|
|
34
|
+
*/
|
|
35
|
+
getActiveSheet(): SheetData | null;
|
|
36
|
+
/**
|
|
37
|
+
* 获取当前激活的索引
|
|
38
|
+
*/
|
|
39
|
+
getActiveIndex(): number;
|
|
40
|
+
/**
|
|
41
|
+
* 销毁组件
|
|
42
|
+
*/
|
|
43
|
+
destroy(): void;
|
|
44
|
+
}
|
package/core/SlTableSheet.d.ts
CHANGED
|
@@ -1,26 +1,35 @@
|
|
|
1
1
|
import { TableSheet, TableSheetConfig } from './TableSheet';
|
|
2
2
|
import { FindReplaceDialog } from './Dialog';
|
|
3
3
|
import { Toolbar, ToolbarConfig } from './Toolbar';
|
|
4
|
-
import {
|
|
4
|
+
import { SheetTabs } from './SheetTabs';
|
|
5
|
+
import { ExcelParseOptions, ExcelParseResult, MultiSheetParseResult, SheetData } from './excel';
|
|
5
6
|
|
|
6
7
|
export interface SlTableSheetConfig extends Omit<TableSheetConfig, "container"> {
|
|
7
8
|
container: HTMLElement | string;
|
|
8
9
|
showToolbar?: boolean;
|
|
10
|
+
/** 是否显示自定义 Sheet 标签页(用于多 Sheet Excel) */
|
|
11
|
+
showSheetTabs?: boolean;
|
|
9
12
|
toolbar?: Partial<ToolbarConfig>;
|
|
10
13
|
onExport?: (format: "csv" | "excel") => void;
|
|
11
14
|
onRefresh?: () => void;
|
|
12
15
|
onExcelImport?: (data: ExcelParseResult) => void;
|
|
16
|
+
/** 多 Sheet 导入回调 */
|
|
17
|
+
onMultiSheetImport?: (data: MultiSheetParseResult) => void;
|
|
18
|
+
/** Sheet 切换回调 */
|
|
19
|
+
onSheetChange?: (sheetData: SheetData, index: number) => void;
|
|
13
20
|
}
|
|
14
21
|
export declare class SlTableSheet {
|
|
15
22
|
private tableSheet;
|
|
16
23
|
private findReplaceDialog;
|
|
17
24
|
private toolbar;
|
|
25
|
+
private sheetTabs;
|
|
18
26
|
private container;
|
|
19
27
|
private tableContainer;
|
|
20
28
|
private toolbarContainer;
|
|
29
|
+
private sheetTabsContainer;
|
|
21
30
|
private config;
|
|
22
|
-
/**
|
|
23
|
-
private
|
|
31
|
+
/** 多 Sheet 数据 */
|
|
32
|
+
private multiSheetData;
|
|
24
33
|
constructor(config: SlTableSheetConfig);
|
|
25
34
|
/**
|
|
26
35
|
* 初始化
|
|
@@ -130,6 +139,14 @@ export declare class SlTableSheet {
|
|
|
130
139
|
parseExcelFile(file: File, options?: ExcelParseOptions & {
|
|
131
140
|
autoDisplay?: boolean;
|
|
132
141
|
}): Promise<ExcelParseResult>;
|
|
142
|
+
/**
|
|
143
|
+
* 将批注数据合并到记录中,生成带 isMarked 标记的数据格式
|
|
144
|
+
*/
|
|
145
|
+
private mergeCommentsToRecords;
|
|
146
|
+
/**
|
|
147
|
+
* 处理数据并生成样式化的列配置
|
|
148
|
+
*/
|
|
149
|
+
private processDataWithStyles;
|
|
133
150
|
/**
|
|
134
151
|
* 处理 Excel 导入结果
|
|
135
152
|
*/
|
|
@@ -162,5 +179,49 @@ export declare class SlTableSheet {
|
|
|
162
179
|
* 销毁实例
|
|
163
180
|
*/
|
|
164
181
|
destroy(): void;
|
|
182
|
+
/**
|
|
183
|
+
* 从 URL 加载 Excel 所有 Sheet
|
|
184
|
+
*/
|
|
185
|
+
loadAllSheetsFromUrl(url: string, options?: Omit<ExcelParseOptions, "sheetIndex">): Promise<MultiSheetParseResult>;
|
|
186
|
+
/**
|
|
187
|
+
* 解析 Excel ArrayBuffer 的所有 Sheet
|
|
188
|
+
*/
|
|
189
|
+
parseAllSheets(buffer: ArrayBuffer, options?: Omit<ExcelParseOptions, "sheetIndex">): MultiSheetParseResult;
|
|
190
|
+
/**
|
|
191
|
+
* 处理多 Sheet 导入结果
|
|
192
|
+
*/
|
|
193
|
+
private handleMultiSheetImportResult;
|
|
194
|
+
/**
|
|
195
|
+
* 创建 Sheet 标签页
|
|
196
|
+
*/
|
|
197
|
+
private createSheetTabs;
|
|
198
|
+
/**
|
|
199
|
+
* 显示指定 Sheet 的数据
|
|
200
|
+
*/
|
|
201
|
+
private displaySheetData;
|
|
202
|
+
/**
|
|
203
|
+
* 更新 Sheet 的错误数量
|
|
204
|
+
*/
|
|
205
|
+
updateSheetError(sheetIndex: number, errorCount: number): void;
|
|
206
|
+
/**
|
|
207
|
+
* 获取当前激活的 Sheet 索引
|
|
208
|
+
*/
|
|
209
|
+
getActiveSheetIndex(): number;
|
|
210
|
+
/**
|
|
211
|
+
* 获取当前激活的 Sheet 数据
|
|
212
|
+
*/
|
|
213
|
+
getActiveSheetData(): SheetData | null;
|
|
214
|
+
/**
|
|
215
|
+
* 获取所有 Sheet 数据
|
|
216
|
+
*/
|
|
217
|
+
getAllSheetsData(): MultiSheetParseResult | null;
|
|
218
|
+
/**
|
|
219
|
+
* 切换到指定 Sheet
|
|
220
|
+
*/
|
|
221
|
+
switchToSheet(index: number): void;
|
|
222
|
+
/**
|
|
223
|
+
* 获取 SheetTabs 实例
|
|
224
|
+
*/
|
|
225
|
+
getSheetTabs(): SheetTabs | null;
|
|
165
226
|
}
|
|
166
227
|
export default SlTableSheet;
|
package/core/TableSheet.d.ts
CHANGED
|
@@ -1,3 +1,5 @@
|
|
|
1
|
+
import { MarkedMap } from './processors/StyleProcessor';
|
|
2
|
+
|
|
1
3
|
/**
|
|
2
4
|
* 自定义组件配置接口
|
|
3
5
|
*/
|
|
@@ -90,10 +92,7 @@ export declare class TableSheet {
|
|
|
90
92
|
private customComponentManager;
|
|
91
93
|
private cellMarkManager;
|
|
92
94
|
private eventManager;
|
|
93
|
-
constructor(config: TableSheetConfig, markedMap?:
|
|
94
|
-
isMarked: boolean;
|
|
95
|
-
comment?: string;
|
|
96
|
-
}>);
|
|
95
|
+
constructor(config: TableSheetConfig, markedMap?: MarkedMap);
|
|
97
96
|
/**
|
|
98
97
|
* 初始化表格
|
|
99
98
|
*/
|
|
@@ -168,10 +167,7 @@ export declare class TableSheet {
|
|
|
168
167
|
/**
|
|
169
168
|
* 获取标记映射
|
|
170
169
|
*/
|
|
171
|
-
getMarkedMap():
|
|
172
|
-
isMarked: boolean;
|
|
173
|
-
comment?: string;
|
|
174
|
-
}> | null;
|
|
170
|
+
getMarkedMap(): MarkedMap | null;
|
|
175
171
|
/**
|
|
176
172
|
* 监听事件
|
|
177
173
|
*/
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ExcelParseOptions, ExcelParseResult } from './types';
|
|
1
|
+
import { ExcelParseOptions, ExcelParseResult, MultiSheetParseResult } from './types';
|
|
2
2
|
|
|
3
3
|
export declare class ExcelParser {
|
|
4
4
|
/**
|
|
@@ -9,4 +9,12 @@ export declare class ExcelParser {
|
|
|
9
9
|
* 构建列配置
|
|
10
10
|
*/
|
|
11
11
|
private static buildColumns;
|
|
12
|
+
/**
|
|
13
|
+
* 解析 Excel 所有 Sheet
|
|
14
|
+
*/
|
|
15
|
+
static parseAllSheets(buffer: ArrayBuffer, options?: Omit<ExcelParseOptions, "sheetIndex">): MultiSheetParseResult;
|
|
16
|
+
/**
|
|
17
|
+
* 获取 Excel 文件的 Sheet 名称列表
|
|
18
|
+
*/
|
|
19
|
+
static getSheetNames(buffer: ArrayBuffer): string[];
|
|
12
20
|
}
|
package/core/excel/index.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { ExcelParseOptions, ExcelParseResult } from './types';
|
|
1
|
+
import { ExcelParseOptions, ExcelParseResult, MultiSheetParseResult } from './types';
|
|
2
2
|
/**
|
|
3
3
|
* Excel 模块统一导出
|
|
4
4
|
*/
|
|
@@ -13,3 +13,15 @@ export declare function exportToExcelStream(columns: any[], records: any[], opti
|
|
|
13
13
|
filterEmptyColumns?: boolean;
|
|
14
14
|
}): ArrayBuffer;
|
|
15
15
|
export declare function downloadExcel(buffer: ArrayBuffer, filename?: string): void;
|
|
16
|
+
/**
|
|
17
|
+
* 解析 Excel 所有 Sheet
|
|
18
|
+
*/
|
|
19
|
+
export declare function parseAllSheets(buffer: ArrayBuffer, options?: Omit<ExcelParseOptions, "sheetIndex">): MultiSheetParseResult;
|
|
20
|
+
/**
|
|
21
|
+
* 从 URL 加载并解析 Excel 所有 Sheet
|
|
22
|
+
*/
|
|
23
|
+
export declare function loadAllSheetsFromUrl(url: string, options?: Omit<ExcelParseOptions, "sheetIndex">): Promise<MultiSheetParseResult>;
|
|
24
|
+
/**
|
|
25
|
+
* 获取 Excel 文件的 Sheet 名称列表
|
|
26
|
+
*/
|
|
27
|
+
export declare function getSheetNames(buffer: ArrayBuffer): string[];
|
package/core/excel/types.d.ts
CHANGED
|
@@ -27,7 +27,7 @@ export interface CellComment {
|
|
|
27
27
|
export interface ExcelParseResult {
|
|
28
28
|
columns: Array<{
|
|
29
29
|
key: string;
|
|
30
|
-
field: string;
|
|
30
|
+
field: string | number;
|
|
31
31
|
title: string;
|
|
32
32
|
width: number;
|
|
33
33
|
sort?: boolean;
|
|
@@ -37,3 +37,26 @@ export interface ExcelParseResult {
|
|
|
37
37
|
cellStyles?: Map<string, CellStyle>;
|
|
38
38
|
cellComments?: Map<string, CellComment>;
|
|
39
39
|
}
|
|
40
|
+
/**
|
|
41
|
+
* 单个 Sheet 的解析结果
|
|
42
|
+
*/
|
|
43
|
+
export interface SheetData {
|
|
44
|
+
sheetName: string;
|
|
45
|
+
sheetIndex: number;
|
|
46
|
+
columns: ExcelParseResult["columns"];
|
|
47
|
+
records: any[][];
|
|
48
|
+
cellStyles?: Map<string, CellStyle>;
|
|
49
|
+
cellComments?: Map<string, CellComment>;
|
|
50
|
+
/** 是否有错误数据 */
|
|
51
|
+
hasError?: boolean;
|
|
52
|
+
/** 错误数量 */
|
|
53
|
+
errorCount?: number;
|
|
54
|
+
}
|
|
55
|
+
/**
|
|
56
|
+
* 多 Sheet 解析结果
|
|
57
|
+
*/
|
|
58
|
+
export interface MultiSheetParseResult {
|
|
59
|
+
sheets: SheetData[];
|
|
60
|
+
sheetNames: string[];
|
|
61
|
+
activeSheetIndex: number;
|
|
62
|
+
}
|
|
@@ -1,13 +1,9 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
*/
|
|
1
|
+
import { MarkedMap } from '../processors/StyleProcessor';
|
|
2
|
+
|
|
4
3
|
export declare class CellMarkManager {
|
|
5
4
|
private markedMap;
|
|
6
5
|
private tableInstance;
|
|
7
|
-
constructor(tableInstance: any, markedMap?:
|
|
8
|
-
isMarked: boolean;
|
|
9
|
-
comment?: string;
|
|
10
|
-
}>);
|
|
6
|
+
constructor(tableInstance: any, markedMap?: MarkedMap);
|
|
11
7
|
/**
|
|
12
8
|
* 处理单元格鼠标进入事件
|
|
13
9
|
*/
|
|
@@ -19,15 +15,13 @@ export declare class CellMarkManager {
|
|
|
19
15
|
/**
|
|
20
16
|
* 获取标记映射
|
|
21
17
|
*/
|
|
22
|
-
getMarkedMap():
|
|
23
|
-
isMarked: boolean;
|
|
24
|
-
comment?: string;
|
|
25
|
-
}> | null;
|
|
18
|
+
getMarkedMap(): MarkedMap | null;
|
|
26
19
|
/**
|
|
27
20
|
* 设置标记映射
|
|
28
21
|
*/
|
|
29
|
-
setMarkedMap(markedMap:
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
22
|
+
setMarkedMap(markedMap: MarkedMap): void;
|
|
23
|
+
/**
|
|
24
|
+
* 销毁实例,清理引用
|
|
25
|
+
*/
|
|
26
|
+
destroy(): void;
|
|
33
27
|
}
|
|
@@ -1,16 +1,12 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
*/
|
|
1
|
+
import { MarkedMap } from './StyleProcessor';
|
|
2
|
+
|
|
4
3
|
export declare class DataProcessor {
|
|
5
4
|
/**
|
|
6
5
|
* 预处理数据:将 {value, isMarked} 格式转换为二维数组格式,并构建标记索引
|
|
7
6
|
*/
|
|
8
7
|
static processRecords(records: any[], columns: any[]): {
|
|
9
8
|
displayRecords: any[][];
|
|
10
|
-
markedMap:
|
|
11
|
-
isMarked: boolean;
|
|
12
|
-
comment?: string;
|
|
13
|
-
}>;
|
|
9
|
+
markedMap: MarkedMap;
|
|
14
10
|
};
|
|
15
11
|
/**
|
|
16
12
|
* 处理数组格式的行
|
|
@@ -1,15 +1,14 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
1
|
+
/**
|
|
2
|
+
* 样式处理器 - 处理列样式配置
|
|
3
|
+
*/
|
|
4
|
+
export interface MarkedInfo {
|
|
5
|
+
isMarked: boolean;
|
|
6
|
+
comment?: string;
|
|
7
|
+
}
|
|
8
|
+
export type MarkedMap = Map<string, MarkedInfo>;
|
|
3
9
|
export declare class StyleProcessor {
|
|
4
10
|
/**
|
|
5
|
-
* 初始化列配置,根据 markedMap
|
|
6
|
-
*/
|
|
7
|
-
static initColumns(columns: any[], markedMap: Map<string, {
|
|
8
|
-
isMarked: boolean;
|
|
9
|
-
comment?: string;
|
|
10
|
-
}>, cellStyles?: Map<string, CellStyle> | null): any[];
|
|
11
|
-
/**
|
|
12
|
-
* 应用 Excel 单元格样式
|
|
11
|
+
* 初始化列配置,根据 markedMap 添加高亮样式
|
|
13
12
|
*/
|
|
14
|
-
|
|
13
|
+
static initColumns(columns: any[], markedMap: MarkedMap, headerRowCount?: number): any[];
|
|
15
14
|
}
|
package/index.d.ts
CHANGED
|
@@ -3,6 +3,8 @@
|
|
|
3
3
|
* 支持多种技术栈:Vue 2/3、原生 JS、Web Component
|
|
4
4
|
*/
|
|
5
5
|
export type { TableSheetConfig, SheetConfig, EditorConfig, CellInfo, } from './core/types';
|
|
6
|
-
export { loadExcelFromUrl, parseExcelFile, parseExcelBuffer, fetchExcelFromUrl, } from './core/
|
|
7
|
-
export type { ExcelParseOptions, ExcelParseResult, CellStyle, } from './core/
|
|
6
|
+
export { loadExcelFromUrl, parseExcelFile, parseExcelBuffer, fetchExcelFromUrl, parseAllSheets, loadAllSheetsFromUrl, getSheetNames, } from './core/excel';
|
|
7
|
+
export type { ExcelParseOptions, ExcelParseResult, CellStyle, SheetData, MultiSheetParseResult, } from './core/excel';
|
|
8
|
+
export { SheetTabs } from './core/SheetTabs';
|
|
9
|
+
export type { SheetTabsConfig } from './core/SheetTabs';
|
|
8
10
|
export { SlTableSheet as default } from './core/SlTableSheet';
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@sl-material/sl-table-sheet",
|
|
3
|
-
"version": "1.0.0-
|
|
3
|
+
"version": "1.0.0-beta3",
|
|
4
4
|
"description": "VTable 组件库 - 支持 npm 和 UMD",
|
|
5
5
|
"main": "./sl-table-sheet.cjs.js",
|
|
6
6
|
"module": "./sl-table-sheet.es.js",
|
|
@@ -18,11 +18,5 @@
|
|
|
18
18
|
"javascript"
|
|
19
19
|
],
|
|
20
20
|
"author": "",
|
|
21
|
-
"license": "MIT"
|
|
22
|
-
"dependencies": {
|
|
23
|
-
"@sl-ui-pc/theme-chalk": "0.1.0-beta1",
|
|
24
|
-
"@visactor/vtable-editors": "^1.22.9",
|
|
25
|
-
"@visactor/vtable-sheet": "^1.22.9",
|
|
26
|
-
"xlsx": "^0.18.5"
|
|
27
|
-
}
|
|
21
|
+
"license": "MIT"
|
|
28
22
|
}
|