代码拉取完成,页面将自动刷新
同步操作将从 liangheng/bpmn-jeecgboot 强制同步,此操作会覆盖自 Fork 仓库以来所做的任何修改,且无法恢复!!!
确定后同步将在后台操作,完成时将刷新页面,请耐心等待。
发布日期:2022-03-06
基于vue2.x、bpmn.js、antdv、bpmn-process-designer 仿jeecg-boot的工作流程图。
运行示例:https://lemnaminor.github.io/bpmn-jeecgboot/dist
示例图片:
import bpmnPage from '@/components/bpmnPackage/bpmnPage.vue'
<bpmn-page :bpmnId="bpmnId" @eventClose="eventClose" />
"dependencies": {
"bpmn-js-token-simulation": "^0.10.0",
"highlight.js": "^10.5.0",
"x2js": "^3.4.2"
},
"devDependencies": {
"node-sass": "^4.12.0",
"sass-loader": "^8.0.2",
"bpmn-js": "^8.8.3",
"ant-design-vue": "^1.7.2"
},
npm install @babel/plugin-proposal-optional-chaining // 可选链运算符 ?.
npm install @babel/plugin-proposal-nullish-coalescing-operator // 空值合并运算符 ??
module.exports = {
plugins: [
'@babel/plugin-proposal-optional-chaining', // 可选链运算符 ?.
'@babel/plugin-proposal-nullish-coalescing-operator' // 空值合并运算符 ??
]
}
// bpmnPackage组件引用
import Antd from 'ant-design-vue'
import bpmnPackage from "@/components/bpmnPackage/index.js";
import 'ant-design-vue/dist/antd.css';
import hljs from 'highlight.js'
import 'highlight.js/styles/atom-one-dark.css' //这里有多个样式,自己可以根据需要切换
Vue.use(Antd);
Vue.use(bpmnPackage);
Vue.use(hljs.vuePlugin);
import "@/components/bpmnPackage/theme/index.scss";
import "bpmn-js/dist/assets/diagram-js.css";
import "bpmn-js/dist/assets/bpmn-font/css/bpmn.css";
import "bpmn-js/dist/assets/bpmn-font/css/bpmn-codes.css";
1,项目下载依赖
npm install 或者 cnpm install
2,项目运行
npm run serve
3,项目打包
npm run build
bpmn-process-designer: https://github.com/miyuesc/bpmn-process-designer
bpmn.js: https://github.com/bpmn-io/bpmn-js
jeecg-boot: http://www.jeecg.com
ant-design-vue: https://www.antdv.com/docs/vue/getting-started-cn
1,如此项目对你有所帮助很开心,请点一下star以帮助到更多的人。
2,如项目有问题请提issue,或者联系我本人QQ:291294950。
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。