案例-附件相关扩展开发

yonyouhmm

本帖最后由 yonyouhmm 于 2024-3-21 20:08 编辑

一、说明
应用构建中的附件字段，存储的是前端生成的uuid，附件信息是绑定在这个uuid上的，就是附件字段的存储的值。前端框架中window对象中预制有文件服务提供的操作附件的js方法
二、生命周期函数
//附件组件初始化

viewModel.on('beforeCreateAttachmentData', ({ data, config }) => {
debugger;
//data.objectId = 'xxxxx'; // 可以自己修改objectId
});

复制代码

//附件组件渲染前

viewModel.on('beforeRenderFileComponent', (obj) => {
debugger;
obj.authId = '';
});

复制代码

//附件组件创建

viewModel.on(`filelistnew2DidMount`, function ({ ecsuiteComponent }) {
debugger;
ecsuiteComponent.then(function (ecsuiteApi) {
//控制是否可上传、删除、下载
//如果对mode有要求就增加viewModel.getParams().mode的判断。ecsuiteComponent是个promise对象也可以先赋值给一个变量 modeChange中直接使用
ecsuiteApi.updateAuth({
auth: {
canDownload: true,
canDelete: true,
canUpload: true,
},
});
});
});

复制代码

//上传前

viewModel.on('beforeFileListUpload', function ({ fileData, ...obj }) {
debugger;
});

复制代码

//监听上传和删除

viewModel.on('ecsuiteFileChange', function ({ viewModel, data, file, type, childrenFieldId, cItemName, objectId, objectName }) {
debugger;
// 通过type区分是上传还是删除 upload 上传 delete 删除
});

复制代码

//上传成功后

viewModel.get('new2').on('afterFileUploadSuccess', function ({ file }) {
debugger;
});

复制代码

//删除附件前

viewModel.on('beforeDeleteCallBack', function (data) {
debugger;
});

复制代码

//删除成功后

viewModel.get('new2').on('afterFileDeleteSuccess', () => {
debugger;
});

复制代码

//预览前

viewModel.on('beforePreviewCallBack', function ({ fileData, params }) {
debugger;
});

复制代码

//下载前

viewModel.on('beforeDownloadCallBack', (obj) => {
debugger;
obj.zipName = 'dddddd'; // 将附件下载的名称修改为dddddd
});

复制代码

//批量下载前

viewModel.on('beforeBatchDownload', (obj, filesInformation) => {
debugger;
});

复制代码

//子表行附件弹窗保存时触发 beforeTableAttachmentHandleOk

viewModel.on('beforeTableAttachmentHandleOk', ({ uploadList, deleteList, data }) => {
debugger;
});

复制代码

三、文件服务js方法

1、可以批量获取根据多个单据的附件字段的值批量获取附件信息列表
2、脚本以获取一个单据的演示获取一个附件字段的附件信息列表
3、按照fileId删除附件
4、获取预览地址
5、获取单个文件下载链接
6、批量获取文件下载链接
7、拷贝附件把一个单据中的附件都拷贝到另一个单据的附件字段
8、上传附件

