在好例子网,分享、交流、成长!
您当前所在位置:首页C# 开发实例C#语言基础 → easyui 工作流设计器设计 例子源码

easyui 工作流设计器设计 例子源码

C#语言基础

下载此实例
  • 开发语言:C#
  • 实例大小:0.59M
  • 下载次数:87
  • 浏览次数:2994
  • 发布时间:2014-11-04
  • 实例类别:C#语言基础
  • 发 布 人:abweixx
  • 文件格式:.zip
  • 所需积分:2
 相关标签: 工作流 easyui

实例介绍

【实例简介】

【实例截图】

【核心代码】

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <meta content="text/html; charset=UTF-8" http-equiv="content-type">
  <title></title>
  <link href="designer/designer.css" type="text/css" rel="stylesheet"/>
  <link href="lib/jquery-easyui/themes/default/easyui.css" type="text/css" rel="stylesheet"/>
  			
        <!-- common, all times required, imports -->
        <SCRIPT src='lib/wz_jsgraphics.js'></SCRIPT>          
        <SCRIPT src='lib/mootools.js'></SCRIPT>          
        <SCRIPT src='lib/moocanvas.js'></SCRIPT>                        
        <SCRIPT src='lib/draw2d.js'></SCRIPT>


        <!-- example specific imports -->
        <SCRIPT src="designer/MyCanvas.js"></SCRIPT>
        <SCRIPT src="designer/ResizeImage.js"></SCRIPT>
        <SCRIPT src="designer/designer.js"></SCRIPT>
		<SCRIPT src="designer/event/Start.js"></SCRIPT>
		<SCRIPT src="designer/event/End.js"></SCRIPT>
		<SCRIPT src="designer/connection/MyInputPort.js"></SCRIPT>
		<SCRIPT src="designer/connection/MyOutputPort.js"></SCRIPT>
		<SCRIPT src="designer/connection/DecoratedConnection.js"></SCRIPT>
		<SCRIPT src="designer/task/Task.js"></SCRIPT>
		<SCRIPT src="designer/task/UserTask.js"></SCRIPT>
		<SCRIPT src="designer/task/ManualTask.js"></SCRIPT>	
		<SCRIPT src='lib/jquery-1.4.4.min.js'></SCRIPT>
  		<script src="lib/jquery-easyui/jquery.easyui.min.js" type="text/javascript"></script>

</head>
<script type="text/javascript">
<!--
var jq = jQuery.noConflict();
var taskArray=[];
jq(function(){
	_process_panel = jq('#process-panel');
	workflow.scrollArea=_process_panel.get(0);
	_task_obj = jq('#task');
	_properties_panel_obj = jq('#designer').layout('panel','east');
	jq('.easyui-linkbutton').draggable({
				proxy:function(source){
					var n = jq('<div class="draggable-model-proxy"></div>');
					n.html(jq(source).html()).appendTo('body');
					return n;
				},
				deltaX:0,
				deltaY:0,
				revert:true,
				cursor:'auto',
				onStartDrag:function(){
					jq(this).draggable('options').cursor='not-allowed';
				},
				onStopDrag:function(){
					jq(this).draggable('options').cursor='auto';
				}	
	});
	jq('#paintarea').droppable({
				accept:'.easyui-linkbutton',
				onDragEnter:function(e,source){
					jq(source).draggable('options').cursor='auto';
				},
				onDragLeave:function(e,source){
					jq(source).draggable('options').cursor='not-allowed';
				},
				onDrop:function(e,source){
					//jq(this).append(source)
					//jq(this).removeClass('over');
					var wfModel = jq(source).attr('wfModel');
					if(wfModel){
						var x=jq(source).draggable('proxy').offset().left;
						var y=jq(source).draggable('proxy').offset().top;
						var xOffset    = workflow.getAbsoluteX();
	                    var yOffset    = workflow.getAbsoluteY();
	                    var scrollLeft = workflow.getScrollLeft();
	                    var scrollTop  = workflow.getScrollTop();
	                  //alert(xOffset "|" yOffset "|" scrollLeft "|" scrollTop);
	                    addModel(wfModel,x-xOffset scrollLeft,y-yOffset scrollTop);
					}
				}
			});
});
function addModel(name,x,y){
	var task = eval("new " name "()");
	//userTask.setContent("DM Approve");
	task.setId(name new Date().getTime());
	workflow.addFigure(task,x,y);
	var id = task.getId();
	var jqTask = jq(task.getHTMLElement());
	jqTask.bind('click',{id:id},function(e){
		alert(e.data.id);
		_properties_panel_obj.panel('refresh','taskProperties.html');
	});
	taskArray[taskArray.length]={id:task.getId(),task:jqTask};
}
//-->
</script>
<body id="designer" class="easyui-layout" style="overflow-y: hidden" scroll="no">
	<div region="west" split="true" iconCls="palette-icon" title="Palette" style="width:150px;overflow:hidden;">
		<div class="easyui-accordion" fit="true" border="false">
