基于若依的ruoyi-nbcio流程管理系统支持支持定时边界事件和定时捕获事件

更多ruoyi-nbcio功能请看演示系统

gitee源代码地址

前后端代码： https://gitee.com/nbacheng/ruoyi-nbcio

演示地址：RuoYi-Nbcio后台管理系统

1、定时边界事件

<template>
  <div class="panel-tab__content">
    <!--目前只处理定时边界事件 -->
    <el-form size="mini" label-width="90px" @submit.native.prevent v-if="this.businessObject.eventDefinitions[0].$type.indexOf('TimerEventDefinition') !== -1">
      <el-form-item label="事件类型">
        <el-select v-model="timeDefinitionType" @change="changeTimerType">
          <!--bpmn:TimerEventDefinition-->
          <el-option label="指定时间" value="timeDate" />
          <el-option label="持续时间" value="timeDuration" />
          <el-option label="周期执行" value="timeCycle" />
        </el-select>
      </el-form-item>
      <template v-if="timeDefinitionType != ''">
        <el-form-item label="时间设置" required>
            <el-tooltip>
              <div slot="content">
                事件类型配置说明<br>
                1.指定时间(timeDate):触发事件的时间,如:2022-12-16T11:12:16 <br>
                2.持续时间(timeDuration):指定时器之前需等待多长时间,使用ISO 8601规定的格式<br>
                 (由BPMN 2.0规定),如PT5M(等待5分钟),也支持表达式${duration},<br>
                 这样你就可以通过流程变量来影响定时器定义<br>
                3.周期执行(timeCycle):指定重复执行的间隔,可以用来定期启动流程实例,<br>
                或为超时时间发送多个提醒。timeCycle元素可以使用两种格式。<br>
                第一种是 ISO 8601 标准的格式。示例值(R3/PT5M)(重复3次,<br>
                每次间隔5分钟),或也可以用cron表达式指定timeCycle,如从整点开始,<br>
                每10分钟执行一次(0 0/10 * * * ?)<br>
              </div>
              <el-input size="mini" type="string" v-model="FormalExpression" @change="updateTimeValue"></el-input>
            </el-tooltip>
        </el-form-item>
      </template>
    </el-form>
  </div>
</template>

<script>
export default {
  name: "BoundaryEvent",
  props: {
    businessObject: Object,
    type: String
  },
  inject: {
    prefix: "prefix"
  },
  data() {
    return {
      timeDefinitionType: "",
      FormalExpression:'',
    }; 
  },
  watch: {
    businessObject: {
      immediate: true,
      handler(val) {
        this.bpmnElement = window.bpmnInstances.bpmnElement;
        this.getElementLoop(val);
      }
    }
  },
  methods: {
    getElementLoop(businessObject) {//获取定时边界事件原有值
      console.log("getElementLoop businessObject=",businessObject)
      console.log("window.bpmnInstances.bpmnElement.businessObject=",window.bpmnInstances.bpmnElement.businessObject);
      if(businessObject.hasOwnProperty('eventDefinitions') && businessObject.eventDefinitions.length>0){
        if(businessObject.eventDefinitions[0].$type == 'bpmn:TimerEventDefinition') {
          if(businessObject.eventDefinitions[0].hasOwnProperty('timeDuration')) {
            this.timeDefinitionType = "timeDuration"
            this.FormalExpression = businessObject.eventDefinitions[0].timeDuration.body
          }
          else if(businessObject.eventDefinitions[0].hasOwnProperty('timeDate')) {
            this.timeDefinitionType = "timeDate"
            this.FormalExpression = businessObject.eventDefinitions[0].timeDate.body
          }
          else if(businessObject.eventDefinitions[0].hasOwnProperty('timeCycle')) {
            this.timeDefinitionType = "timeCycle"
            this.FormalExpression = businessObject.eventDefinitions[0].timeCycle.body
            
          }
        }
      }
    },
    changeTimerType(type) {
      this.timeDefinitionType = type
    },
    updateTimeValue(value) {
      console.log("updateTimeValue value=",value);
      this.updateTime(this.timeDefinitionType,value);
      console.log("updateTimeValue this.bpmnElement=",this.bpmnElement);
    },
    //时间事件定义类型修改
    updateTime(type,value){
      //获取节点的子节点 timerEventDefinition
      console.log("updatetime type=",type)
      let timerEventDef = this.bpmnElement.businessObject.eventDefinitions[0]
      const timeCycle = window.bpmnInstances.moddle.create("bpmn:FormalExpression", { body:value });
      const timeDate = window.bpmnInstances.moddle.create("bpmn:FormalExpression", { body:value });
      const timeDuration = window.bpmnInstances.moddle.create("bpmn:FormalExpression", { body:value });
      if (type == 'timeCycle') {
        window.bpmnInstances.modeling.updateModdleProperties(this.bpmnElement,timerEventDef,{timeDate:null})
        window.bpmnInstances.modeling.updateModdleProperties(this.bpmnElement,timerEventDef,{timeDuration:null})
        window.bpmnInstances.modeling.updateModdleProperties(this.bpmnElement,timerEventDef,{timeCycle })
      }
      else if (type == 'timeDate') {
        window.bpmnInstances.modeling.updateModdleProperties(this.bpmnElement,timerEventDef,{timeCycle:null})
        window.bpmnInstances.modeling.updateModdleProperties(this.bpmnElement,timerEventDef,{timeDuration:null})
        window.bpmnInstances.modeling.updateModdleProperties(this.bpmnElement,timerEventDef,{ timeDate })
      }
      else if (type == 'timeDuration') {
        window.bpmnInstances.modeling.updateModdleProperties(this.bpmnElement,timerEventDef,{timeDate:null})
        window.bpmnInstances.modeling.updateModdleProperties(this.bpmnElement,timerEventDef,{timeCycle:null})
        window.bpmnInstances.modeling.updateModdleProperties(this.bpmnElement,timerEventDef,{ timeDuration })
      }  
      
    },
    beforeDestroy() {
      this.bpmnElement = null;
    },
  }  
};
</script>

