# 变更记录 | **产品版本** | **更新内容** | **更新日期** | | --- | --- | --- | | V5.0.011 | 1、移动端附件支持整体折叠和查看更多
2、移动端附件面板，支持配置上传按钮位置
3、移动端附件字段权限控制交互优化 | 2023-04-13 | | V5.0.024 | 新增了移动端附件支持调用app客户端的上传接口上传文的功能，满足了用户使用APP接口上传文件的需求 | 2023-07-14 | | V5.0.025 | 新增了移动端附件通过链接下载的功能，满足了客户希望在移动端下载附件需求 | 2023-07-27 | | V6.0.1 | 1、移动端附件标题字体样式可配
2、移动端附件字段支持图片缩略图的格式 | 2023-10-18 | | V6.0.9 | 新增云之家app附件预览时，切换成苍穹的默认预览方式 | 2024-04-24 | | V6.0.12 | 优化了移动端附件预览功能，支持自定义预览文件类型，满足用户预览zip等格式文件的需求 | 2024-5-28 | | V6.0.13 | 优化了移动端附件上传图片功能，支持设置图片压缩阈值，当图片大小超过已设置的阈值时，对图片进行压缩，提升用户体验 | 2024-6-11 | | V7.0.1 | 1、优化了移动附件下载，支持了附件在云之家、钉钉，点击下载直接跳转到浏览器下载 ；支持了附件在企业微信、飞书、welink点击下载提示点击右上角，打开浏览器下载；支持了附件在其他App及浏览器，点击下载自动复制下载链接到剪切板，需要用户自己打开浏览器下载，提升用户体验
2、增加了附件自定义排序功能，解决客户需要自定义附件顺序问题，提升用户体验 | 2024-10-24 | # 1 功能介绍 附件字段，用于文件上传与展示。 # 2 控件对象 ``` kd.bos.form.field.AttachmentEdit ``` # 3 视觉展示  # 4 属性说明 ## 4.1 通用属性 通用属性包含字段和控件的一些公有的属性，如宽高，帮助文本等等。请参考[通用属性](https://vip.kingdee.com/article/215559076720798976) ## 4.2 样式属性 样式属性是每个控件在设计器右侧样式栏可以设置的属性，请参考[样式属性](https://vip.kingdee.com/article/252017936767406336) ## 4.3 业务属性 | **属性名** | **类型** | **默认值** | **说明** | 版本要求 | | --- | --- | --- | --- | --- | | 扩展名 | 文本 | - | 配置可上传文件扩展名，例：zip,rar，详见4.3.1 | | | 最大附件大小 | 整数 | 20 | 设置单个可上传文件大小，在系统参数中可设置服务器最大附件的大小，优先级比设计器属性要高， | | | 最大附件数 | 整数 | 0 | 设置附件可上传的文件数量，超出限制则不可上传 | | | 排序字段 | 下拉 | 上传时间 | 上传附件成功后，按排序字段进行排序，可排序的字段分为上传时间、文件名称、文件大小，详见4.3.2 | | | 排序方式 | 下拉 | 顺序 | 设置排序的方式，分为顺序和倒序 | | | 文件来源 | 下拉 | 金蝶云盘、相册、拍照 | 设置附件字段的文件来源，可选值为金蝶云盘、相册、拍照、本地文件、录像。详见4.3.3 | | | 上传按钮位置 | 下拉 | 顶部显示 | 设置附件字段上传按钮位置 | V5.0.011 | | 图片显示缩略图 | 复选框 | false | 设置附件字段文件为图片时，是否展示缩略图 | V6.0.1 | | 图片压缩阈值 | 整数 | 0 | 设置附件上传图片的压缩阈值，单位为MB，上传的图片大小超过阈值时，启动图片上传压缩。值为0时，默认图片超过4M以上时，进行压缩。 | V6.0.013 | | 拖拽排序 | 复选框 | false | 拖拽排序开启时，排序字段属性不在生效，以用户拖拽的排序为准。关闭时，生效排序字段属性。注：拖拽排序开启目前只支持pc拖拽排序，移动还不支持。 | V7.0.1 | ### 4.3.1 扩展名 扩展名用于设置附件字段允许上传的文件格式，如.webp,.webp等，多个文件格式使用英文逗号进行分隔 ### 4.3.2 排序字段 排序字段用于指定附件的排序条件和顺序，可选择的属性有附件名称、上传时间和附件大小，根据排序字段指定顺序或者是逆序排序。 ### 4.3.3 文件来源 文件来源用于设置上传附件时的文件来源，可选值为金蝶云盘、相册、拍照、本地文件、录像。云之家app中默认支持这些选项，其他app有需要可以选择接入这些接口，详情见6.1。如不接入则调用手机自带的文件资源管理器，上传附件。 # 5 插件示例 ```java **public** **void** **afterCreateNewData**(EventObject e){ *//案例需求：将某个已存在附件字段上的附件，设置到当前页面的附件字段上。* Object[] attachmentIds = **new** Object[1]; *//实体bd_attachment的主键，可通过查询bd_attachment实体获取。* attachmentIds[0] = 607079090620535808L; *//第一个参数为附件字段的key* **this**.getModel().setValue("attachmentfield", attachmentIds); } ``` 详情请参考：[附件绑定单据接口](https://vip.kingdee.com/article/126693402527067136) # 6 功能介绍 ## 6.1 支持调用app客户端的上传接口上传文件 在苍穹移动端单据的开发过程中，会遇到需要调用APP提供的文件上传接口的场景，如选择文件、选择图片、选择相机等。开发者可以重写平台附件的方法，在重写方法中调用APP提供的接口完成文件上传。 支持重写的方法如下表，重写的方法对应下图的选项，用户点击选项后将调用对应方法。 | **方法名** | **选项名** | | --- | --- | | selectAttachmentFile | 金蝶云盘 | | choosePhotoImage | 相册 | | chooseCarmeaImage | 相机 | | video_startRecord | 录像 |  开发者可以在扩展js中，重写附件的选择文件、相册、相机、录像方法。用户在点击对应选项后，平台会自动调用上述方法，开发者只需将需要的数据传入callback中即可,平台接收到callback中的数据后，会将数据上传至服务器。扩展js使用请参考：[苍穹前端扩展能力之一，快来学习](https://vip.kingdee.com/article/235427929415677696) ### selectAttachmentFile(金蝶云盘) 一、如果需要引入外部js桥文件，如jsbridge.js，引入方式如下： ``` // index.js (function () { /**二开扩展PC端js * 注意：扩展的js默认是在平台的js前运行，如需扩展的js在平台的js后运行，需要在写在window.afterLoaded中，如下 * window.afterLoaded = function (){ * // your code * } */ window.initKDPlugin = function ({ loadjs, releaseResource }, callback) { // load插件需要的js桥文件 loadjs('jsbridge.js', () => { window.KDPluginExtend = { selectAttachmentFile: function (data = {}, callback) { // ...调用app的api后返回result数据 const result = [{ downloadUrl: "https://xxx/", fileExt: "doc", fileId: "6497fe85354fc40001c2c28b", fileName: "test.doc", fileSize: 573952, fileTime: 1687682693642, }] callback(result) } } callback({ success: true })//插件安装成功回调{success:false, error:'error info'} }) //如果要支持额外多个平台不支持的app,需要根据window.navigator.userAgent类型来设置最终window.KDPlugin的值 } })(); ``` 如果不需要引入外部js桥文件，则直接重写附件方法即可。 ``` // index.js (function () { /**二开扩展PC端js * 注意：扩展的js默认是在平台的js前运行，如需扩展的js在平台的js后运行，需要在写在window.afterLoaded中，如下 * window.afterLoaded = function (){ * // your code * } */ // 这个场景不需要在平台js运行后执行，可以直接写在这里 window.KDPluginExtend = { selectAttachmentFile: function (data = {}, callback) { // ...调用app的api后返回result数据 const result = [{ downloadUrl: "https://xxx/", fileExt: "doc", fileId: "abc123", fileName: "test.doc", fileSize: 573952, fileTime: 1687682693642, }] callback(result) } } })(); ``` **参数说明** | **参数** | **类型** | **是否必传** | **说明** | | --- | --- | --- | --- | | downloadUrl | String | 是 | 开发者需提供文件的下载链接，平台通过下载地址将文件下载后，上传至服务器 | | fileExt | String | 是 | 上传的文件类型，如doc、pdf等 | | fileId | String | 否 | 上传文件id，选填，默认随机生成 | | fileName | String | 是 | 上传文件名 | | fileSize | Number | 是 | 上传文件大小 | | fileTime | Number | 否 | 上传文件时间，选填，默认为当前时间 | ### choosePhotoImage(相册) 方式一：开发者提供downloadUrl下载链接，所需参数与金蝶云盘一致; 方式二：开发者提供图片File对象，支持金蝶云盘中的两种写法。这里主要展示传入参数，采用不加载外部js的写法如下 ``` // index.js (function () { /**二开扩展PC端js * 注意：扩展的js默认是在平台的js前运行，如需扩展的js在平台的js后运行，需要在写在window.afterLoaded中，如下 * window.afterLoaded = function (){ * // your code * } */ window.KDPluginExtend = { choosePhotoImage: function (data = {}, callback) { // ...调用app的api后返回result数据 const result = [{ fileData: File对象, fileExt: "image/png", size: 573952, }] callback(result) } } })(); ``` **参数说明** | **参数** | **类型** | **是否必传** | **说明** | | --- | --- | --- | --- | | fileData | File对象 | 是 | 开发者需提供图片的File对象 | | fileExt | String | 是 | 上传的文件类型File.type，如image/png | | size | Number | 是 | 上传文件大小 | ### chooseCarmeaImage（相机） 方式与参数和相册一致 ### video_startRecord（录像） 方式与参数和金蝶云盘一致 ## 6.2 附件下载功能 由于各app对下载支持的不同，平台对接主流app的下载，其他app为复制下载链接到剪切板。同时支持开发者在扩展js中，自己实现附件下载的逻辑。 ### 6.2.1各app的接入功能如下 1、云之家、钉钉app直接跳转到浏览器下载（V7.0.1及以上版本支持） 2、企业微信、飞书、welink提示用户点击右上角，从底部弹出的菜单中选择浏览器，从而跳转到浏览器下载（V7.0.1及以上版本支持） 3、其他app自动复制下载链接或者手动复制下载链接到剪切板，并手动打开浏览器粘贴下载链接下载（V6.0.1及以上版本支持） ### 6.2.2二开支持（V7.0.1及以上版本支持） 以下方式都需要在扩展js中使用，扩展js使用请参考：[苍穹前端扩展能力之一，快来学习](https://vip.kingdee.com/article/235427929415677696) **1、支持业务二开移动的附件下载** 开发者可以在扩展js中注册`downloadAttFile` 方法， 用户点击下载后，平台会自动调用上述方法，传入参数有附件下载链接、名称、类型、大小、创建时间。后续附件下载逻辑由该方法控制。 （1）如果需要引入app的sdk，写法如下： ``` (function () { window.initKDPlugin = function ({ loadjs, releaseResource }, callback) { // load插件需要的js桥文件 loadjs('selfAppSDK.js', () => { window.KDPluginExtend = { downloadAttFile: function (data = {}) { // fileDownloadUrl:下载链接；fileName：附件名称，fileType：附件文件类型，fileSize：附件大小，fileTime：附件时间 const { fileDownloadUrl, fileName, fileType, fileSize, fileTime} = data //.... 自定义下载逻辑 } } callback({ success: true })//插件安装成功回调{success:false, error:'error info'} }) } })(); ``` （2）如果不需要引入外部js桥文件，则直接注册方法即可。 ``` // index_m.js (function () { /**二开扩展移动端js * 注意：扩展的js默认是在平台的js前运行，如需扩展的js在平台的js后运行，需要在写在window.afterLoaded中，如下 * window.afterLoaded = function (){ * // your code * } */ window.KDPluginExtend = { downloadAttFile: function (data = {}) { // fileDownloadUrl:下载链接；fileName：附件名称，fileType：附件文件类型，fileSize：附件大小，fileTime：附件时间 const { fileDownloadUrl, fileName, fileType, fileSize, fileTime} = data //.... 自定义下载逻辑 } } })(); ``` **2、支持将下载方式设置为自动复制下载链接** `window.mobAttDownConfig = {copyType: "auto"}` **3、支持将下载方式设置为提示点击右上角，选择浏览器** 提示的蒙层样式是全局样式，开发者可以进行修改。 `window.mobAttDownConfig = {openBrowserTip:"true"}` **4、支持将下载方式设置为手动复制下载链接** `window.mobAttDownConfig = {copyType: "linkCopy"}` ## 6.3 附件预览支持自定义预览方式 业务可以在自定义预览中配置自己需要二开的文件类型。  ## 6.4 云之家app附件预览，切换成苍穹的预览方式 在扩展js中设置以下代码可以切换: ``` window.closeYzjPreview = true ``` 扩展js使用请参考：[苍穹前端扩展能力之一，快来学习](https://vip.kingdee.com/article/235427929415677696)