我有个表单,需要增加多个自定义按钮,每个按钮弹出自定义的页面,比如换货页面,比如修改地址页面等,我怎么实现?
//初始化控件
useFun.controlInit('FormView', 'formView_85622', {
formId: '1980889665869148161', //表单设计id
formType: 'edit', //表单类型 add | edit | view
handleType: '', //处理类型 default | returnData
showType: 'dialog', //弹窗类型 dialog | drawer
showButton: true, //是否显示底部默认操作按钮
dataOption: { //数据配置
tableId: '', //表单开发id
dataId: '' //数据id
},
defaultData: {}, //默认表单数据
enhanceData: {}, //传递给表单js增强内部调用配置
popOption: { //弹窗配置
title: 'SN码出库', //标题
width: '', //弹窗宽度
fullscreen: false, //是否全屏
footerBtn: [ //底部按钮配置
{
params: {}, //el-button 其他参数
name: '测试按钮', //按钮名称
display: false, //是否显示
loading: true, //点击时是否有loading
icon: '', //图标
clickFun: (loading) => {
//点击事件
if (loading) loading() //关闭loading
}
],
headerBtn: [], //顶部按钮配置(配置同上)
dialogParams: {} //弹窗其他配置
beforeClose: (type, done, formData, loading) => {
// type:关闭类型 submit:提交后触发 close:直接关闭弹窗触发
// done:关闭弹窗方法 formData:表单数据 loading:关闭loading方法
if (type == 'submit') {
console.log('表单数据', formData)
useFun.requestApi('post', '/jeelowcode/snmanage/outbound', {
data: formData
}).then(res => {
message.success('出库成功')
})
useFun.resetChange()
done()
});
//控件调用
const { formView_85622 } = Vue.toRefs(rendControlData.value)
const controlData = formView_85622.value.params //FormView的配置
// componentRef.value.formView_85622 FormView的Ref控件引用
useFun.controlInit('ControlView', 'controlView_97890', {
controlName: '', //控件名称(全局注册的控件使用,例:el-transfer )
controlPath: 'components/LowDesign/src/LowTable/components/import/importData.vue', //控件相对路径(未全局注册的控件使用,例:components/IFrame/src/IFrame.vue)
controlParams: {}, //控件配置
title: '导入调货数据', //标题
name: '导入调货', //按钮名称
display: true, //是否显示
dialogParams: {}, //弹窗其他配置
handleClose: (done) => { //关闭弹窗前的回调
const { controlView_97890 } = Vue.toRefs(rendControlData.value)
const controlData = controlView_97890.value.params //ControlView的配置
// componentRef.value.controlView_97890 ControlView的Ref控件引用
我这样实现,点击按钮,弹框就没有弹出框,但是我删除一个,另外一个可以弹出页面页面
演示环境复现一下,这样子看不出什么
我正在参加 Gitee 2025 最受欢迎的年度开源软件投票活动,请为 JeeLowCode 投上宝贵一票。