btn数据结构:
{
name:'add',
label:'新增'
enable:true,'启用按钮',
type: 'primary|success|info|warning|danger',//为空default,按钮颜色
//暂时先不要;没有icon选择器
//icon: 'Plus', //图标'el-icon-plus'
//topBtn: true,
//rowBtn: true,
//top可能有的参数: row rows, id ,ids
//row可能有的参数: row,id
//detail可能有的参数: formData,id
//all可能有的参数: row rows formData id ids
show:['top|row|detail'],//顶部 行上,详情页上
//show=detail|row
enableTopBtnOnSelect:'one|more|empty|always',//针对topBtn
operationConditions:[],//针对row和detail按钮,前端隐藏,topBtn也行后台用到过滤选中的数据
//openFormOperation和formDataOperation功能重叠,去掉?
action:'openFormOperation|formDataOperation|startWorkflow|serviceFunction|customAction|clickEvent',
//准备作废confirmOperation|directOperation|promptOperation
actionSetting:{
doAction: '$FN:(event)=>{}',
//clickEvent
onClick: '$FN:(event)=>{}',
},//见actionSetting数据结构
//考虑作废 doAction代码要用到
btnParam: 'none', //ids[0] ids| row row.id [row.id]| none|queryParam
doAction:()=>{}, //method(string), function,object {url:'',method:'get',parsm}
}
actionSetting数据结构:
公共属性:
{
//操作前
//===formDataOperation|startWorkflow|serviceFunction====才有的参数=begin===
needConfirm:true,//是否确认,当needOpenForm=true时候,在提交表单时确认
confirm:{
confirmTitle: '是否确认',
confirmMessage: '是否确认xxx',
confirmButtonText:'确认',
cancelButtonText:'取消',
//prompt
showInput: true,//需要用户输入文本,比如作废原因,删除原因,可通过event.prompt拿到该值
inputType:'',//输入框类型'text' | 'textarea' | 'number' | 'password' | 'email' | 'search' | 'tel' | 'url'
inputPlaceholder:'',//输入框占位文本
inputPattern:'',输入框校验表达式(正则)
inputErrorMessage:'校验未通提示文本'
}
//打开ui表单搜集参数 ${formData} 同时还有选中的行参数 ${id} ${ids} ${row} ${rows}
needOpenForm: true,
openForm: {
//dialog属性==
dialog:{
title:'xx新增',
//width:300,
//height:300,
//showMaximize: true,//允许最大化
//maskClosable: true,//是否允许点击遮罩层关闭窗口
//escClosable: true, //ESC 按键关闭
//resize: true,//调整宽高
},
//UI表单和数据表单
formKey:'f1',//打开表单搜集参数,用来覆盖workFlowParam,serviceFunctionParam,formOperationParam
//可以覆盖formMeta中的配置
fieldRuleConfig: {
field:{
required: true
}
},
//submit:()=>{}
//表单数据,字符串格式,方便设置表单数据,可以使用选中行的数据,可以使用
formData:{
remark:'xxx',
},
//formData中可用参数
// 选中多行: ids,rows
// 选中一行,或者详情页 id,row
//参数使用示例
formData: {
id:'${id}',
name: '${row.name}',
remark: 'abc${row.reamrk}',
firstRowName : '${rows[0].name}',
ids:'${ids}',
selectedRows:'${rows}'
//updateFields:[]
}
}
//===formDataOperation|startWorkflow|serviceFunction====才有的参数=end===
//操作完成后
refreshListData: true,//操作完成后是否刷新列表数据
refreshFormData: true,//操作完成后是否刷新detail表单数据
showSuccessMsg: true,
successMsg: '',//弹出消息 ${btn.label}成功; ${res.msg}
//作废"actionType":"download",
download: true, //下载 window.open(${res.data})
//formOperation表单操作,startWorkflow启动工作流,serviceFunction服务端函数,都可以通过打开表单,覆盖相关参数
//可以通过${formData}, ${formData.name} 提取参数值
}openFormOperation 打开本表单操作:
(只能操作本表的,复杂操作比如操作其他表用serviceFunction做)
{
//操作前
needConfirm: false,//提交时确认
//dialog设置设置
dialog:{
title:'xx新增',
//width:300,
//height:300,
//showMaximize: true,//允许最大化
//maskClosable: true,//是否允许点击遮罩层关闭窗口
//escClosable: true, //ESC 按键关闭
//resize: true,//调整宽高
},
//操作设置
openFormOperation:'add|edit|batchEdit',
//字段设置
fieldRuleConfig: {f1:{required}},
//写入设置(可覆盖表单里的) add|edit|batchEdit
fieldWriteConfig: {
f1:{
required:true
}
}
//操作后
triggerWorkflow: true,//是否触发工作流,
refreshListData: true,//操作完成后是否刷新列表数据
refreshFormData: true,//操作完成后是否刷新detail表单数据
showSuccessMsg: true,//是否显示消息操作成功消息
successMsg: '',//弹出消息 ${btn.label}成功; ${res.msg}
}formDataOperation 表单数据操作:
{
//操作前设置
needConfirm:true,
//open表单设置
needOpenForm:false,
openForm:{},
//操作设置
operation:'add|edit|batchEdit',//|del|batchDel
//操作哪个表单
tableCode:'',//选择表单
//可用参数
// 如果打开表单 formData
// 如果直接操作没有打开表单
// 如果选择了多行 rows
// 如果选择了一行或者详情页 row 同时也提供数组类型rows ids方便使用
//操作参数配置,字符串
operationParams:{
//add,edit
formData:'${formData}',
//batchEdit
ids:'${formData.ids}',//选择了多条或者单条 ${ids}
updateFields:['f1'],//为空则取决于formData
formData: {
status: 10
}
//del
id:'${formData.id}',//选择了一条直接操作 ${row.id}
//batchDel
//ids:'${formData.ids}',//或者 选择了多条直接操作${ids}
},
//操作后
triggerWorkflow: true,//是否触发工作流
refreshListData: true,//操作完成后是否刷新列表数据
refreshFormData: true,//操作完成后是否刷新detail表单数据
showSuccessMsg: true,//是否显示消息操作成功消息
successMsg: '',//弹出消息 ${btn.label}成功; ${res.msg}
}startWorkflow 启动工作流:
{
//操作前设置
needConfirm:true,
//open表单设置
needOpenForm:false,
openForm:{},
//操作设置startWorkflow
workFlowKey:'F001',//工作流key
//针对 enableTopBtnOnSelect=more多选时有效
//如果是批量一个流程实例处理批量处理 则可获取到 ${rows}
// 如果不是批量 则workFlowParam中可以获取到 ${row},
isBatch: false //是否批量
//可用参数
// 如果打开表单 formData
// 如果直接操作没有打开表单
// 如果选择了多行 rows
// 如果选择了一行或者详情页 row
workFlowParam:{},
//操作后
needWaitResult:false,//是否需要等待异步结果,工作流是异步启动可能需要等待异步返回
download: true, //下载 window.open(${res.data})
refreshListData: true,//操作完成后是否刷新列表数据
refreshFormData: true,//操作完成后是否刷新detail表单数据
showSuccessMsg: true,//是否显示消息操作成功消息
successMsg: '',//弹出消息 ${btn.label}成功; ${res.msg}
}serviceFunction 服务端函数:
{
//操作前设置
needConfirm:true,
//open表单设置
needOpenForm:false,
openForm:{},
//serviceFunction
serviceFunction:'xx/XxxService.function',
serviceFunctionParam: ['${id}'], // [{id:'${id}'}] 如果是object类型则将此object作为为第一个参数
//操作后
download: true, //下载 window.open(${res.data})
refreshListData: true,//操作完成后是否刷新列表数据
refreshFormData: true,//操作完成后是否刷新detail表单数据
successMsg: '',//弹出消息 ${btn.label}成功; ${res.msg}
}customAction自定义操作:
{
needConfirm:true,//
needUrls:'',//需要的urls
//字符串格式,event和clickEvent一致,只是多了操作前后设置
doAction:'$FN:(event)=>{
const {id,row,ids,rows} = event;
console.log('click row',row)
return event.api.request('xx/delete',id)
}'
}
clickEvent执行点击事件:
{
needUrls:'',//需要的urls
//字符串格式
onClick:'$FN:(event)=>{
const {id,row,ids,rows} = event;
console.log('click row',row)
}'
}
event参数结构:
{
clickType:'topBtn|rowBtn',//点击类型 topBtn 点击顶部按钮; rowBtn点击行按钮
btn:{},//当前按钮信息
pk:'id',//主键 一般是id
titleField:'title',//标题字段
row:{},//当前row数据,detail详情页或者select一条数据时候有值
id:'11',//当前id //当前row数据,detail详情页或者select一条数据时候有值
//查询参数
queryParams:{
_queryType: '1',
queryParams: {}, //简单查询参数
advQueryParams: [], //高级查询参数
orderbyParams: [], //简单查询 高级查询共用排序参数
pageNo: 1,
pageSize: 10,
_keywords: null,
_queryplanId: null,
_tabView: null, //当前视图
_quickTagView: null, //快捷查询标签
},
ids:[],//复选框选中记录时有值
rows:[],//复选框选中记录时有值
api:{
refreshListData,//刷新列表数据
refreshFormData //刷新详情页数据
}
}旧btn:
{
type: 'primary|success|info|warning|danger',//为空default,按钮颜色
label:'按钮',
icon: 'Plus', //图标'el-icon-plus'
value:'btn1',
type:10,//
fieldSetting: {}, //字段设置
customActionSetting: {},自定义设置
operationConditions:[],//操作条件
onClick:(ctx) => {},
enableOnSelect:'one|more|empty|always',// one 选一条时启用按钮 more 多条时启用 ,always总是显示按钮
//openForm dialog配置
dialog:{
title:'xx新增'
}
action: 'startWorkflow|openForm|serviceFunction',//|confirmOperation|directOperation|promptOperation
//action=startWorkflow
workFlowKey:"",
workFlowParam:{},
needWaitResult:false,
actionType:"download",
//action=openForm
formKey:"caa",
formData:{},
//action=serviceFunction
serviceFunction:"xx/XxxService.function",
btnParam: 'none', //ids[0] ids| row row.id [row.id]| none|queryParam
doAction:()=>{}, // function,object {url:'',method:'get',parsm}
refreshList: true,//操作完成后是否刷新列表
//action=startWorkflow||serviceFunction
needConfirm:true,//需要确认
}===作废:====
自定义行按钮 类型
1 修改数据(弹出表单)
3 直接修改数据
4 直接修改数据(需确认)
10 自定义动作
自定义顶部按钮 类型
1 新增
2 批量修改(弹出表单)
3 批量直接修改数据
4 批量直接修改数据(需确认)
10 自定义动作
文档更新时间: 2026-03-30 06:27 作者：admin
