Jsmom-edit-table NPM

编辑表格组件

安装

npm i jsmom-edit-table -S

yarn add jsmom-edit-table

使用

引入

import EditTable from "jsmom-edit-table";

注册
```
components: {
    EditTable,
}
```
页面
```
<EditTable></EditTable>
```

配置

fieldData Array<Object> 字段配置
- name string 字段名
- text string 展示文本
- formType String|Function 类型 select|cascader|selectData|textarea|datetime|date|images|file|number|switch|content|text
- enumName string 枚举名
- formRules Array<Object>|Function<{row,rowIndex,tableFormItem}> 表单验证规则
- inputStyle String 表单输入项 style
- selectMultiple Boolean|Function 多选
- clearable Boolean 可被清理
- optionLoading Boolean|Function 选择列表加载中
- isLazy Boolean 懒加载(级联选择)
- lazyLoadFunction Function 懒加载函数(级联选择)
- showAllLevels Function 显示所有级(级联选择)
- isCheckStrictly Boolean 父子不关联(级联选择)
- isCollapseTags Boolean 折叠选项
- selectOption Array<Object>|Function 选择项
  - 参数 1: rowIndex
  - 参数 2: row
  - 参数 3: tableFormItem
- allowCreate Boolean 手动创建选择项
- filterable Boolean 是否可搜索手动创建开启时必须为 true
- defaultFirstOption Boolean 回车时选择第一个
- dateType String 日期类型 year|month|date|dates| week|datetime|datetimerange|daterange|monthrange
- selectTable String|Function 选择表
- selectParams Object|Function 选择额外的参数(selectData)
- formEventMaps Object<Function> 表单多动态事件
- selectBind Object<Function> 关联其他字段(selectData)
- disabled Boolean 禁用表单
- disabledFunction Function 禁用表单
- isExpandTableId Boolean 是展开表格数据 id 出现一次即可
- valueFormat String 格式化时间值
- textareaRowNum Number 文本域显示行数
- limit Number 限制文件图片数量
- showStepControls Boolean 显示步进控制条
- numberMin Number|Function 最小数值
- numberMax Number|Function 最大数值
- numberPrecision Number 数值精度
- numberStep Number 步进值
- switchActiveValue Number|String|Boolean 开关打开时的的值
- switchinactiveValue Number|String|Boolean 开关关闭时的值
- placeholder String 表单占位符
- showTableColumn Boolean 显示在表格中
- initalValue any 初使值
- formatterFunction Function 格式化方法
- tableColumnMinWidth Number|String 表格列宽度
- fixed String 固定定位
- formatterFunction Function 格式化显示文本
fnPropDelDataFromIds Function 删除的请求方法
fnPropAddData Function 新增的方法
fnPropSaveData Function 保存的方法
fnPropListRecord Function 获取列表的方法
eventMaps Object<Function> 事件集合
- checkboxChange 多行选中行时
  - 参数 {records,reserves,indeterminates,checked,row,rowIndex,column,columnIndex}
- radioChange 单行选中时
  - 参数 {newValue,oldValue,row,rowIndex,column,columnIndex}
- refreshTable 点击表格刷新时
- deletedRow 删除行时
  - 参数 rowIndex
configData Object
- size String 组件大小 medium|small|mini
- headers Object 请求头信息
- disableToolBar Boolean 禁用表格工具栏
- disableRefresh Boolean 禁用刷新按钮
- disableCustom Boolean 禁用自定义列
- disablePrint Boolean 禁用打印
- disableAdd Boolean 禁用添加
- disableDelete Boolean|Function 禁用删除
- disableMultipleDelete Boolean 禁用多选删除
- disableSave Boolean 禁用保存
- disableSequence Boolean 禁用序号列
- disablePreview Boolean 禁用预览按钮
- disableEdit Boolean 禁用编辑按钮
- disablePaging Boolean 禁用分页
- disableRowSort Boolean|Function 禁用行排序
- showRowSort Boolean 显示行排序
- showRadio Boolean 显示单选
- showCheckbox Boolean 显示多选
- disableSearch Boolean 禁用搜索
- hideDelete Boolean 隐藏删除
- id String 唯一标识记录列顺序、显隐等
- operateFixed String 排作列固定
- align String 对齐方式
- table
  - height Number||String 表格高度 auto|empty|Number
- fnTableHeaderCellClassName Function 表格表头 Class 名称方法
- fnTableRowClassName Function 表格行 Class 名称方法
- fnTableCellClassName Function 单元格 Class 名称方法
- fnTableHeaderCellStyle Function 表格表头样式方法
- fnTableRowStyle Function 表格行样式方法
- fnTableCellStyle Function 单元格样式方法
- pagingAlign String 分页对齐方式
- formSize String 表单样式大小
- editLabelWidth Number 表单标签宽度
- importExcelAction String 导入表格的地址
- importExcelSize Number 导入表格的限制大小
- showExportField Boolean 导出时选择字段
- operateExtraWidth Number 操作列增加宽度
- title String 标题
- fixedSelect Boolean 选择列固定在左侧
- showFilter Boolean 显示过滤
- footerMethod Function 设置表尾数据
  - 参数 { columns, data, formData }
- enableDragColumn Boolean 启用拖动列支持

方法

fnSetData(variate, property, value) 修改数据
- variate 变量名
- property 属性如：'a.b'、'a.d0'、'a.d1.f'
- value 值
fnGetData(variate:String, property:String|Array, defaultValue) 获取数据
- variate 变量名
- property 属性如：'a.b'、'a.d0'、'a.d1.f'、'a', 'c'
- defaultValue 默认值
fnInsertData(dataArr, index) 插入数据
- index 位置默认最后一行
fnDeleteData(index, number) 删除数据
- number 删除数量默认为 1
fnGetTableForm() 获取表单数据 - 包含排序
fnGetTableData() 获取表格数据 - 包含排序
fnGetRowSort() 获取排序
execMethod
req: {type, params}
- getRadioRecord 用于 radio，获取当前已选中的行数据
- getCheckboxRecords 用于 checkbox，获取当前已选中的行数据
- getRowExpandRecords 获取已展开的行数据
- setRowExpand(rows, checked:Boolean) 设置要展开的行
  - checked 展开或折叠
- setRadioRow(row) 设置某一行为选中状态
- setCheckboxRow(rows, checked:Boolean) 设置行为选中状态
- updateFooter() 手动更新表尾
reloadData(Object) 重新加载表格数据
- page Number 页码 default: 当前页
- params Object 传递到请求的其他数据