查看“前端开发文档”的源代码

{{MARKDOWN}}
leon-base组件使用手册
=====================

布局 Layout
-----------

### base-container

外层容器。当子一级元素中包含base-section时，固定当前可视的base-section中的header和footer元素（base-section的子一级base-header、base-footer，以及base-main子一级的el-table（及其衍生组件）的表头和表尾行、el-pagination组件），直到页面滑动到其他section。

### base-section

分节容器。当外层元素为base-container时，固定当前可视节的头、尾类元素。

### base-header

分节头部元素的容器。将该组件置于base-container子一级的base-section中
时（base-container \> base-section \>
base-header），当前组件将在页面滚动到父级section区域时被固定到顶部。也可以通过设置inline-title属性为true的方式将其用作某一部分内容的小节标题。

属性：

| 属性名       | 说明                                                                                  | 类型    | 可选值     | 默认值 |
|--------------|---------------------------------------------------------------------------------------|---------|------------|--------|
| inline-title | 是否启用行内标题模式。如果该属性值为真，base-header元素是将表示为一个小节标题的形式。 | Boolean | true/false | false  |

### base-main

分节主体元素的容器。当将该组件置于base-container子一级的base-section中时（base-container
\> base-section \>
base-main），如果子一级元素中存在el-table及其衍生组件，固定表头到顶部并将表尾行固定到底部；如果子一级元素中存在el-pagination组件，将其固定到尾部。

### base-footer

分节尾部元素的容器。将该组件置于base-container子一级的base-section中
时（base-container \> base-section \>
base-footer），当前组件将在页面滚动到父级section区域时被固定到底部。

导航 Navigation
---------------

### base-navigator

左侧菜单导航器。

| 属性名 | 说明       | 类型  | 可选值 | 默认值 |
|--------|------------|-------|--------|--------|
| nodes  | 节点列表。 | Array | \-     | \-     |

### base-tabs

标签页组件。扩展自element-ui的组件el-tabs。本文档涉及的属性及特性仅描述作出扩展和修改的部分。其他部分参考element-ui官方文档（版本：2.5.\*）。

方法：

| 方法名 | 说明                                                                                                                                                 | 参数 |
|--------|------------------------------------------------------------------------------------------------------------------------------------------------------|------|
| addTab | 新增标签页。接受参数为一个包含label、name、singleton、data属性的对象。此方法通过provide提供给子组件使用，子组件增加inject: ['addTab ']属性即可调用。 | tab  |

### base-tab-pane 

标签页组件。扩展自element-ui的组件el-tabs。本文档涉及的属性及特性仅描述作出扩展和修改的部分。其他部分参考element-ui官方文档（版本：2.5.\*）。

方法：

| 方法名   | 说明                                                                                                                                                       | 参数 |
|----------|------------------------------------------------------------------------------------------------------------------------------------------------------------|------|
| closeTab | 关闭当前标签页。接受参数为一个包含label、name、singleton、data属性的对象。此方法通过provide提供给子组件使用，子组件增加inject: ['closeTab ']属性即可调用。 | \-   |

事件：

| 事件名        | 说明                                                 | 参数 |
|---------------|------------------------------------------------------|------|
| tab-activated | 当前标签页被激活的事件，接收参数为当前tab页的tab属性 | tab  |

输入 Input
----------

### base-input-number

数字输入框。修改自element-ui的组件el-input-number。本文档涉及的属性及特性仅描述作出扩展和修改的部分。其他部分参考element-ui官方文档（版本：2.5.\*）。

属性：

| 属性名   | 说明                                                                                                                                                                                                                                           | 类型    | 可选值            | 默认值 |
|----------|------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|---------|-------------------|--------|
| controls | 是否使用控制按钮。本组件仅修改默认值                                                                                                                                                                                                           | Boolean | true/false        | false  |
| type     | 非必须属性。当指定为amount时，输入框中的值将以带千分符的格式显示，并自动右对齐，amount模式下增加默认前缀人民币符（￥）；当指定为percent时，输入框中的值为百分比值，百分比模式下增加默认后缀百分号（%）。（例：输入15，显示15，实际数值为0.15） | String  | amount/percent    | \-     |
| readonly | 是否只读                                                                                                                                                                                                                                       | Boolean | true/false        | false  |
| align    | 文本对齐                                                                                                                                                                                                                                       | String  | left/center/right | left   |
| prefix   | 输入框前缀字符                                                                                                                                                                                                                                 | String  | \-                | \-     |
| suffix   | 输入框后缀字符                                                                                                                                                                                                                                 | String  | \-                | \-     |

slots:

| 名称    | 说明                                           |
|---------|------------------------------------------------|
| prefix  | 输入框前缀。如已指定prefix属性，该slot不生效。 |
| suffix  | 输入框后缀。如已指定suffix属性，该slot不生效。 |
| prepend | 输入框前置内容                                 |
| append  | 输入框后置内容                                 |

### base-date-picker

日期选择框。修改自element-ui的组件el-date-picker。本文档涉及的属性及特性仅描述作出扩展和修改的部分。其他部分参考element-ui官方文档（版本：2.5.\*）。

picker-options属性：

| 属性名              | 说明                                                                                                                        | 类型         | 可选值 | 默认值 |
|---------------------|-----------------------------------------------------------------------------------------------------------------------------|--------------|--------|--------|
| timeSelectableRange | 当日期时间选择框为date-time模式时，限定可选的时间范围。可为字符串（HH:mm:ss –HH:mm:ss），也可为字符串数组（字符串格式同上） | String/Array | \-     | \-     |

slots:

| 名称         | 说明                                     |
|--------------|------------------------------------------|
| date-content | 自定义设置日期面板上每个日期单元的内容。 |

### base-cascader

级联选择框。修改自element-ui的组件el-cascader。本文档设计的属性及特性进描述作出扩展和修改的部分。其他部分参考element-ui官方文档（版本：2.5.\*）。

属性：

