`

FoxBPM任务详细信息展现实现

 
阅读更多

FoxBPM任务详细页面包括:任务信息、流程信息、流程图信息三个功能模块,具体功能介绍如下:

1、任务信息:

      任务信息管理,通过rest服务获取任务信息、流程处理信息、任务节点信息。

2、流程信息:

      流程信息管理,通过rest服务取流程实例信息,以及流程状态、当前处理人、流程参入者展现。

3、流程图信息:

      流程图信息管理通过rest服务获取流程图数据(png、svg),以及包括(轨迹信息、轨迹运行状态、隐藏状态)操作。

 

 

实例任务详细信息showTaskDetailInfor.html

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta charset="utf-8">
<title>FoxBPM流程门户</title>
<link rel="stylesheet" type="text/css" href="css/taskDetailInfor.css" />
<script src="js/jquery.js"></script>
<script src="js/foxbpmframework.js"></script>
<script src="js/taskInfor.js"></script>
<script src="js/flowInfor.js"></script> 
<script src="js/flowGraphicInfor.js"></script>
<script src="js/flowRunTrackInfor.js"></script>
</head>
<body>
	<br>
	<div class="container process" id="processInfo">
		<div
			class="repository-with-sidebar repo-container new-discussion-timeline">
			<div class="repository-content context-loader-container"
				id="js-repo-pjax-container" data-pjax-container="">
				<div class="issues-listing" >
					<div class="context-loader-container" id="issues-container">
						<div class="issues-listing">
							<div class="js-issues-results" id="show_issue">
								<div class="tab-content clearfix" id="discussion_bucket">
									<!-- 流程信息 -->
									<div class="discussion-sidebar" id="flowInforEle">
									</div>
									<!-- 任务详细信息 -->
									<div class="discussion-timeline js-quote-selection-container" id="taskInforEle">
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<br>
	<div class="container process">
		<div id="process">
			<div id="flowRunTrackInforEle" style="display: none;" class="proc_bg"></div>
			<div id="flowGraphicInforEle" class="proc_bg"></div>
		</div>
	</div>
	<script type="text/javascript">
		$(document).ready(function(){
			var isIELowVer = window.ActiveXObject && ($.browser.msie && $.browser.version < 8.0); 
			//流程信息
			var flowInfor = new FlowInfor({
				 eleId:'flowInforEle',
			    action : _serviceUrl,
				processInstanceId : _processInstanceId
			});
			flowInfor.init(); 
			//流程运行轨迹信息
			var flowRunTrackInfor = new FlowRunTrackInfor({
				eleId:'flowRunTrackInforEle',
				isIELowVer:isIELowVer,
				action : _serviceUrl + 'task/runTrack',
				processInstanceId : _processInstanceId
			});
			flowRunTrackInfor.init();
			//流程图信息
			var flowGraphicInfor = new FlowGraphicInfor({
				eleId:'flowGraphicInforEle',
				isIELowVer : isIELowVer,
				action : _serviceUrl,
				processInstanceId : _processInstanceId,
				runTrackObj:flowRunTrackInfor
			});
			flowGraphicInfor.init();
			//任务信息
		     var taskInfor = new TaskInfor({
		    	eleId:'taskInforEle',
		    	action : _serviceUrl,
				processInstanceId : _processInstanceId,
				processDefinitionKey : _processDefinitionKey,
				flowInforObj:flowInfor,
				flowGraphicInforObj:flowGraphicInfor
			}).init();
		});
	</script>
</body>
</html>

   以上html中

  

taskDetailInfor.css 样式文件;
jquery.js juqery工具;
foxbpmframework.js foxbpm框架工具(请求参数获取、rest服务地址配置等公共特性);
taskInfor.js 任务信息处理;
flowInfor.js 流程信息处理;
flowGraphicInfor.js 流程图信息处理;
flowRunTrackInfor.js 流程轨迹信息处理;

   
   附件是界面展现效果;

   以上是FoxBPM任务详细信息页面展现,关于更多FoxBPM请链接https://github.com/FoxBPM

   
 

 

  • 大小: 65 KB
分享到:
评论

相关推荐

    foxBPM入门项目

    FoxBPM(6.0版本开始fixflow改名为FoxBPM)是一款开源的基于BPMN2.0标准的工作流引擎,引擎底层直接支持BPMN2.0国际标准, 吸纳了 jBPM3 、 Activiti5、BonitaBPM 等国际开源流程引擎的精髓, 同时提供了强大的中国式流程...

    关于FoxBPM连接器介绍

    请假审批 博文链接:https://yangguangftlp.iteye.com/blog/2106720

    FoxBPM-Designer:FoxBPM流程设计器

    FoxBPM-Designer FoxBPM流程设计器 #分支介绍 develop 最新开发版 master 最新稳定版 release-* 发布分支为准备新的产品版本发布做支持 hotfix-* 当产品版本的重大bug需要立即解决的时候,我们从对应版本的标签创建...

    debugpy-1.7.0-cp310-cp310-win32.whl

    Python库是一组预先编写的代码模块,旨在帮助开发者实现特定的编程任务,无需从零开始编写代码。这些库可以包括各种功能,如数学运算、文件操作、数据分析和网络编程等。Python社区提供了大量的第三方库,如NumPy、Pandas和Requests,极大地丰富了Python的应用领域,从数据科学到Web开发。Python库的丰富性是Python成为最受欢迎的编程语言之一的关键原因之一。这些库不仅为初学者提供了快速入门的途径,而且为经验丰富的开发者提供了强大的工具,以高效率、高质量地完成复杂任务。例如,Matplotlib和Seaborn库在数据可视化领域内非常受欢迎,它们提供了广泛的工具和技术,可以创建高度定制化的图表和图形,帮助数据科学家和分析师在数据探索和结果展示中更有效地传达信息。

    ipython-5.0.0b2.zip

    Python库是一组预先编写的代码模块,旨在帮助开发者实现特定的编程任务,无需从零开始编写代码。这些库可以包括各种功能,如数学运算、文件操作、数据分析和网络编程等。Python社区提供了大量的第三方库,如NumPy、Pandas和Requests,极大地丰富了Python的应用领域,从数据科学到Web开发。Python库的丰富性是Python成为最受欢迎的编程语言之一的关键原因之一。这些库不仅为初学者提供了快速入门的途径,而且为经验丰富的开发者提供了强大的工具,以高效率、高质量地完成复杂任务。例如,Matplotlib和Seaborn库在数据可视化领域内非常受欢迎,它们提供了广泛的工具和技术,可以创建高度定制化的图表和图形,帮助数据科学家和分析师在数据探索和结果展示中更有效地传达信息。

    debugpy-1.1.0-cp36-cp36m-manylinux1_x86_64.whl

    Python库是一组预先编写的代码模块,旨在帮助开发者实现特定的编程任务,无需从零开始编写代码。这些库可以包括各种功能,如数学运算、文件操作、数据分析和网络编程等。Python社区提供了大量的第三方库,如NumPy、Pandas和Requests,极大地丰富了Python的应用领域,从数据科学到Web开发。Python库的丰富性是Python成为最受欢迎的编程语言之一的关键原因之一。这些库不仅为初学者提供了快速入门的途径,而且为经验丰富的开发者提供了强大的工具,以高效率、高质量地完成复杂任务。例如,Matplotlib和Seaborn库在数据可视化领域内非常受欢迎,它们提供了广泛的工具和技术,可以创建高度定制化的图表和图形,帮助数据科学家和分析师在数据探索和结果展示中更有效地传达信息。

    基于springboot的在线教育管理系统

    基于springboot的在线教育管理系统,

    ipython-7.1.0.tar.gz

    Python库是一组预先编写的代码模块,旨在帮助开发者实现特定的编程任务,无需从零开始编写代码。这些库可以包括各种功能,如数学运算、文件操作、数据分析和网络编程等。Python社区提供了大量的第三方库,如NumPy、Pandas和Requests,极大地丰富了Python的应用领域,从数据科学到Web开发。Python库的丰富性是Python成为最受欢迎的编程语言之一的关键原因之一。这些库不仅为初学者提供了快速入门的途径,而且为经验丰富的开发者提供了强大的工具,以高效率、高质量地完成复杂任务。例如,Matplotlib和Seaborn库在数据可视化领域内非常受欢迎,它们提供了广泛的工具和技术,可以创建高度定制化的图表和图形,帮助数据科学家和分析师在数据探索和结果展示中更有效地传达信息。

    grpcio-1.59.3-cp310-cp310-manylinux_2_17_aarch64.whl

    Python库是一组预先编写的代码模块,旨在帮助开发者实现特定的编程任务,无需从零开始编写代码。这些库可以包括各种功能,如数学运算、文件操作、数据分析和网络编程等。Python社区提供了大量的第三方库,如NumPy、Pandas和Requests,极大地丰富了Python的应用领域,从数据科学到Web开发。Python库的丰富性是Python成为最受欢迎的编程语言之一的关键原因之一。这些库不仅为初学者提供了快速入门的途径,而且为经验丰富的开发者提供了强大的工具,以高效率、高质量地完成复杂任务。例如,Matplotlib和Seaborn库在数据可视化领域内非常受欢迎,它们提供了广泛的工具和技术,可以创建高度定制化的图表和图形,帮助数据科学家和分析师在数据探索和结果展示中更有效地传达信息。

    grpcio-1.59.0-cp39-cp39-manylinux_2_17_aarch64.whl

    Python库是一组预先编写的代码模块,旨在帮助开发者实现特定的编程任务,无需从零开始编写代码。这些库可以包括各种功能,如数学运算、文件操作、数据分析和网络编程等。Python社区提供了大量的第三方库,如NumPy、Pandas和Requests,极大地丰富了Python的应用领域,从数据科学到Web开发。Python库的丰富性是Python成为最受欢迎的编程语言之一的关键原因之一。这些库不仅为初学者提供了快速入门的途径,而且为经验丰富的开发者提供了强大的工具,以高效率、高质量地完成复杂任务。例如,Matplotlib和Seaborn库在数据可视化领域内非常受欢迎,它们提供了广泛的工具和技术,可以创建高度定制化的图表和图形,帮助数据科学家和分析师在数据探索和结果展示中更有效地传达信息。

    debugpy-1.0.0b4-cp37-cp37m-manylinux1_i686.whl

    Python库是一组预先编写的代码模块,旨在帮助开发者实现特定的编程任务,无需从零开始编写代码。这些库可以包括各种功能,如数学运算、文件操作、数据分析和网络编程等。Python社区提供了大量的第三方库,如NumPy、Pandas和Requests,极大地丰富了Python的应用领域,从数据科学到Web开发。Python库的丰富性是Python成为最受欢迎的编程语言之一的关键原因之一。这些库不仅为初学者提供了快速入门的途径,而且为经验丰富的开发者提供了强大的工具,以高效率、高质量地完成复杂任务。例如,Matplotlib和Seaborn库在数据可视化领域内非常受欢迎,它们提供了广泛的工具和技术,可以创建高度定制化的图表和图形,帮助数据科学家和分析师在数据探索和结果展示中更有效地传达信息。

    debugpy-1.2.0-cp37-cp37m-manylinux2010_i686.whl

    Python库是一组预先编写的代码模块,旨在帮助开发者实现特定的编程任务,无需从零开始编写代码。这些库可以包括各种功能,如数学运算、文件操作、数据分析和网络编程等。Python社区提供了大量的第三方库,如NumPy、Pandas和Requests,极大地丰富了Python的应用领域,从数据科学到Web开发。Python库的丰富性是Python成为最受欢迎的编程语言之一的关键原因之一。这些库不仅为初学者提供了快速入门的途径,而且为经验丰富的开发者提供了强大的工具,以高效率、高质量地完成复杂任务。例如,Matplotlib和Seaborn库在数据可视化领域内非常受欢迎,它们提供了广泛的工具和技术,可以创建高度定制化的图表和图形,帮助数据科学家和分析师在数据探索和结果展示中更有效地传达信息。

    debugpy-1.0.0b1-cp36-cp36m-manylinux1_i686.whl

    Python库是一组预先编写的代码模块,旨在帮助开发者实现特定的编程任务,无需从零开始编写代码。这些库可以包括各种功能,如数学运算、文件操作、数据分析和网络编程等。Python社区提供了大量的第三方库,如NumPy、Pandas和Requests,极大地丰富了Python的应用领域,从数据科学到Web开发。Python库的丰富性是Python成为最受欢迎的编程语言之一的关键原因之一。这些库不仅为初学者提供了快速入门的途径,而且为经验丰富的开发者提供了强大的工具,以高效率、高质量地完成复杂任务。例如,Matplotlib和Seaborn库在数据可视化领域内非常受欢迎,它们提供了广泛的工具和技术,可以创建高度定制化的图表和图形,帮助数据科学家和分析师在数据探索和结果展示中更有效地传达信息。

    ipython-7.9.0.tar.gz

    Python库是一组预先编写的代码模块,旨在帮助开发者实现特定的编程任务,无需从零开始编写代码。这些库可以包括各种功能,如数学运算、文件操作、数据分析和网络编程等。Python社区提供了大量的第三方库,如NumPy、Pandas和Requests,极大地丰富了Python的应用领域,从数据科学到Web开发。Python库的丰富性是Python成为最受欢迎的编程语言之一的关键原因之一。这些库不仅为初学者提供了快速入门的途径,而且为经验丰富的开发者提供了强大的工具,以高效率、高质量地完成复杂任务。例如,Matplotlib和Seaborn库在数据可视化领域内非常受欢迎,它们提供了广泛的工具和技术,可以创建高度定制化的图表和图形,帮助数据科学家和分析师在数据探索和结果展示中更有效地传达信息。

    电子行业周报:地震影响逐步明朗,三星SSD涨价超预期.pdf

    电子元件 电子行业 行业分析 数据分析 数据报告 行业报告

    libaacs-utils-0.11.1-3.fc39.x86_64.rpm

    aacs-utils安装包 rpm -i xx.rpm 注意架构是否一致

    基于TMS320F28335的开关电源模块并联供电系统

    基于TMS320F28335的开关电源模块并联供电系统

    debugpy-1.0.0b12-cp35-cp35m-manylinux1_x86_64.whl

    Python库是一组预先编写的代码模块,旨在帮助开发者实现特定的编程任务,无需从零开始编写代码。这些库可以包括各种功能,如数学运算、文件操作、数据分析和网络编程等。Python社区提供了大量的第三方库,如NumPy、Pandas和Requests,极大地丰富了Python的应用领域,从数据科学到Web开发。Python库的丰富性是Python成为最受欢迎的编程语言之一的关键原因之一。这些库不仅为初学者提供了快速入门的途径,而且为经验丰富的开发者提供了强大的工具,以高效率、高质量地完成复杂任务。例如,Matplotlib和Seaborn库在数据可视化领域内非常受欢迎,它们提供了广泛的工具和技术,可以创建高度定制化的图表和图形,帮助数据科学家和分析师在数据探索和结果展示中更有效地传达信息。

    grpcio-1.49.1-cp37-cp37m-musllinux_1_1_i686.whl

    Python库是一组预先编写的代码模块,旨在帮助开发者实现特定的编程任务,无需从零开始编写代码。这些库可以包括各种功能,如数学运算、文件操作、数据分析和网络编程等。Python社区提供了大量的第三方库,如NumPy、Pandas和Requests,极大地丰富了Python的应用领域,从数据科学到Web开发。Python库的丰富性是Python成为最受欢迎的编程语言之一的关键原因之一。这些库不仅为初学者提供了快速入门的途径,而且为经验丰富的开发者提供了强大的工具,以高效率、高质量地完成复杂任务。例如,Matplotlib和Seaborn库在数据可视化领域内非常受欢迎,它们提供了广泛的工具和技术,可以创建高度定制化的图表和图形,帮助数据科学家和分析师在数据探索和结果展示中更有效地传达信息。

    debugpy-1.0.0b2-cp37-cp37m-manylinux1_x86_64.whl

    Python库是一组预先编写的代码模块,旨在帮助开发者实现特定的编程任务,无需从零开始编写代码。这些库可以包括各种功能,如数学运算、文件操作、数据分析和网络编程等。Python社区提供了大量的第三方库,如NumPy、Pandas和Requests,极大地丰富了Python的应用领域,从数据科学到Web开发。Python库的丰富性是Python成为最受欢迎的编程语言之一的关键原因之一。这些库不仅为初学者提供了快速入门的途径,而且为经验丰富的开发者提供了强大的工具,以高效率、高质量地完成复杂任务。例如,Matplotlib和Seaborn库在数据可视化领域内非常受欢迎,它们提供了广泛的工具和技术,可以创建高度定制化的图表和图形,帮助数据科学家和分析师在数据探索和结果展示中更有效地传达信息。

Global site tag (gtag.js) - Google Analytics