# bpmn-process-designer **Repository Path**: MiyueSC/bpmn-process-designer ## Basic Information - **Project Name**: bpmn-process-designer - **Description**: Base on Vue 2.x and ElementUI，基于 Bpmn.js、Vue 2.x 和 ElementUI 的流程编辑器（前端部分），支持监听器，扩展属性，表单等配置，可自由扩展 - **Primary Language**: JavaScript - **License**: Apache-2.0 - **Default Branch**: next - **Homepage**: https://miyuesc.gitee.io/process-designer/ - **GVP Project**: No ## Statistics - **Stars**: 1653 - **Forks**: 641 - **Created**: 2021-04-05 - **Last Updated**: 2025-12-15 ## Categories & Tags **Categories**: workflow **Tags**: Element-UI, Vue, bpmn, bpmnjs ## README

Bpmn Process Designer

--- ✨✨✨ Currently, the "小学生" in Chengdu and the author are developing the Flowable process engine component (including the front-end designer and the back-end process engine). 🚀🚀🚀 This component is deeply integrated with the Flowable process engine, combined with actual business scenarios and usage methods, the property editing panel has been redesigned to optimize the user experience. 🔥🔥🔥 The component Added process validation and progress preview tailored to business scenarios, and introduced a rich text editor and code editor. Integrated with the backend engine, it can be directly embedded into the system for use. Contact us: Mail: 463805737@qq.com QQ Group: 582010059

QQ Group wechat

--- About bpmn-js and related content, if you have any questions, you can check the [bpmn-js-questions: bpmn tool library description and common problem solutions](https://github.com/miyuesc/bpmn-js-questions) or ask questions. --- ## Author Introduction MiyueFE (Bai Xiaomi), also known as Xiaobai or Xiaomi, is a front-end developer who is currently working in Chongqing. You can also contact me through the following channels: - Email: [QQ mail](mailto:913784771@qq.com) - Juejin: [MiyueFE](https://juejin.cn/user/747323639208391) - Discard：https://discord.gg/8cBhGGyeV5 - WeChat: MiyueFE 的前端圈 ## Project Introduction 1. `vue 2 + JavaScript + bpmn-js@8+ + element-ui` In the `main` branch of this repository, it is the original code that most projects depend on, with more problems. 2. `vue 2 + JavaScript + bpmn-js@9+ + element-ui` In the `v2` branch of this repository, the style has been modified slightly, and the data interaction logic has been adjusted, but the core data update and processing part still has some defects. 3. `vue 3 + TypeScript + bpmn-js@13 + naive-ui` In the [moon-studio/vite-vue-bpmn-process](https://github.com/moon-studio/vite-vue-bpmn-process) repository, it is the predecessor of `v2`. > The `next` branch is currently used as a pnpm workplace test branch, and there are significant differences from the above content (currently not available for use). > > In addition, the above 1, 2, 3 three branches are relatively early versions of the project, although the user base is relatively large, there are still many problems, and it is recommended to develop again after understanding the code. > > The `next` branch provides basic bpmn-js tool methods, based on the official camunda property panel, and has been tested multiple times, basically meeting most needs. > > If you need it directly, you can combine it with the system for use, and the version that has fixed the core business logic problems has been released, you can contact the commercial version above. ## Open Source License [Apache License](https://github.com/miyuesc/bpmn-process-designer/blob/next/LICENSE) © 2023 [miyuesc](https://github.com/miyuesc) **This project follows the Apache License 2.0 open source agreement, please refer to [LICENSE](https://github.com/miyuesc/bpmn-process-designer/blob/next/LICENSE) file for details.** ## Book Recommendation #### 《深入Activiti流程引擎：核心原理与高阶实战》 Recommendation index: ⭐⭐⭐⭐⭐ Purchase address: [JD](https://item.jd.com/13928958.html)、[Asynchronous Community E-book](https://www.epubit.com/bookDetails?id=UBd189db7e65bd) #### 《深入Flowable流程引擎：核心原理与高阶实战》 Recommendation index: ⭐⭐⭐⭐⭐ Purchase address: [JD](https://item.jd.com/14804836.html) This book has been recommended by the founder of Flowable, Tijs Rademakers. It is very helpful for learning and mastering the use of Flowable. ![深入Flowable流程引擎](https://img14.360buyimg.com/n0/jfs/t1/108850/37/53916/154540/66f612a3Fdb62296b/2d4c3001da6dd921.jpg)