| 属性名        | 说明                                | 类型    | 可选值     | 默认值 |
|---------------|-------------------------------------|---------|------------|--------|
| plain-options | 是否使用平滑列表格式的options数据。 | Boolean | true/false | false  |

props属性：

| 属性名 | 说明                                                                      | 类型   | 可选值 | 默认值 |
|--------|---------------------------------------------------------------------------|--------|--------|--------|
| id     | 当cascader组件的plain-options属性设为true时，用于指定数据唯一id的属性名。 | String | \-     | id     |
| pid    | 当cascader组件的plain-options属性设为true时，用于指定数据父级id的属性名。 | String | \-     | pid    |

弹出窗口 Dialogs
----------------

### base-approve-dialog

审批弹出框。用于审批操作的通用组件。

属性：

| 属性名             | 说明             | 类型   | 可选值 | 默认值 |
|--------------------|------------------|--------|--------|--------|
| operation-name     | 审批操作名称。   | String | \-     | 审批   |
| apv-result-options | 审批结果可选项。 | Array  | \-     | \-     |

方法：

| 方法名      | 说明                                              | 参数 |
|-------------|---------------------------------------------------|------|
| open        | 打开对话框。                                      | \-   |
| close       | 关闭对话框。                                      | \-   |
| stopLoading | 停止对话框的loading加载中状态，使审批按钮可点击。 | \-   |

事件：

| 事件名 | 说明                                                                                      | 参数 |
|--------|-------------------------------------------------------------------------------------------|------|
| save   | 保存审批结果。参数为包含审批结果的对象。apvResult选中的审批结果值，apvOpinion审批意见值。 | data |

### base-export-dialog

导出弹框。用于批量导出操作的通用组件。

属性：

| 属性名           | 说明                                     | 类型    | 可选值     | 默认值 |
|------------------|------------------------------------------|---------|------------|--------|
| file-suffix      | 导出文件后缀名。                         | String  | \-         | xlsx   |
| can-export-all   | 导出全部选项是否禁用。                   | Boolean | true/false | false  |
| template-options | 可选模板列表{templateId, templateName}。 | Array   | \-         | []     |

方法：

| 方法名      | 说明                                              | 参数 |
|-------------|---------------------------------------------------|------|
| open        | 打开对话框。                                      | \-   |
| close       | 关闭对话框。                                      | \-   |
| stopLoading | 停止对话框的loading加载中状态，使审批按钮可点击。 | \-   |

事件：

| 事件名      | 说明                                                  | 参数 |
|-------------|-------------------------------------------------------|------|
| export-data | 提交导出请求。{fileName, exportRange, exportTemplate} | data |

### base-import-dialog

导入弹框。用于批量导入操作的通用组件。

属性：

| 属性名        | 说明             | 类型    | 可选值     | 默认值 |
|---------------|------------------|---------|------------|--------|
| need-template | 是否需要下载模板 | Boolean | true/false | true   |

方法：

| 方法名 | 说明         | 参数 |
|--------|--------------|------|
| open   | 打开对话框。 | \-   |
| close  | 关闭对话框。 | \-   |

事件：

| 事件名            | 说明                                                                                   | 参数 |
|-------------------|----------------------------------------------------------------------------------------|------|
| download-template | 下载模板                                                                               | \-   |
| upload-success    | 上传成功，参数为包含上传结果result、响应response、当前文件file及文件列表fileList的对象 | data |
| upload-error      | 上传失败，参数为包含错误信息err、当前文件file及文件列表fileList的对象                  | data |
| import-data       | 提交导入请求，参数为上传成功的上传结果对象                                             | data |

数据 Data
---------

### base-scroll-table

滚动加载表格，扩展自element-ui的组件el-table。本文档涉及的属性及特性仅描述作出扩展和修改的部分。其他部分参考element-ui官方文档（版本：2.5.\*）。

属性：

| 属性名         | 说明                                                                                        | 类型     | 可选值     | 默认值 |
|----------------|---------------------------------------------------------------------------------------------|----------|------------|--------|
| fetch-method   | 查询数据方法，必需属性，参数为页码page，分页大小size，查询参数params，返回一个Promise对象。 | Function | \-         | \-     |
| virtual-scroll | 是否虚拟滚动                                                                                | Boolean  | true/false | true   |
| size           | 分页大小，必需属性。                                                                        | Number   | \-         | \-     |
| span-columns   | 需要合并的列。需要注意要使用此属性，必须设置row-key属性。                                   | Array    | \-         | []     |
| span-key       | 合并列依据的属性名称。需要注意要使用此属性，必须设置row-key属性。                           | String   | \-         | \-     |
| header-height  | 表头高度。                                                                                  | Number   | \-         | \-     |
| footer-height  | 表尾高度。                                                                                  | Number   | \-         | \-     |

### base-tree

树形组件。扩展自element-ui的el-tree组件。本文档涉及的属性及特性仅描述作出扩展和修改的部分。其他部分参考element-ui官方文档（版本：2.5.\*）。

属性：

| 属性名     | 说明                                                                               | 类型    | 可选值     | 默认值 |
|------------|------------------------------------------------------------------------------------|---------|------------|--------|
| plain-data | 当前是否接收平铺列表数据。如接收平铺列表数据，则会自动将传入数据序列化为树形数据。 | Boolean | true/false | false  |

treeProps属性：

| 属性名   | 说明                                                                                             | 类型    | 可选值     | 默认值 |
|----------|--------------------------------------------------------------------------------------------------|---------|------------|--------|
| readonly | 节点checkbox只读。禁用节点checkbox，但与disabled不同的是，readonly为true时也允许其处于选中状态。 | Boolean | true/false | true   |
| id       | 节点的主键字段名。                                                                               | String  | \-         | id     |
| pid      | 节点的父级id字段名。                                                                             | String  | \-         | pid    |

### base-entry-table

用于组织类似于Map.entrySet形式的数据，即key-value名值对小对象列表的数据格式，并以表格的形式进行管理。

属性：