2、定时捕获事件

<template>
  <div class="panel-tab__content">
    <!--目前只处理定时捕获事件 -->
    <el-form size="mini" label-width="90px" @submit.native.prevent v-if="this.businessObject.eventDefinitions[0].$type.indexOf('TimerEventDefinition') !== -1">
      <el-form-item label="事件类型">
        <el-select v-model="timeDefinitionType" @change="changeTimerType">
          <!--bpmn:TimerEventDefinition-->
          <el-option label="指定时间" value="timeDate" />
          <el-option label="持续时间" value="timeDuration" />
          <el-option label="周期执行" value="timeCycle" />
        </el-select>
      </el-form-item>
      <template v-if="timeDefinitionType != ''">
        <el-form-item label="时间设置" required>
            <el-tooltip>
              <div slot="content">
                事件类型配置说明<br>
                1.指定时间(timeDate):触发事件的时间,如:2022-12-16T11:12:16 <br>
                2.持续时间(timeDuration):指定时器之前需等待多长时间,使用ISO 8601规定的格式<br>
                 (由BPMN 2.0规定),如PT5M(等待5分钟),也支持表达式${duration},<br>
                 这样你就可以通过流程变量来影响定时器定义<br>
                3.周期执行(timeCycle):指定重复执行的间隔,可以用来定期启动流程实例,<br>
                或为超时时间发送多个提醒。timeCycle元素可以使用两种格式。<br>
                第一种是 ISO 8601 标准的格式。示例值(R3/PT5M)(重复3次,<br>
                每次间隔5分钟),或也可以用cron表达式指定timeCycle,如从整点开始,<br>
                每10分钟执行一次(0 0/10 * * * ?)<br>
              </div>
              <el-input size="mini" type="string" v-model="FormalExpression" @change="updateTimeValue"></el-input>
            </el-tooltip>
        </el-form-item>
      </template>
    </el-form>
  </div>
</template>

