GooFlow.js在线制作编辑流程图插件

来源:https://www.sucaihuo.com/js/3384.html 2018-01-11 22:19浏览(11863) 收藏

一款基于jQuery与GooFlow.js在线制作编辑流程图插件,可制作各种网页流程图效果。gooflow功能简介 1、自定义流程绘制 2、自定义属性添加 3、支持3种步骤类型 普通审批步骤 自动决策步骤 手动决策步骤 4、决策方式(支持js决策,sql语句决策) 5、审批人员参与方式,可以自定配置,系统目前自带(员工,部门,岗位,sql语句4种方式) 6、响应方式(支持多人审批通过,和单人审批通过) 7、事件执行方式(审批通过后可以触发配置事件) 8、消息提醒(支持实时提醒)
GooFlow.js在线制作编辑流程图插件
分类:其它特效 > jQuery插件 难易:初级
查看演示 下载资源 下载积分: 20 积分

js代码

<script type="text/javascript" src="demo/child.js"></script>
<script type="text/javascript" src="plugin/jquery.min.js"></script>
<script type="text/javascript" src="codebase/GooFunc.js"></script>
<script type="text/javascript" src="plugin/json2.js"></script>
<link rel="stylesheet" type="text/css" href="demo/default.css"/>
<script type="text/javascript" src="codebase/GooFlow.js"></script>
<script type="text/javascript">
var property={
	width:1200,
	height:600,
	toolBtns:["start round","end","task","node","chat","state","plug","join","fork","complex mix"],
	haveHead:true,
	headBtns:["new","open","save","undo","redo","reload"],//如果haveHead=true,则定义HEAD区的按钮
	haveTool:true,
	haveGroup:true,
	useOperStack:true
};
var remark={
	cursor:"选择指针",
	direct:"转换连线",
	start:"开始结点",
	"end round":"结束结点",
	"task round":"任务结点",
	node:"自动结点",
	chat:"决策结点",
	state:"状态结点",
	plug:"附加插件",
	fork:"分支结点",
	"join":"联合结点",
	"complex mix":"复合结点",
	group:"组织划分框编辑开关"
};
var demo;
$(document).ready(function(){
	demo=$.createGooFlow($("#demo"),property);
	demo.setNodeRemarks(remark);
	//demo.onItemDel=function(id,type){
	//	return confirm("确定要删除该单元吗?");
	//}
	demo.loadData(jsondata);
});
var out;
function Export(){
    document.getElementById("result").value=JSON.stringify(demo.exportData());
}
</script>
标签: gooflow流程图
评论0
头像

系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791

1 2