| 属性名     | 说明                                                              | 类型   | 可选值 | 默认值                         |
|------------|-------------------------------------------------------------------|--------|--------|--------------------------------|
| value      | key-value名值对数组。                                             | Array  | \-     | \-                             |
| item-props | key-value名值对对象属性设置。必须是一个具有key和value属性的对象。 | Object | \-     | { key: 'key', value: 'value' } |

### base-entry-view-form

用于组织类似于Map.entrySet形式的数据，即key-value名值对小对象列表的数据格式，并以普通详情页面的形式进行查看。

属性：

| 属性名     | 说明                                                              | 类型   | 可选值 | 默认值                         |
|------------|-------------------------------------------------------------------|--------|--------|--------------------------------|
| data       | key-value名值对数组。                                             | Array  | \-     | []                             |
| item-props | key-value名值对对象属性设置。必须是一个具有key和value属性的对象。 | Object | \-     | { key: 'key', value: 'value' } |

其他 Others
-----------

### base-calendar

日历日程组件。

属性：

| 属性名              | 说明                        | 类型   | 可选值         | 默认值 |
|---------------------|-----------------------------|--------|----------------|--------|
| locale              | 语言                        | String | en-US/zh-CN    | en-US  |
| month-name-format   | 月份名称格式                | String | short/long     | short  |
| weekday-name-format | 星期名称格式                | String | short/long     | short  |
| start-day-of-week   | 周起始日                    | Number | 0-6            | 0      |
| display-period-type | 显示模式                    | String | month/week/day | month  |
| data                | 日程数据                    | Array  | \-             | []     |
| date-classes        | 自定义每个日期单元格的class | Object | \-             | \-     |

事件：

| 事件名        | 说明                                                                            | 参数      |
|---------------|---------------------------------------------------------------------------------|-----------|
| click-date    | 日期点击事件                                                                    | day       |
| click-event   | 日程项目点击事件                                                                | event,day |
| period-change | 切换日历时间段事件，参数： {calendarStart, calendarEnd, periodStart, periodEnd} | Data      |

### base-smart-search

智能搜索组件。

属性：

| 属性名           | 说明                              | 类型    | 可选值     | 默认值 |
|------------------|-----------------------------------|---------|------------|--------|
| search-width     | 搜索框宽度                        | String  | \-         | 450px  |
| disabled         | 是否已禁用                        | Boolean | true/false | false  |
| selectable       | 是否启用左侧下拉选                | Boolean | true/false | true   |
| default-search   | 左侧下拉选默认搜索项{label, name} | Object  | \-         | \-     |
| select-data      | 左侧下拉选可选项列表              | Array   | \-         | []     |
| form-model       | 高级查询表单model                 | Object  | \-         | {}     |
| form-label-width | 表单label宽度                     | String  | \-         | 120px  |

slots:

| 名称                  | 说明                                                   |
|-----------------------|--------------------------------------------------------|
| search-bar            | 查询框右侧空白粗靠左部分的工具栏slot。                 |
| tool-bar              | 查询框右侧空白靠右部分，高级查询按钮左侧的工具栏slot。 |
| group-tool-bar        | 高级查询所在按钮组中的工具栏slot。                     |
| adv-search-items      | 高级查询项。                                           |
| adv-search-operations | 高级查询表单按钮左侧的工具栏slot。                     |
| adv-form-tool-bar     | 高级查询表单按钮右侧的工具栏slot。                     |
| bottom-bar            | 高级查询表单底部的工具栏slot。                         |

### base-workflow-designer

工作流设计器组件。工作流设计器组件基于go.js进行封装，go.js的官方文档请参阅：https://gojs.net/latest/api/index.html

属性：

| 属性名                 | 说明                                                                                                                                                                                                                                                                              | 类型     | 可选值             | 默认值     |
|------------------------|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|----------|--------------------|------------|
| mode                   | 组件调用模式。design模式为工作流设计模式，绘制剪贴板，允许移动、拖放、粘贴、删除元素，允许拖移画布；view模式为工作流展示模式，不绘制剪贴板，不允许对元素进行修改变更，允许拖移画布；fixed模式为工作流展示模式，与view模式的区别在于fixed模式不允许拖移画布                        | String   | design/view/ fixed | design     |
| data                   | 工作流json数据对象。应当至少具有nodeDataArray（节点数组）和linkDataArray（跳转数组）两个属性。其他属性请参阅: <https://gojs.net/latest/api/symbols/GraphLinksModel.html> 。 \*注意：在此对象上入的nodeKeyProperty、linkFromKeyProperty、linkToKeyProperty 属性将被忽略。          | Object   | \-                 | {}         |
| width                  | 组件宽度                                                                                                                                                                                                                                                                          | String   | \-                 | 100%       |
| height                 | 组件高度                                                                                                                                                                                                                                                                          | String   | \-                 | 500px      |
| auto-layout            | 自动进行布局                                                                                                                                                                                                                                                                      | Boolean  |                    | true       |
| layout                 | 布局类型。具体类型请参阅官方文档。                                                                                                                                                                                                                                                | String   | \-                 | TreeLayout |
| angle                  | 跳转线拐角的角度                                                                                                                                                                                                                                                                  | Number   | \-                 | 90         |
| node-spacing           | 同级节点最小间距                                                                                                                                                                                                                                                                  | Number   | \-                 | 40         |
| layer-spacing          | 层间距：树形布局中父级节点和子节点的最小间距                                                                                                                                                                                                                                      | Number   | \-                 | 30         |
| node-name-field        | 在data对象上的节点数组中每一个节点数据对象上，指定为节点名称的字段名                                                                                                                                                                                                              | String   | \-                 | nodeName   |
| node-key-field         | 在data对象上的节点数组中在每一个节点数据对象上，指定为节点ID的字段名                                                                                                                                                                                                              | String   | \-                 | nodeKey    |
| node-menu-btns         | 节点右键上下文菜单的按钮数组（开始、结束节点不适用右键上下文菜单）。数组中的元素必须具有text（指定按钮的显示文本）和action（函数，接收两个参数，第一个为按钮本身，第二个为事件，为按钮指定点击后的操作）两个属性。 \*注意：design模式下自动向数组末尾追加删除按钮，无需手动配置。 | Array    | \-                 | \-         |
| link-name-field        | 指定为跳转名称的字段名                                                                                                                                                                                                                                                            | String   | \-                 | linkName   |
| link-from-key-property | 在data对象上的跳转数组中每一个跳转数据对象上，被指定为跳转起点节点ID的属性                                                                                                                                                                                                        | String   | \-                 | from       |
| link-to-key-property   | 在data对象上的跳转数组每一个跳转数据对象上，被指定为跳转终点节点ID的属性                                                                                                                                                                                                          | String   | \-                 | to         |
| link-menu-btns         | 跳转右键上下文菜单的按钮数组。数组中的元素必须具有text（指定按钮的显示文本）和action（函数，接收两个参数，第一个为按钮本身，第二个为事件，为按钮指定点击后的操作）两个属性。 \*注意：design模式下自动向数组末尾追加删除按钮，无需手动配置。                                       | Array    | \-                 | \-         |
| before-remove-node     | 执行删除节点之前的操作。接收当前正在被删除的节点作为参数，返回值为是否确认删除。如果返回true，则确认删除，如果返回false，则取消删除                                                                                                                                               | Function | \-                 | \-         |
| before-remove-link     | 执行删除跳转之前的操作。接收当前正在被删除的跳转作为参数，返回值为是否确认删除。如果返回true，则确认删除，如果返回false，则取消删除                                                                                                                                               | Function | \-                 | \-         |