//附件操作
viewModel.get('button27yk').on('click', (args) => {
  window.YYCooperationBridge.ready(() => {
let objectId = viewModel.get('new2').getValue();
//1、根据附件字段存的值获取附件信息列表
//也可以批量获取根据多个单据的附件字段的值这是批量获取的方式
window.YYCooperationBridge.YYFormFileGetAllListByObjectIdV2({
   searchList: [
      { businessId: '附件字段存的值', objectName: 'iuap-yonbuilder-runtime' },
      { businessId: '附件字段存的值', objectName: 'iuap-yonbuilder-runtime' },
   ],
   extraParams: { authId: 'xxx' },
}).then((data) => {
   console.log(data);
});
//2、获取一个附件字段的附件信息列表
window.YYCooperationBridge.YYGetFileListV2({
   objectName: 'iuap-yonbuilder-runtime',
   objectId: objectId,
   ts: Date.now(),
   pageSize: 10,
   extraParams: { authId: 'xx' },
}).then((data) => {
   console.log(data);
   //3、按照fileId删除附件
   let fileId = data.data[0].fileId;
   window.YYCooperationBridge.YYDeleteFileV2({
      fileId: fileId,
      fileSign: '', //删除签名可以不传
      checkUser: true, //是否验证用户如果为true只能删除本人上传的附件
      extraParams: { authId: '' }, //其他参数不传也可以
   }).then((args) => {
      console.log(args);
   });
   //4、获取预览地址
   window.YYCooperationBridge.YYPreviewFileByIdV2({
      fileId: fileId,
      open: true, //如果为true就直接在浏览器打开新页签预览了
      extraParams: { authId: 'xx' },
   }).then((data) => {
      console.log(data);
   });
   //5、获取单个文件下载链接
   window.YYCooperationBridge.YYGetDownloadUrlV2({
      fileId: fileId,
      extraParams: { authId: 'xx' },
   }).then((res) => {
      console.log(res);
      let file = null;
      getFileFromUrl(res, 'test', '.text').then((response) => {
      file = response.file;
      //8、上传附件
      YYCooperationBridge.YYUploadFiles({
         files: [file],
         appCode: 'iuap-yonbuilder-runtime',
         businessId: objectId,
         beforeUpload: (file) => {
            if (file.name.includes('副本')) {
            return Promise.reject(false);
            }
         },
         onFailed: (file, error) => {
            console.log('onFailed', file, error);
         },
         onSuccess: (file) => {
            console.log('onSuccess', file);
         },
         onProgress: (file) => {
            console.log('onProgress', file);
         },
      });
      });
   });
   //6、批量获取文件下载链接
   window.YYCooperationBridge.YYGetBatchDownloadUrlV2({
      fileId: [fileId], //字符串数组
      zipName: 'test', //下载下来的zip文件名
      extraParams: { authId: 'xx' },
   }).then((data) => {
      console.log(data);
   });
});
  });
});

//7、拷贝附件把一个单据中的附件都拷贝到另一个单据的附件字段
viewModel.get('button40zi')?.on('click', (args) => {
  window.YYCooperationBridge.ready(() => {
window.YYCooperationBridge.YYFormFilesCopyAllV2({
   copyList: [
      {
      sourceObjectId: '08eb78cc-94e7-48f4-ba97-c4d85d32b846', //附件字段存储的值
      sourceObjectName: 'iuap-yonbuilder-runtime',
      targetObjectName: 'iuap-yonbuilder-runtime',
      targetObjectId: '65b40e68-6321-4715-87c0-aa16884adee0', //目标附件字段存储的值
      },
   ],
   extraParams: { authId: 'xxx' },
});
  });
});
四、客开需要同步校验的脚本示例
async function processPromise(objectId, returnPromise) {
  let promise = window.YYCooperationBridge.YYGetFileListV2({
objectName: 'iuap-yonbuilder-runtime',
objectId: objectId,
ts: Date.now(),
pageSize: 10,
extraParams: { authId: '' },
  });
  const result = await promise;
  debugger;
  if (result.count == 0) {
cb.utils.alert("附件不能为空");
return returnPromise.reject();
  } else {
return returnPromise.resolve();
  }
}

viewModel.on('beforeSubmit', (args) => {
  var returnPromise = new cb.promise();
  let objectId = viewModel.get('new2').getValue();
  let result = processPromise(objectId, returnPromise);
  return returnPromise;
});

