vue+SimpleFlowChart实现可编辑导入导出json的审批oa流程图代码
代码语言:html
所属分类:图表
代码描述:vue+SimpleFlowChart实现可编辑导入导出json的审批oa流程图代码,可编辑增加删除节点信息,可监听点击事件,还可以自定义新节点。
代码标签: vue SimpleFlowChart 编辑 导入 导出 json 审批 oa 流程图 代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum=1.0,minimum=1.0,user-scalable=0" /> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/vue.2.7.14.js"></script> <style> .submitbtn{ position: fixed; top: 10px; left: 10px; background:#3366CC ; padding: 10px; color: white; z-index: 111; } </style> <script type="text/javascript" src="//repo.bfw.wiki/bfwrepo/js/SimpleFlowChart.umd.min.js"></script> <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/SimpleFlowChart.css"> </head> <body> <div id="app" style="height:100vh;" > </div> <script > Vue.use(SimpleFlowChart) Vue.component( "SimpleFlowChart", SimpleFlowChart.default) Vue.component( "SFCNode", SimpleFlowChart.Node) var app = new Vue({ el: '#app', data : function() { return { nodetypelist:[ { name: '普通节点', list: [ { type: 'normal', name: '普通节点' } ] }, ], tes.........完整代码请登录后点击上方下载按钮下载查看
网友评论0