方法：

| 方法名      | 说明                                                   | 参数 |
|-------------|--------------------------------------------------------|------|
| removeNode  | 删除节点。删除前会执行before-remove-node方法进行确认。 | node |
| removeLink  | 删除跳转。删除前会执行before-remove-link方法进行确认。 | link |
| clear       | 清空画布。                                             |      |
| undo        | 撤销上一步操作。                                       |      |
| redo        | 重做，恢复被撤销的操作。                               |      |
| getJSONData | 获取model的JSON字符串。                                |      |

事件：

| 事件名        | 说明                                                                                                                                                                          | 参数  |
|---------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|-------|
| node-drop     | 节点被拖放到画布上的事件。e.subject属性为拖放到画布的节点的集合，通过each遍历进行操作。通过设置e.cancel属性为true，可以取消被拖放到画布上的节点。                             | event |
| link-drawn    | 拖拽绘制出跳转线的事件。e.subject属性为此次拖拽出的跳转。通过设置e.cancel属性为true，可以取消被绘制出的跳转。                                                                 | event |
| node-deleting | 选中节点按下Delete键删除的事件。e.subject属性为当前选中的节点对象。如果选中多个节点并进行删除，此事件将被触发多次。通过设置e.cancel属性为true，可以取消对当前节点的删除操作。 | event |
| link-deleting | 选中跳转按下Delete键删除的事件。e.subject属性为当前选中的跳转对象。如果选中多个跳转并进行删除，此事件将被触发多次。通过设置e.cancel属性为true，可以取消对当前跳转的删除操作。 | event |
| node-click    | 节点单击事件。此事件与双击事件冲突。e.subject属性为被单击的节点。                                                                                                             | event |
| link-click    | 跳转单击事件。此事件与双击事件冲突。e.subject属性为被单击的跳转。                                                                                                             | event |
| node-dblclick | 节点双击事件。此事件与单击事件冲突，如果同时声明单击、双击事件，则只会触发单击事件。e.subject属性为被双击的节点。                                                             | event |
| link-dblclick | 跳转双击事件。此事件与单击事件冲突，如果同时声明单击、双击事件，则只会触发单击事件。e.subject属性为被双击的跳转。                                                             | event |

leon-base工具类使用手册
=======================

Pager
-----

前端分页器。用于向服务端发送分页请求，并自动为elmenti-ui的el-pagination组件附加事件处理函数。

引用路径： leon-base-component/lib/helper/Pager

属性：

| 属性名  | 说明                                                                                                  | 类型    | 默认值 |
|---------|-------------------------------------------------------------------------------------------------------|---------|--------|
| data    | 当前页数据。可以将el-table的data属性值指向Pager实例的data属性，以将服务端返回的数据展示到el-table中。 | Array   | []     |
| loading | 可以在el-table上附加v-loading并指向Pager实例的loading属性，以控制表格的加载状态显示。                 | Boolean | false  |
| current | 将el-pagination的current-page属性指向Pager实例的current属性，以控制当前页码。                         | Number  | 1      |
| size    | 将el-pagination的size属性指向Pager实例的size属性，以控制分页大小。                                    | Number  | 10     |
| total   | 将el-pagination的total属性指向Pager实例的total属性，以在分页组件上显示数据总量。                      | Number  | 0      |

方法：

| 方法名 | 说明                                                                                                    | 参数                 |
|--------|---------------------------------------------------------------------------------------------------------|----------------------|
| init   | 初始化当前Pager实例。参数为el-pagination组件实例，以及用于向后端请求的方法，该方法必须返回一个Promise。 | pagination, queryApi |
| search | 向服务端发起请求，进行传参查询，并重置当前页码。                                                        | params               |

使用说明：要使用Pager类自动管理分页请求，在组件的data()
函数中增加一个属性，值为Pager类的实例。在组件的生命周期函数上调用Pager实例的init方法，并将el-pagination实例（通过\$refs属性获取）和请求数据的方法传入。（一般选择组件的mounted方法，如果存在如el-dialog之类lazy-render的情况，在初次渲染内容时进行调用，需要保证调用init方法时页面上的el-pagination组件已经渲染）。

ScrollHelper
------------

用于配合base-section使用，计算当前节的头部、尾部高度，传入base-scroll-table中使用。

引用路径： leon-base-component/lib/helper/ScrollHelper

属性：

