本页用于说明业务流 JS 插件的配置方式、示例场景与基础实现方法。

插件配置步骤

1. 在用一个示例进行快速上手之前，首先要知道插件的配置方式

2. 当我们想配置业务流的插件时，首先要在【管理后台】的【定制开发工具】中，找到【自定义插件】，并点击【新建】。

   

3. 配置插件的基本信息。这里需要注意选择支持的终端类型，以及选择我们需要的插件类型，比如我们想使用业务流JS插件，那么我们就选择它。对于移动端来说，我们除了通过WEB IDE来编写插件以外，还可以通过上传压缩包的形式来配置插件，这里我们以WEB IDE创建插件为例。

   

4. 配置插件的基本信息以后，可以选择”公共模板“、“历史模板”或“使用空模板”。“公共模板”和“历史模板”历史模板都是以前创建好的，我们可以选择以后根据自己的需求来进行简单的修改，当我们选择“使用空模板”，那么我们就需要自己来编写插件内容了。

   

5. 如下图我们进行插件内容的编写，并且需要指定插件的入口，例如：plugins/testplugin.js，配置完成以后点击“保存”或“发布”。

   
   

6. 编写完成以后，我们需要在对应的流程的【高级配置】中找到【自定义插件配置】，并选择自己需要使用的插件即可。

   

简单需求说明

1. 假设现在存在一个需求，即如果编辑内容配置的是普通布局，在没有必填或必填已有数据的情况下，不弹出编辑内容弹窗，直接完成任务。这种情况下是没办法在点击"完成"时，对表单数据进行二次确认的。因此基于上述场景，有的人就会提出需求，在点击"完成"时，希望可以强制弹出编辑内容弹窗/页面。

代码实现示例

module.exports = function (context, pluginService, pluginParam) {
    return {
        apply() {
            let self = this;
            return [{
                /**
                 * 设置外部注入的暴露给插件的方法
                 * 业务流有表单时，是否强制进入表单页面
                 */
                event: "flow.bpm.edit.form.render.before",
                functional: async function (context, options) {
                    return Promise.resolve({
                        // 如果返回值true时，强制进入表单页
                        forceShowEditForm: true,
                    });
                }
            }]
        }
    }
}

实现效果展示

下图中可以看到，配置该插件以后，即使在如下情况：①默认布局下有必填字段，但是必填字段有值，②默认布局下没有必填字段，③流程布局下没有从对象 依然会强制弹出编辑内容表单/页面。

插件结构说明

1. 代码主要围绕event和functional来实现
2. event：对于不同的需求要用到不同的event，例如当前示例需求中，需要在业务流中强制弹出编辑内容弹窗/页面，因此这里的event选择的是flow.bpm.edit.form.render.before
3. functional：在functional中，是当前事件下对应的处理函数，即我们需要实现的具体功能，这里我们需要强制弹出编辑内容弹窗/页面，因此在示例代码的functional中，需要对forceShowEditForm进行处理并返回

示例代码下载

业务流JS插件demo [点击下载]