专利名称:Arp框架下的图形化流程模板绘制方法
技术领域:
本发明属于工作流管理平台领域,具体是一种基于FLE利记体育和ActionScript语言实现 的,在ARP框架下的图形化流程模板绘制方法。
背景技术:
目前WEB上的图形绘制,基本是利用传统的浏览器脚本语言如VBScript、 JavaScript等, 绘制出来的图形不够美观,且灵活程度相当有限,又因为它们是开发的插件,需要客户机在 使用时安装插件,这既容易受客户机的环境影响,也给使用者带来一定的软件风险。
Flex是Adobe发布的presentation server (展现月艮务),它是Java Web container或者.net server的一个应用,根据.mxml文件(纯粹的xml描述文件和actionscript)产生相应得.swf文 件,传送到客户端,由客户端的flash player或者Shockwave player解释执行,给用户以丰富 的客户体验。
ActionScript动作脚本是遵循ECMAscript第四版的Adobe Flash Player运行
时环境的编程语言,它在Flash内容和应用程序中实现交互性、数据处理、以极其他 功能。
ARP是轻量级的、基于模式的结构化框架,主要由控制器、事件、命令、模型和视图组成。
图1展示了实际应用中ARP的框架一个例子,图中,Controller是控制器,QueryEvent 为事件,CMD为命令,ModelLocator为模型,视图是表现层。
发明内容
发明目的针对目前生产流程中,缺少图形化展现和配置的流程模板难于被用户理解, 本发明通过FLE利记体育绘制图像,展现流程模板中各个图形元素间的相互关系及其走向,提高 了用户对服务开通流程的理解。
同时,本发明结合ARP框架,利用FLE利记体育进行图形化配置流程模板,并将图形数据以 某种数据结构保存到数据库中。各个流程模板可以按一定条件组合以形成现实中的更为复杂 的流程,利用FLEX可以更美观地在WEB上展现。具体技术方案如下
在FLEX框架下,利用复杂的算法根据数据模型的配置展现流程图,再通过ActionScript 技术实时刷新图形界面,在WEB浏览器上绘制图形。 所述算法的步骤包括-
a) 绘制流程图节点获取鼠标当前位置,动态生成节点图,添加节点到绘制区域中鼠标 当前位置;
b) 绘制流程图节点间的连线获取起点和终点坐标,绘制两点间的连线,取连线中间坐 标位置,绘制表示方向的箭头;
c) 支持节点拖动算法是,获取当前节点坐标,鼠标拖动节点到鼠标当前位置,监听鼠 标左键按下MOUSE—DOWN、鼠标移动MOUSE—MOVE和鼠标左键松开MOUSE—UP事件, 重新绘制连线;
d) 流程图数据保存循环取得流程图上节点和连线对象,并取得节点和连线的数据信息, 分别保存到路由表和坐标表中。
本方法基于专有的数据模型,所述专有数据模型一个是流程图的路由线段信息 FLOW—ROUTE,另一个是流程图上节点的坐标信息FL0W_TACHE—COORD I NATE 。
在FLEX框架下,Flex图形界面的展现是基于路由线段信息和节点信息,Flex读取路由线 段信息和节点信息,并生成流程图形,以直观的图形化方式显示流程图信息和流程图的节点 信息;点和线段的图形化采用了Flex自定义组件的方式,使用ActionScript编程语言实现。
本方法支持用户拖拽节点,连接节点绘制流程模板,并能展现实际流程,图形化展现和 绘制流程图更容易被用户所接受和理解,可以直接应用于流程管理平台中流程模板的图形化 展现和绘制,尤其适用于电信行业的工作流管理平台。
图1是现有技术中ARP的框架举例的示意图。
图2是已经配置好的的流程模板的关系及走向示意图。
图3是生成新节点的操作界面示意图。
图4是鼠标右键点击节点后操作界面示意图。
图5保存流程模板图形保到数据库的操作界面示意图。
具体实施例方式
下面结合附图与具体实施方式
对本发明作进一步说明。
一种基于FLE利记体育和ActionScript语言实现的,在ARP框架下的图形化流程模板绘制 方法,步骤是先通过FLE利记体育,利用复杂的算法根据配置展现流程图,再通过 ActionScript3. 0技术实时刷新图形界面,在WEB浏览器上绘制图形。
1)数据模型
流程图的展现需要两个关系表支持, 一个是流程图的路由线段信息(FLOW—R0UTE),另一 个是流程图上节点的坐标信息(FLOW—TACHE—COORDINATE),表字段信息如表a、 b所示 a. FLOW TACHE COORDINATE
字段名数据类型字段含义
TACHE—IDVARCHAR2(6)环节ID
FLOW—ID窗CHAR2(15)流程模板ID
COORDINATE—XNUMBER(5)X坐标
COORDINATE—Y■BER(5)Y坐标
,L0W—TACHE—COORDINATE表,TACHE—ID代表流程图上的节点,FL0W_ID J COORDINATE—X, COORDINATE—Y是展现流程图时,节点的具体坐标位置。 ).FLOW—ROUTE字段名数据类型字段含义
FLOW—ROUTE—IDINTEGER
TRANSITION—NAMEVARC廳2(255)名称
TRANSITION—DESCVARC廳2(255)注释
FLOW—ID窗C腿2(15)流程模板ID
SOURCE—TACHE—ID窗CHAR2 (6)源环节ID
TARGET—TACHE—IDVARC腿2(6)目标环节ID
CONDITIONVARCHAR2(255)条件
SOURCE—TACHE—INDEXNUMBER(5)1个源环节对应多 个目标环节序号
FLOW—ROUTE表主要目的是保存各个节点的关系(对应流程图上各节点间的连线), SOURCE—TACHE—ID和TARGET—TACHEJD表明从一个节点到另一节点,CONDITION表明节点间的 连线的关系,FL0W_ID是这些连线所属的流程模板。
52)程序算法
a、 绘制流程图节点
描述结合FL0W_TACHE_C00RDINATE表(节点ID和坐标)在流程图上展现节点,如图2, 节点是一个由image(图片)和label (文本显示标签)自定制组件.如果是新增节点则需要用户 设置一些基本信息,节点的坐标取当前鼠标的坐标。
算法获取鼠标当前位置,动态生成节点图,添加节点到绘制区域中鼠标当前位置。
b、 绘制流程图节点间的连线
描述结合FLOW—ROUTE表在流程图上可方便绘制节点间的连线,如图2
连线是一个也是一个自定义组件.自定义组件包含鼠标双击事件(弹出窗口设置连线条 件),鼠标右键菜单事件(右键菜单增加了删除当前连线的功能).
算法以上图"开始"和"结束"节点为例,获取"开始"和"结束"坐标,绘制两点 间的连线,取连线中间坐标位置,绘制表示方向的箭头。
c、支持节点拖动
描述绘制流程图时,操作人员会移动流程图上节点的位置来设计流程图,如图2,
如果配线节点移动,则配线节点左右两边的连接位置需要实时改变,刷新左右两边的连 线算法上不同之处在于,对于左边的连线,线的开始位置不变,对于右边的连线,线的结束 位置不变,根据这一特点利用算法把配线节点所包含的连线进行实时绘制(在节点移动中清 除旧的连线和生成新的连线)。
算法获取当前节点坐标,鼠标拖动节点到鼠标当前位置,监听鼠标M0USE_D0WN、 MOUSE一MOVE、 M0USE_D0WN事件,重新绘制连线。
d、流程图数据保存
描述对于绘制好的流程图,每个节点和连线都有相关数据信息,为了能再次展现绘制 好的流程图,需要将数据保存到两张关系表中。
算法循环取得流程图上节点和连线对象,并取得节点和连线的数据信息,分别保存到 路由表和坐标表中。
图2展现了已经配置好的的流程模板的关系及走向。节点的位置可以拖动,之间的连线 会跟随节点自动刷新,连线关系可以删除或者增加;节点可以删除和增加,增加的时候从右 上角的树状菜单中拖拽到界面上即可。图3中,拖拽新节点到流程图上来时,即提示用户输入一些基本的信息,然后生成该节点。
图4中,右键点击节点出现的右键菜单里可以进行环节配置、删除节点、删除后续连线 等操作。
图5中,点击上面的保存按钮,可以把刚才绘制的流程模板图形保存到数据库中。
流程图绘制是个单独的Flex应用,需要传入一个流程模板ID的参数,运行于支持Adobe Flash Player的浏览器中,发布的WEB包中需要包括编译后封装的HTML和SWF文件,并且 数据库建好前面描述的两张关系表a和b。
应用环境与操作说明如下
1、流程模板绘制区域工具栏介绍
a) 节点工具栏
返回返回到流程模板査询条件区域
新建添加流程图上的开始和结束结节,省去手工添加的麻烦,因为这两个节点是必需
的
开始节点手工直接添加开始节点 结束节点手工直接添加结束节点
连线在两个节点之前连线,此时鼠标变成手指形状,指示用户操作
选择这个是在用户连线过程中如果要取消掉连线状态,则可以单击此按钮,使鼠标恢 复到可以选择节点的状态
保存保存节点数据到数据库中。
b) 流程图绘制区域绘制和展示流程图的区域,可以从岗位选择区域里选择岗位,拖动 或双击添加到绘制区域。
C)岗位选择列出了可以添加到绘制区域的岗位信息,以树状分类显示,便于用户浏览 数据。也可以通过输入过滤条件来找到所需要的岗位信息,只需要在过滤条件输入区域内输 入岗位的关键字即可。
d)岗位信息显示显示当前节点的岗位信息,只可以査看,不可以编辑。2、绘制流程图示例
a) 单击工具栏"新建"按钮,自动添加开始和结束节点
b) 拖动结束节点往后面,空出区域来添加其它节点。可以查看岗位信息,参考坐标信息
c) 从岗位选择区域内选择服务开通下的"程控/APS",双击或拖动到绘制区域
d) 在弹出的窗口中设置环节ID,如果要从已有的环节中去查找,则单击已有环节按钮,
从弹出的列表框中选择
e) 继续添加测量台、外线节点
f) 添加连线,选择工具栏上的"连线",选择绘图区域的"开始"节点,移动鼠标到"程 控/APS"节点后单击,生成"开始"节点到"程控/APS"节点的连线。
g) 如果不需要"程控/APS"节点,可以删除这个节点和前面的连线,可以在节点和连线 上单击右键,选择"删除连线"、"删除节点"
h) 重新连接"开始"和"测量台"
i) 移动节点到适当的位置,使流程图看起来更美观。 j)保存数据,单击工具栏上的"保存"按钮。
k)修改节点环节信息,右键单击节点,从弹出的右键菜单中选择"环节配置",弹出"环 节配置"窗口,可以重新选择环节。
基于工作流平台的服务开通系统需要配置流程化数据,流程配置数据的专业化使得对流 程配置的展现有一定的困难,图形化的方式有利于对流程模板配置的理解,并通过绘制流程 模板进一步加深对流程配置的认识,使复杂的数据能以简单的图形方式来表现。每种特定的 流程模板数据都能以图形化的方式进行展现。
权利要求
1、ARP框架下的图形化流程模板绘制方法,其特征是在FLEX框架下,利用复杂的算法根据数据模型的配置展现流程图,再通过ActionScript技术实时刷新图形界面,在WEB浏览器上绘制图形;所述算法的步骤包括a)绘制流程图节点获取鼠标当前位置,动态生成节点图,添加节点到绘制区域中鼠标当前位置;b)绘制流程图节点间的连线获取起点和终点坐标,绘制两点间的连线,取连线中间坐标位置,绘制表示方向的箭头;c)支持节点拖动算法是,获取当前节点坐标,鼠标拖动节点到鼠标当前位置,监听鼠标左键按下MOUSE_DOWN、鼠标移动MOUSE_MOVE和鼠标左键松开MOUSE_UP事件,重新绘制连线;d)流程图数据保存循环取得流程图上节点和连线对象,并取得节点和连线的数据信息,分别保存到路由表和坐标表中;所述数据模型包括流程图的路由线段信息FLOW_ROUTE,和流程图上节点的坐标信息FLOW_TACHE_COORDINATE。
2、 根据权利要求1所述的ARP框架下的图形化流程模板绘制方法,其特征是在FLEX框 架下,Flex图形界面的展现是基于路由线段信息和节点信息,Flex读取路由线段信息和节点 信息,并生成流程图形,以直观的图形化方式显示流程图信息和流程图的节点信息;点和线 段的图形化采用了Flex自定义组件的方式,使用ActionScript编程语言实现。
全文摘要
一种ARP框架下的图形化流程模板绘制方法,在FLEX框架下,利用复杂的算法根据数据模型的配置展现流程图,再通过ActionScript技术实时刷新图形界面,在WEB浏览器上绘制图形。所述算法的步骤包括a)绘制流程图节点;b)绘制流程图节点间的连线;c)支持节点拖动;d)流程图数据保存。所述数据模型包括流程图的路由线段信息和流程图上节点的坐标信息。本方法支持用户拖拽节点,连接节点绘制流程模板,并能展现实际流程,图形化展现和绘制流程图更容易被用户所接受和理解,可以直接应用于流程管理平台中流程模板的图形化展现和绘制,尤其适用于电信行业的工作流管理平台。
文档编号G06F9/44GK101587438SQ20091003386
公开日2009年11月25日 申请日期2009年6月18日 优先权日2009年6月18日
发明者余志刚, 迪 朱, 朱志昊, 王验兵, 陈赫赫 申请人:南京联创科技股份有限公司