| 属性名       | 说明                                                                                                                                            | 类型   | 默认值 |
|--------------|-------------------------------------------------------------------------------------------------------------------------------------------------|--------|--------|
| headerHeight | 头部高度。将base-scroll-table的header-height属性值指向ScrollHelper实例的headerHeight属性，用以辅助base-scroll-table进行滚动加载时的高度计算。   | Number | 0      |
| footerheight | 尾部高度。将base-scroll-table的footer-height属性值指向ScrollHelper实例的footerheight属性，，用以辅助base-scroll-table进行滚动加载时的高度计算。 | Number | 0      |

TreeHelper
----------

用于处理树形数据的工具类。

引用路径： leon-base-component/lib/helper/TreeHelper

方法：

| 方法名    | 说明                                                                                                                                                                                                                                                                        | 参数                                                   |
|-----------|-----------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|--------------------------------------------------------|
| serialize | 此方法为静态方法。用于将平铺列表/数组数据转为树形数据。传入4个参数：list（数据源）、childrenPropName（用于存放子节点数组的属性名，默认值为children）、keyPropName（主键属性名，默认值为id）、parentKeyPropName（父级ID属性名，默认值为pid）。返回经过序列化的树形数据列表。 | list, childrenPropName, keyPropName, parentKeyPropName |

leon-base 验证规则使用说明
==========================

引用路径： leon-base-core/lib/validator

range(min, max, message)
------------------------

数值范围校验。min:最小值，max:最大值，message:验证不通过的错误提示（可选）。当为非必填项且值为空时，不进行校验。

precision(min, max, message)
----------------------------

数值精度校验。min:最小精度，max:最大精度，message:验证不通过的错误提示（可选）。当为非必填项且值为空时，不进行校验。

length(min, max, message)
-------------------------

字符串长度校验。min:最小长度，max:最大长度，message:验证不通过的错误提示（可选）。当为非必填项且值为空时，不进行校验。

notBlank(message)
-----------------

字符串非空白校验。message:验证不通过的错误提示（可选）。

notEmpty(message)
-----------------

字符串非空校验。message:验证不通过的错误提示（可选）。

numeric(message)
----------------

数值校验。传入的值可以为字符串，但必须全部由数字组成。message:验证不通过的错误提示（可选）。当为非必填项且值为空时，不进行校验。

mobile(message)
---------------

手机号码校验。1开头的11位数字或01开头的十二位数字。message:验证不通过的错误提示（可选）。当为非必填项且值为空时，不进行校验。

email(message)
--------------

邮箱地址校验。message:验证不通过的错误提示（可选）。当为非必填项且值为空时，不进行校验。

ipv4(message)
-------------

IP地址校验。message:验证不通过的错误提示（可选）。当为非必填项且值为空时，不进行校验。

account(min = 4, max = 50)
--------------------------

账号校验。必须以字母开头，特殊字符中仅允许出现\@-._，其中\@仅允许出现一次，并且不能以特殊字符结尾。min:最小长度，max:最大长度。当为非必填项且值为空时，不进行校验。

password(message)
-----------------

密码校验。密码由字母和数字组成，至少8位。message:验证不通过的错误提示（可选）。当为非必填项且值为空时，不进行校验。

cnIdCard(message, gender = 0)
-----------------------------

中国大陆身份证校验。可校验15位的一代身份证或18位的二代身份证号码。message:验证不通过的错误提示（可选）,
gender:同时校验性别（1男2女，默认为0即不校验性别）。当为非必填项且值为空时，不进行校验。

carVin(message)
---------------

车架号（车辆唯一识别码）校验。message:验证不通过的错误提示（可选）。当为非必填项且值为空时，不进行校验。

equalsTo(compare, message)
--------------------------

等值校验。compare:比较字符串，message:验证不通过的错误提示（可选）。

leon-base预置Vue-filter使用说明
===============================

框架内置了日期时间类和部分字符串类的vue-filter。使用方法为(双大括号内): value \|
filter('类型名称（date/string）', '具体的过滤器名称', ...其他参数)。

DateFilters
-----------

日期时间类过滤器。

| 名称           | 说明                                          |
|----------------|-----------------------------------------------|
| formatDate     | 将值格式化为yyyy-MM-dd格式的字符串。          |
| formatDateTime | 将值格式化为yyyy-MM-dd HH:mm:ss格式的字符串。 |
| formatTime     | 将值格式化为HH:mm:ss格式的字符串。            |

StringFilters
-------------

字符串过滤器。

| 名称   | 说明                                                                                                     |
|--------|----------------------------------------------------------------------------------------------------------|
| subStr | 字符串截取。此过滤器带有额外两个参数。length:截取长度， append:附加在截取后字符串之后的后缀，默认为...。 |
| blank  | 空字符占位符。此过滤器带有额外一个参数。placeholder:当字符串为空值时以此代替，默认为-。                  |

leon-base自定义Vue指令使用手册
==============================

dbl-click-edit
--------------

双击编辑。接收一个函数作为值，该函数将在编辑框失去焦点时执行，参数为编辑框的值。

修饰符：

| 名称     | 说明               |
|----------|--------------------|
| mutiLine | 是否支持多行编辑。 |

el-date-range
-------------

专用于处理element-ui组件el-date-picker的指令。当且仅当组件的type属性为daterange、datetimerange或timerange时有效。使用该指令，需要为组件设置data
-range-start和data-range-end属性。这些属性通过HTML5
Dataset对象向该指令传递一个vue数据对象的属性路径（例如：form.params.datestart），用于将日期区间的起始、结束值赋值到指定的属性上。

el-single-select
----------------

专用于处理elment-ui组件el-select的指令。当且仅当组件的multiple属性为false（不指定默认为false）时有效。使用该指令，必须为组件设置value-key属性，并以data-map.\*的形式将需要映射到vue数据对象的通过HTML5
Dataset对象向该指令传递一个将需要映射到vue数据对象的属性路径传入该指令，用法如下：data-map.optionProperty="form.params.property"，其中属性名中的optionProperty为选项列表中的对象属性名，用于将选中的选项的指定属性赋值到vue数据对象中指定的属性上。