<script>
export default {
  name: "CatchEvent",
  props: {
    businessObject: Object,
    type: String
  },
  inject: {
    prefix: "prefix"
  },
  data() {
    return {
      timeDefinitionType: "",
      FormalExpression:'',
    }; 
  },
  watch: {
    businessObject: {
      immediate: true,
      handler(val) {
        this.bpmnElement = window.bpmnInstances.bpmnElement;
        this.getElementLoop(val);
      }
    }
  },
  methods: {
    getElementLoop(businessObject) {//获取定时捕获事件原有值
      console.log("getElementLoop businessObject=",businessObject)
      console.log("window.bpmnInstances.bpmnElement.businessObject=",window.bpmnInstances.bpmnElement.businessObject);
      if(businessObject.hasOwnProperty('eventDefinitions') && businessObject.eventDefinitions.length>0){
        if(businessObject.eventDefinitions[0].$type == 'bpmn:TimerEventDefinition') {
          if(businessObject.eventDefinitions[0].hasOwnProperty('timeDuration')) {
            this.timeDefinitionType = "timeDuration"
            this.FormalExpression = businessObject.eventDefinitions[0].timeDuration.body
          }
          else if(businessObject.eventDefinitions[0].hasOwnProperty('timeDate')) {
            this.timeDefinitionType = "timeDate"
            this.FormalExpression = businessObject.eventDefinitions[0].timeDate.body
          }
          else if(businessObject.eventDefinitions[0].hasOwnProperty('timeCycle')) {
            this.timeDefinitionType = "timeCycle"
            this.FormalExpression = businessObject.eventDefinitions[0].timeCycle.body
            
          }
        }
      }
    },
    changeTimerType(type) {
      this.timeDefinitionType = type
    },
    //
    updateTimeValue(value) {
      console.log("updateTimeValue value=",value);
      this.updateTime(this.timeDefinitionType,value);
      console.log("updateTimeValue this.bpmnElement=",this.bpmnElement);
    },
    //时间事件定义类型修改
    updateTime(type,value){
      //获取节点的子节点 timerEventDefinition
      console.log("updatetime type=",type)
      let timerEventDef = this.bpmnElement.businessObject.eventDefinitions[0]
      const timeCycle = window.bpmnInstances.moddle.create("bpmn:FormalExpression", { body:value });
      const timeDate = window.bpmnInstances.moddle.create("bpmn:FormalExpression", { body:value });
      const timeDuration = window.bpmnInstances.moddle.create("bpmn:FormalExpression", { body:value });
      if (type == 'timeCycle') {
        window.bpmnInstances.modeling.updateModdleProperties(this.bpmnElement,timerEventDef,{timeDate:null})
        window.bpmnInstances.modeling.updateModdleProperties(this.bpmnElement,timerEventDef,{timeDuration:null})
        window.bpmnInstances.modeling.updateModdleProperties(this.bpmnElement,timerEventDef,{timeCycle })
      }
      else if (type == 'timeDate') {
        window.bpmnInstances.modeling.updateModdleProperties(this.bpmnElement,timerEventDef,{timeCycle:null})
        window.bpmnInstances.modeling.updateModdleProperties(this.bpmnElement,timerEventDef,{timeDuration:null})
        window.bpmnInstances.modeling.updateModdleProperties(this.bpmnElement,timerEventDef,{ timeDate })
      }
      else if (type == 'timeDuration') {
        window.bpmnInstances.modeling.updateModdleProperties(this.bpmnElement,timerEventDef,{timeDate:null})
        window.bpmnInstances.modeling.updateModdleProperties(this.bpmnElement,timerEventDef,{timeCycle:null})
        window.bpmnInstances.modeling.updateModdleProperties(this.bpmnElement,timerEventDef,{ timeDuration })
      }  
      
    },
    beforeDestroy() {
      this.bpmnElement = null;
    },
  }  
};
</script>

3、PropertiesPanel.vue 增加下面部分

<el-collapse-item name="catchEvent" v-if="elementType.indexOf('IntermediateCatchEvent') !== -1" key="catchEvent">
        <div slot="title" class="panel-tab__title"><i class="el-icon-s-help"></i>定时捕获事件</div>
        <catch-event :business-object="elementBusinessObject" :type="elementType" />
      </el-collapse-item>
      <el-collapse-item name="boundaryEvent" v-if="elementType.indexOf('BoundaryEvent') !== -1" key="boundaryEvent">
        <div slot="title" class="panel-tab__title"><i class="el-icon-s-help"></i>定时边界事件</div>
        <boundary-event :business-object="elementBusinessObject" :type="elementType" />
      </el-collapse-item>

4、效果图如下：

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

如若内容造成侵权/违法违规/事实不符，请联系我们进行投诉反馈qq邮箱809451989@qq.com，一经查实，立即删除！

相关文章

shell命令学习(1)——(待完善)

shell命令学习(1)——(待完善)

explainshell.com shell统计当前文件夹下的文件个数、目录个数Linux之shell常用命令&#xff08;三&#xff09; sort&#xff08;排序&#xff09;、uniq&#xff08;处理重复字符&#xff09; linux中shell将换行输入到文件中 shell脚本&#xff0c;将多行内容写入文件中 f…
阅读更多...
【8】PyQt单选框和复选框

【8】PyQt单选框和复选框

