流程编辑器bpmnjs的改造3:加一个审批人的设置

news2025/1/13 10:04:56

默认的设计器有代理人、候选用户和候选组,但是并不能满足实际的业务需求,我们需要对它进行改造,使得我们能够按照自定义的规则来生成用户任务节点的审批人。

1、在bpmnjs里面加一个审批人的输入部件

打开resources/properties-panel/provider/activiti/parts/UserTaskProps.js,加入

module.exports = function(group, element, translate) {

if (is(element, 'activiti:Assignable')) {

// Approver

group.entries.push(entryFactory.textField({

id : 'approver',

description : translate('Specify approvers. If there are multiple approvers, enter the candidate user list.'),

label : translate('Approver'),

modelProperty : 'approver'

}));

红字是我加入的内容,一个输入框。

打开resources/activiti.json,搜索”assignee“,然后照着它抄一个在上面:

{

"name": "approver",

"isAttr": true,

"type": "String"

},

接着打开resources/factory/TextInputEntryFactory.js,加入:

if(resource.id == 'approver'){ //如果为审批人

resource.html =

'<label for="camunda-' + escapeHTML(resource.id) + '" ' +

(canBeDisabled ? 'data-disable="isDisabled" ' : '') +

(canBeHidden ? 'data-show="isHidden" ' : '') +

(dataValueLabel ? 'data-value="' + escapeHTML(dataValueLabel) + '"' : '') + '>'+ escapeHTML(label) +'</label>' +

'<div class="bpp-field-wrapper" ' +

(canBeDisabled ? 'data-disable="isDisabled"' : '') +

(canBeHidden ? 'data-show="isHidden"' : '') +

'>' +

'<div class="left-input-disabled">' +

'<input id="camunda-' + escapeHTML(resource.id) + '" type="text" name="' + escapeHTML(options.modelProperty) + '" ' +

(canBeDisabled ? 'data-disable="isDisabled"' : '') +

(canBeHidden ? 'data-show="isHidden"' : '') +

' style="width:80%;float:left"/>' +

'</div>'+

'<input type="button" class="candidate-select" value="选择" οnclick="taskApproverSelect(this)" style="width:18%;float:right"/>' + //点击方法

'</div>';

}

判断当生成审批人的对象时候,在后面给它加一个按钮。打开translationsGerman.js,把英文对应着转换一下。

在打开bpmnjs目录下打开cmd,输入grunt,等待编译完成,然后在浏览器打开设计器,弄一个用户节点过去,可以看到一个新的属性在里面了,大概长这样。

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/156472.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

MD5算法全解析

前言 这段时间刚好正在做软件安全的实验和课设&#xff0c;学习了各种加密算法&#xff0c;比如对称加密算法的DES,AES&#xff1b;非对称加密算法的RSA&#xff1b;再如今天要讲的主角-单向加密算法的MD5。为什么这么多算法&#xff0c;MD5成为了今天的猪脚呢&#xff1f;&am…

nexus raw 仓库代理(node-sass 内网下载问题)

问题背景 内网环境中使用 node 构建项目&#xff0c;项目中依赖了 node-sass&#xff0c;环境自动下载 node-saas 失败&#xff08;内网&#xff09;。 下面是构建 node-sass 的错误代码&#xff1a; [5/5] Building fresh packages... error /workspace/node_modules/node-…

FreeRTOS-消息队列详解

✅作者简介&#xff1a;嵌入式入坑者&#xff0c;与大家一起加油&#xff0c;希望文章能够帮助各位&#xff01;&#xff01;&#xff01;&#xff01; &#x1f4c3;个人主页&#xff1a;rivencode的个人主页 &#x1f525;系列专栏&#xff1a;玩转FreeRTOS &#x1f4ac;保持…

burpsuite安装HTTPS证书

burpsuite安装HTTPS证书1.Burpsuite介绍1.1.Burpsuite安装2.https证书介绍2.1.证书下载步骤2.1.1.打开burp软件2.1.2.开启代理2.1.3.下载证书2.1.4.证书2.2.证书安装步骤2.2.1.打开证书页2.2.2.导入证书2.2.3.确认安装2.3.抓包测试1.Burpsuite介绍 Burp Suite 是用于攻击web 应…

OpenStack 扩容cpu、内存

创建要扩容的实例类型&#xff0c;也就是flavor获取要扩容的server id根据命令 nova list获取刚才创建好的实例类型id根据命令 nova flavor-list执行扩容的命令nova resize <server-id> <flavor-id>举例&#xff1a;nova resize 06be1c3d-bcfb-4038-ae28-f8e7ac0a2…

【AI奇技淫巧】使用Optuna进行机器学习模型调参

使用Optuna进行机器学习模型调参Optuna简介框架特点安装方式举个例子高级配置搜索方式分支&#xff08;Branches&#xff09;与循环&#xff08;Loops&#xff09;分布式优化命令行界面用户定义属性将用户定义属性添加到Study将用户属性添加到Trial中对无望的Trial进行剪枝&…

大前端—回顾2022年明星项目,展望2023发展前沿

导读 | 2022年是艰难的一年&#xff0c;不仅有互联网的寒冬、还有新冠疫情的洗礼。但是似乎这一切都阻挡不了JavaScript的内卷&#xff0c;一年不长不短的时间中&#xff0c;JavaScript从创新、性能、功能等多维度深度进化&#xff0c;给前端带来了诸多惊喜。本文基于github上流…

(十三)并发集合——ConcurrentSkipListMap/Set

ConcurrentSkipListMapConcurrentSkipListMap与TreeMap对应&#xff0c;相当于线程安全的TreeMap&#xff0c;key有序&#xff0c;TreeMap基于红黑树&#xff0c;ConcurrentSkipListMap基于跳表。无锁链表的问题用跳表而不用红黑树是因为目前计算机领域还未找到一种高效的、作用…

LabVIEW测试和调试Web服务

LabVIEW测试和调试Web服务发布Web服务至终端前&#xff0c;需要测试HTTP方法VI是否按照预期与客户端进行通信。可直接从LabVIEW项目将Web服务置于调试服务器上&#xff0c;从而允许客户端发送请求至HTTP方法VI。调试服务器提供类似沙盒的环境。1. (Windows) 右键单击我的电脑下…

JVM- 第二章-类加载子系统

类加载子系统 2. 类加载子系统 2.1. 内存结构概述2.2. 类加载器与类的加载过程 加载阶段链接阶段初始化阶段 2.3. 类加载器分类 2.3.1. 虚拟机自带的加载器2.3.2. 用户自定义类加载器 2.4. ClassLoader的使用说明2.5. 双亲委派机制2.6. 其他 2. 类加载子系统 2.1. 内存结构…

nacos

文章目录1、认识和安装nacos&#xff08;单机安装&#xff09;1.1、下载安装包1.2、解压1.3、端口配置1.4、启动1.5、访问2、nacos快速入门2.1、在父工程中添加依赖2.2、注释掉服务中原有的eureka依赖2.3、添加nacos的客户端依赖2.4、修改配置文件2.5、启动并测试2.6、总结3、n…

19、Java并发 Java wait() 和 notify() 方法

大家有没有发现&#xff0c;其实 「 一文秒懂 」 系列讲述的都是多线程并发开发的问题。这个话题太大了&#xff0c;估计没有上百篇文章都解释不清楚。 本文&#xff0c;我们来讲解下 Java 并发中的基础的基础&#xff0c;核心的核心&#xff0c;Java 并发编程中的最基本的机制…

为什么 APISIX Ingress 是比 Ingress NGINX 更好的选择?

作者容鑫&#xff0c;API7.ai 云原生技术工程师&#xff0c;Apache APISIX Committer。 本文将会对比两个比较流行的 Ingress controller 实现&#xff0c;希望能对读者进行 Ingress controller 选型中有所帮助。 Ingress NGINX 是 Kubernetes 社区实现的 Ingress controller&a…

高通量代谢组学四路筛选法,揭秘“神药”二甲双胍延长寿命的机制

百趣代谢组学分享—研究背景 目前据统计中国糖尿病患者人数达9700万以上&#xff0c;数量达到世界第一。这其中2型糖尿病占到了90%以上。二甲双胍是目前治疗2型糖尿病的一线“明星”药物&#xff0c;因其较少出现低血糖和体重增加副作用而受到广大患者和医生的青睐。代谢组学文…

Replicate Brogaard Stock Volatility Decomposition

文章目录IntroductionData and SampleDownload DataClean DataExtract Estimation Unit and Set Global VariablesImplement Brogaard DecompositionEstimate VAR Coefficients, Matrix BBB, ϵt\epsilon_tϵt​, Σe\Sigma_eΣe​, and Σϵ\Sigma_\epsilonΣϵ​Estimate 15-…

常用的前端大屏 适配方案

方案实现方式优点缺点vm vh1.按照设计稿的尺寸&#xff0c;将px按比例计算转为vw和vh1.可以动态计算图表的宽高&#xff0c;字体等&#xff0c;灵活性较高 2.当屏幕比例跟 ui 稿不一致时&#xff0c;不会出现两边留白情况1.每个图表都需要单独做字体、间距、位移的适配&#xf…

【寒假每日一题】AcWing 4509. 归一化处理

目录 一、题目 1、原题链接 2、题目描述 二、解题报告 1、思路分析 2、时间复杂度 3、代码详解 三、知识风暴 1、cmath头文件相关函数 2、cout大法 一、题目 1、原题链接 4509. 归一化处理 - AcWing题库 2、题目描述 在机器学习中&#xff0c;对数据进行归一化处理…

【C++】list用法简单模拟实现

文章目录1. list的介绍及使用1.1 list基本概念1.2 list的构造1.3 list的迭代器使用1.4 list 赋值和交换1.5 list 插入和删除1.6 list容量大小操作1.7 list 数据存取2. list的模拟实现这次要模拟实现的类及其成员函数接口总览2.1 结点类的实现2.2 迭代器的模拟实现2.3 反向迭代器…

yolov1 论文精读 - You Only Look Once- Unified, Real-Time Object Detection-统一的实时目标检测

Abstract 我们提出了一种新的目标检测方法- YOLO。以前的目标检测工作重复利用分类器来完成检测任务。相反&#xff0c;我们将目标检测框架看作回归问题&#xff0c;从空间上分割边界框和相关的类别概率。单个神经网络在一次评估中直接从整个图像上预测边界框和类别概率。由于…

PDF体积太大怎么缩小?这两种方法轻松解决

在我们日常处理的文件中&#xff0c;PDF文件的体积已经算是比较小的文件了&#xff0c;但是随着工作时间增加&#xff0c;我们用到的PDF文件也越来越多&#xff0c;而且有些PDF文件的内容非常丰富&#xff0c;文件体积变得更大&#xff0c;这就不利于我们将文件传输给别人&…