leon-base常量/枚举列表
======================

BaseBooleanEnum
---------------

布尔值枚举。

引用路径： leon-base-core/lib/contant/BaseBooleanEnum

| 枚举  | 说明（name） | 值（value） |
|-------|--------------|-------------|
| TRUE  | 是           | 1           |
| FALSE | 否           | 0           |

BaseEnableStateEnum
-------------------

启用状态枚举。

引用路径： leon-base-core/lib/contant/BaseEnableStateEnum

| 枚举     | 说明（name） | 值（value） |
|----------|--------------|-------------|
| ENABLED  | 启用         | 1           |
| DISABLED | 停用         | 0           |

BaseFlowStateEnum
-----------------

流程状态枚举。

引用路径： leon-base-core/lib/contant/BaseFlowStateEnum

| 枚举           | 说明（name） | 值（value） |
|----------------|--------------|-------------|
| SAVED          | 待提交       | 1           |
| PENDING        | 审批中       | 5           |
| UNCONFIRMED    | 待确认       | 8           |
| CONFIRMED      | 已确认       | 9           |
| PROCESSED      | 已审批       | 10          |
| PROCESSING     | 处理中       | 11          |
| PROCESS_FAILED | 处理失败     | 12          |
| TERMINATED     | 已终止       | 85          |
| APPROVED       | 已办结       | 90          |
| ADOPT          | 条件通过     | 91          |
| REJECTED       | 驳回         | 95          |
| CANCELED       | 作废         | 99          |

BaseFileApi
-----------

服务端文件API常量。

引用路径： leon-base-core/lib/contant/BaseFileApi

| 项           | 说明        | 值                  |
|--------------|-------------|---------------------|
| UPLOAD_API   | 文件上传API | /api/file/upload    |
| DOWNLOAD_API | 文件下载API | /api/file/download/ |

leon-framework 工具类使用手册
=============================

ArrayUtils
----------

数组相关工具类。

引用路径： leon-framework/lib/util/ArrayUtils

方法：

| 方法名     | 说明                                                                                             | 参数          |
|------------|--------------------------------------------------------------------------------------------------|---------------|
| isEmpty    | 此方法为静态方法。用于判断数组是否为空。                                                         | arr           |
| isNotEmpty | 此方法为静态方法。用于判断数组是否非空。                                                         | arr           |
| distinct   | 此方法为静态方法。用于数组去重。如果可选参数property的值不为空，还可以根据指定属性的值进行去重。 | arr, property |

DateUtils
---------

日期时间相关工具类。

引用路径： leon-framework/lib/util/DateUtils

方法：

| 方法名             | 说明                                                                                                                                                                                            | 参数                  |
|--------------------|-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------|-----------------------|
| supportsIntl       | 此方法为静态方法。用于判断浏览器是否支持Intl（ECMAScript 国际化 API 的一个命名空间，相关文档请参阅：<https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Intl>）。 | \-                    |
| diffMs             | 此方法为静态方法。用于计算两个时间之间的毫秒数。参数可以为Date对象，或者数值。                                                                                                                  | dateStart, dateEnd    |
| diffSeconds        | 此方法为静态方法。用于计算两个时间之间的秒数。参数可以为Date对象，或者数值。                                                                                                                    | dateStart, dateEnd    |
| diffMinutes        | 此方法为静态方法。用于计算两个时间之间的分钟数。参数可以为Date对象，或者数值。                                                                                                                  | dateStart, dateEnd    |
| diffHours          | 此方法为静态方法。用于计算两个时间之间的小时数。参数可以为Date对象，或者数值。                                                                                                                  | dateStart, dateEnd    |
| diffDays           | 此方法为静态方法。用于计算两个时间之间的天数。参数可以为Date对象，或者数值。                                                                                                                    | dateStart, dateEnd    |
| addDays            | 此方法为静态方法。用于计算在某一时间加上指定天数的结果。参数date为Date对象，days为数值。                                                                                                        | date, days            |
| addMonths          | 此方法为静态方法。用于计算在某一时间加上指定月数的结果。参数date为Date对象，months为数值。                                                                                                      | date, months          |
| beginningOfDate    | 此方法为静态方法。用于获取某一日期的当日开始时间。                                                                                                                                              | date                  |
| beginningOfWeek    | 此方法为静态方法。用于获取某一日期所在星期的开始时间。参数startDayOfWeek用于指定星期的哪一天作为每星期的开始，默认为0。                                                                         | date, startDayOfWeek  |
| beginningOfMonth   | 此方法为静态方法。用于获取某一日期所在月份的开始时间。                                                                                                                                          | date                  |
| endOfWeek          | 此方法为静态方法。用于获取某一日期所在星期的结束时间。参数startDayOfWeek用于指定星期的哪一天作为每星期的开始，默认为0。                                                                         | date, startDayOfWeek  |
| endOfMonth         | 此方法为静态方法。用于获取某一日期所在月份的结束时间。                                                                                                                                          | date                  |
| getDayCountOfMonth | 此方法为静态方法。用于获取某一年某月的天数。不指定年或月则默认为当日所在的年或月。                                                                                                              | year, month           |
| format             | 此方法为静态方法。用于格式化日期。dateObj可以为Date对象、字符串、或者数值。mask为指定的格式。i18n为指定的国际化设置，是可选参数。                                                               | dateObj, mask, i18n   |
| parse              | 此方法为静态方法。用于从字符串中解析出日期。format为指定的格式。i18n为指定的国际化设置，是可选参数。                                                                                            | dateStr, format, i18n |

DOMUtils
--------

js原生DOM操作的工具类。如非必要，请勿在业务代码中使用原生DOM操作。

引用路径： leon-framework/lib/util/DOMUtils

方法：

