明细表多图片、文件上传

代码生成器上明细表的编辑类型选择图片或者文件,主表点下生成页面

[vue3代码]写在生成的[表.vue]文件中,[vue2代码]写在[表.jsx]文件methods方法中;二选一实现
vue3代码
//生成对象属性初始化
const onInited =  () => {
    //主表表单:启用多文件/图上传,其他上传参数设置
  editFormOptions.forEach(x => {
    x.forEach(item => {
        if (item.field == '字段') {
        item.type = 'file';//可以指定上传文件类型img/file/excel
        //设置上传图片字段100%宽度
        // item.colSize = 12;
        //启用多图上传(默认单图)
        item.multiple = true;
        //自动上传(默认自动上传)
        item.autoUpload=true;
        //最多可以上传3张照片
        item.maxFile = 3;
        //限制图片大小,默认3M
        item.maxSize = 3;

        //限制文件上传格式,注意:设置fileTypes后,上面的  item.type = 'file'需要去掉
        //item.fileTypes=['jpg','png','pdf']

        //选择文件时
        item.onChange=(files)=>{
            console.log('选择文件事件')
            //此处不返回true,会中断代码执行
            return true;
        }
        //上传前
        item.uploadBefore=(files,params)=>{
            console.log('上传前')
            //上传前可以自定义参数
            params.xx='123'
            //上传前可以自定义参数,从编辑表单、或者当前编辑的行数据中获取
            params.xx=this.editFormFields.字段
            //从编辑的行数据中获取参数
            params.xx=this.currentRow.字段
            //后台重写【表service】类的中upload方法获取参数:
            //string val= Utilities.HttpContext.Current.Request.Query["xx"]
            return true;
        }
            //上传后
            item.uploadAfter=(files)=>{
            console.log('上传后')
            return true;
        }
        }
    })


    //(主从明细表)主从一对一明细表上传文件图或者图片
    gridRef.detailOptions.columns.forEach(x=>{
        if(x.field=='字段'){
            x.edit={};

            x.edit.type= 'file';//可以指定上传文件类型img/file/excel
            x.edit.multiple = true;
            //其他属性配置同上:x.edit.xx=
        }
    })

  })

}