sheetnext 0.1.8 → 0.2.0
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/LICENSE +1 -1
- package/README.md +161 -76
- package/README_CN.md +161 -0
- package/dist/sheetnext.css +1 -1
- package/dist/sheetnext.es.js +4 -4
- package/dist/sheetnext.locale.zh-CN.es.js +20 -0
- package/dist/sheetnext.locale.zh-CN.umd.js +20 -0
- package/dist/sheetnext.umd.js +4 -4
- package/docs/docs-detail.md +2998 -0
- package/docs/image_en.png +0 -0
- package/package.json +25 -35
- package/AGENT.md +0 -330
- package/DOCS.md +0 -826
- package/docs/demo.png +0 -0
- package/types/index.d.ts +0 -171
package/DOCS.md
DELETED
|
@@ -1,826 +0,0 @@
|
|
|
1
|
-
# SheetNext API 文档
|
|
2
|
-
|
|
3
|
-
> 详细的类、方法和属性说明
|
|
4
|
-
|
|
5
|
-
---
|
|
6
|
-
|
|
7
|
-
## 目录
|
|
8
|
-
|
|
9
|
-
- [SheetNext Class](#SheetNext) - 工作簿管理:实例化编辑器、添加/删除/切换工作表、导入/导出 Excel、多实例支持等
|
|
10
|
-
- [Sheet Class](#Sheet) - 工作表管理:行列管理、合并单元格、区域遍历、排序、批量插入数据、图形对象管理等
|
|
11
|
-
- [Cell Class](#Cell) - 单元格管理:读写值/公式、样式设置、数字格式、超链接、数据验证等
|
|
12
|
-
- [Row Class](#Row) - 行管理:行高、批量行样式、获取行内单元格、显示/隐藏等
|
|
13
|
-
- [Col Class](#Col) - 列管理:列宽、批量列样式、获取列内单元格、显示/隐藏等
|
|
14
|
-
- [Drawing Class](#Drawing) - 图形管理:图表、图形、图片的增删改查、设置位置和尺寸、调整图层顺序等
|
|
15
|
-
- [Layout Class](#Layout) - 布局管理:显示/隐藏菜单栏、工具栏、公式栏、AI 聊天面板等界面元素
|
|
16
|
-
- [Utils Class](#Utils) - 坐标转换:单元格字符串与数字坐标互转、列字母与数字互转、范围格式转换等
|
|
17
|
-
- [UndoRedo Class](#UndoRedo) - 历史管理:撤销/重做操作
|
|
18
|
-
|
|
19
|
-
---
|
|
20
|
-
|
|
21
|
-
## SheetNext
|
|
22
|
-
|
|
23
|
-
SheetNext 是主入口类,管理整个电子表格应用。
|
|
24
|
-
|
|
25
|
-
### 构造函数
|
|
26
|
-
|
|
27
|
-
```javascript
|
|
28
|
-
const SN = new SheetNext(dom: HTMLElement, options?: object)
|
|
29
|
-
// 下面所有示例使用此实例进行操作
|
|
30
|
-
```
|
|
31
|
-
|
|
32
|
-
**参数:**
|
|
33
|
-
- `dom`: 容器 DOM 元素(必需)
|
|
34
|
-
- `options`: 可选配置对象(详见 [README 初始化配置](https://github.com/wyyazlz/sheetnext/blob/master/README.md#初始化配置))
|
|
35
|
-
|
|
36
|
-
### 核心属性
|
|
37
|
-
|
|
38
|
-
| 属性 | 类型 | 说明 |
|
|
39
|
-
|------|------|------|
|
|
40
|
-
| `activeSheet` | `Sheet` | 当前激活的工作表(可读写) |
|
|
41
|
-
| `sheets` | `Sheet[]` | 所有工作表数组 |
|
|
42
|
-
| `sheetNames` | `string[]` | 工作表名称列表(只读) |
|
|
43
|
-
| `containerDom` | `HTMLElement` | 编辑器容器元素 |
|
|
44
|
-
| `namespace` | `string` | 实例的全局命名空间(如 `SN_0`) |
|
|
45
|
-
| `locked` | `boolean` | 是否锁定工作表切换 |
|
|
46
|
-
|
|
47
|
-
### 工作表管理方法
|
|
48
|
-
|
|
49
|
-
#### `addSheet(name?: string): Sheet`
|
|
50
|
-
添加新工作表,名称可选(自动生成 Sheet1、Sheet2 等)。
|
|
51
|
-
|
|
52
|
-
```javascript
|
|
53
|
-
const newSheet = SN.addSheet("销售数据");
|
|
54
|
-
const autoSheet = SN.addSheet(); // 自动命名
|
|
55
|
-
```
|
|
56
|
-
|
|
57
|
-
**规则:** 名称不重复、长度1-31字符、不含特殊符号 `: / \ * ? [ ]`
|
|
58
|
-
|
|
59
|
-
#### `delSheet(name: string): void`
|
|
60
|
-
删除指定工作表(至少保留一个可见工作表)。
|
|
61
|
-
|
|
62
|
-
```javascript
|
|
63
|
-
SN.delSheet("Sheet2");
|
|
64
|
-
```
|
|
65
|
-
|
|
66
|
-
#### `getSheetByName(name: string): Sheet | null`
|
|
67
|
-
根据名称获取工作表。
|
|
68
|
-
|
|
69
|
-
```javascript
|
|
70
|
-
const sheet = SN.getSheetByName("Sheet1");
|
|
71
|
-
```
|
|
72
|
-
|
|
73
|
-
#### `getVisibleSheetByIndex(index: number): Sheet`
|
|
74
|
-
获取可见工作表(按索引,隐藏工作表不计入)。
|
|
75
|
-
|
|
76
|
-
```javascript
|
|
77
|
-
const firstSheet = SN.getVisibleSheetByIndex(0);
|
|
78
|
-
```
|
|
79
|
-
|
|
80
|
-
### 文件操作
|
|
81
|
-
|
|
82
|
-
#### `import(file: File): Promise<void>`
|
|
83
|
-
导入 Excel 文件(.xlsx 格式)。
|
|
84
|
-
|
|
85
|
-
```javascript
|
|
86
|
-
fileInput.addEventListener('change', (e) => {
|
|
87
|
-
SN.import(e.target.files[0]);
|
|
88
|
-
});
|
|
89
|
-
```
|
|
90
|
-
|
|
91
|
-
#### `export(type: string): void`
|
|
92
|
-
导出电子表格(目前支持 `"XLSX"`)。
|
|
93
|
-
|
|
94
|
-
```javascript
|
|
95
|
-
SN.export('XLSX');
|
|
96
|
-
```
|
|
97
|
-
|
|
98
|
-
### 其他方法
|
|
99
|
-
|
|
100
|
-
#### `r(): void`
|
|
101
|
-
手动触发画布重新渲染(批量修改后使用)。
|
|
102
|
-
|
|
103
|
-
```javascript
|
|
104
|
-
// 批量修改后刷新
|
|
105
|
-
for (let i = 0; i < 100; i++) {
|
|
106
|
-
sheet.getCell(i, 0).editVal = i;
|
|
107
|
-
}
|
|
108
|
-
SN.r();
|
|
109
|
-
```
|
|
110
|
-
|
|
111
|
-
#### `getLicenseInfo()`
|
|
112
|
-
获取 License 信息。
|
|
113
|
-
|
|
114
|
-
```javascript
|
|
115
|
-
const info = SN.getLicenseInfo();
|
|
116
|
-
```
|
|
117
|
-
|
|
118
|
-
### 多实例支持
|
|
119
|
-
|
|
120
|
-
SheetNext 支持同一页面创建多个独立实例:
|
|
121
|
-
|
|
122
|
-
```javascript
|
|
123
|
-
const editor1 = new SheetNext(document.querySelector('#container1'));
|
|
124
|
-
const editor2 = new SheetNext(document.querySelector('#container2'));
|
|
125
|
-
|
|
126
|
-
console.log(editor1.namespace); // "SN_0"
|
|
127
|
-
console.log(editor2.namespace); // "SN_1"
|
|
128
|
-
```
|
|
129
|
-
|
|
130
|
-
---
|
|
131
|
-
|
|
132
|
-
## Sheet
|
|
133
|
-
|
|
134
|
-
Sheet 类代表一个工作表。
|
|
135
|
-
|
|
136
|
-
### 属性
|
|
137
|
-
|
|
138
|
-
| 属性 | 类型 | 说明 |
|
|
139
|
-
|------|------|------|
|
|
140
|
-
| `name` | `string` | 工作表名称 |
|
|
141
|
-
| `hidden` | `boolean` | 是否隐藏 |
|
|
142
|
-
| `merges` | `RangeNum[]` | 合并单元格区域列表 |
|
|
143
|
-
| `defaultColWidth` | `number` | 默认列宽(像素) |
|
|
144
|
-
| `defaultRowHeight` | `number` | 默认行高(像素) |
|
|
145
|
-
| `showGridLines` | `boolean` | 是否显示网格线 |
|
|
146
|
-
| `showRowColHeaders` | `boolean` | 是否显示行列标题 |
|
|
147
|
-
| `activeCell` | `CellNum` | 当前活动单元格 |
|
|
148
|
-
| `activeAreas` | `RangeNum[]` | 当前选中区域 |
|
|
149
|
-
| `rows` | `Row[]` | 所有行 |
|
|
150
|
-
| `cols` | `Col[]` | 所有列 |
|
|
151
|
-
| `xSplit` | `number` | 冻结列数 |
|
|
152
|
-
| `ySplit` | `number` | 冻结行数 |
|
|
153
|
-
| `drawings` | `Drawing[]` | 图形对象列表(图表、图片等) |
|
|
154
|
-
|
|
155
|
-
### 基础方法
|
|
156
|
-
|
|
157
|
-
#### `getRow(r: number): Row`
|
|
158
|
-
获取指定行对象。
|
|
159
|
-
|
|
160
|
-
```javascript
|
|
161
|
-
const row = sheet.getRow(0); // 获取第一行
|
|
162
|
-
```
|
|
163
|
-
|
|
164
|
-
#### `getCol(c: number): Col`
|
|
165
|
-
获取指定列对象。
|
|
166
|
-
|
|
167
|
-
```javascript
|
|
168
|
-
const col = sheet.getCol(0); // 获取第一列(A列)
|
|
169
|
-
```
|
|
170
|
-
|
|
171
|
-
#### `getCell(r: number, c: number): Cell`
|
|
172
|
-
获取指定单元格。
|
|
173
|
-
|
|
174
|
-
```javascript
|
|
175
|
-
const cell = sheet.getCell(0, 0); // 获取 A1 单元格
|
|
176
|
-
```
|
|
177
|
-
|
|
178
|
-
#### `getCellByStr(cellStr: string): Cell`
|
|
179
|
-
通过字符串引用获取单元格。
|
|
180
|
-
|
|
181
|
-
```javascript
|
|
182
|
-
const cell = sheet.getCellByStr("A1");
|
|
183
|
-
```
|
|
184
|
-
|
|
185
|
-
#### `rangeStrToNum(rangeStr: string): RangeNum`
|
|
186
|
-
将字符串范围转换为数字范围对象。
|
|
187
|
-
|
|
188
|
-
```javascript
|
|
189
|
-
const rangeNum = sheet.rangeStrToNum("A1:C3");
|
|
190
|
-
// 返回: {s:{r:0,c:0}, e:{r:2,c:2}}
|
|
191
|
-
```
|
|
192
|
-
|
|
193
|
-
### 区域遍历
|
|
194
|
-
|
|
195
|
-
#### `eachArea(rangeRef: RangeRef, callback: (r, c, index) => void, reverse?: boolean): void`
|
|
196
|
-
遍历指定区域的每个单元格。
|
|
197
|
-
|
|
198
|
-
```javascript
|
|
199
|
-
// 正向遍历
|
|
200
|
-
sheet.eachArea("A1:C3", (r, c, index) => {
|
|
201
|
-
const cell = sheet.getCell(r, c);
|
|
202
|
-
console.log(cell.showVal);
|
|
203
|
-
});
|
|
204
|
-
|
|
205
|
-
// 反向遍历(用于删除操作,避免索引混乱)
|
|
206
|
-
sheet.eachArea("A:A", (r, c) => {
|
|
207
|
-
if (sheet.getCell(r, c).showVal === "") {
|
|
208
|
-
sheet.delRows(r, 1);
|
|
209
|
-
}
|
|
210
|
-
}, true);
|
|
211
|
-
```
|
|
212
|
-
|
|
213
|
-
### 行列操作
|
|
214
|
-
|
|
215
|
-
#### `showAllHidRows(): void`
|
|
216
|
-
显示所有隐藏的行。
|
|
217
|
-
|
|
218
|
-
```javascript
|
|
219
|
-
sheet.showAllHidRows();
|
|
220
|
-
```
|
|
221
|
-
|
|
222
|
-
#### `showAllHidCols(): void`
|
|
223
|
-
显示所有隐藏的列。
|
|
224
|
-
|
|
225
|
-
```javascript
|
|
226
|
-
sheet.showAllHidCols();
|
|
227
|
-
```
|
|
228
|
-
|
|
229
|
-
#### `addRows(startR: number, num: number): void`
|
|
230
|
-
在指定位置插入行。
|
|
231
|
-
|
|
232
|
-
```javascript
|
|
233
|
-
sheet.addRows(5, 3); // 在第 5 行位置插入 3 行
|
|
234
|
-
```
|
|
235
|
-
|
|
236
|
-
**注意**:多个同时调用时,应反向遍历以避免索引混乱。
|
|
237
|
-
|
|
238
|
-
#### `addCols(startC: number, num: number): void`
|
|
239
|
-
在指定位置插入列。
|
|
240
|
-
|
|
241
|
-
```javascript
|
|
242
|
-
sheet.addCols(2, 2); // 在第 2 列位置插入 2 列
|
|
243
|
-
```
|
|
244
|
-
|
|
245
|
-
#### `delRows(startR: number, num: number): void`
|
|
246
|
-
删除指定行。
|
|
247
|
-
|
|
248
|
-
```javascript
|
|
249
|
-
sheet.delRows(5, 3); // 删除从第 5 行开始的 3 行
|
|
250
|
-
```
|
|
251
|
-
|
|
252
|
-
#### `delCols(startC: number, num: number): void`
|
|
253
|
-
删除指定列。
|
|
254
|
-
|
|
255
|
-
```javascript
|
|
256
|
-
sheet.delCols(2, 2); // 删除从第 2 列开始的 2 列
|
|
257
|
-
```
|
|
258
|
-
|
|
259
|
-
### 合并单元格
|
|
260
|
-
|
|
261
|
-
#### `mergeCells(rangeRef: RangeRef): void`
|
|
262
|
-
合并指定区域的单元格。
|
|
263
|
-
|
|
264
|
-
```javascript
|
|
265
|
-
sheet.mergeCells("A1:C3");
|
|
266
|
-
// 或
|
|
267
|
-
sheet.mergeCells({s:{r:0,c:0}, e:{r:2,c:2}});
|
|
268
|
-
```
|
|
269
|
-
|
|
270
|
-
#### `unMergeCells(cellRef: CellRef): void`
|
|
271
|
-
取消合并(传入区域内任意单元格引用)。
|
|
272
|
-
|
|
273
|
-
```javascript
|
|
274
|
-
sheet.unMergeCells("A1"); // 取消包含 A1 的合并区域
|
|
275
|
-
```
|
|
276
|
-
|
|
277
|
-
### 排序
|
|
278
|
-
|
|
279
|
-
#### `rangeSort(sortItems: SortItem[], range?: RangeRef): void`
|
|
280
|
-
对指定区域进行排序。
|
|
281
|
-
|
|
282
|
-
**SortItem 接口:**
|
|
283
|
-
|
|
284
|
-
```typescript
|
|
285
|
-
interface SortItem {
|
|
286
|
-
type: "column" | "row" | "custom";
|
|
287
|
-
order?: "asc" | "desc" | "value"; // type="custom" 时省略
|
|
288
|
-
index: string; // 列/行标签,行从 1 开始,列从 A 开始
|
|
289
|
-
sortData?: any[]; // order="value" 时使用,基于此数据排序
|
|
290
|
-
cb?: (rowsArray: Cell[][], sortIndex: number) => Cell[][]; // type="custom" 时使用
|
|
291
|
-
}
|
|
292
|
-
```
|
|
293
|
-
|
|
294
|
-
**示例:按自定义顺序排序**
|
|
295
|
-
|
|
296
|
-
```javascript
|
|
297
|
-
const sheet = SN.activeSheet;
|
|
298
|
-
// 除标题外,按 C 列字母顺序排序:A V U T
|
|
299
|
-
sheet.rangeSort(
|
|
300
|
-
[{
|
|
301
|
-
type: 'column',
|
|
302
|
-
order: 'value',
|
|
303
|
-
index: 'C',
|
|
304
|
-
sortData: ["A", "V", "U", "T"]
|
|
305
|
-
}],
|
|
306
|
-
{s:{c:0,r:1}, e:{c:sheet.colCount, r:sheet.rowCount}}
|
|
307
|
-
);
|
|
308
|
-
```
|
|
309
|
-
|
|
310
|
-
### 批量插入数据
|
|
311
|
-
|
|
312
|
-
#### `insertTable(data: (ICellConfig | string | number)[][], startCell: CellRef, globalConfig?: object): RangeNum`
|
|
313
|
-
在指定位置插入表格数据。
|
|
314
|
-
|
|
315
|
-
**ICellConfig 接口:**
|
|
316
|
-
|
|
317
|
-
```typescript
|
|
318
|
-
interface ICellConfig {
|
|
319
|
-
v?: string; // 单元格值
|
|
320
|
-
w?: number; // 列宽(像素),仅在首行设置
|
|
321
|
-
h?: number; // 行高(像素),仅在首列设置
|
|
322
|
-
b?: boolean; // 是否粗体
|
|
323
|
-
s?: number; // 字体大小
|
|
324
|
-
fg?: string; // 背景色
|
|
325
|
-
a?: 'l' | 'r' | 'c'; // 对齐方式(left/right/center)
|
|
326
|
-
c?: string; // 文本颜色
|
|
327
|
-
mr?: number; // 向右合并单元格数(不包括自身)
|
|
328
|
-
mb?: number; // 向下合并单元格数(不包括自身)
|
|
329
|
-
}
|
|
330
|
-
```
|
|
331
|
-
|
|
332
|
-
**globalConfig 参数:**
|
|
333
|
-
- `a`: 对齐方式
|
|
334
|
-
- `border`: 是否显示边框
|
|
335
|
-
- `w`: 默认列宽
|
|
336
|
-
- `h`: 默认行高
|
|
337
|
-
- `fg`: 背景色
|
|
338
|
-
- `c`: 文本颜色
|
|
339
|
-
|
|
340
|
-
**示例:生成会议记录模板**
|
|
341
|
-
|
|
342
|
-
```javascript
|
|
343
|
-
const t = [
|
|
344
|
-
[
|
|
345
|
-
{ v: "Meeting Minutes", s: 16, mr: 3, fg: "#eee", h: 45, b: true },
|
|
346
|
-
{ w: 160 }, "", { w: 160 }
|
|
347
|
-
],
|
|
348
|
-
["Time", "", "Location", ""],
|
|
349
|
-
["Host", "", "Recorder", ""],
|
|
350
|
-
["Expected", "", "Present", ""],
|
|
351
|
-
["Absent Members", { mr: 2 }, "", ""],
|
|
352
|
-
["Topic", { mr: 2 }, "", ""],
|
|
353
|
-
[{ v: "Content", h: 280 }, { mr: 2 }, "", ""],
|
|
354
|
-
[{ v: "Remarks", h: 80 }, { mr: 2 }, "", ""]
|
|
355
|
-
]; // 必须是矩形矩阵
|
|
356
|
-
|
|
357
|
-
SN.activeSheet.insertTable(t, "A1", {
|
|
358
|
-
border: true,
|
|
359
|
-
a: "c",
|
|
360
|
-
h: 35,
|
|
361
|
-
w: 140
|
|
362
|
-
});
|
|
363
|
-
```
|
|
364
|
-
|
|
365
|
-
**注意**:
|
|
366
|
-
- 对于合并单元格(`mr`/`mb`),需要添加相同数量的空字符串占位符,保持二维数组的矩形结构。
|
|
367
|
-
- 例如:`{ mr: 2 }, "", ""`
|
|
368
|
-
|
|
369
|
-
### 图形对象
|
|
370
|
-
|
|
371
|
-
#### `addDrawing(config: object): Drawing`
|
|
372
|
-
添加图形对象(图表、图片等)。
|
|
373
|
-
|
|
374
|
-
**示例:添加图表**
|
|
375
|
-
|
|
376
|
-
```javascript
|
|
377
|
-
SN.activeSheet.addDrawing({
|
|
378
|
-
type: 'chart',
|
|
379
|
-
startCell: 'B2',
|
|
380
|
-
option: {
|
|
381
|
-
title: { text: '销售趋势图' },
|
|
382
|
-
legend: {
|
|
383
|
-
data: ['销量'] // 或使用引用: `${sheet.name}!B3`
|
|
384
|
-
},
|
|
385
|
-
xAxis: {
|
|
386
|
-
type: 'category',
|
|
387
|
-
data: ['一月', '二月', '三月'] // 或引用: `${sheet.name}!C2:E2`
|
|
388
|
-
},
|
|
389
|
-
yAxis: { type: 'value' },
|
|
390
|
-
series: [
|
|
391
|
-
{
|
|
392
|
-
name: '销量',
|
|
393
|
-
type: 'line',
|
|
394
|
-
data: [820, 932, 901] // 或引用: `${sheet.name}!C3:E3`
|
|
395
|
-
}
|
|
396
|
-
]
|
|
397
|
-
}
|
|
398
|
-
});
|
|
399
|
-
```
|
|
400
|
-
|
|
401
|
-
#### `getDrawingsByCell(cellRef: CellRef): Drawing[]`
|
|
402
|
-
获取指定单元格位置的所有图形对象。
|
|
403
|
-
|
|
404
|
-
```javascript
|
|
405
|
-
const drawings = sheet.getDrawingsByCell("B2");
|
|
406
|
-
```
|
|
407
|
-
|
|
408
|
-
#### `removeDrawing(id: string): void`
|
|
409
|
-
删除指定 ID 的图形对象。
|
|
410
|
-
|
|
411
|
-
```javascript
|
|
412
|
-
sheet.removeDrawing("drawing-id");
|
|
413
|
-
```
|
|
414
|
-
|
|
415
|
-
---
|
|
416
|
-
|
|
417
|
-
## Cell
|
|
418
|
-
|
|
419
|
-
Cell 类代表单个单元格。
|
|
420
|
-
|
|
421
|
-
### 属性
|
|
422
|
-
|
|
423
|
-
| 属性 | 类型 | 说明 |
|
|
424
|
-
|------|------|------|
|
|
425
|
-
| `isMerged` | `boolean` | 是否为合并单元格 |
|
|
426
|
-
| `master` | `CellNum \| null` | 如果是合并单元格,指向主单元格 |
|
|
427
|
-
| `hyperlink` | `object` | 超链接:`{target, location, tooltip}` |
|
|
428
|
-
| `dataValidation` | `object` | 数据验证规则 |
|
|
429
|
-
| `editVal` | `string` | 编辑值或公式(可写) |
|
|
430
|
-
| `calcVal` | `any` | 计算值(只读) |
|
|
431
|
-
| `showVal` | `string` | 显示值(只读) |
|
|
432
|
-
| `numFmt` | `string` | 数字格式 |
|
|
433
|
-
| `font` | `object` | 字体样式 |
|
|
434
|
-
| `alignment` | `object` | 对齐方式 |
|
|
435
|
-
| `border` | `object` | 边框样式 |
|
|
436
|
-
| `fill` | `object` | 填充样式 |
|
|
437
|
-
|
|
438
|
-
### dataValidation 对象结构
|
|
439
|
-
|
|
440
|
-
```typescript
|
|
441
|
-
{
|
|
442
|
-
type: string; // 验证类型
|
|
443
|
-
operator: string; // 操作符
|
|
444
|
-
allowBlank: boolean; // 是否允许空白
|
|
445
|
-
formula1: any; // 公式1(type=list 时为数组)
|
|
446
|
-
formula2: any; // 公式2
|
|
447
|
-
showInputMessage: boolean; // 是否显示输入提示
|
|
448
|
-
promptTitle: string; // 提示标题
|
|
449
|
-
prompt: string; // 提示内容
|
|
450
|
-
showErrorMessage: boolean; // 是否显示错误提示
|
|
451
|
-
errorTitle: string; // 错误标题
|
|
452
|
-
error: string; // 错误内容
|
|
453
|
-
errorStyle: string; // 错误样式
|
|
454
|
-
showDropDown: boolean; // 是否显示下拉框
|
|
455
|
-
}
|
|
456
|
-
```
|
|
457
|
-
|
|
458
|
-
### 示例
|
|
459
|
-
|
|
460
|
-
```javascript
|
|
461
|
-
const cell = sheet.getCell(0, 0);
|
|
462
|
-
|
|
463
|
-
// 设置单元格值
|
|
464
|
-
cell.editVal = "Hello World";
|
|
465
|
-
|
|
466
|
-
// 设置公式
|
|
467
|
-
cell.editVal = "=SUM(A1:A10)";
|
|
468
|
-
|
|
469
|
-
// 读取显示值
|
|
470
|
-
console.log(cell.showVal);
|
|
471
|
-
|
|
472
|
-
// 设置样式
|
|
473
|
-
cell.fill = { fgColor: '#FFFF00' };
|
|
474
|
-
cell.font = { bold: true, size: 14 };
|
|
475
|
-
```
|
|
476
|
-
|
|
477
|
-
---
|
|
478
|
-
|
|
479
|
-
## Row
|
|
480
|
-
|
|
481
|
-
Row 类代表行,提供行级别的属性和操作。
|
|
482
|
-
|
|
483
|
-
### 属性
|
|
484
|
-
|
|
485
|
-
| 属性 | 类型 | 说明 |
|
|
486
|
-
|------|------|------|
|
|
487
|
-
| `cells` | `Cell[]` | 该行的所有单元格 |
|
|
488
|
-
| `height` | `number` | 行高(像素) |
|
|
489
|
-
| `hidden` | `boolean` | 是否隐藏 |
|
|
490
|
-
| `rIndex` | `number` | 行索引 |
|
|
491
|
-
| `numFmt` | `string` | 数字格式 |
|
|
492
|
-
| `font` | `object` | 字体样式 |
|
|
493
|
-
| `alignment` | `object` | 对齐方式 |
|
|
494
|
-
| `border` | `object` | 边框样式 |
|
|
495
|
-
| `fill` | `object` | 填充样式 |
|
|
496
|
-
|
|
497
|
-
### 方法
|
|
498
|
-
|
|
499
|
-
#### `getCell(c: number): Cell`
|
|
500
|
-
获取该行的指定列单元格。
|
|
501
|
-
|
|
502
|
-
```javascript
|
|
503
|
-
const row = sheet.getRow(0); // 获取第一行
|
|
504
|
-
const cell = row.getCell(0); // 获取该行第一列的单元格
|
|
505
|
-
```
|
|
506
|
-
|
|
507
|
-
### 示例
|
|
508
|
-
|
|
509
|
-
```javascript
|
|
510
|
-
const row = sheet.getRow(5);
|
|
511
|
-
|
|
512
|
-
// 设置行高
|
|
513
|
-
row.height = 30;
|
|
514
|
-
|
|
515
|
-
// 隐藏行
|
|
516
|
-
row.hidden = true;
|
|
517
|
-
|
|
518
|
-
// 设置行样式
|
|
519
|
-
row.fill = { fgColor: '#F0F0F0' };
|
|
520
|
-
row.font = { bold: true };
|
|
521
|
-
```
|
|
522
|
-
|
|
523
|
-
---
|
|
524
|
-
|
|
525
|
-
## Col
|
|
526
|
-
|
|
527
|
-
Col 类代表列,提供列级别的属性和操作。
|
|
528
|
-
|
|
529
|
-
### 属性
|
|
530
|
-
|
|
531
|
-
| 属性 | 类型 | 说明 |
|
|
532
|
-
|------|------|------|
|
|
533
|
-
| `cells` | `Cell[]` | 该列的所有单元格 |
|
|
534
|
-
| `hidden` | `boolean` | 是否隐藏 |
|
|
535
|
-
| `width` | `number` | 列宽(像素) |
|
|
536
|
-
| `cIndex` | `number` | 列索引 |
|
|
537
|
-
| `numFmt` | `string` | 数字格式 |
|
|
538
|
-
| `font` | `object` | 字体样式 |
|
|
539
|
-
| `alignment` | `object` | 对齐方式 |
|
|
540
|
-
| `border` | `object` | 边框样式 |
|
|
541
|
-
| `fill` | `object` | 填充样式 |
|
|
542
|
-
|
|
543
|
-
### 方法
|
|
544
|
-
|
|
545
|
-
#### `getCell(r: number): Cell`
|
|
546
|
-
获取该列的指定行单元格。
|
|
547
|
-
|
|
548
|
-
```javascript
|
|
549
|
-
const col = sheet.getCol(0); // 获取第一列(A列)
|
|
550
|
-
const cell = col.getCell(0); // 获取该列第一行的单元格
|
|
551
|
-
```
|
|
552
|
-
|
|
553
|
-
### 示例
|
|
554
|
-
|
|
555
|
-
```javascript
|
|
556
|
-
const col = sheet.getCol(2); // 获取 C 列
|
|
557
|
-
|
|
558
|
-
// 设置列宽
|
|
559
|
-
col.width = 120;
|
|
560
|
-
|
|
561
|
-
// 隐藏列
|
|
562
|
-
col.hidden = true;
|
|
563
|
-
|
|
564
|
-
// 设置列样式
|
|
565
|
-
col.fill = { fgColor: '#E0E0E0' };
|
|
566
|
-
col.alignment = { horizontal: 'center' };
|
|
567
|
-
```
|
|
568
|
-
|
|
569
|
-
---
|
|
570
|
-
|
|
571
|
-
## Drawing
|
|
572
|
-
|
|
573
|
-
Drawing 类代表图表、图片、连接线或形状等图形对象。
|
|
574
|
-
|
|
575
|
-
### 属性
|
|
576
|
-
|
|
577
|
-
| 属性 | 类型 | 说明 |
|
|
578
|
-
|------|------|------|
|
|
579
|
-
| `id` | `string` | 唯一标识符 |
|
|
580
|
-
| `type` | `string` | 类型:`chart`、`image`、`connector`、`shape` |
|
|
581
|
-
| `startCell` | `CellNum` | 起始单元格位置 |
|
|
582
|
-
| `offsetX` | `number` | X 轴偏移(默认 0) |
|
|
583
|
-
| `offsetY` | `number` | Y 轴偏移(默认 0) |
|
|
584
|
-
| `width` | `number` | 宽度(默认 480) |
|
|
585
|
-
| `height` | `number` | 高度(默认 288) |
|
|
586
|
-
| `option` | `object` | 图表配置(type=chart 时,与 ECharts 配置相同) |
|
|
587
|
-
| `imageBase64` | `string` | Base64 图片数据(type=image 时) |
|
|
588
|
-
| `updRender` | `boolean` | 是否更新渲染 |
|
|
589
|
-
|
|
590
|
-
### 方法
|
|
591
|
-
|
|
592
|
-
#### `updIndex(direction: string): void`
|
|
593
|
-
更新图层顺序。
|
|
594
|
-
|
|
595
|
-
参数值:`"up"` | `"down"` | `"top"` | `"bottom"`
|
|
596
|
-
|
|
597
|
-
```javascript
|
|
598
|
-
drawing.updIndex("top"); // 移到最上层
|
|
599
|
-
```
|
|
600
|
-
|
|
601
|
-
---
|
|
602
|
-
|
|
603
|
-
## Layout
|
|
604
|
-
|
|
605
|
-
Layout 类管理编辑器的界面布局,包括菜单栏、工具栏、公式栏、Sheet 标签栏和 AI 聊天面板等界面元素的显示与隐藏。
|
|
606
|
-
|
|
607
|
-
### 构造函数
|
|
608
|
-
|
|
609
|
-
Layout 类由 SheetNext 自动创建,通过 `SN.Layout` 访问。
|
|
610
|
-
|
|
611
|
-
```javascript
|
|
612
|
-
const SN = new SheetNext(dom, {
|
|
613
|
-
menuList: [...], // 自定义菜单配置(可选)
|
|
614
|
-
menuRight: {...} // 自定义右侧菜单(可选)
|
|
615
|
-
});
|
|
616
|
-
```
|
|
617
|
-
|
|
618
|
-
**注意:** `menuList` 和 `menuRight` 只能在初始化时传入,后续无法修改。
|
|
619
|
-
|
|
620
|
-
### 属性
|
|
621
|
-
|
|
622
|
-
| 属性 | 类型 | 说明 |
|
|
623
|
-
|------|------|------|
|
|
624
|
-
| `showMenuBar` | `boolean` | 是否显示菜单栏(可读写) |
|
|
625
|
-
| `showToolbar` | `boolean` | 是否显示工具栏(可读写) |
|
|
626
|
-
| `showFormulaBar` | `boolean` | 是否显示公式栏(可读写) |
|
|
627
|
-
| `showSheetTabBar` | `boolean` | 是否显示 Sheet 标签栏(可读写) |
|
|
628
|
-
| `showAIChat` | `boolean` | 是否显示 AI 聊天面板(可读写) |
|
|
629
|
-
| `showAIChatWindow` | `boolean` | 是否显示 AI 聊天小窗口模式(可读写) |
|
|
630
|
-
| `isSmallWindow` | `boolean` | 当前是否为小窗口模式(宽度 < 900px)(只读) |
|
|
631
|
-
| `menuConfig` | `object` | 菜单配置对象(只读) |
|
|
632
|
-
|
|
633
|
-
### 菜单配置(初始化时)
|
|
634
|
-
|
|
635
|
-
#### menuList 配置
|
|
636
|
-
|
|
637
|
-
`menuList` 用于自定义顶部菜单栏,只能在初始化时传入。
|
|
638
|
-
|
|
639
|
-
**MenuList 结构:**
|
|
640
|
-
|
|
641
|
-
```typescript
|
|
642
|
-
interface MenuItem {
|
|
643
|
-
label: string; // 菜单项标签
|
|
644
|
-
handler?: () => void; // 点击处理函数
|
|
645
|
-
disabled?: boolean; // 是否禁用
|
|
646
|
-
tip?: string; // 提示信息(右侧显示)
|
|
647
|
-
divider?: boolean; // 是否为分隔线
|
|
648
|
-
}
|
|
649
|
-
|
|
650
|
-
interface Menu {
|
|
651
|
-
label: string; // 菜单标签
|
|
652
|
-
items: MenuItem[]; // 菜单项列表
|
|
653
|
-
}
|
|
654
|
-
|
|
655
|
-
type MenuList = Menu[];
|
|
656
|
-
```
|
|
657
|
-
|
|
658
|
-
**完整示例:**
|
|
659
|
-
|
|
660
|
-
```javascript
|
|
661
|
-
const SN = new SheetNext(document.querySelector('#container'), {
|
|
662
|
-
// 配置后覆盖原配置
|
|
663
|
-
menuList: [
|
|
664
|
-
{
|
|
665
|
-
label: '文件',
|
|
666
|
-
items: [
|
|
667
|
-
{ label: '导入 XLSX', handler: () => SN.containerDom.querySelector('.sn-upload').click() },
|
|
668
|
-
{ divider: true },
|
|
669
|
-
{ label: '导出 XLSX', handler: () => SN.export('XLSX') }
|
|
670
|
-
]
|
|
671
|
-
},
|
|
672
|
-
{
|
|
673
|
-
label: '插入',
|
|
674
|
-
items: [
|
|
675
|
-
{ label: '插入行', handler: () => SN.AI.chatInput('在表最后新插入10行') },
|
|
676
|
-
{ label: '插入列', handler: () => SN.AI.chatInput('在表最后新插入10列') },
|
|
677
|
-
{ label: '超链接', handler: () => SN.AI.chatInput('在A1插入超链接,文本:SN 地址:https://www.sheetnext.com') },
|
|
678
|
-
{ label: '图片', disabled: true, tip: '待开放' },
|
|
679
|
-
{ label: '图表', handler: () => SN.AI.chatInput('根据表中数据生成柱状图') },
|
|
680
|
-
{ label: '图形', disabled: true, tip: '待开放' },
|
|
681
|
-
{ label: '数据透视表', disabled: true, tip: '待开放' },
|
|
682
|
-
{ label: '公式', handler: () => SN.AI.chatInput('在A1编写公式,求F18:G21的平均值') }
|
|
683
|
-
]
|
|
684
|
-
},
|
|
685
|
-
{
|
|
686
|
-
label: '视图',
|
|
687
|
-
items: [
|
|
688
|
-
{ label: '显示行列标', handler: () => { SN.activeSheet.showRowColHeaders = true; SN.r(); } },
|
|
689
|
-
{ label: '隐藏行列标', handler: () => { SN.activeSheet.showRowColHeaders = false; SN.r(); } },
|
|
690
|
-
{ label: '显示网格线', handler: () => { SN.activeSheet.showGridLines = true; SN.r(); } },
|
|
691
|
-
{ label: '隐藏网格线', handler: () => { SN.activeSheet.showGridLines = false; SN.r(); } },
|
|
692
|
-
{ label: '冻结首行', handler: () => { SN.activeSheet.ySplit = 1; SN.r(); } },
|
|
693
|
-
{ label: '冻结首列', handler: () => { SN.activeSheet.xSplit = 1; SN.r(); } }
|
|
694
|
-
]
|
|
695
|
-
},
|
|
696
|
-
{
|
|
697
|
-
label: '更多',
|
|
698
|
-
items: [
|
|
699
|
-
{ label: 'SheetNext Pro', handler: () => window.open('https://www.sheetnext.com/pro') },
|
|
700
|
-
{ label: '开发文档', handler: () => window.open('https://www.github.com/wyyazlz/sheetnext') },
|
|
701
|
-
]
|
|
702
|
-
}
|
|
703
|
-
]
|
|
704
|
-
});
|
|
705
|
-
```
|
|
706
|
-
|
|
707
|
-
**默认菜单:**
|
|
708
|
-
|
|
709
|
-
如果不传入 `menuList`,将使用默认菜单配置(包含:文件、插入、视图、更多)。
|
|
710
|
-
|
|
711
|
-
#### menuRight 配置
|
|
712
|
-
|
|
713
|
-
`menuRight` 用于自定义菜单栏右侧区域,只能在初始化时传入。
|
|
714
|
-
|
|
715
|
-
**MenuRight 结构:**
|
|
716
|
-
|
|
717
|
-
```typescript
|
|
718
|
-
interface MenuRight {
|
|
719
|
-
html: string; // HTML 内容
|
|
720
|
-
handler?: () => void; // 点击处理函数
|
|
721
|
-
}
|
|
722
|
-
```
|
|
723
|
-
|
|
724
|
-
**示例:**
|
|
725
|
-
|
|
726
|
-
```javascript
|
|
727
|
-
const SN = new SheetNext(document.querySelector('#container'), {
|
|
728
|
-
menuRight: {
|
|
729
|
-
html: '<span style="color: #666;">我的应用 v1.0</span>',
|
|
730
|
-
handler: () => {
|
|
731
|
-
alert('欢迎使用!');
|
|
732
|
-
}
|
|
733
|
-
}
|
|
734
|
-
});
|
|
735
|
-
```
|
|
736
|
-
|
|
737
|
-
---
|
|
738
|
-
|
|
739
|
-
## Utils
|
|
740
|
-
|
|
741
|
-
Utils 类提供坐标转换等实用方法。
|
|
742
|
-
|
|
743
|
-
### 方法
|
|
744
|
-
|
|
745
|
-
#### `numToChar(num: number): string`
|
|
746
|
-
数字转字母列标。
|
|
747
|
-
|
|
748
|
-
```javascript
|
|
749
|
-
SN.Utils.numToChar(0); // "A"
|
|
750
|
-
SN.Utils.numToChar(25); // "Z"
|
|
751
|
-
SN.Utils.numToChar(26); // "AA"
|
|
752
|
-
```
|
|
753
|
-
|
|
754
|
-
#### `charToNum(char: string): number`
|
|
755
|
-
字母列标转数字。
|
|
756
|
-
|
|
757
|
-
```javascript
|
|
758
|
-
SN.Utils.charToNum("A"); // 0
|
|
759
|
-
SN.Utils.charToNum("Z"); // 25
|
|
760
|
-
SN.Utils.charToNum("AA"); // 26
|
|
761
|
-
```
|
|
762
|
-
|
|
763
|
-
#### `rangeNumToStr(rangeNum: RangeNum): string`
|
|
764
|
-
范围对象转字符串。
|
|
765
|
-
|
|
766
|
-
```javascript
|
|
767
|
-
SN.Utils.rangeNumToStr({s:{r:0,c:0}, e:{r:2,c:2}}); // "A1:C3"
|
|
768
|
-
```
|
|
769
|
-
|
|
770
|
-
#### `cellStrToNum(cellStr: string): CellNum`
|
|
771
|
-
单元格字符串转数字对象。
|
|
772
|
-
|
|
773
|
-
```javascript
|
|
774
|
-
SN.Utils.cellStrToNum("A1"); // {r:0, c:0}
|
|
775
|
-
```
|
|
776
|
-
|
|
777
|
-
#### `cellNumToStr(cellNum: CellNum): string`
|
|
778
|
-
单元格数字对象转字符串。
|
|
779
|
-
|
|
780
|
-
```javascript
|
|
781
|
-
SN.Utils.cellNumToStr({r:0, c:0}); // "A1"
|
|
782
|
-
```
|
|
783
|
-
|
|
784
|
-
---
|
|
785
|
-
|
|
786
|
-
## UndoRedoClass
|
|
787
|
-
|
|
788
|
-
管理操作历史,支持撤销和重做功能。
|
|
789
|
-
|
|
790
|
-
### 方法
|
|
791
|
-
|
|
792
|
-
#### `undo(): void`
|
|
793
|
-
撤销上一步操作。
|
|
794
|
-
|
|
795
|
-
```javascript
|
|
796
|
-
SN.UndoRedo.undo();
|
|
797
|
-
```
|
|
798
|
-
|
|
799
|
-
#### `redo(): void`
|
|
800
|
-
重做上一步操作。
|
|
801
|
-
|
|
802
|
-
```javascript
|
|
803
|
-
SN.UndoRedo.redo();
|
|
804
|
-
```
|
|
805
|
-
|
|
806
|
-
### 示例
|
|
807
|
-
|
|
808
|
-
```javascript
|
|
809
|
-
// 执行一些操作
|
|
810
|
-
sheet.getCell(0, 0).editVal = "Hello";
|
|
811
|
-
sheet.mergeCells("A1:B1");
|
|
812
|
-
|
|
813
|
-
// 撤销合并操作
|
|
814
|
-
SN.UndoRedo.undo();
|
|
815
|
-
|
|
816
|
-
// 撤销编辑操作
|
|
817
|
-
SN.UndoRedo.undo();
|
|
818
|
-
|
|
819
|
-
// 重做编辑操作
|
|
820
|
-
SN.UndoRedo.redo();
|
|
821
|
-
```
|
|
822
|
-
|
|
823
|
-
**注意**:
|
|
824
|
-
- 撤销/重做会自动记录大部分用户操作
|
|
825
|
-
- 通过 API 修改的内容也会被记录
|
|
826
|
-
- 历史记录栈有大小限制,过旧的操作会被清除
|