<!--				<div id="connection" title="Connection" iconCls="palette-menu-icon" class="palette-menu">-->
<!--					<a href="##" class="easyui-linkbutton" plain="true" iconCls="sequence-flow-icon">SequenceFlow</a><br>-->
<!--				</div>-->
				<div id="event" title="Event" iconCls="palette-menu-icon" class="palette-menu">
					<a href="##" class="easyui-linkbutton" plain="true" iconCls="start-event-icon">Start</a><br>
					<a href="##" class="easyui-linkbutton" plain="true" iconCls="end-event-icon">End</a><br>
				</div>
				<div id="task" title="Task" iconCls="palette-menu-icon" selected="true" class="palette-menu">
					<a href="##" class="easyui-linkbutton" plain="true" iconCls="user-task-icon" wfModel="draw2d.UserTask">User Task</a><br>
					<a href="##" class="easyui-linkbutton" plain="true" iconCls="manual-task-icon" wfModel="draw2d.ManualTask">Manual Task</a><br>
					<a href="##" class="easyui-linkbutton" plain="true" iconCls="service-task-icon">Service Task</a><br>
					<a href="##" class="easyui-linkbutton" plain="true" iconCls="script-task-icon">Script Task</a><br>
					<a href="##" class="easyui-linkbutton" plain="true" iconCls="mail-task-icon">Mail Task</a><br>
					<a href="##" class="easyui-linkbutton" plain="true" iconCls="receive-task-icon">Receive Task</a><br>
					<a href="##" class="easyui-linkbutton" plain="true" iconCls="business-rule-task-icon">Business Rule Task</a><br>
					<a href="##" class="easyui-linkbutton" plain="true" iconCls="subprocess-icon">SubProcess</a><br>
					<a href="##" class="easyui-linkbutton" plain="true" iconCls="callactivity-icon">CallActivity</a><br>
				</div>
				<div id="gateway" title="Gateway" iconCls="palette-menu-icon" class="palette-menu">
					<a href="##" class="easyui-linkbutton" plain="true" iconCls="parallel-gateway-icon">ParallelGateway</a><br>
					<a href="##" class="easyui-linkbutton" plain="true" iconCls="exclusive-gateway-icon">ExclusiveGateway</a><br>
				</div>
				<div id="boundary-event" title="Boundary event" iconCls="palette-menu-icon" class="palette-menu">
					<a href="##" class="easyui-linkbutton" plain="true" iconCls="timer-boundary-event-icon">TimerBoundaryEvent</a><br>
					<a href="##" class="easyui-linkbutton" plain="true" iconCls="error-boundary-event-icon">ErrorBoundaryEvent</a><br>
				</div>
		</div>
	</div>
	<div id="process-panel" region="center" split="true" iconCls="process-icon" title="Process" style="overflow:hidden;overflow-x:auto;overflow-y:auto;padding:1px;">
		<div id="paintarea" style="POSITION: relative; WIDTH: 3000px; HEIGHT: 3000px" ></div>
	</div>
	<div id="properties-panel" region="east" split="true" iconCls="properties-icon" title="Properties" style="width:300px;">
		
	</div>
	<div id="toolbar-panel" region="north" border="false" style="height:36px;background:#E1F0F2;">
		<div style="background:#E1F0F2;padding:5px;">
			<a href="javascript:void(0)" id="sb1" class="easyui-splitbutton" menu="#mm1" iconCls="icon-edit" onclick="javascript:alert('edit')">Edit</a>
			<a href="javascript:void(0)" id="sb2" class="easyui-splitbutton" menu="#mm2" iconCls="icon-ok" onclick="javascript:alert('ok')">Ok</a>
			<a href="javascript:void(0)" id="mb3" class="easyui-menubutton" menu="#mm3" iconCls="icon-help">Help</a>
		</div>
		<div id="mm1" style="width:150px;">
		<div iconCls="icon-undo">Undo</div>
		<div iconCls="icon-redo">Redo</div>
		<div class="menu-sep"></div>
		<div>Cut</div>
		<div>Copy</div>
		<div>Paste</div>
		<div class="menu-sep"></div>
		<div>
			<span>Toolbar</span>
			<div style="width:150px;">
				<div>Address</div>
				<div>Link</div>
				<div>Navigation Toolbar</div>
				<div>Bookmark Toolbar</div>
				<div class="menu-sep"></div>
				<div>New Toolbar...</div>
			</div>
		</div>
		<div iconCls="icon-remove">Delete</div>
		<div>Select All</div>
		</div>
		<div id="mm2" style="width:100px;">
			<div iconCls="icon-ok">Ok</div>
			<div iconCls="icon-cancel">Cancel</div>
		</div>
		<div id="mm3" style="width:150px;">
			<div>Help3</div>
			<div class="menu-sep"></div>
			<div>About3</div>
		</div>
	</div>
	<script type="text/javascript">
	<!--
	
	var workflow  = new draw2d.MyCanvas("paintarea");
		// Add the start,end,connector to the canvas
	  var startObj = new draw2d.Start("designer/icons/type.startevent.none.png");
	  startObj.setId("startObj");
	  workflow.addFigure(startObj, 50,200);
	  
	  var endObj   = new draw2d.End("designer/icons/type.endevent.none.png");
	  endObj.setId("endObj");
	  workflow.addFigure(endObj,700,200);
	//-->
	</script>