目录 1. 单选框 2. 复选框 1. 单选框 QRadioButton是单选按钮,它提供了一组可供选择的按钮和文本标签,用户可以选择其中一个选项 单选框选中的信号是:toggled 代码示例&#xff1a; from PyQt5.QtWidgets import * from PyQt5.QtCore import * import sysdef func(checked…
阅读更多...
Java项目学生管理系统一前后端环境搭建

Java项目学生管理系统一前后端环境搭建

在现代的软件开发中&#xff0c;学生管理系统是一个常见的应用场景。通过学生管理系统&#xff0c;学校能够方便地管理学生的信息、课程安排和成绩等数据。本文将介绍如何使用Java语言搭建一个学生管理系统的前后端环境&#xff0c;并提供一个简单的示例。 1.环境搭建 学生管…
阅读更多...
扩展卡尔曼滤波技术（Extended Kalman Filter，EKF）

扩展卡尔曼滤波技术（Extended Kalman Filter，EKF）

一、概念介绍 卡尔曼滤波是一种高效率的递归滤波器(自回归滤波器), 它能够从一系列的不完全包含噪声的测量中&#xff0c;估计动态系统的状态&#xff0c;然而简单的卡尔曼滤波必须应用在符合高斯分布的系统中。 扩展卡尔曼滤波就是为了解决非线性问题&#xff0c;普通卡尔曼…
阅读更多...
Socks VS HTTP 谁才是最快的代理协议

Socks VS HTTP 谁才是最快的代理协议

目录 前言 一、Socks代理协议 二、HTTP代理协议 三、Socks代理协议和HTTP代理协议的比较 1. 性能 2. 安全性 3. 灵活性 4. 应用场景 四、哪一个更快&#xff1f; 五、总结 前言 在网络传输中&#xff0c;代理协议扮演着非常重要的角色。Socks协议和HTTP协议是两种常…
阅读更多...
探索正则可视化工具：让编程更直观、高效

探索正则可视化工具：让编程更直观、高效

导语&#xff1a;在当今的编程世界中&#xff0c;正则表达式已成为不可或缺的技能。然而&#xff0c;理解和编写正则表达式往往是一项具有挑战性的任务。为了降低门槛&#xff0c;提高编程效率&#xff0c;正则可视化工具应运而生。 一、正则表达式的简介与历史 正则表达式&a…
阅读更多...
Failed to resolve org.junit.platform:junit-platform-launcher:1.9.3

Failed to resolve org.junit.platform:junit-platform-launcher:1.9.3

springboot 跑 unit test 的时候&#xff0c;如果报错如题的话&#xff0c;可以更改idea 里的 Settings ——> HTTP Proxy 配置为&#xff1a;Auto-detect proxy settings
阅读更多...
2023 CCF中国软件大会（CCF ChinaSoft）“软件定义汽车”论坛成功召开

2023 CCF中国软件大会（CCF ChinaSoft）“软件定义汽车”论坛成功召开

2023年12月1日下午&#xff0c;2023年度CCF中国软件大会“软件定义汽车”论坛成功召开。 本次论坛由华东师范大学蒲戈光教授、武汉光庭信息技术股份有限公司朱敦尧董事长以及华东师范大学张越龄副教授联合组织举办。论坛主要关注汽车的智能网联化与电动化的融合&#xff0c;包括…
阅读更多...
【Android Studio】【入门】helloworld和工程的各个文件的作用

【Android Studio】【入门】helloworld和工程的各个文件的作用

这里写目录标题 可以开发的app类型注意点 搞一个helloworld玩玩各个文件的作用 可以开发的app类型 Phone and Tablet&#xff1a;开发手机和平板的app&#xff1b;Wear OS&#xff1a;穿戴系统&#xff1b;TV&#xff1a;电视app&#xff1b;Android Auto&#xff1a;汽车上的…
阅读更多...
Java API接口强势对接：构建高效稳定的系统集成方案

Java API接口强势对接：构建高效稳定的系统集成方案

文章目录 1. Java API接口简介2. Java API接口的优势2.1 高度可移植性2.2 强大的网络通信能力2.3 多样化的数据处理能力 3. 实战&#xff1a;Java API接口强势对接示例3.1 场景描述3.2 用户管理系统3.3 订单处理系统3.4 系统集成 4. 拓展&#xff1a;Java API接口在微服务架构中…
阅读更多...
ROS 动态坐标变换

ROS 动态坐标变换