| 方法名          | 说明                                                                                                                                                      | 参数             |
|-----------------|-----------------------------------------------------------------------------------------------------------------------------------------------------------|------------------|
| queryChild      | 此方法为静态方法。用于根据指定的选择器获取子一级的元素。选择器的相关文档请参阅：<https://developer.mozilla.org/zh-CN/docs/Web/API/Document/querySelector> | parent, selector |
| getWindowOffset | 此方法为静态方法。用于计算元素到浏览器窗体边框的距离。返回结果为包含top、right、bottom、left四个属性的对象。                                              | element          |

HashUtils
---------

加密/解密相关的工具类。

引用路径： leon-framework/lib/util/HashUtils

方法：

| 方法名 | 说明                                              | 参数   |
|--------|---------------------------------------------------|--------|
| md5    | 此方法为静态方法。用于将指定的字符串进行md5加密。 | source |

ObjectUtils
-----------

对象操作相关的工具类。

引用路径： leon-framework/lib/util/ObjectUtils

方法：

| 方法名               | 说明                                                                                   | 参数                   |
|----------------------|----------------------------------------------------------------------------------------|------------------------|
| isEmpty              | 此方法为静态方法。用于判断指定对象是否为空对象（null/undefined/{}）。                  | obj                    |
| isNotEmpty           | 此方法为静态方法。用于判断指定对象是否为非空对象。                                     | obj                    |
| isPlainObject        | 此方法为静态方法。用于判断指定对象是否为基本对象（构造函数为Object或无原型的对象）。   | obj                    |
| isNotPlainObject     | 此方法为静态方法。用于判断指定对象是否为非基本对象（构造函数为Object或无原型的对象）。 | obj                    |
| isNullorUndefined    | 此方法为静态方法。用于判断指定对象是否为null或undefined。                              | obj                    |
| isNotNullorUndefined | 此方法为静态方法。用于判断指定对象是否非null且非undefined。                            | obj                    |
| clone                | 此方法为静态方法。用于将传入的对象属性全部复制到一个对象上。                           | ...orig                |
| deepClone            | 此方法为静态方法。用于将传入的对象属性全部复制到一个对象上。此方法为深度复制。         | ...orig                |
| watch                | 此方法为静态方法。用于监听对象的某一个属性，并在其赋值时执行相应的回调函数。           | target, prop, callback |

StringUtils
-----------

字符串操作相关的工具类。

引用路径： leon-framework/lib/util/StringUtils

方法：

| 方法名      | 说明                                                                                                               | 参数          |
|-------------|--------------------------------------------------------------------------------------------------------------------|---------------|
| isEmpty     | 此方法为静态方法。用于判断指定字符串是否为空（null/undefined/空字符串）。                                          | str           |
| isNotEmpty  | 此方法为静态方法。用于判断指定字符串是否非空。                                                                     | str           |
| isAnyEmpty  | 此方法为静态方法。用于判断传入的多个字符串中是否存在空串（null/undefined/空字符串）。                              | ...str        |
| isNoneEmpty | 此方法为静态方法。用于判断传入的多个字符串是否全部不是空串。                                                       | ...str        |
| isBlank     | 此方法为静态方法。用于判断指定字符串是否为空白字符串（null/undefined/空字符串/全部由空格组成的字符串）。           | str           |
| isNotBlank  | 此方法为静态方法。用于判断指定字符串是否非空白。                                                                   | str           |
| isAnyBlank  | 此方法为静态方法。用于判断传入的多个字符串中是否存在空白字符串（null/undefined/空字符串/全部由空格组成的字符串）。 | ...str        |
| isNoneBlank | 此方法为静态方法。用于判断传入的多个字符串中是否全部不是空白字符串。                                               | ...str        |
| trim        | 此方法为静态方法。用于去除字符串左右的空格。                                                                       | str           |
| trimToNull  | 此方法为静态方法。用于去除字符串左右的空格。如果结果为空，返回null。                                               | str           |
| trimToEmpty | 此方法为静态方法。用于去除字符串左右的空格。如果结果为空，返回空字符串。                                           | str           |
| leftPad     | 此方法为静态方法。用于向字符串左侧填充指定的字符到指定的长度。                                                     | val, pad, len |
| shorten     | 此方法为静态方法。用于将传入的所有字符串都截取到指定的长度。返回截取后的字符串数组。                               | len, arr      |

TypeUtils
---------

用于类型判断的工具类。

引用路径： leon-framework/lib/util/TypeUtils

方法：

| 方法名      | 说明                                                              | 参数 |
|-------------|-------------------------------------------------------------------|------|
| isArray     | 此方法为静态方法。用于判断指定对象是否数组。                      | obj  |
| isBoolean   | 此方法为静态方法。用于判断指定对象是否布尔值。                    | obj  |
| isDate      | 此方法为静态方法。用于判断指定对象是否Date对象。                  | obj  |
| isError     | 此方法为静态方法。用于判断指定对象是否Error对象。                 | obj  |
| isFunction  | 此方法为静态方法。用于判断指定对象是否函数。                      | obj  |
| isMath      | 此方法为静态方法。用于判断指定对象是否Math对象。                  | obj  |
| isNumber    | 此方法为静态方法。用于判断指定对象是否数值。                      | obj  |
| isString    | 此方法为静态方法。用于判断指定对象是否字符串。                    | obj  |
| isString    | 此方法为静态方法。用于判断指定对象是否字符串。                    | obj  |
| isString    | 此方法为静态方法。用于判断指定对象是否字符串。                    | obj  |
| isRegExp    | 此方法为静态方法。用于判断指定对象是否正则表达式。                | obj  |
| isObject    | 此方法为静态方法。用于判断指定对象是否Object。                    | obj  |
| isWindow    | 此方法为静态方法。用于判断指定对象是否Window对象。                | obj  |
| isNull      | 此方法为静态方法。用于判断指定对象是否null。                      | obj  |
| isUndefined | 此方法为静态方法。用于判断指定对象是否undefined。                 | obj  |
| type        | 此方法为静态方法。用于获取指定对象的类型。                        | obj  |
| toString    | 此方法为静态方法。用于将指定对象转为[object Object]格式的字符串。 | obj  |