</body>
</html>

标签: 工作流 easyui

实例下载地址

easyui 工作流设计器设计 例子源码

不能下载?内容有错? 点击这里报错 + 投诉 + 提问

好例子网口号:伸出你的我的手 — 分享

网友评论

发表评论

(您的评论需要经过审核才能显示)

查看所有0条评论>>

小贴士

感谢您为本站写下的评论,您的评论对其它用户来说具有重要的参考价值,所以请认真填写。

  • 类似“顶”、“沙发”之类没有营养的文字,对勤劳贡献的楼主来说是令人沮丧的反馈信息。
  • 相信您也不想看到一排文字/表情墙,所以请不要反馈意义不大的重复字符,也请尽量不要纯表情的回复。
  • 提问之前请再仔细看一遍楼主的说明,或许是您遗漏了。
  • 请勿到处挖坑绊人、招贴广告。既占空间让人厌烦,又没人会搭理,于人于己都无利。

关于好例子网

本站旨在为广大IT学习爱好者提供一个非营利性互相学习交流分享平台。本站所有资源都可以被免费获取学习研究。本站资源来自网友分享,对搜索内容的合法性不具有预见性、识别性、控制性,仅供学习研究,请务必在下载后24小时内给予删除,不得用于其他任何用途,否则后果自负。基于互联网的特殊性,平台无法对用户传输的作品、信息、内容的权属或合法性、安全性、合规性、真实性、科学性、完整权、有效性等进行实质审查;无论平台是否已进行审查,用户均应自行承担因其传输的作品、信息、内容而可能或已经产生的侵权或权属纠纷等法律责任。本站所有资源不代表本站的观点或立场,基于网友分享,根据中国法律《信息网络传播权保护条例》第二十二与二十三条之规定,若资源存在侵权或相关问题请联系本站客服人员,点此联系我们。关于更多版权及免责申明参见 版权及免责申明

;
报警