BPMN.js 属性面板可以配置审批人、按钮、表单和数据权限但不应该把组织用户、表单结构和权限明细全部塞进 BPMN XML。更稳妥的设计是模型保存稳定引用与策略业务服务保存可变目录数据运行时重新解析并执行授权必要时保存最小证据快照。这类扩展真正解决的不是“增加几个输入框”而是建立一套跨设计器、流程引擎和业务系统都能长期演进的模型协议。实现时应把 Properties Provider、moddle、Vue 业务弹窗、CommandStack、后端校验和运行时解析看成一条完整链路。图 1 属性面板编辑模型引用和策略业务弹窗负责复杂选择后端负责发布校验、运行时解析与审计。一、先回答最重要的问题配置应该存在哪里审批配置可以分为三类数据数据类型示例推荐存储位置流程语义审批策略、表单引用、按钮策略、字段权限引用BPMN XML / moddle 扩展业务目录用户、部门、角色、表单版本、按钮定义组织、表单和权限服务运行证据实际审批人、按钮授权结果、字段权限快照任务上下文或审计存储BPMN XML 适合保存“如何找到和解释配置”不适合保存完整用户资料、整张表单 Schema 或动态权限结果。否则人员调岗、表单升级和权限调整都会迫使流程模型重新发布。建议只保存稳定 ID、解析策略和版本约束。例如审批人保存policyKey与参数表单保存formKey与版本策略按钮保存buttonPolicyKey字段权限保存规则引用或小型规则快照。1. 企业审批属性配置的总体分层一套可维护的属性配置通常包含五层BPMN.js Modeler选中节点、导入导出 XML、触发 CommandStackProperties Provider按元素类型提供属性分组和编辑项企业 moddle定义 XML 中的属性、扩展元素和命名空间Vue Bridge打开审批人、表单、按钮和权限等复杂弹窗后端服务发布校验、引用解析、权限授权、快照与审计。属性面板只是编辑器不是业务数据库也不是可信授权端。浏览器里的只读、隐藏和禁用只能改善体验生产运行时仍要由后端重新计算审批人与操作权限。二、用 moddle 建立稳定的企业模型协议企业属性不要混进 Camunda 或其他引擎命名空间应使用独立命名空间例如ent:。这样可以把“企业审批语义”与“引擎执行属性”分开便于适配 Camunda 7、Camunda 8、Flowable 或其他内核。{name:Enterprise,prefix:ent,uri:https://example.com/schema/bpmn/enterprise/1.0,types:[{name:ApprovalConfig,extends:[bpmn:UserTask],properties:[{name:assigneePolicyKey,isAttr:true,type:String},{name:formKey,isAttr:true,type:String},{name:buttonPolicyKey,isAttr:true,type:String}]}]}模型协议至少要有四项治理能力schemaVersion标识企业扩展协议版本迁移器导入旧 XML 时转换字段和默认值未知扩展保留普通保存不能静默删除暂不识别的数据发布校验检查引用是否存在、可用且属于当前租户。三、Properties Provider 只负责编辑模型新版 Properties Panel 通过getGroups(element)返回属性分组。Provider 应根据元素类型和设计模式添加企业配置项修改时调用modeling.updateProperties()或commandStack.execute()。classApprovalPropertiesProvider{constructor(propertiesPanel){propertiesPanel.registerProvider(500,this);}getGroups(element){returngroups{if(is(element,bpmn:UserTask)){groups.push(buildApprovalGroup(element));}returngroups;};}}Provider 不应直接查询组织树或完整表单列表。属性面板会频繁刷新如果每次刷新都调用后端就会造成请求风暴、焦点丢失和侧栏闪烁。目录数据可以缓存复杂选择应交给 Vue 弹窗。四、审批人配置为什么要建模成策略审批人不是一个字符串而是一套运行时解析策略。常见策略包括指定用户、角色或部门岗位发起人、发起人部门负责人或逐级负责人根据表单字段选择人员由上一个节点或业务服务动态计算发起时或任务到达时由用户选择。模型可以保存如下结构{policyKey:deptLeader,params:{level:2,from:initiatorDept},emptyPolicy:error,duplicatePolicy:skip}必须明确解析时点、无人可办、重复审批人、审批人是发起人和组织变更等边界。会签还要保存串行或并行、完成比例、拒绝策略和剩余任务处理方式不能只保存一个multiInstancetrue。1. 按钮配置不是前端按钮数组“同意、拒绝、退回、转办、加签、暂存”等按钮会触发不同的任务命令、权限检查和审计要求。BPMN XML 中应保存按钮策略引用或动作白名单而不是颜色、CSS 类名和前端事件函数。配置内容应放在模型中应放在业务服务中动作代码approve、reject、rollback动作名称、图标、排序可用条件表达式或策略引用策略实现与版本意见要求必填、选填、隐藏文案、提示与国际化后续行为提交、退回、转办命令处理器和审计逻辑运行时必须由后端根据当前用户、任务状态和业务数据重新计算按钮集合。即使前端隐藏了“退回”也不能认为接口已经安全。2. 表单绑定和数据权限怎样配合表单绑定至少要保存formKey、版本策略和渲染模式。版本策略通常有三种固定版本、始终使用最新兼容版本、启动实例时冻结版本。审批流程更适合在实例启动或任务创建时冻结关键版本避免同一实例前后看到不同字段。数据权限至少包含四个维度字段可见用户能否看到字段字段可编辑用户能否修改字段数据范围子表、关联数据和附件能看到哪些记录动作约束提交前校验、脱敏、导出和打印限制。权限规则可以只保存permissionPolicyKey也可以在extensionElements中保存小型规则快照。规则经常变化且需要统一治理时使用引用流程必须长期复现当时规则时保存版本或快照。不要在 XML 中复制完整表单 Schema。五、复杂选择器如何与 Vue 弹窗连接组织树、表单设计器和字段权限矩阵不适合挤进窄侧栏。推荐在属性项中显示摘要与“配置”按钮再通过可注入 Bridge 打开 Vue 弹窗。图 2 Provider 只传递当前配置Vue 弹窗返回结构化结果模型修改统一进入 CommandStack。exportinterfaceDesignerBridge{selectAssignee(input:AssigneePolicy):PromiseAssigneePolicy|null;selectForm(input:FormBinding):PromiseFormBinding|null;configureButtons(input:ButtonPolicy):PromiseButtonPolicy|null;configurePermission(input:PermissionPolicy):PromisePermissionPolicy|null;}弹窗确认后应一次性提交结构化配置取消时不修改模型。不要用大量window.showXxxDialog和全局回调连接属性面板否则多设计器实例、异步取消和自动化测试都会变得困难。六、运行时如何解析配置并保存证据设计时保存的是策略任务到达时需要把策略解析为可执行上下文实际办理人、表单版本、可用按钮、字段权限和数据范围。图 3 运行时从模型读取引用通过业务服务解析后形成任务上下文并按审计要求保存快照。推荐统一输出TaskContextinterfaceTaskContext{assignees:string[];form:{key:string;version:string};actions:string[];fieldPermissions:Recordstring,hidden|read|edit;resolvedAt:string;policyVersions:Recordstring,string;}以下情况通常需要保存运行快照审批人依赖组织关系、权限策略可能更新、表单版本可变、流程需要审计复现或任务会长期挂起。快照应保存解析结果与版本证据不要复制无关个人资料。七、校验、安全和版本迁移缺一不可设计时校验建议分三层输入校验必填、格式、枚举和表达式语法模型校验UserTask 是否绑定审批策略、表单字段是否存在、会签配置是否完整发布校验后端按租户、状态和版本重新检查所有引用。安全上要遵守三个原则前端隐藏不等于授权模型 XML 属于不可信输入运行时按钮和字段权限必须重新计算。导入外部 XML 时还要限制扩展属性、脚本和表达式的可用范围。升级 Properties Panel、bpmn-js 或引擎 Provider 时不能只看页面能否打开。必须比对导入后的业务对象、导出的 XML、未知扩展保留、运行解析结果和旧模型迁移结果。八、从当前项目出发怎样渐进改造当前项目已经有独立的ych-bpm-designer并集成审批人设置、变量选择、表单选择、按钮列表、字段权限、任务时限和脚本等业务组件。现有能力可以保留不需要一次性重写。建议按以下顺序改造盘点当前 XML 中所有自定义字段和命名空间建立旧模型导入、导出和运行回归样例新增独立ent:moddle 协议与schemaVersion用 Bridge 适配现有 Vue 弹窗逐步替换全局回调按审批人、表单、按钮、权限顺序迁移 Provider建立统一 TaskContext 解析器与后端发布校验最后升级依赖并保持新旧模型并行兼容一段时间。云程低代码开发平台可以复用已有审批配置弹窗把长期演进重点放在模型协议、Bridge、运行时解析和版本治理上。九、上线检查清单企业属性是否使用独立命名空间并带schemaVersionXML 是否只保存稳定引用、策略和必要快照所有模型修改是否进入 CommandStack复杂选择是否通过可注入 Bridge 打开 Vue 弹窗审批人无人可办、重复和会签边界是否明确按钮是否由后端重新授权并记录审计表单版本是否在明确时点冻结字段可见、可编辑、数据范围和动作约束是否分开发布时是否按租户和状态校验所有引用旧模型、未知扩展、XML 与运行结果是否有回归测试十. 如果只记住五句话属性面板编辑模型不充当业务数据库企业属性使用独立 moddle 命名空间复杂选择放进 Vue 弹窗通过 Bridge 与 Provider 连接所有修改进入 CommandStack所有发布经过可信后端运行时重新解析并授权需要审计时保存最小证据快照。做到这些审批人、按钮、表单和数据权限才会成为可复用、可迁移、可审计的平台能力而不是绑死设计器和流程引擎的私有字段。
BPMN.js 属性面板可以配置审批人、按钮、表单和数据权限但不应该把组织用户、表单结构和权限明细全部塞进 BPMN XML。更稳妥的设计是模型保存稳定引用与策略业务服务保存可变目录数据运行时重新解析并执行授权必要时保存最小证据快照。这类扩展真正解决的不是“增加几个输入框”而是建立一套跨设计器、流程引擎和业务系统都能长期演进的模型协议。实现时应把 Properties Provider、moddle、Vue 业务弹窗、CommandStack、后端校验和运行时解析看成一条完整链路。图 1 属性面板编辑模型引用和策略业务弹窗负责复杂选择后端负责发布校验、运行时解析与审计。一、先回答最重要的问题配置应该存在哪里审批配置可以分为三类数据数据类型示例推荐存储位置流程语义审批策略、表单引用、按钮策略、字段权限引用BPMN XML / moddle 扩展业务目录用户、部门、角色、表单版本、按钮定义组织、表单和权限服务运行证据实际审批人、按钮授权结果、字段权限快照任务上下文或审计存储BPMN XML 适合保存“如何找到和解释配置”不适合保存完整用户资料、整张表单 Schema 或动态权限结果。否则人员调岗、表单升级和权限调整都会迫使流程模型重新发布。建议只保存稳定 ID、解析策略和版本约束。例如审批人保存policyKey与参数表单保存formKey与版本策略按钮保存buttonPolicyKey字段权限保存规则引用或小型规则快照。1. 企业审批属性配置的总体分层一套可维护的属性配置通常包含五层BPMN.js Modeler选中节点、导入导出 XML、触发 CommandStackProperties Provider按元素类型提供属性分组和编辑项企业 moddle定义 XML 中的属性、扩展元素和命名空间Vue Bridge打开审批人、表单、按钮和权限等复杂弹窗后端服务发布校验、引用解析、权限授权、快照与审计。属性面板只是编辑器不是业务数据库也不是可信授权端。浏览器里的只读、隐藏和禁用只能改善体验生产运行时仍要由后端重新计算审批人与操作权限。二、用 moddle 建立稳定的企业模型协议企业属性不要混进 Camunda 或其他引擎命名空间应使用独立命名空间例如ent:。这样可以把“企业审批语义”与“引擎执行属性”分开便于适配 Camunda 7、Camunda 8、Flowable 或其他内核。{name:Enterprise,prefix:ent,uri:https://example.com/schema/bpmn/enterprise/1.0,types:[{name:ApprovalConfig,extends:[bpmn:UserTask],properties:[{name:assigneePolicyKey,isAttr:true,type:String},{name:formKey,isAttr:true,type:String},{name:buttonPolicyKey,isAttr:true,type:String}]}]}模型协议至少要有四项治理能力schemaVersion标识企业扩展协议版本迁移器导入旧 XML 时转换字段和默认值未知扩展保留普通保存不能静默删除暂不识别的数据发布校验检查引用是否存在、可用且属于当前租户。三、Properties Provider 只负责编辑模型新版 Properties Panel 通过getGroups(element)返回属性分组。Provider 应根据元素类型和设计模式添加企业配置项修改时调用modeling.updateProperties()或commandStack.execute()。classApprovalPropertiesProvider{constructor(propertiesPanel){propertiesPanel.registerProvider(500,this);}getGroups(element){returngroups{if(is(element,bpmn:UserTask)){groups.push(buildApprovalGroup(element));}returngroups;};}}Provider 不应直接查询组织树或完整表单列表。属性面板会频繁刷新如果每次刷新都调用后端就会造成请求风暴、焦点丢失和侧栏闪烁。目录数据可以缓存复杂选择应交给 Vue 弹窗。四、审批人配置为什么要建模成策略审批人不是一个字符串而是一套运行时解析策略。常见策略包括指定用户、角色或部门岗位发起人、发起人部门负责人或逐级负责人根据表单字段选择人员由上一个节点或业务服务动态计算发起时或任务到达时由用户选择。模型可以保存如下结构{policyKey:deptLeader,params:{level:2,from:initiatorDept},emptyPolicy:error,duplicatePolicy:skip}必须明确解析时点、无人可办、重复审批人、审批人是发起人和组织变更等边界。会签还要保存串行或并行、完成比例、拒绝策略和剩余任务处理方式不能只保存一个multiInstancetrue。1. 按钮配置不是前端按钮数组“同意、拒绝、退回、转办、加签、暂存”等按钮会触发不同的任务命令、权限检查和审计要求。BPMN XML 中应保存按钮策略引用或动作白名单而不是颜色、CSS 类名和前端事件函数。配置内容应放在模型中应放在业务服务中动作代码approve、reject、rollback动作名称、图标、排序可用条件表达式或策略引用策略实现与版本意见要求必填、选填、隐藏文案、提示与国际化后续行为提交、退回、转办命令处理器和审计逻辑运行时必须由后端根据当前用户、任务状态和业务数据重新计算按钮集合。即使前端隐藏了“退回”也不能认为接口已经安全。2. 表单绑定和数据权限怎样配合表单绑定至少要保存formKey、版本策略和渲染模式。版本策略通常有三种固定版本、始终使用最新兼容版本、启动实例时冻结版本。审批流程更适合在实例启动或任务创建时冻结关键版本避免同一实例前后看到不同字段。数据权限至少包含四个维度字段可见用户能否看到字段字段可编辑用户能否修改字段数据范围子表、关联数据和附件能看到哪些记录动作约束提交前校验、脱敏、导出和打印限制。权限规则可以只保存permissionPolicyKey也可以在extensionElements中保存小型规则快照。规则经常变化且需要统一治理时使用引用流程必须长期复现当时规则时保存版本或快照。不要在 XML 中复制完整表单 Schema。五、复杂选择器如何与 Vue 弹窗连接组织树、表单设计器和字段权限矩阵不适合挤进窄侧栏。推荐在属性项中显示摘要与“配置”按钮再通过可注入 Bridge 打开 Vue 弹窗。图 2 Provider 只传递当前配置Vue 弹窗返回结构化结果模型修改统一进入 CommandStack。exportinterfaceDesignerBridge{selectAssignee(input:AssigneePolicy):PromiseAssigneePolicy|null;selectForm(input:FormBinding):PromiseFormBinding|null;configureButtons(input:ButtonPolicy):PromiseButtonPolicy|null;configurePermission(input:PermissionPolicy):PromisePermissionPolicy|null;}弹窗确认后应一次性提交结构化配置取消时不修改模型。不要用大量window.showXxxDialog和全局回调连接属性面板否则多设计器实例、异步取消和自动化测试都会变得困难。六、运行时如何解析配置并保存证据设计时保存的是策略任务到达时需要把策略解析为可执行上下文实际办理人、表单版本、可用按钮、字段权限和数据范围。图 3 运行时从模型读取引用通过业务服务解析后形成任务上下文并按审计要求保存快照。推荐统一输出TaskContextinterfaceTaskContext{assignees:string[];form:{key:string;version:string};actions:string[];fieldPermissions:Recordstring,hidden|read|edit;resolvedAt:string;policyVersions:Recordstring,string;}以下情况通常需要保存运行快照审批人依赖组织关系、权限策略可能更新、表单版本可变、流程需要审计复现或任务会长期挂起。快照应保存解析结果与版本证据不要复制无关个人资料。七、校验、安全和版本迁移缺一不可设计时校验建议分三层输入校验必填、格式、枚举和表达式语法模型校验UserTask 是否绑定审批策略、表单字段是否存在、会签配置是否完整发布校验后端按租户、状态和版本重新检查所有引用。安全上要遵守三个原则前端隐藏不等于授权模型 XML 属于不可信输入运行时按钮和字段权限必须重新计算。导入外部 XML 时还要限制扩展属性、脚本和表达式的可用范围。升级 Properties Panel、bpmn-js 或引擎 Provider 时不能只看页面能否打开。必须比对导入后的业务对象、导出的 XML、未知扩展保留、运行解析结果和旧模型迁移结果。八、从当前项目出发怎样渐进改造当前项目已经有独立的ych-bpm-designer并集成审批人设置、变量选择、表单选择、按钮列表、字段权限、任务时限和脚本等业务组件。现有能力可以保留不需要一次性重写。建议按以下顺序改造盘点当前 XML 中所有自定义字段和命名空间建立旧模型导入、导出和运行回归样例新增独立ent:moddle 协议与schemaVersion用 Bridge 适配现有 Vue 弹窗逐步替换全局回调按审批人、表单、按钮、权限顺序迁移 Provider建立统一 TaskContext 解析器与后端发布校验最后升级依赖并保持新旧模型并行兼容一段时间。云程低代码开发平台可以复用已有审批配置弹窗把长期演进重点放在模型协议、Bridge、运行时解析和版本治理上。九、上线检查清单企业属性是否使用独立命名空间并带schemaVersionXML 是否只保存稳定引用、策略和必要快照所有模型修改是否进入 CommandStack复杂选择是否通过可注入 Bridge 打开 Vue 弹窗审批人无人可办、重复和会签边界是否明确按钮是否由后端重新授权并记录审计表单版本是否在明确时点冻结字段可见、可编辑、数据范围和动作约束是否分开发布时是否按租户和状态校验所有引用旧模型、未知扩展、XML 与运行结果是否有回归测试十. 如果只记住五句话属性面板编辑模型不充当业务数据库企业属性使用独立 moddle 命名空间复杂选择放进 Vue 弹窗通过 Bridge 与 Provider 连接所有修改进入 CommandStack所有发布经过可信后端运行时重新解析并授权需要审计时保存最小证据快照。做到这些审批人、按钮、表单和数据权限才会成为可复用、可迁移、可审计的平台能力而不是绑死设计器和流程引擎的私有字段。
