npm install jsmom-table-form> npm i jsmom-table-form -S
or
> yarn add jsmom-table-form
- 引入
``javascript`
import TableForm from "jsmom-table-form";
`
- 注册
javascript`
components: {
TableForm,
}
`
- 页面
html`
- fieldData Array
- name string 字段名string
- text 展示文本String
- formType 类型 select|cascader|selectData|textarea|datetime|date|calendar|images|file|number|switch|content|text|html|radiostring
- enumName 枚举名Array
- formRules
- isPreview 预览 BooleanArray
- expandTableFieldData 展开表格的字段配置Function
- fnPropExpandTableListRecord 展开表格的请求方法Function
- fnPropDelDataFromIds 删除的请求方法Function
- fnPropEditRecordDataFromRow 点击编辑记录的数据方法Function
- fnPropAddRecord 新增的方法Function
- fnPropUpdateRecord 更新的方法Function
- fnPropListRecord 获取列表的方法Function
- fnPropExportExcel 导出 Excel 的方法Object
- eventMaps 事件集合
- checkboxChange 多行选中行时
- 参数 {records,reserves,indeterminates,checked,row,rowIndex,column,columnIndex}
- radioChange 单行选中时
- 参数 {newValue,oldValue,row,rowIndex,column,columnIndex}
- expandChange 当行展开或收起时会触发该事件
- 参数 { expanded, row, rowIndex, column, columnIndex }
- filterSubmit 过滤提交时
- 参数 当前过虑表单数据
- refreshTable 点击表格刷新时
- clickAddBtn 点击添加按钮时
- getListData 获取列表数据成功后
- 参数 数据列表
- importExcelSuccessAfter 导入文件时 status:200 后
- 参数1 响应数据
- 参数2 文件信息
- cellSelected 单元格被选中时会触发该事件
- 参数 { row, rowIndex, $rowIndex, column, columnIndex, $columnIndex, $event }
- checkboxAll 多行全选时
- 参数 {records,reserves,indeterminates,checked}
- closeFormDialog 关闭表单弹窗时
- 参数 弹窗类型状态
- clickFooterCell 点击表尾单元格
- 参数 { items, $rowIndex, column, columnIndex, $columnIndex, $event }
- scroll 表格滚动时
- 参数 { type, scrollTop, scrollLeft, scrollHeight, scrollWidth, bodyWidth, bodyHeight, isX, isY, $event }
- resizableChange 拖动列宽时
- 参数 { column, columnIndex, $event }
- configData ObjectString
- size 组件大小 medium|small|miniObject
- headers 请求头信息Boolean
- disableToolBar 禁用表格工具栏Boolean
- disableRefresh 禁用刷新按钮Boolean
- disableCustom 禁用自定义列Boolean
- disablePrint 禁用打印Boolean
- disableAdd 禁用添加Boolean
- disableDelete 禁用删除Boolean
- disableMultipleDelete 禁用多选删除Boolean
- disableAudit 禁用审核Boolean
- disableImport 禁用导入Boolean
- disableExport 禁用导出Boolean
- disableCheckbox 禁用多选Boolean
- disableRadio 禁用单选Boolean
- disableSequence 禁用序号列Boolean
- disablePreview 禁用预览按钮Boolean
- disableEdit 禁用编辑按钮Boolean
- disablePaging 禁用分页Boolean
- disableDragColumn 禁用拖动列Boolean
- hideOverflow 单元格不换行Boolean
- showDefaultExport 显示默认导出Boolean
- showRadio 显示单选Boolean
- disableFixedFilter 禁用固定高级查询在左侧Boolean
- disableSearch 禁用搜索String
- searchPlaceholder 搜索占位符
- id 唯一标识 记录列顺序、显隐等Object
- tree 树型配置Boolean
- enabled 启用String
- childrenName 子列字段名称Boolean
- expandAll 展开所有String
- trigger 触发方式String
- align 对齐方式Number||String
- tableHeight 表格高度 auto|empty|NumberFunction
- fnTableHeaderCellClassName 表格表头 Class 名称方法Function
- fnTableRowClassName 表格行 Class 名称方法Function
- fnTableCellClassName 单元格 Class 名称方法Function
- fnTableHeaderCellStyle 表格表头样式方法Function
- fnTableRowStyle 表格行样式方法Function
- fnTableCellStyle 单元格样式方法String
- pagingAlign 分页对齐方式String
- formSize 表单样式大小String
- editLabelWidth 表单标签宽度String
- importExcelAction 导入表格的地址Number
- importExcelSize 导入表格的限制大小Boolean
- showExportField 导出时选择字段Number
- operateExtraWidth 操作列增加宽度Number
- pageSize 页数量String
- title 标题Boolean
- disableScrollY 是否禁用Y轴虚拟滚动Boolean
- disableScrollX 是否禁用X轴虚拟滚动Function
- footerMethod 设置表尾数据Function|Array
- 参数 { columns, data }
- 返回二维数组 第二维为每列的值
- mergeCells 合并单元格Boolean
- 参数1 tableData
- 参数2 computeColumnOrder
- 对象数组 Array<{ row: number, col: number, rowspan: number, colspan: number }>
- disableDragSelect 禁用拖动选择列Boolean
- disableDragTree 禁用拖动树型列Boolean
- disableDragExpand 禁用拖动展开列Boolean
- disableDragSeq 禁用拖动序号列Boolean
- fixedSelect 选择列固定在左侧Boolean
- fixedSeq 序号列固定在左侧String
- filterLabelWidth 高级查询标签宽度Boolean
- enableSelectCell 启用选择单元格Object
- formInitData 表单初使数据String
- baseApi 请求地址Array
- exportModes 前端导出输出数据的方式列表Array<{ colId?: number; field:? string; type?: string }>
- current, selected, all
- exportColumns 前端导出默认选中的列Boolean
- showAdd 显示添加按钮Boolean
- showDelete 显示删除按钮Boolean
- showEdit 显示修改按钮Number
- rowHeight 表格行高Object<{ field: String, order: String }>
- defaultSort 默认排序字段Boolean
- showImport 显示导入按钮Boolean
- showExport 显示导出按钮Boolean
- hideHeaderOverflow 隐藏表头省略Boolean
- stripe 是否带有斑马纹Boolean
- rowIsCurrent 当鼠标点击行时,是否要高亮当前行Boolean
- disableRowIsHover 禁用高亮鼠标当前行String
- operateFixed 操作列固定方式 默认right
- execMethod
req: {type, params}
- recalculate(refull:Boolean) 重新计算表格
- refull 完整计算
- updateData 更新数据
- insertAt(records, row) 临时插入数据
- row 指定位置、null从第一行插入、-1 从最后插入
- getTableData 获取表格的数据
- getRadioRecord 用于radio,获取当前已选中的行数据
- getCheckboxRecords 用于checkbox,获取当前已选中的行数据
- getRowExpandRecords 获取已展开的行数据
- setRowExpand(rows, checked:Boolean) 设置要展开的行
- checked 展开或折叠
- setRadioRow(row) 设置某一行为选中状态
- setCheckboxRow(rows, checked:Boolean) 设置行为选中状态
- getSelectedCell 获取选中的单元格信息
- scrollToRow(row, fieldOrColumn) 滚动到对应的行
- setCurrentRow(row) 设置某一行为高亮状态
- scrollTo(scrollLeft, scrollTop) 滚动到对应的位置
- fnResetFormData 清空表单数据
- ~~fnSetData({ variate, prop, value }) 修改data数据~~ 旧新
- variate 变量名
- prop 子属性
- value 值
- fnSetData(variate, property, value) 修改数据 Object
- variate 变量名
- property 属性 如:'a.b'、'a.d[0]'、'a.d[1].f'
- value 值
- fnGetData(variate:String, property:String|Array, defaultValue) 获取数据
- variate 变量名
- property 属性 如:'a.b'、'a.d[0]'、'a.d[1].f'、['a', 'c']
- defaultValue 默认值
- reloadData() 重新加载表格数据Number
- page 页码 default: 当前页Object
- params 传递到请求的其他数据Boolean
- filter 是否传递高级查询和关键词的数据 default: true`
- expand 展开行内容
- row 当前行数据
- operateExtraButton 操作列扩展按钮
- row 当前行数据
- importBefore 导入表格前的内容
- importBefore 表单内容
- toolbarButton 工具栏按钮
- selectedRow 选中的行数据
- toolbarTool 右侧工具列表插槽
- selectedRow 选中的行数据
- formFooterAfter 表单底部按钮
- formStatus 状态
- formFooterBefore 表单底部按钮
- formStatus 状态
_待补充_