UUID
----

集成封装了node-uuid库的方法，用于生成UUID。

引用路径： leon-framework/lib/util/UUID

方法：

| 方法名      | 说明                                                                                                                                            | 参数            |
|-------------|-------------------------------------------------------------------------------------------------------------------------------------------------|-----------------|
| timestamp   | 此方法为静态方法。生成一个符合RFC4122 v1标准（基于时间戳）的UUID。                                                                              | \-              |
| namespaceV3 | 此方法为静态方法。根据一个字符串和另一个UUID生成一个符合RFC4122 v3标准的UUID。name：用于创建UUID的名称；namespace：用于创建新UUID的UUID字符串。 | name, namespace |
| random      | 此方法为静态方法。生成一个符合RFC4122 v4标准（基于随机数）的UUID。                                                                              | \-              |
| namespaceV5 | 此方法为静态方法。根据一个字符串和另一个UUID生成一个符合RFC4122 v5标准的UUID。name：用于创建UUID的名称；namespace：用于创建新UUID的UUID字符串。 | name, namespace |

leon-framework Vue相关
======================

VueHelper
---------

Vue工具对象，全局对象，用于在非Vue上下文中使用Vue实例的某些属性或方法，或注册全局Vue事件。

引用路径： leon-framework/lib/vue/VueHelper

属性：

| 属性名   | 说明                                        |
|----------|---------------------------------------------|
| \$store  | Vuex状态管理对象。                          |
| \$cookie | Vue-cookie管理对象。                        |
| eventHub | 全局事件处理器。本身是一个无状态的Vue实例。 |

方法：

| 方法名 | 说明                                                                                    | 参数        |
|--------|-----------------------------------------------------------------------------------------|-------------|
| init   | 初始化VueHelper，注入store、cookie等对象，并保存一个Vue根实例的引用，以代理其部分方法。 | vm          |
| \$t    | 代理的Vue-i18n \$t方法。Vue-i18n文档请参阅：<http://kazupon.github.io/vue-i18n/>        | key         |
| \$tc   | 代理的Vue-i18n \$tc方法。                                                               | key, choice |
| \$te   | 代理的Vue-i18n \$te方法。                                                               | key         |

VueMixin
--------

为Vue提供一些额外的方法或属性。引入此文件，并以Vue.use的方式使用。

引用路径： leon-framework/lib/vue/VueMixin

方法：

| 方法名 | 说明                                | 参数      |
|--------|-------------------------------------|-----------|
| \$find | 根据子组件tag名称查找子一级的组件。 | childName |

leon-framework常量/枚举说明
===========================

KeyCodeEnum
-----------

按键keycode表。

引用路径： leon-framework/lib/constant/KeyCodeEnum

| 项            | 值  |
|---------------|-----|
| NULL          | 0   |
| BACKSPACE     | 8   |
| TAB           | 9   |
| CLEAR         | 12  |
| ENTER         | 13  |
| SHIFT         | 16  |
| CTRL          | 17  |
| ALT           | 18  |
| PAUSE_BREAK   | 19  |
| CAPS_LOCK     | 20  |
| ESCAPE        | 27  |
| SPACE         | 32  |
| PAGE_UP       | 33  |
| PAGE_DOWN     | 34  |
| END           | 35  |
| HOME          | 36  |
| LEFT          | 37  |
| UP            | 38  |
| RIGHT         | 39  |
| DOWN          | 40  |
| SELECT        | 41  |
| PRINT         | 42  |
| EXECUTE       | 43  |
| INSERT        | 45  |
| DELETE        | 46  |
| HELP          | 47  |
| NUM_0         | 48  |
| NUM_1         | 49  |
| NUM_2         | 50  |
| NUM_3         | 51  |
| NUM_4         | 52  |
| NUM_5         | 53  |
| NUM_6         | 54  |
| NUM_7         | 55  |
| NUM_8         | 56  |
| NUM_9         | 57  |
| A             | 65  |
| B             | 66  |
| C             | 67  |
| D             | 68  |
| E             | 69  |
| F             | 70  |
| G             | 71  |
| H             | 72  |
| I             | 73  |
| J             | 74  |
| K             | 75  |
| L             | 76  |
| M             | 77  |
| N             | 78  |
| O             | 79  |
| P             | 80  |
| Q             | 81  |
| R             | 82  |
| S             | 83  |
| T             | 84  |
| U             | 85  |
| V             | 86  |
| W             | 87  |
| X             | 88  |
| Y             | 89  |
| Z             | 90  |
| WINDOW_LEFT   | 91  |
| WINDOW_RIGHT  | 92  |
| WINDOW_MENU   | 93  |
| NUMPAD_0      | 96  |
| NUMPAD_1      | 97  |
| NUMPAD_2      | 98  |
| NUMPAD_3      | 99  |
| NUMPAD_4      | 100 |
| NUMPAD_5      | 101 |
| NUMPAD_6      | 102 |
| NUMPAD_7      | 103 |
| NUMPAD_8      | 104 |
| NUMPAD_9      | 105 |
| MULTIPLY      | 106 |
| ADD           | 107 |
| NUMPAD_ENTER  | 108 |
| SUBTRACT      | 109 |
| DECIMAL_POINT | 110 |
| DIVIDE        | 111 |
| F1            | 112 |
| F2            | 113 |
| F3            | 114 |
| F4            | 115 |
| F5            | 116 |
| F6            | 117 |
| F7            | 118 |
| F8            | 119 |
| F9            | 120 |
| F10           | 121 |
| F11           | 122 |
| F12           | 123 |
| NUM_LOCK      | 144 |
| SCROLL_LOCK   | 145 |
| EQUAL_SIGN    | 187 |
| DASH          | 189 |
| GRAVE_ACCENT  | 192 |
| OPEN_BRACKET  | 219 |
| BACK_SLASH    | 220 |
| CLOSE_BRACKET | 221 |