在ROS 中&#xff0c;坐标变换是一个重要的概念&#xff0c;因为它允许系统中的不同节点和模块以统一的方式描述物体的位置和方向。 动态坐标变换指的是当机器人或其环境中物体的位姿&#xff08;位置和姿态&#xff09;发生变化时&#xff0c;能够实时更新这些信息的过程。 …
阅读更多...
Linux---进程管理

Linux---进程管理

本章主要介绍RHEL8中如何管理并查看进程。 了解进程并查看系统中存放的进程了解进程的信号进程优先级设置 进程介绍 在 Windows中打开任务管理器就可以查看到系统中的所有进程&#xff0c;如图下图所示。 这里列出了系统中所有的进程&#xff0c;不过也可以使用命令行工具来…
阅读更多...
学生成绩的增删改查

学生成绩的增删改查

接上一篇MySQL数据库与其管理工具Navicat link 1.下载JDBC 可以登录MySQL的官方网站&#xff1a;www.mysql.com&#xff0c;下载JDBC-MySQL数据库驱动&#xff08;JDBC Driver for MySQL&#xff09;下载mysql-connector-java-5.1.40.zip后&#xff0c;将该zip文件解压至硬盘&a…
阅读更多...
html和css写去哪儿导航条

html和css写去哪儿导航条

目录 1、css代码 2、html代码 3、效果图 1、css代码 * {padding: 0;margin: 0;list-style: none;text-decoration: none;}.nav {height: 50px;background-color: rgb(36, 210, 188);margin-top: 50px;padding-left: 20px;}li {float: left;width: 75px;line-height: 50px;tex…
阅读更多...
【EI会议征稿-ACM出版】2023年信息化教育与人工智能国际学术会议（ICIEAI 2023）

【EI会议征稿-ACM出版】2023年信息化教育与人工智能国际学术会议（ICIEAI 2023）

2023年信息化教育与人工智能国际学术会议&#xff08;ICIEAI 2023&#xff09; 2023 International Conference on Information Education and Artificial Intelligence 2023年12月22-24日 中国-厦门 2023年信息化教育与人工智能国际学术会议&#xff08;ICIEAI 2023&#xf…
阅读更多...
8. 信号基础

8. 信号基础

8. 信号基础 1. 基本概念1.1 信号的目的是用来通信的1.2 信号由谁处理、怎么处理1.3 信号是异步的 2. 信号的分类2.1 可靠信号和不可靠信号2.2 实时信号和非实时信号 3. 进程对信号的处理3.1 signal()3.2 sigaction()3.2.1 struct sigaction3.2.2 实例 4. 向进程发送信号4.1 ki…
阅读更多...
欧拉操作系统

欧拉操作系统

提示&#xff1a;文章写完后&#xff0c;目录可以自动生成&#xff0c;如何生成可参考右边的帮助文档 文章目录 前言一、pandas是什么&#xff1f;二、使用步骤 1.引入库2.读入数据总结 前言 提示&#xff1a;这里可以添加本文要记录的大概内容&#xff1a; 这个章节主要是介…
阅读更多...
微信小程序中生命周期钩子函数

微信小程序中生命周期钩子函数

微信小程序 App 的生命周期钩子函数有以下 7 个&#xff1a; onLaunch(options)&#xff1a;当小程序初始化完成时&#xff0c;会触发 onLaunch&#xff08;全局只触发一次&#xff09;。onShow(options)&#xff1a;当小程序启动或从后台进入前台显示时&#xff0c;会触发 on…
阅读更多...
CSS属性 display和visibility的区别

CSS属性 display和visibility的区别

在CSS中&#xff0c;有两种让元素隐藏的方式&#xff0c;分别是display和visibility&#xff0c;他们有什么区别呢&#xff1f; <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><meta name"viewport"…
阅读更多...
[Kubernetes]1.Kubernetes(K8S)介绍,基于腾讯云的K8S环境搭建集群以及裸机搭建K8S集群

[Kubernetes]1.Kubernetes(K8S)介绍,基于腾讯云的K8S环境搭建集群以及裸机搭建K8S集群

一. Kubernetes（K8S）简介 Kubernetes (K8S) 是一个为 容器化应用 提供 集群部署 和 管理 的开源工具，和docker swarm类似,由 Google 开发. Kubernetes 这个名字源于希腊语，意为 “ 舵手 ” 或 “ 飞行员 ” , k8s 这个缩写是因为 k 和 s 之间有八个字符的关系, Google…
阅读更多...
最新文章

Copyright @ 2022~2023