五、一个附件相关的案例-发送附件
viewModel.get('button40ai').on('click', (args) => {
  window.YYCooperationBridge.ready(() => {
let objectId = viewModel.get('new2').getValue();
window.YYCooperationBridge.YYGetFileListV2({
   objectName: 'iuap-yonbuilder-runtime',
   objectId: objectId,
   ts: Date.now(),
   pageSize: 10,
   extraParams: { authId: 'xx' },
}).then((fileRes) => {
   console.log(fileRes);
   const fileId = fileRes.data[0].id; //这里获取到了fileId 多个文件自行处理
   var fileName = fileRes.data[0].fileName;
   var fileExtension = fileRes.data[0].fileExtension;
   //获取下载链接下载后转为base64发送
   window.YYCooperationBridge.YYGetDownloadUrlV2({
      fileId: fileId,
      extraParams: { authId: 'xx' },
   }).then((res) => {
      let file = null;
      getFileFromUrl(res,fileName,fileExtension).then((response) => {
      file = response.file;
      var reader = new FileReader();
      reader.readAsDataURL(file);
      reader.onload = function () {
         console.log(reader.result);
         debugger;
         cb.rest.invokeFunction('AT18EBC2523EB80008.backDesignerFunction.sendFile', {fileExtension: fileExtension, fileName: fileName, filePath: reader.result }, function (err, res) {
            debugger;
         });
         //这里测试把base64下载下来
         //downloadFileByBase64(reader.result,fileName);
      };
      });
   });
});
  });
});

function getFileFromUrl(url,fileName, fileExtension) {
  return new Promise((resolve, reject) => {
var blob = null;
var xhr = new XMLHttpRequest();
xhr.open('GET', url);
//xhr.setRequestHeader('Accept', 'application/octet-stream');
xhr.responseType = 'blob';
// 加载时处理
xhr.onload = (args) => {
   // 获取返回结果
   blob = xhr.response;
   let fullName = fileName + fileExtension;
   debugger;
   //可以自己判断附件类型
   let file = new File([blob], fullName, { type: 'image/png' });
   // 返回结果
   resolve({ file: file, fileName: fullName });
};
xhr.onerror = (e) => {
   reject(e);
};
// 发送
xhr.send();
  });
}

获取下载地址后，如何将附件下载并上传到其他单据（调用开放平台api上传）
getFileFromUrl(res).then((response) => {
file = response.file;
//目标单据销售订单的businessType  businessId是单据id
let businessType = 'yonbip-scm-scmsa';
let businessId = '69ee6045-edc4-4544-990d-8e60f4249048';
//获取token
let result = cb.rest.invokeFunction(
         'PU.backFunc.fileToSaleOrder', {},
         function (err, res) {},
         viewModel, {
         async: false
      });
let access_token = result.result.access_token;
const FD = new FormData();
FD.enctype = 'multipart/form-data';
FD.append('files', file);
let url = 'https://c3.yonyoucloud.com/iuap-api-gateway/yonbip/uspace/iuap-apcom-file/rest/v1/file?access_token=' + access_token + '&businessType=' + businessType + '&businessId=' + businessId;
cb.rest.ajax(url, {
      method: 'post',
      uniform: false,
      mask: false,
      dateType: 'file',
      domainKey: 'upu',
      params: FD,
      callback: (err, res) => {
         debugger;
         if (err) {
            console.log(err);
         } else {
            console.log(res);
         }
      }
});
});

function dataURLtoBlob(dataurl) {
  var arr = dataurl.split(','),
mime = arr[0].match(/

.*?);/)[1],
bstr = atob(arr[1]),
n = bstr.length,
u8arr = new Uint8Array(n);
  while (n--) {
u8arr[n] = bstr.charCodeAt(n);
  }
  return new Blob([u8arr], { type: mime });
}
//下载方法
function downloadFile(url, name) {
  var a = document.createElement('a');
  a.setAttribute('href', url);
  a.setAttribute('download', name);
  a.setAttribute('target', '_blank');
  let clickEvent = document.createEvent('MouseEvents');
  clickEvent.initEvent('click', true, true);
  a.dispatchEvent(clickEvent);
}

function downloadFileByBase64(base64, name) {
  var myBlob = dataURLtoBlob(base64);
  var myUrl = URL.createObjectURL(myBlob);
  downloadFile(myUrl, name);
}