insigma-modal-vue 1.4.82 → 1.4.84

Sign up to get free protection for your applications and to get access to all the features.
package/README.md CHANGED
@@ -1,528 +1,528 @@
1
- <!-- START doctoc generated TOC please keep comment here to allow auto update -->
2
- <!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
3
-
4
- - [更新说明](#%E6%9B%B4%E6%96%B0%E8%AF%B4%E6%98%8E)
5
- - [bl-from](#bl-from)
6
- - [bl-from Attributes](#bl-from-attributes)
7
- - [form-template](#form-template)
8
- - [picker-options](#picker-options)
9
- - [option-prop](#option-prop)
10
- - [bl-from 事件](#bl-from-%E4%BA%8B%E4%BB%B6)
11
- - [bl-from 方法](#bl-from-%E6%96%B9%E6%B3%95)
12
- - [bl-button](#bl-button)
13
- - [bl-button Attributes](#bl-button-attributes)
14
- - [config-obj](#config-obj)
15
- - [bl-title](#bl-title)
16
- - [bl-title Attributes](#bl-title-attributes)
17
- - [bl-search-card](#bl-search-card)
18
- - [bl-search-card Attributes](#bl-search-card-attributes)
19
- - [other-btn-list](#other-btn-list)
20
- - [bl-search-card 事件](#bl-search-card-%E4%BA%8B%E4%BB%B6)
21
- - [bl-search-card 方法](#bl-search-card-%E6%96%B9%E6%B3%95)
22
- - [bl-search-card 参数](#bl-search-card-%E5%8F%82%E6%95%B0)
23
- - [bl-dialog](#bl-dialog)
24
- - [bl-dialog Attributes](#bl-dialog-attributes)
25
- - [bl-dialog 事件](#bl-dialog-%E4%BA%8B%E4%BB%B6)
26
- - [bl-dialog 方法](#bl-dialog-%E6%96%B9%E6%B3%95)
27
- - [container](#container)
28
- - [bl-svg-icon](#bl-svg-icon)
29
- - [bl-svg-icon Attributes](#bl-svg-icon-attributes)
30
- - [bl-preview-pdf](#bl-preview-pdf)
31
- - [bl-preview-pdf Attributes](#bl-preview-pdf-attributes)
32
- - [bl-preview-pdf 方法](#bl-preview-pdf-%E6%96%B9%E6%B3%95)
33
- - [bl-pagination](#bl-pagination)
34
- - [bl-pagination Attributes](#bl-pagination-attributes)
35
- - [bl-pagination 事件](#bl-pagination-%E4%BA%8B%E4%BB%B6)
36
- - [export](#export)
37
- - [导出xlsx](#%E5%AF%BC%E5%87%BAxlsx)
38
- - [导出csv](#%E5%AF%BC%E5%87%BAcsv)
39
- - [导出txt](#%E5%AF%BC%E5%87%BAtxt)
40
- - [bl-tables](#bl-tables)
41
- - [bl-tables 属性](#bl-tables-attributes)
42
- - [bl-tables tableColumn Attributes](#bl-tables-table-column-attributes)
43
- - [bl-tables Methods](#bl-tables-methods)
44
- <!-- END doctoc generated TOC please keep comment here to allow auto update -->
45
-
46
- ## 更新说明
47
- v1.0.19 修改消息弹窗样式<br/>
48
- v1.0.20 表单组件入参增加picker-options<br/>
49
- v1.0.21 弹窗组件入参增加modal-append-to-body、append-to-body<br/>
50
- v1.0.22 搜索栏组件增加表单校验方法<br/>
51
- v1.0.23 表单组件选择框label和value的key值可自定义<br/>
52
- v1.0.24 bug修复<br/>
53
- v1.0.25 添加focus、blur、change事件,表单组件添加textarea<br/>
54
- v1.1.2 表单组件添加移除检验结果、重置事件恢复默认值、输入框添加保留两位小数功能、添加pdf预览组件<br/>
55
- v1.1.9 README.md修改<br/>
56
- v1.1.10 修复隐藏表单的重置bug<br/>
57
- v1.1.11 修改pdf预览组件<br/>
58
- v1.1.16 修改bug<br/>
59
- v1.1.17 表单选择框增加多选<br/>
60
- v1.1.22 表单选择框增加全选框<br/>
61
- v1.1.23 表单组件添加级联选择器<br/>
62
- v1.1.29 下拉框添加筛选功能filterable<br/>
63
- v1.1.30 表单组件添加clearable<br/>
64
- v1.2.1 添加导出excel、csv、txt 方法<br/>
65
- v1.2.14 打印模糊问题<br/>
66
- v1.2.16 表单添加form-inline参数,控制是否横竖向显示<br/>
67
- v1.2.20 form-template添加display参数,控制表单项是否显示<br/>
68
- v1.2.22 弹出框bug修复<br/>
69
- v1.2.40 pdf预览,若未查询,点击点击按钮提示请先查询<br/>
70
- v1.2.49 表单项为级联时,监听change事件,增加返回选中的node<br/>
71
- ## bl-from
72
- 自定义表单组件
73
-
74
- ### bl-from Attributes
75
-
76
- 参数 | 说明 | 类型 | 可选值 | 默认值
77
- ---- | ---- | ---- | ---- | ----
78
- label-width | 表单域标签的宽度 | string | — | 130px
79
- [form-template](#form-template) | 需要渲染的模板表单 | array | — | —
80
- form-data | 需要渲染的模板表单 | Object | — | —
81
- form-rules | 需要渲染的模板表单 | Object | — | —
82
- form-append | 是否展开 | Boolean | — | true
83
- form-shownum | 收起时显示的个数,默认显示所有 | Number | — | —
84
- form-inline | 行内表单模式 | boolean | — | true
85
- ### form-template
86
-
87
- 参数 | 说明 | 类型 | 可选值 | 默认值
88
- ---- |-------------------------------------------------------------------|------------------------------------------| ---- | ----
89
- label | 表单标签 | string | — | —
90
- size | 表单元素大小 | number | — | —
91
- prop | 表单标签key | string | — | —
92
- type | 表单元素类型 | string | select / cascader / number / input / range / textarea / checkbox / radio / date / week / month / year / datetime / timerange(时间区间) / monthrange(月区间) / daterange(日期区间) / datetimerange(日期时间区间)/ ta-number(数字输入框) | input
93
- options | 当表单元素类型为select时的选项列表 | Array | — | —
94
- disabled | 表单元素是否为禁用 | boolean | — | false
95
- isFullReturn | 当表单元素类型为select时,是否完整返回对象 | boolean | — | false
96
- valueFormat | 当表单元素日期选择器时 | string | — | —
97
- icons | 当表单元素为input时 | Array | code、idcard、search | —
98
- placeholder | 输入框占位文本 | string | —
99
- keyEnter | 是否触发回车搜索事件 | boolean | false
100
- pickerOptions | 当前时间日期选择器特有的选项参考[picker-options表](#picker-options) | object | —
101
- [optionProp](#option-prop) | 选择框下拉项配置 | object | —
102
- maxlength | 当表单元素为textarea时设置最大长度 | number | -
103
- isFocus | 是否监听选中事件 | boolean | -
104
- isBlur | 是否监听失去焦点事件 | boolean | -
105
- isChange | 是否监听change事件 | boolean | -
106
- isDecimals | 输入框是否保留两位小数 | boolean | -
107
- isMultiple | select是否多选 | boolean | -
108
- isAllCheck | select是否加全选,默认开启多选模式 | boolean | -
109
- checked | 全选标识,isAllCheck为true时,checked必须存在 | boolean | - | false
110
- isIndeterminate | 半选标识,checkbox类型,isAllCheck为true时 | boolean | - | false
111
- defaultTime | 选中默认时间 | Array | -
112
- showAllLevels | 级联输入框中是否显示选中值的完整路径 | boolean | -
113
- cascaderProps | 级联选项框配置参考[Props表](https://element.eleme.cn/#/zh-CN/component/cascader#props) | object | -
114
- filterable | 是否过滤 | boolean | false
115
- clearable | 是否清除 | boolean | true
116
- range-separator | 区间中间文字 | string | '至'
117
- start-placeholder | 区间第一个输入框占位文本 | string | -
118
- end-placeholder | 区间第二个输入框占位文本 | string | -
119
- prefix-icon | 区间输入框首部图标<element图标库可选> | string | -
120
- prepend | 输入框前置内容 | string | -
121
- append | 输入框后置内容 | string | -
122
- isPrefix | 显示选择框搜索 | boolean | - | false
123
- display | 是否隐藏 | boolean | - | false
124
- taProp | 特殊级联框占位prop | string | - | -
125
- fieldNames | 特殊级联框自定义 options 中 label name children 的字段 | object | - | -
126
- asAmount | ta-number类型设置为金额数字框,每三位用逗号隔开 | boolean | - | false
127
- alignRight | ta-number类型数字居右显示 | boolean | - | false
128
- max | ta-number类型最大值 | number | - | -
129
- min | ta-number类型最小值 | number | - | -
130
- decimalSeparator | ta-number类型小数点 | string | - | -
131
- precision | ta-number类型数值精度 | number | - | -
132
- step | ta-number类型每次改变步数,可以为小数 | number |string | - | 1
133
- formatter | ta-number类型指定输入框展示值的格式 | function(value: number / string): string | - | -
134
- parser | ta-number类型指定从 formatter 里转换回数字的方式,和 formatter 搭配使用 | function( string): number | - | -
135
- codeType | 字典对应编码 | string | - | -
136
- initValue | 表单初始值 | any | - | -
137
- filterArr | 搭配codeType使用,不显示的字典值数组,例:['01','02'] | array | - | -
138
- isReverse | 搭配filterArr使用,是否反向过滤,默认否 | boolean | - | false
139
-
140
- ### picker-options
141
- 参数 | 说明 | 类型 | 可选值 | 默认值
142
- ---- | ---- | ---- | ---- | ----
143
- shortcuts | 设置快捷选项,需要传入 { text, onClick } 对象用法参考 element | Object[] | — | —
144
- disabledDate | 设置禁用状态,参数为当前日期,要求返回 Boolean | Function | — | —
145
- cellClassName | 设置日期的 className | Function(Date) | — | —
146
- firstDayOfWeek | 周起始日 | Number | 1 到 7 | 7
147
- onPick | 选中日期后会执行的回调,只有当 daterange 或 datetimerange 才生效 | Function({ maxDate, minDate }) | — | —
148
- ### option-prop
149
- 参数 | 说明 | 类型 | 可选值 | 默认值
150
- ---- | ---- | ---- | ---- | ----
151
- label | 选项的标签 | — | — | label
152
- value | 选项的标签 | — | — | value
153
- ### bl-from 事件
154
- 事件名称 | 说明 | 回调参数
155
- ---- | ---- | ----
156
- suffixClick | 输入框icon点击事件 | icon
157
- keyEnter | 输入框回车事件,表单参数中keyEnter为true时生效 | prop
158
- focus | 监听选中事件 | prop
159
- blur | 监听失去焦点事件 | prop
160
- change | 监听change事件,当输入框类型为级联时返回选中的node | {prop,node}
161
- ### bl-from 方法
162
- 方法名 | 说明 | 参数
163
- ---- | ---- | ----
164
- getValidateResult | 获取校验结果 | —
165
- clearValidate | 移除表单项的校验结果 | 表单prop 属性或者 prop 组成的数组 array、string
166
- clearFields | 重置表单 | —
167
- <br/>
168
-
169
- ## bl-button
170
- 按钮组件
171
-
172
- ### bl-button Attributes
173
-
174
- 参数 | 说明 | 类型 | 可选值 | 默认值
175
- ---- | ---- | ---- | ---- | ----
176
- [config-obj](#config-obj) | 按钮配置参数 | object | — | —
177
-
178
- ### config-obj
179
-
180
- 参数 | 说明 | 类型 | 可选值 | 默认值
181
- ---- | ---- | ---- | ---- | ----
182
- type | 按钮类型 | string | primary / success / warning / error / info / text | —
183
- size | 按钮尺寸 | string | medium / small / mini | small
184
- loading | 按钮是否加载中状态 | boolean | — | false
185
- disabled | 按钮是否禁用状态 | boolean | — | false
186
- icon | 图标类名 | string | — | —
187
- wait | 点击后按钮等待时间(单位ms) | number | — | 1000
188
- <br/>
189
-
190
- ## bl-title
191
- 标题组件
192
-
193
- ### bl-title Attributes
194
-
195
- 参数 | 说明 | 类型 | 可选值 | 默认值
196
- ---- | ---- | ---- | ---- | ----
197
- title | 标题文本 | string | — | —
198
- append | 是否显示展开图标 | boolean | — | false
199
- defaultAppend | 默认是否展开 | boolean | — | true
200
- <br/>
201
-
202
- ### bl-title 事件
203
- 事件名称 | 说明 | 回调参数
204
- ---- | ---- | ----
205
- changeAppend | 展开切换事件 | isAppend:当前展开收起的状态
206
- <br/>
207
-
208
- ## bl-search-card
209
- 搜索栏组件
210
-
211
- ### bl-search-card Attributes
212
- ---
213
- 参数 | 说明 | 类型 | 可选值 | 默认值
214
- ---- | ---- | ---- | ---- | ---
215
- title | 搜索栏标题(默认不显示) | string | — | —
216
- append | 是否可收起 | boolean | — | —
217
- showNum | 搜索栏收起时显示的输入框数量(append为true时生效) | number | — | —
218
- other-btn-list | 除展开、重置、查询按钮外的按钮列表 | Array | — | —
219
- 表单属性同[自定义表单组件](#bl-from)
220
-
221
- ### other-btn-list
222
-
223
- 参数 | 说明 | 类型 | 可选值 | 默认值
224
- ---- | ---- | ---- | ---- | ----
225
- name | 按钮名称 | string | — | —
226
- config | 按钮配置,属性同[config-obj](#config-obj) | Object | — | —
227
- fun | 按钮函数 | string | — | —
228
-
229
- ### bl-search-card 事件
230
- 事件名称 | 说明 | 回调参数
231
- ---- | ---- | ----
232
- resetSearch | 重置 | —
233
- search | 搜索 | —
234
- btnClick | 按钮点击事件,返回函数名称,传入other-btn-list时生效 | fun
235
- keyEnter | 输入框回车事件,表单参数中keyEnter为true时生效 | prop
236
- suffixClick | 输入框icon点击事件 | icon
237
- change | 监听表单变化 | prop
238
- ### bl-search-card 方法
239
- 方法名 | 说明 | 参数
240
- ---- | ---- | ----
241
- getValidateResult | 获取校验结果 | —
242
- clearFields | 清空表单内容 | —
243
- clearValidate | 移除表单项的校验结果。传入待移除的表单项的 prop 属性或者 prop 组成的数组,如不传则移除整个表单的校验结果 | Function(props: array | string)
244
- ### bl-search-card 参数
245
- 参数 | 说明 | 类型 | 可选值 | 默认值
246
- ---- | ---- | ---- | ---- | ----
247
- formAppend | 表单是否展开 | boolean | — | —
248
- <br/>
249
-
250
- ## bl-dialog
251
- 弹窗组件
252
-
253
- ### bl-dialog Attributes
254
- ---
255
- 参数 | 说明 | 类型 | 可选值 | 默认值
256
- ---- | ---- | ---- | ---- | -
257
- width | 弹窗的宽度 | string | — | 50%
258
- top | 弹窗CSS 中的 margin-top 值 | string | — | 10vh
259
- showClose | 是否显示关闭按钮 | boolean | — | false
260
- destroyOnClose | 关闭时销毁 Dialog 中的元素 | boolean | — | true
261
- modal-append-to-body | 遮罩层是否插入至 body 元素上,若为 false,则遮罩层会插入至 Dialog 的父元素上 | boolean | — | true
262
- append-to-body | Dialog 自身是否插入至 body 元素上。嵌套的 Dialog 必须指定该属性并赋值为 true | boolean | — | false
263
- ### bl-dialog 事件
264
- 事件名称 | 说明 | 回调参数
265
- ---- | ---- | ----
266
- beforeClose | 关闭弹窗前调用的方法 | -
267
- ### bl-dialog 方法
268
- 方法名 | 说明 | 参数
269
- ---- | ---- | ----
270
- open | 打开弹窗 | (title)接收一个string类型的参数:弹窗标题
271
- close | 关闭弹窗 | -
272
- <br/>
273
-
274
- ## container
275
- 布局容器
276
-
277
- 标签名 | 说明
278
- ---- | ----
279
- search-page-container | 外层容器
280
- search-page-result | 搜索结果容器
281
- result-header | 搜索结果容器头部
282
- result-handle-btnbar | 搜索结果容器头部按钮栏
283
- <br/>
284
-
285
- ## bl-svg-icon
286
- 图标组件
287
-
288
- ### bl-svg-icon Attributes
289
- ---
290
- 参数 | 说明 | 类型 | 可选值 | 默认值
291
- ---- | ---- | ---- | ---- | ---
292
- icon-class | 图标名称 | string | — | —
293
- class-name | 图标样式 | 详见[class-name 列表](#class-name) | — | —
294
- ###class-name
295
- 参数 | 说明 |
296
- ---- | ---- |
297
- code | 条形码
298
- idcard | 身份证
299
- search | 搜索
300
- <br/>
301
-
302
- ## bl-preview-pdf
303
- pdf预览
304
-
305
- ### bl-preview-pdf Attributes
306
- ---
307
- 参数 | 说明 | 类型 | 可选值 | 默认值
308
- ---- | ---- | ---- | ---- | ---
309
- pdf-url | pdf地址 | string | — | —
310
- is-downLoad | 是否显示下载按钮 | boolean | - | -
311
- is-scale | 是否缩放按钮 | boolean | - | -
312
- is-show | 是否显示工具栏 | boolean | - | true
313
- init-scale | 自定义初始化缩放大小 | number | - | 1
314
- print-direction | 打印默认方向 | string | portrait(纵向)/landscape(横向) | -
315
- download-options | 下载类型选项 | Array | - | EXCEL/PDF
316
- ### bl-preview-pdf 方法
317
- 方法名 | 说明 | 参数
318
- ---- | ---- | ----
319
- onPrevPage | 上一页 | -
320
- onNextPage | 下一页 | -
321
- printPdf | 打印 | -
322
- scaleBig | 放大 | -
323
- scaleSmall | 缩小 | -
324
- <br>
325
-
326
- ## bl-pagination
327
- 分页组件
328
-
329
- ### bl-pagination Attributes
330
- ---
331
- 参数 | 说明 | 类型 | 可选值 | 默认值
332
- ---- | ---- | ---- | ---- | ---
333
- current | 当前页数 | number | — | —
334
- pageList | 每页显示个数选择器的选项设置 | number[] | — | [20, 50, 100]
335
- pageSize | 每页显示条目个数 | number | — | —
336
- total | 总条目数 | number | — | —
337
- disabled | 是否禁用 | boolean | — | false
338
-
339
- ### bl-pagination 事件
340
- 方法名 | 说明 | 参数
341
- ---- | ---- | ----
342
- handleCurrent | current 改变时会触发 | 当前页
343
- handleSize | pageSize 改变时会触发 | 每页条数
344
-
345
- ## export
346
- 文件导出方法
347
-
348
- ### 导出xlsx
349
- ```js
350
- this.$export.excel({
351
- columns,
352
- data
353
- })
354
- .then(() => {
355
- // ...可选回调
356
- })
357
- ```
358
- 参数 | 说明 | 类型 | 可选值 | 默认值
359
- ---- | ---- | ---- | ---- | ---- |
360
- columns | 列 | Array | - | 空数组
361
- data | 行数据 | Array | - | 空数组
362
- title | 文件名 | String | - | table
363
- header | 第一行文字 | String | - | null
364
- merges | 要合并的单元格 | String | - | 空数组
365
- <br/>
366
- 合并单元格,根据 Excel 的表达方式,从第一行第一个单元格,到第一行第三个单元格:merges: ['A1', 'A3'], 多个合并区域,用二维数组表示:merges: [['A1', 'B1'], ['A2', B2]],单元格从A1到B1、从A2到B2,分别进行合并。
367
- <br/>
368
- 示例:
369
-
370
- ```js
371
- const columns = [
372
- {
373
- label: '姓名',
374
- prop: 'name'
375
- },
376
- {
377
- label: '年龄',
378
- prop: 'age'
379
- }
380
- ]
381
- const data = [
382
- {
383
- name: 'lucy',
384
- age: 24
385
- },
386
- {
387
- name: 'bob',
388
- age: 26
389
- }
390
- ]
391
- this.$export.excel({
392
- columns,
393
- data,
394
- header: 'Excel 第一行标题',
395
- merges: ['A1', 'A2']
396
- })
397
- ```
398
- <br/>
399
-
400
- ### 导出csv
401
- ```js
402
- this.$export.csv({
403
- columns,
404
- data
405
- })
406
- .then(() => {
407
- // ...可选回调
408
- })
409
- ```
410
- 参数 | 说明 | 类型 | 可选值 | 默认值
411
- ---- | ---- | ---- | ---- | ---- |
412
- columns | 列 | Array | - | 空数组
413
- data | 行数据 | Array | - | 空数组
414
- title | 文件名 | String | - | table
415
- noHeader | 不导出表头 | Boolean | - | false
416
- separator | 数据分隔符 | String | - | ,
417
- quoted | 每项数据是否加引号 | Boolean | - | false
418
-
419
- <br/>
420
- 示例:
421
-
422
- ```js
423
- const columns = [
424
- {
425
- label: '姓名',
426
- prop: 'name'
427
- },
428
- {
429
- label: '年龄',
430
- prop: 'age'
431
- }
432
- ]
433
- const data = [
434
- {
435
- name: 'lucy',
436
- age: 24
437
- },
438
- {
439
- name: 'bob',
440
- age: 26
441
- }
442
- ]
443
- this.$export.csv({
444
- columns,
445
- data
446
- })
447
- ```
448
- <br/>
449
-
450
- ### 导出txt
451
- ```js
452
- this.$export.txt({
453
- text: '文本内容',
454
- title: '文件名'
455
- })
456
- .then(() => {
457
- // ...可选回调
458
- })
459
- ```
460
- 参数 | 说明 | 类型 | 可选值 | 默认值
461
- ---- | ---- | ---- | ---- | ---- |
462
- text | 文件内容 | String | - | 空
463
- title | 文件名 | String | - | 文本
464
-
465
- ## bl-tables
466
- ### bl-tables-attributes
467
-
468
- 参数 | 说明 | 类型 | 可选值 | 默认值
469
- ---- | ---- | ---- | ---- | ---- |
470
- current | 当前页数 | number | — | —
471
- pageList | 每页显示个数选择器的选项设置 | number[] | — | [10, 20, 50]
472
- pageSize | 每页显示条目个数 | number | — | —
473
- total | 总条目数 | number | — | —
474
- offsetBottom | 距离底部的距离 | number | — | 0
475
- stripe | 是否为斑马纹 table | boolean | — | false
476
- selection | 是否多选 | boolean | — | false
477
- loading | 表格loading | boolean | — | false
478
- loadingText | 表格加载文字 | string | — | -
479
- indexFixed | 序号固定 | string, boolean | true, left, right | -
480
- currentRowKey | 行数据的 Key,用来优化 Table 的渲染 | string, number | - | -
481
- paginationShow | 是否需要分页 | boolean | - | false
482
- tableColumn | 表格列 | array | - | []
483
- selectable | 仅对 type=selection 的列有效,类型为 Function,Function 的返回值用来决定这一行的 CheckBox 是否可以勾选 | Function(row, index) | - | -
484
- showHead | 头部展示 | boolean | - | -
485
- title | 头部title | string | - | -
486
- buttonName | 头部按钮名字 | string | - | -
487
- fileName | 导出文件名 | string | - | table
488
- span-method | 合并行或列的计算方法 | Function({ row, column, rowIndex, columnIndex }) | - | -
489
-
490
- ### bl-tables-table-column-attributes
491
-
492
- 参数 | 说明 | 类型 | 可选值 | 默认值
493
- ---- | ---- | ---- | ---- | ---- |
494
- type | 对应列的类型 selection 多选框/index 该行的索引(从 1 开始计算)/expand 显示为一个可展开的按钮,slot插槽显示 | String | - | 空
495
- columnKey | column 的 key,如果需要使用 filter-change 事件,则需要此属性标识是哪个 column 的筛选条件 | String | - | 文本
496
- label | 显示的标题 | String | - |-
497
- prop | 对应列内容的字段名 | String | - |-
498
- width | 对应列的宽度 | String | - |-
499
- minWidth | 对应列的最小宽度,与 width 的区别是 width 是固定的,min-width 会把剩余宽度按比例分配给设置了 min-width 的列 | String | - |
500
- fixed | 列是否固定在左侧或者右侧,true 表示固定在左侧 | string,boolean | true, left, right |-
501
- sortable | 对应列是否可以排序,如果设置为 'custom',则代表用户希望远程排序,需要监听 Table 的 sort-change 事件 | boolean, String |true, false, 'custom' |false
502
- showOverflowTooltip | 当内容过长被隐藏时显示 tooltip | Boolean | - | false
503
- align | 对齐方式 | String | left/center/right |left
504
- headerAlign | 表头对齐方式,若不设置该项,则使用表格的对齐方式 | String | left/center/right | -
505
- className| 列的 className | String | - | -
506
- operation | 操作栏 | Array | - |
507
- collectionType | 使用字典API对值进行解析,如 collectionType: 'sex' | String | - | -
508
- slot | 插槽名 | String | - |
509
- format | 时间格式 | String | - | YYYY-MM-DD HH:mm:ss
510
- dataSources | 数据源 dic:字典值,custom:自定义 | string | - |
511
- options | 自定义数据源,数据源为custom时需要传入 | Array | - | -
512
- formatter | 用来格式化内容 | Function(row, column, cellValue, index) | - | -
513
-
514
- ### bl-tables-methods
515
-
516
- 方法名 | 说明 | 参数
517
- ---- | ---- | ----
518
- rowClick | 当某一行被点击时会触发该事件 | row, column, event
519
- handleCurrent | current 改变时会触发 | 当前页
520
- handleSize | pageSize 改变时会触发 | 每页条数
521
- rowOperation | 操作按钮点击触发 | row, $index, prop, columIndex, optionIndex (row.loading,row.disabled)
522
- switchChange | 开关切换 | row, $index, prop, columIndex
523
- editInputBlur | 可编辑input失去焦点 | row, $index, prop, columIndex
524
- selectChange | 当选择项发生变化时会触发该事件 | selection
525
- handleExport | 导出数据 | 传入data,不传则导出当前的数据
526
- getData | 获取数据 | 设置了dataUrl和searchData时可以使用
527
-
528
-
1
+ <!-- START doctoc generated TOC please keep comment here to allow auto update -->
2
+ <!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE -->
3
+
4
+ - [更新说明](#%E6%9B%B4%E6%96%B0%E8%AF%B4%E6%98%8E)
5
+ - [bl-from](#bl-from)
6
+ - [bl-from Attributes](#bl-from-attributes)
7
+ - [form-template](#form-template)
8
+ - [picker-options](#picker-options)
9
+ - [option-prop](#option-prop)
10
+ - [bl-from 事件](#bl-from-%E4%BA%8B%E4%BB%B6)
11
+ - [bl-from 方法](#bl-from-%E6%96%B9%E6%B3%95)
12
+ - [bl-button](#bl-button)
13
+ - [bl-button Attributes](#bl-button-attributes)
14
+ - [config-obj](#config-obj)
15
+ - [bl-title](#bl-title)
16
+ - [bl-title Attributes](#bl-title-attributes)
17
+ - [bl-search-card](#bl-search-card)
18
+ - [bl-search-card Attributes](#bl-search-card-attributes)
19
+ - [other-btn-list](#other-btn-list)
20
+ - [bl-search-card 事件](#bl-search-card-%E4%BA%8B%E4%BB%B6)
21
+ - [bl-search-card 方法](#bl-search-card-%E6%96%B9%E6%B3%95)
22
+ - [bl-search-card 参数](#bl-search-card-%E5%8F%82%E6%95%B0)
23
+ - [bl-dialog](#bl-dialog)
24
+ - [bl-dialog Attributes](#bl-dialog-attributes)
25
+ - [bl-dialog 事件](#bl-dialog-%E4%BA%8B%E4%BB%B6)
26
+ - [bl-dialog 方法](#bl-dialog-%E6%96%B9%E6%B3%95)
27
+ - [container](#container)
28
+ - [bl-svg-icon](#bl-svg-icon)
29
+ - [bl-svg-icon Attributes](#bl-svg-icon-attributes)
30
+ - [bl-preview-pdf](#bl-preview-pdf)
31
+ - [bl-preview-pdf Attributes](#bl-preview-pdf-attributes)
32
+ - [bl-preview-pdf 方法](#bl-preview-pdf-%E6%96%B9%E6%B3%95)
33
+ - [bl-pagination](#bl-pagination)
34
+ - [bl-pagination Attributes](#bl-pagination-attributes)
35
+ - [bl-pagination 事件](#bl-pagination-%E4%BA%8B%E4%BB%B6)
36
+ - [export](#export)
37
+ - [导出xlsx](#%E5%AF%BC%E5%87%BAxlsx)
38
+ - [导出csv](#%E5%AF%BC%E5%87%BAcsv)
39
+ - [导出txt](#%E5%AF%BC%E5%87%BAtxt)
40
+ - [bl-tables](#bl-tables)
41
+ - [bl-tables 属性](#bl-tables-attributes)
42
+ - [bl-tables tableColumn Attributes](#bl-tables-table-column-attributes)
43
+ - [bl-tables Methods](#bl-tables-methods)
44
+ <!-- END doctoc generated TOC please keep comment here to allow auto update -->
45
+
46
+ ## 更新说明
47
+ v1.0.19 修改消息弹窗样式<br/>
48
+ v1.0.20 表单组件入参增加picker-options<br/>
49
+ v1.0.21 弹窗组件入参增加modal-append-to-body、append-to-body<br/>
50
+ v1.0.22 搜索栏组件增加表单校验方法<br/>
51
+ v1.0.23 表单组件选择框label和value的key值可自定义<br/>
52
+ v1.0.24 bug修复<br/>
53
+ v1.0.25 添加focus、blur、change事件,表单组件添加textarea<br/>
54
+ v1.1.2 表单组件添加移除检验结果、重置事件恢复默认值、输入框添加保留两位小数功能、添加pdf预览组件<br/>
55
+ v1.1.9 README.md修改<br/>
56
+ v1.1.10 修复隐藏表单的重置bug<br/>
57
+ v1.1.11 修改pdf预览组件<br/>
58
+ v1.1.16 修改bug<br/>
59
+ v1.1.17 表单选择框增加多选<br/>
60
+ v1.1.22 表单选择框增加全选框<br/>
61
+ v1.1.23 表单组件添加级联选择器<br/>
62
+ v1.1.29 下拉框添加筛选功能filterable<br/>
63
+ v1.1.30 表单组件添加clearable<br/>
64
+ v1.2.1 添加导出excel、csv、txt 方法<br/>
65
+ v1.2.14 打印模糊问题<br/>
66
+ v1.2.16 表单添加form-inline参数,控制是否横竖向显示<br/>
67
+ v1.2.20 form-template添加display参数,控制表单项是否显示<br/>
68
+ v1.2.22 弹出框bug修复<br/>
69
+ v1.2.40 pdf预览,若未查询,点击点击按钮提示请先查询<br/>
70
+ v1.2.49 表单项为级联时,监听change事件,增加返回选中的node<br/>
71
+ ## bl-from
72
+ 自定义表单组件
73
+
74
+ ### bl-from Attributes
75
+
76
+ 参数 | 说明 | 类型 | 可选值 | 默认值
77
+ ---- | ---- | ---- | ---- | ----
78
+ label-width | 表单域标签的宽度 | string | — | 130px
79
+ [form-template](#form-template) | 需要渲染的模板表单 | array | — | —
80
+ form-data | 需要渲染的模板表单 | Object | — | —
81
+ form-rules | 需要渲染的模板表单 | Object | — | —
82
+ form-append | 是否展开 | Boolean | — | true
83
+ form-shownum | 收起时显示的个数,默认显示所有 | Number | — | —
84
+ form-inline | 行内表单模式 | boolean | — | true
85
+ ### form-template
86
+
87
+ 参数 | 说明 | 类型 | 可选值 | 默认值
88
+ ---- |-------------------------------------------------------------------|------------------------------------------| ---- | ----
89
+ label | 表单标签 | string | — | —
90
+ size | 表单元素大小 | number | — | —
91
+ prop | 表单标签key | string | — | —
92
+ type | 表单元素类型 | string | select / cascader / number / input / range / textarea / checkbox / radio / date / week / month / year / datetime / timerange(时间区间) / monthrange(月区间) / daterange(日期区间) / datetimerange(日期时间区间)/ ta-number(数字输入框) | input
93
+ options | 当表单元素类型为select时的选项列表 | Array | — | —
94
+ disabled | 表单元素是否为禁用 | boolean | — | false
95
+ isFullReturn | 当表单元素类型为select时,是否完整返回对象 | boolean | — | false
96
+ valueFormat | 当表单元素日期选择器时 | string | — | —
97
+ icons | 当表单元素为input时 | Array | code、idcard、search | —
98
+ placeholder | 输入框占位文本 | string | —
99
+ keyEnter | 是否触发回车搜索事件 | boolean | false
100
+ pickerOptions | 当前时间日期选择器特有的选项参考[picker-options表](#picker-options) | object | —
101
+ [optionProp](#option-prop) | 选择框下拉项配置 | object | —
102
+ maxlength | 当表单元素为textarea时设置最大长度 | number | -
103
+ isFocus | 是否监听选中事件 | boolean | -
104
+ isBlur | 是否监听失去焦点事件 | boolean | -
105
+ isChange | 是否监听change事件 | boolean | -
106
+ isDecimals | 输入框是否保留两位小数 | boolean | -
107
+ isMultiple | select是否多选 | boolean | -
108
+ isAllCheck | select是否加全选,默认开启多选模式 | boolean | -
109
+ checked | 全选标识,isAllCheck为true时,checked必须存在 | boolean | - | false
110
+ isIndeterminate | 半选标识,checkbox类型,isAllCheck为true时 | boolean | - | false
111
+ defaultTime | 选中默认时间 | Array | -
112
+ showAllLevels | 级联输入框中是否显示选中值的完整路径 | boolean | -
113
+ cascaderProps | 级联选项框配置参考[Props表](https://element.eleme.cn/#/zh-CN/component/cascader#props) | object | -
114
+ filterable | 是否过滤 | boolean | false
115
+ clearable | 是否清除 | boolean | true
116
+ range-separator | 区间中间文字 | string | '至'
117
+ start-placeholder | 区间第一个输入框占位文本 | string | -
118
+ end-placeholder | 区间第二个输入框占位文本 | string | -
119
+ prefix-icon | 区间输入框首部图标<element图标库可选> | string | -
120
+ prepend | 输入框前置内容 | string | -
121
+ append | 输入框后置内容 | string | -
122
+ isPrefix | 显示选择框搜索 | boolean | - | false
123
+ display | 是否隐藏 | boolean | - | false
124
+ taProp | 特殊级联框占位prop | string | - | -
125
+ fieldNames | 特殊级联框自定义 options 中 label name children 的字段 | object | - | -
126
+ asAmount | ta-number类型设置为金额数字框,每三位用逗号隔开 | boolean | - | false
127
+ alignRight | ta-number类型数字居右显示 | boolean | - | false
128
+ max | ta-number类型最大值 | number | - | -
129
+ min | ta-number类型最小值 | number | - | -
130
+ decimalSeparator | ta-number类型小数点 | string | - | -
131
+ precision | ta-number类型数值精度 | number | - | -
132
+ step | ta-number类型每次改变步数,可以为小数 | number |string | - | 1
133
+ formatter | ta-number类型指定输入框展示值的格式 | function(value: number / string): string | - | -
134
+ parser | ta-number类型指定从 formatter 里转换回数字的方式,和 formatter 搭配使用 | function( string): number | - | -
135
+ codeType | 字典对应编码 | string | - | -
136
+ initValue | 表单初始值 | any | - | -
137
+ filterArr | 搭配codeType使用,不显示的字典值数组,例:['01','02'] | array | - | -
138
+ isReverse | 搭配filterArr使用,是否反向过滤,默认否 | boolean | - | false
139
+
140
+ ### picker-options
141
+ 参数 | 说明 | 类型 | 可选值 | 默认值
142
+ ---- | ---- | ---- | ---- | ----
143
+ shortcuts | 设置快捷选项,需要传入 { text, onClick } 对象用法参考 element | Object[] | — | —
144
+ disabledDate | 设置禁用状态,参数为当前日期,要求返回 Boolean | Function | — | —
145
+ cellClassName | 设置日期的 className | Function(Date) | — | —
146
+ firstDayOfWeek | 周起始日 | Number | 1 到 7 | 7
147
+ onPick | 选中日期后会执行的回调,只有当 daterange 或 datetimerange 才生效 | Function({ maxDate, minDate }) | — | —
148
+ ### option-prop
149
+ 参数 | 说明 | 类型 | 可选值 | 默认值
150
+ ---- | ---- | ---- | ---- | ----
151
+ label | 选项的标签 | — | — | label
152
+ value | 选项的标签 | — | — | value
153
+ ### bl-from 事件
154
+ 事件名称 | 说明 | 回调参数
155
+ ---- | ---- | ----
156
+ suffixClick | 输入框icon点击事件 | icon
157
+ keyEnter | 输入框回车事件,表单参数中keyEnter为true时生效 | prop
158
+ focus | 监听选中事件 | prop
159
+ blur | 监听失去焦点事件 | prop
160
+ change | 监听change事件,当输入框类型为级联时返回选中的node | {prop,node}
161
+ ### bl-from 方法
162
+ 方法名 | 说明 | 参数
163
+ ---- | ---- | ----
164
+ getValidateResult | 获取校验结果 | —
165
+ clearValidate | 移除表单项的校验结果 | 表单prop 属性或者 prop 组成的数组 array、string
166
+ clearFields | 重置表单 | —
167
+ <br/>
168
+
169
+ ## bl-button
170
+ 按钮组件
171
+
172
+ ### bl-button Attributes
173
+
174
+ 参数 | 说明 | 类型 | 可选值 | 默认值
175
+ ---- | ---- | ---- | ---- | ----
176
+ [config-obj](#config-obj) | 按钮配置参数 | object | — | —
177
+
178
+ ### config-obj
179
+
180
+ 参数 | 说明 | 类型 | 可选值 | 默认值
181
+ ---- | ---- | ---- | ---- | ----
182
+ type | 按钮类型 | string | primary / success / warning / error / info / text | —
183
+ size | 按钮尺寸 | string | medium / small / mini | small
184
+ loading | 按钮是否加载中状态 | boolean | — | false
185
+ disabled | 按钮是否禁用状态 | boolean | — | false
186
+ icon | 图标类名 | string | — | —
187
+ wait | 点击后按钮等待时间(单位ms) | number | — | 1000
188
+ <br/>
189
+
190
+ ## bl-title
191
+ 标题组件
192
+
193
+ ### bl-title Attributes
194
+
195
+ 参数 | 说明 | 类型 | 可选值 | 默认值
196
+ ---- | ---- | ---- | ---- | ----
197
+ title | 标题文本 | string | — | —
198
+ append | 是否显示展开图标 | boolean | — | false
199
+ defaultAppend | 默认是否展开 | boolean | — | true
200
+ <br/>
201
+
202
+ ### bl-title 事件
203
+ 事件名称 | 说明 | 回调参数
204
+ ---- | ---- | ----
205
+ changeAppend | 展开切换事件 | isAppend:当前展开收起的状态
206
+ <br/>
207
+
208
+ ## bl-search-card
209
+ 搜索栏组件
210
+
211
+ ### bl-search-card Attributes
212
+ ---
213
+ 参数 | 说明 | 类型 | 可选值 | 默认值
214
+ ---- | ---- | ---- | ---- | ---
215
+ title | 搜索栏标题(默认不显示) | string | — | —
216
+ append | 是否可收起 | boolean | — | —
217
+ showNum | 搜索栏收起时显示的输入框数量(append为true时生效) | number | — | —
218
+ other-btn-list | 除展开、重置、查询按钮外的按钮列表 | Array | — | —
219
+ 表单属性同[自定义表单组件](#bl-from)
220
+
221
+ ### other-btn-list
222
+
223
+ 参数 | 说明 | 类型 | 可选值 | 默认值
224
+ ---- | ---- | ---- | ---- | ----
225
+ name | 按钮名称 | string | — | —
226
+ config | 按钮配置,属性同[config-obj](#config-obj) | Object | — | —
227
+ fun | 按钮函数 | string | — | —
228
+
229
+ ### bl-search-card 事件
230
+ 事件名称 | 说明 | 回调参数
231
+ ---- | ---- | ----
232
+ resetSearch | 重置 | —
233
+ search | 搜索 | —
234
+ btnClick | 按钮点击事件,返回函数名称,传入other-btn-list时生效 | fun
235
+ keyEnter | 输入框回车事件,表单参数中keyEnter为true时生效 | prop
236
+ suffixClick | 输入框icon点击事件 | icon
237
+ change | 监听表单变化 | prop
238
+ ### bl-search-card 方法
239
+ 方法名 | 说明 | 参数
240
+ ---- | ---- | ----
241
+ getValidateResult | 获取校验结果 | —
242
+ clearFields | 清空表单内容 | —
243
+ clearValidate | 移除表单项的校验结果。传入待移除的表单项的 prop 属性或者 prop 组成的数组,如不传则移除整个表单的校验结果 | Function(props: array | string)
244
+ ### bl-search-card 参数
245
+ 参数 | 说明 | 类型 | 可选值 | 默认值
246
+ ---- | ---- | ---- | ---- | ----
247
+ formAppend | 表单是否展开 | boolean | — | —
248
+ <br/>
249
+
250
+ ## bl-dialog
251
+ 弹窗组件
252
+
253
+ ### bl-dialog Attributes
254
+ ---
255
+ 参数 | 说明 | 类型 | 可选值 | 默认值
256
+ ---- | ---- | ---- | ---- | -
257
+ width | 弹窗的宽度 | string | — | 50%
258
+ top | 弹窗CSS 中的 margin-top 值 | string | — | 10vh
259
+ showClose | 是否显示关闭按钮 | boolean | — | false
260
+ destroyOnClose | 关闭时销毁 Dialog 中的元素 | boolean | — | true
261
+ modal-append-to-body | 遮罩层是否插入至 body 元素上,若为 false,则遮罩层会插入至 Dialog 的父元素上 | boolean | — | true
262
+ append-to-body | Dialog 自身是否插入至 body 元素上。嵌套的 Dialog 必须指定该属性并赋值为 true | boolean | — | false
263
+ ### bl-dialog 事件
264
+ 事件名称 | 说明 | 回调参数
265
+ ---- | ---- | ----
266
+ beforeClose | 关闭弹窗前调用的方法 | -
267
+ ### bl-dialog 方法
268
+ 方法名 | 说明 | 参数
269
+ ---- | ---- | ----
270
+ open | 打开弹窗 | (title)接收一个string类型的参数:弹窗标题
271
+ close | 关闭弹窗 | -
272
+ <br/>
273
+
274
+ ## container
275
+ 布局容器
276
+
277
+ 标签名 | 说明
278
+ ---- | ----
279
+ search-page-container | 外层容器
280
+ search-page-result | 搜索结果容器
281
+ result-header | 搜索结果容器头部
282
+ result-handle-btnbar | 搜索结果容器头部按钮栏
283
+ <br/>
284
+
285
+ ## bl-svg-icon
286
+ 图标组件
287
+
288
+ ### bl-svg-icon Attributes
289
+ ---
290
+ 参数 | 说明 | 类型 | 可选值 | 默认值
291
+ ---- | ---- | ---- | ---- | ---
292
+ icon-class | 图标名称 | string | — | —
293
+ class-name | 图标样式 | 详见[class-name 列表](#class-name) | — | —
294
+ ###class-name
295
+ 参数 | 说明 |
296
+ ---- | ---- |
297
+ code | 条形码
298
+ idcard | 身份证
299
+ search | 搜索
300
+ <br/>
301
+
302
+ ## bl-preview-pdf
303
+ pdf预览
304
+
305
+ ### bl-preview-pdf Attributes
306
+ ---
307
+ 参数 | 说明 | 类型 | 可选值 | 默认值
308
+ ---- | ---- | ---- | ---- | ---
309
+ pdf-url | pdf地址 | string | — | —
310
+ is-downLoad | 是否显示下载按钮 | boolean | - | -
311
+ is-scale | 是否缩放按钮 | boolean | - | -
312
+ is-show | 是否显示工具栏 | boolean | - | true
313
+ init-scale | 自定义初始化缩放大小 | number | - | 1
314
+ print-direction | 打印默认方向 | string | portrait(纵向)/landscape(横向) | -
315
+ download-options | 下载类型选项 | Array | - | EXCEL/PDF
316
+ ### bl-preview-pdf 方法
317
+ 方法名 | 说明 | 参数
318
+ ---- | ---- | ----
319
+ onPrevPage | 上一页 | -
320
+ onNextPage | 下一页 | -
321
+ printPdf | 打印 | -
322
+ scaleBig | 放大 | -
323
+ scaleSmall | 缩小 | -
324
+ <br>
325
+
326
+ ## bl-pagination
327
+ 分页组件
328
+
329
+ ### bl-pagination Attributes
330
+ ---
331
+ 参数 | 说明 | 类型 | 可选值 | 默认值
332
+ ---- | ---- | ---- | ---- | ---
333
+ current | 当前页数 | number | — | —
334
+ pageList | 每页显示个数选择器的选项设置 | number[] | — | [20, 50, 100]
335
+ pageSize | 每页显示条目个数 | number | — | —
336
+ total | 总条目数 | number | — | —
337
+ disabled | 是否禁用 | boolean | — | false
338
+
339
+ ### bl-pagination 事件
340
+ 方法名 | 说明 | 参数
341
+ ---- | ---- | ----
342
+ handleCurrent | current 改变时会触发 | 当前页
343
+ handleSize | pageSize 改变时会触发 | 每页条数
344
+
345
+ ## export
346
+ 文件导出方法
347
+
348
+ ### 导出xlsx
349
+ ```js
350
+ this.$export.excel({
351
+ columns,
352
+ data
353
+ })
354
+ .then(() => {
355
+ // ...可选回调
356
+ })
357
+ ```
358
+ 参数 | 说明 | 类型 | 可选值 | 默认值
359
+ ---- | ---- | ---- | ---- | ---- |
360
+ columns | 列 | Array | - | 空数组
361
+ data | 行数据 | Array | - | 空数组
362
+ title | 文件名 | String | - | table
363
+ header | 第一行文字 | String | - | null
364
+ merges | 要合并的单元格 | String | - | 空数组
365
+ <br/>
366
+ 合并单元格,根据 Excel 的表达方式,从第一行第一个单元格,到第一行第三个单元格:merges: ['A1', 'A3'], 多个合并区域,用二维数组表示:merges: [['A1', 'B1'], ['A2', B2]],单元格从A1到B1、从A2到B2,分别进行合并。
367
+ <br/>
368
+ 示例:
369
+
370
+ ```js
371
+ const columns = [
372
+ {
373
+ label: '姓名',
374
+ prop: 'name'
375
+ },
376
+ {
377
+ label: '年龄',
378
+ prop: 'age'
379
+ }
380
+ ]
381
+ const data = [
382
+ {
383
+ name: 'lucy',
384
+ age: 24
385
+ },
386
+ {
387
+ name: 'bob',
388
+ age: 26
389
+ }
390
+ ]
391
+ this.$export.excel({
392
+ columns,
393
+ data,
394
+ header: 'Excel 第一行标题',
395
+ merges: ['A1', 'A2']
396
+ })
397
+ ```
398
+ <br/>
399
+
400
+ ### 导出csv
401
+ ```js
402
+ this.$export.csv({
403
+ columns,
404
+ data
405
+ })
406
+ .then(() => {
407
+ // ...可选回调
408
+ })
409
+ ```
410
+ 参数 | 说明 | 类型 | 可选值 | 默认值
411
+ ---- | ---- | ---- | ---- | ---- |
412
+ columns | 列 | Array | - | 空数组
413
+ data | 行数据 | Array | - | 空数组
414
+ title | 文件名 | String | - | table
415
+ noHeader | 不导出表头 | Boolean | - | false
416
+ separator | 数据分隔符 | String | - | ,
417
+ quoted | 每项数据是否加引号 | Boolean | - | false
418
+
419
+ <br/>
420
+ 示例:
421
+
422
+ ```js
423
+ const columns = [
424
+ {
425
+ label: '姓名',
426
+ prop: 'name'
427
+ },
428
+ {
429
+ label: '年龄',
430
+ prop: 'age'
431
+ }
432
+ ]
433
+ const data = [
434
+ {
435
+ name: 'lucy',
436
+ age: 24
437
+ },
438
+ {
439
+ name: 'bob',
440
+ age: 26
441
+ }
442
+ ]
443
+ this.$export.csv({
444
+ columns,
445
+ data
446
+ })
447
+ ```
448
+ <br/>
449
+
450
+ ### 导出txt
451
+ ```js
452
+ this.$export.txt({
453
+ text: '文本内容',
454
+ title: '文件名'
455
+ })
456
+ .then(() => {
457
+ // ...可选回调
458
+ })
459
+ ```
460
+ 参数 | 说明 | 类型 | 可选值 | 默认值
461
+ ---- | ---- | ---- | ---- | ---- |
462
+ text | 文件内容 | String | - | 空
463
+ title | 文件名 | String | - | 文本
464
+
465
+ ## bl-tables
466
+ ### bl-tables-attributes
467
+
468
+ 参数 | 说明 | 类型 | 可选值 | 默认值
469
+ ---- | ---- | ---- | ---- | ---- |
470
+ current | 当前页数 | number | — | —
471
+ pageList | 每页显示个数选择器的选项设置 | number[] | — | [10, 20, 50]
472
+ pageSize | 每页显示条目个数 | number | — | —
473
+ total | 总条目数 | number | — | —
474
+ offsetBottom | 距离底部的距离 | number | — | 0
475
+ stripe | 是否为斑马纹 table | boolean | — | false
476
+ selection | 是否多选 | boolean | — | false
477
+ loading | 表格loading | boolean | — | false
478
+ loadingText | 表格加载文字 | string | — | -
479
+ indexFixed | 序号固定 | string, boolean | true, left, right | -
480
+ currentRowKey | 行数据的 Key,用来优化 Table 的渲染 | string, number | - | -
481
+ paginationShow | 是否需要分页 | boolean | - | false
482
+ tableColumn | 表格列 | array | - | []
483
+ selectable | 仅对 type=selection 的列有效,类型为 Function,Function 的返回值用来决定这一行的 CheckBox 是否可以勾选 | Function(row, index) | - | -
484
+ showHead | 头部展示 | boolean | - | -
485
+ title | 头部title | string | - | -
486
+ buttonName | 头部按钮名字 | string | - | -
487
+ fileName | 导出文件名 | string | - | table
488
+ span-method | 合并行或列的计算方法 | Function({ row, column, rowIndex, columnIndex }) | - | -
489
+
490
+ ### bl-tables-table-column-attributes
491
+
492
+ 参数 | 说明 | 类型 | 可选值 | 默认值
493
+ ---- | ---- | ---- | ---- | ---- |
494
+ type | 对应列的类型 selection 多选框/index 该行的索引(从 1 开始计算)/expand 显示为一个可展开的按钮,slot插槽显示 | String | - | 空
495
+ columnKey | column 的 key,如果需要使用 filter-change 事件,则需要此属性标识是哪个 column 的筛选条件 | String | - | 文本
496
+ label | 显示的标题 | String | - |-
497
+ prop | 对应列内容的字段名 | String | - |-
498
+ width | 对应列的宽度 | String | - |-
499
+ minWidth | 对应列的最小宽度,与 width 的区别是 width 是固定的,min-width 会把剩余宽度按比例分配给设置了 min-width 的列 | String | - |
500
+ fixed | 列是否固定在左侧或者右侧,true 表示固定在左侧 | string,boolean | true, left, right |-
501
+ sortable | 对应列是否可以排序,如果设置为 'custom',则代表用户希望远程排序,需要监听 Table 的 sort-change 事件 | boolean, String |true, false, 'custom' |false
502
+ showOverflowTooltip | 当内容过长被隐藏时显示 tooltip | Boolean | - | false
503
+ align | 对齐方式 | String | left/center/right |left
504
+ headerAlign | 表头对齐方式,若不设置该项,则使用表格的对齐方式 | String | left/center/right | -
505
+ className| 列的 className | String | - | -
506
+ operation | 操作栏 | Array | - |
507
+ collectionType | 使用字典API对值进行解析,如 collectionType: 'sex' | String | - | -
508
+ slot | 插槽名 | String | - |
509
+ format | 时间格式 | String | - | YYYY-MM-DD HH:mm:ss
510
+ dataSources | 数据源 dic:字典值,custom:自定义 | string | - |
511
+ options | 自定义数据源,数据源为custom时需要传入 | Array | - | -
512
+ formatter | 用来格式化内容 | Function(row, column, cellValue, index) | - | -
513
+
514
+ ### bl-tables-methods
515
+
516
+ 方法名 | 说明 | 参数
517
+ ---- | ---- | ----
518
+ rowClick | 当某一行被点击时会触发该事件 | row, column, event
519
+ handleCurrent | current 改变时会触发 | 当前页
520
+ handleSize | pageSize 改变时会触发 | 每页条数
521
+ rowOperation | 操作按钮点击触发 | row, $index, prop, columIndex, optionIndex (row.loading,row.disabled)
522
+ switchChange | 开关切换 | row, $index, prop, columIndex
523
+ editInputBlur | 可编辑input失去焦点 | row, $index, prop, columIndex
524
+ selectChange | 当选择项发生变化时会触发该事件 | selection
525
+ handleExport | 导出数据 | 传入data,不传则导出当前的数据
526
+ getData | 获取数据 | 设置了dataUrl和searchData时可以使用
527
+
528
+