当前位置：首页 > news >正文

泛微Ecology9实现流程界面隐藏按钮

news 2025/10/28 8:59:48

1. 前言

在泛微Ecology9系统中，流程界面默认显示多个操作按钮。为满足特定业务需求，需要隐藏部分按钮。本文将介绍三种实现方法，分别针对"提交"、"保存"、"转发"三个按钮进行演示。

首先我先建了个平白无奇的测试流程，我们可以看到目前流程上方存在四个按钮：

经过我的调研，目前一共有三种方式来实现这个功能：1、代码块CSS样式实现、2、编写ecode代码实现：复写WeaReqTop组件：overwritePropsFnQueueMapSet 3、也是ecode实现：复写API请求入参和返参：rewriteApiDataQueueSet；现在我分别用三种方式来隐藏三个不同的流程按钮：提交、保存、转发来作为测试

2. 实现方案对比

方案一：CSS样式隐藏法（推荐用于简单场景）

实现思路：通过CSS选择器直接隐藏目标按钮元素

适用场景：简单的按钮隐藏需求，无需复杂逻辑判断

操作步骤：

登录系统后台，进入流程引擎管理界面
定位目标流程，进入流程设计界面
在代码块区域添加CSS样式代码
保存配置并测试效果


<style type="text/css">.ant-menu-item:has(.wea-right-menu-item span[title="提交"]) {display: none !important;}button[title="提交"] {display: none !important;}
</style>

保存之后，即可实现隐藏效果

方案二：ECode组件复写法（推荐用于复杂条件控制）

实现思路：复写WeaReqTop组件：overwritePropsFnQueueMapSet

通过复写WeaReqTop组件的属性，动态控制按钮显示

对于ecode腹泻我们可以先打印出参数查看，看看有啥参数可以修改达到目的：

核心代码

ecodeSDK.overwritePropsFnQueueMapSet('WeaReqTop', {fn: (newProps) => {// 环境检查if (!ecodeSDK.checkLPath('/spa/workflow/static4form/index.html')) return;if (!WfForm) return;// 流程节点验证let baseInfo = WfForm.getBaseInfo();let workflowId = baseInfo.workflowid;let nodeId = baseInfo.nodeid;// 仅对特定流程生效（测试环境workflowId: 1537）这里需要换成你自己的流程id和节点idif (workflowId !== 1537 || nodeId !== 2622) return;// 按钮处理逻辑var buttons = newProps.buttons;console.log(buttons);// 隐藏保存按钮buttons = buttons.filter(button => button.props.title !== '保存');newProps.buttons = buttons;},order: 1,desc: '隐藏保存按钮'
});

方案三：ECode API复写法（推荐基于后端数据控制）

实现思路：

复写API请求入参和返参：rewriteApiDataQueueSet，通过拦截API请求的入参和返参，间接控制按钮显示状态

核心代码：

ecodeSDK.rewriteApiDataQueueSet({fn: (url, params, data) => {var workflowids='87029,134021'var workflowArray = workflowids.split(',');  var workflowidsByDelete = '134021,131021,65523,43021';var workflowArrayByDelete = workflowidsByDelete.split(','); var workflowid = params.workflowid+''if (workflowArray.includes(workflowid)){var value = '1'} // 判断流程是否是需要隐藏的流程if (workflowArrayByDelete.includes(workflowid)){var valueByDelete = '1'}var allow = window.location.hash.indexOf('#/main/workflow/req') >= 0 && (url.indexOf('/api/workflow/reqform/rightMenu') >= 0 ||url.indexOf('/api/workflow/reqform/loadForm') >=0 )&& (params.workflowid=='4061' || params.workflowid=='4062' || value=='1')if (!allow) return data;if (data.rightMenus && data.rightMenus.length > 0 && valueByDelete!='1') {data.rightMenus = data.rightMenus.filter((item,index)=>{return item.menuName!='转发'})}return data;},desc: '拦截接口参数，同一个接口会在多个页面请求，需注意路径的判断'
});

目前上诉代码都是使用按钮名称汉字匹配，也可以改为ecId匹配，原理都是一样的；

方案选择建议

方案	适用场景	优点	缺点
CSS样式法	简单隐藏需求	实现简单、维护成本低	可能被绕过，灵活性差
组件复写法	复杂条件控制	灵活性高，可基于流程节点控制	实现复杂度中等
API复写法	基于数据条件控制	控制粒度细，稳定性好	需要了解API结构