• 发货源资源网

    [质量:5|效率:5|态度:5 ]

  • 当前位置:首页 > 源码集市 > 流程图控件 >
    收藏商品 分享到:
    举报
    BS拖拽工作流设计及研发源码
    • 售  价:
    • 免费
    • 语  言:
    • C#
    • 数 据 库:
    • 品  牌:
    • WebForm
    • 最后更新:
    • 2012-12-19 21:12:54
    • 大  小:
    • 1.15MB MB
    • 演示网站:

      自动发货商品,随时可以购买,零等待。

      购买本商品,交易成功后可获赠积分。

      担保交易,有问题不解决24小时内可申请退款,安全保证。

    商品详情 交易评价 交易规则

    发货源资源网

    本文主要目录如下:

    一、概述

    二、需求分析及设计

    三、数据结构设计

    四、技术选型

    五、界面和代码赏析

    六、Demo源码下载

     

    一、概述

    BS应用系统或互联网网站中经常会有一些漂亮的流程图的展示,传统的开发方式一般是由项目经理或产品经理根据客户的需求画出流程图原型,然后交由美工设计效果图评审并切割,再由研发这边根据美工切割的html结合实际业务流程实现流程图的动态显示,这个过程涉及了各个工作角色,整个过程工作量比较巨大,尤其是在美工和研发这两方面都需要投入比较多的精力和时间,我这里所说的流程图并不是行业专用流程,它可能是工作流、自由流、状态机中的任何一个,那我们如何去抽象出一种能够满足大部分应用系统展示漂亮流程图的组件呢?我觉得有必要结合一种典型的应用场景,去设计、评审和研发,下图就是一种典型的应用场景,这是运行态的一个流程图,它主要包括两部分图例和流程图动态解析渲染。

    二、需求分析及设计

    1、用例分析

    <组件总体用例>:主要包括图例信息、流程设计态和流程运行态3部分;

    <流程设计、图例信息>:

    <流程运行态>

     

    2、鲁棒图分析

    基于鲁棒图分析我们可以很好的发现一些实体,如下图:

    通过此图我们可以很好的发现流程图的一些实体信息,为以后的数据结构设计做好了充分的铺垫。

    3、需求矩阵

    三、数据结构设计

    经过充分的需求分析和设计,我们可以进行数据结构设计了,见下图:

     

    表名:DRAG_FLOW_INFOS 

    序号

    列名

    数据类型

    长度

    小数位

    标识

    主键

    允许空

    默认值

    说明

    1

    DF_ID

    varchar

    200

    0

     

     

    流程号

    2

    DFL_ID

    varchar

    200

    0

     

     

     

    流程图例号

    3

    DF_NAME

    varchar

    200

    0

     

     

     

    流程名称

    4

    DF_DESC

    varchar

    3900

    0

     

     

     

    流程描述

    5

    DF_DEPTNAME

    varchar

    200

    0

     

     

     

    部门名称

    6

    DF_DEPTCODE

    varchar

    100

    0

     

     

     

    部门编码

    7

    DF_CREATER_ID

    varchar

    100

    0

     

     

     

    创建人号

    8

    DF_CREATER

    varchar

    200

    0

     

     

     

    创建者

    9

    DF_CREATETIME

    datetime

    8

    3

     

     

     

    创建时间

    10

    DF_VERSION

    varchar

    10

    0

     

     

     

    版本号(v1.0、v2.0等)

    11

    DF_ISACTIVE

    varchar

    4

    0

     

     

     

    是或否(只有活动的流程才可以使用,可以使用此字段把流程Disable)

    12

    DF_LASTMODIFIED

    datetime

    8

    3

     

     

     

    备用字段1

    13

    DF_ISEDIT

    varchar

    4

    0

     

     

     

    是或否

    表名:DRAG_FLOW_LEGENDELEMENTS 

    序号

    列名

    数据类型

    长度

    小数位

    标识

    主键

    允许空

    默认值

    说明

    1

    DFLE_ID

    varchar

    200

    0

     

     

     

    元素号

    2

    DFL_ID

    varchar

    200

    0

     

     

     

    图例号

    3

    DFLE_INNERTEXT

    varchar

    400

    0

     

     

     

     

    4

    DFLE_TYPE

    varchar

    20

    0

     

     

     

    分为实线矩形、虚线框矩形、椭圆、未办框、正办框、已办框、未办框等

    5

    DFLE_TEXT_CUTLENGTH

    int

    4

    0

     

     

     

     

    6

    DFLE_ISHIDDEN

    varchar

    4

    0

     

     

     

    是否(显示是否隐藏,默认为否)

    表名:DRAG_FLOW_LEGENDINFOS 

    序号

    列名

    数据类型

    长度

    小数位

    标识

    主键

    允许空

    默认值

    说明

    1

    DFL_ID

    varchar

    200

    0

     

     

     

    图例号

    2

    DFL_STYLE

    varchar

    20

    0

     

     

     

    样式

    3

    DFL_ISDEFAULT

    varchar

    4

    0

     

     

     

    是否默认图例

    4

    DFL_CREATORID

    varchar

    100

    0

     

     

     

    创建者ID

    5

    DFL_CREATOR

    varchar

    200

    0

     

     

     

    创建者

    6

    DFL_CREATDATE

    datetime

    8

    3

     

     

     

    创建时间

    7

    DFL_LASTUPDATEDATE

    datetime

    8

    3

     

     

     

    最近修改时间

    8

    DFLE_ISDRAGED

    varchar

    4

    0

     

     

     

    是否(拖拽)

    表名:DRAG_FLOW_STEPS 

    序号

    列名

    数据类型

    长度

    小数位

    标识

    主键

    允许空

    默认值

    说明

    1

    DFS_ID

    varchar

    200

    0

     

     

     

    步骤号

    2

    DF_ID

    varchar

    200

    0

     

     

     

    流程号

    3

    DFS_NAME

    varchar

    200

    0

     

     

     

    步骤名称

    4

    DFS_DESC

    varchar

    3800

    0

     

     

     

    步骤描述

    5

    DFS_TYPE

    varchar

    20

    0

     

     

     

    步骤类型(实线矩形、虚线矩形、椭圆、空白框等)

    6

    DFS_ORDERNO

    int

    4

    0

     

     

     

    排序号

    7

    DFS_X

    float

    8

    0

     

     

     

    坐标X

    8

    DFS_Y

    float

    8

    0

     

     

     

    坐标Y

    9

    DFS_WIDTH

    int

    4

    0

     

     

     

    宽度

    10

    DFS_HEIGHT

    int

    4

    0

     

     

     

    高度

    11

    DFS_PARENTID

    varchar

    200

    0

     

     

     

    父ID

    12

    DFS_TITLE_CUTLENGTH

    int

    4

    0

     

     

     

    标题切割长度

    13

    DFS_DESC_CUTLENGTH

    int

    4

    0

     

     

     

    描述切割长度

    14

    DFS_STYLE

    varchar

    40

    0

     

     

     

    样式

    15

    DFS_ISROOTSTEP

    varchar

    4

    0

     

     

     

    是或否(是否首步骤)

    表名:DRAG_FLOW_STEPSRELATION 

    序号

    列名

    数据类型

    长度

    小数位

    标识

    主键

    允许空

    默认值

    说明

    1

    DFSR_ID

    varchar

    200

    0

     

     

     

    步骤关系ID

    2

    DF_ID

    varchar

    200

    0

     

     

     

    流程ID

    3

    DFS_SOURCEID

    varchar

    200

    0

     

     

     

    源步骤ID

    4

    DFS_TARGETID

    varchar

    200

    0

     

     

     

    目标步骤号

    5

    DFSR_CSSCLASS

    varchar

    50

    0

     

     

     

    连接器样式

    6

    DFSR_CONNECTOR

    varchar

    100

    0

     

     

     

    连接器(Flowchart、Bezier、Straight、StateMachine等),默认为Flowchart

    7

    DFSR_ANCHORS

    varchar

    1000

    0

     

     

     

    锚点集合,类似["Center", "Center"]

    8

    DFSR_ANCHOR

    varchar

    100

    0

     

     

     

    锚点类型,此字段优于DFSR_Anchors字段,值有Continuous、AutoDefault、Assign、Perimeter、Center等,默认为Continuous

    9

    DFSR_PAINTSTYLE

    varchar

    1000

    0

     

     

     

    绘制样式

    10

    DFSR_ENDPOINT

    varchar

    1000

    0

     

     

     

    端点有:Blank、Image、Rectangle、Dot等

    11

    DFSR_ENDPOIONTSTYLE

    varchar

    1000

    0

     

     

     

    端点样式

    12

    DFSR_HOVERSTYLE

    varchar

    1000

    0

     

     

     

    盘旋样式

    13

    DFSR_OVERLAYS

    varchar

    1000

    0

     

     

     

    填充物

    14

    DFSR_LABEL

    varchar

    1000

    0

     

     

     

    标签

    15

    DFSR_LABELSTYLE

    varchar

    1000

    0

     

     

     

    标签样式

    表名:DRAG_FLOW_VERSION

    序号

    列名

    数据类型

    长度

    小数位

    标识

    主键

    允许空

    默认值

    说明

    1

    DFV_CUR_ID

    varchar

    200

    0

     

     

    当前版本流程号

    2

    DFV_BEF_ID

    varchar

    200

    0

     

     

    之前版本流程号

    四、技术选型

    1、流程图UI界面主样式-BootStrap:GitHub上这样介绍 bootstrap:简单灵活可用于架构流行的用户界面和交互接口的html,css,javascript工具集。基于html5、css3的bootstrap,具有大量的诱人特性:友好的学习曲线,卓越的兼容性,响应式设计,12列格网,样式向导文档,自定义JQuery插件,完整的类库,基于Less等,BootStrap设计非常优雅,唯一的缺憾是不兼容IE6,不过做应用系统的现在应该可以抛弃 IE6了,据调查IE6是中国的重灾区,由于它本身的安全性等缺陷,很容易遭受各种攻击;

    2、流程图、图例管理-EasyUI:jQuery easyui 为网页开发提供了一堆的常用UI组件,包括菜单、对话框、布局、窗帘、表格、表单等等,它的布局和表格非常简洁和优雅;

    3、流程图设计态-JSPlum,我找了半天才找到它,这真是一个优秀的js流程图框架,封装的非常好,支持3种主流的渲染模式:SVG、Canvas和VML,技术底层library也支持:JQuery、MoonTools、YUI3,这里我们果断选择JQuery+VML模式,做应用吗要考虑到各种应用场景!  

    五、界面及代码赏析

    1、流程设计态界面,见下图:

    2、代码这一块我这边把相关代码结构进行一下简答的说明,这里不再赘述,如果有感兴趣的朋友,可以下载代码;

     

     

    交易评价
      (0)
      <

      1/5

      >
    交易规则
    • 交易流程
    • 发货方式
    • 1、自动:在上方保障服务中标有自动发货的商品,拍下后,将会自动收到来自卖家的商品获取(下载)链接;

      2、手动:未标有自动发货的的商品,拍下后,卖家会收到邮件、短信提醒,也可通过QQ或订单中的电话联系对方。

    • 退款说明
    • 1、描述:源码描述(含标题)与实际源码不一致的(例:描述PHP实际为ASP、描述的功能实际缺少、版本不符等);

      2、演示:有演示站时,与实际源码小于95%一致的(但描述中有"不保证完全一样、有变化的可能性"类似显著声明的除外);

      3、发货:手动发货源码,在卖家未发货前,已申请退款的;

      4、服务:卖家不提供安装服务或需额外收费的(但描述中有显著声明的除外);

      5、其他:如质量方面的硬性常规问题等。

      注:经核实符合上述任一,均支持退款,但卖家予以积极解决问题则除外。交易中的商品,卖家无法对描述进行修改!

    • 注意事项
    • 1、在未拍下前,双方在QQ上所商定的内容,亦可成为纠纷评判依据(商定与描述冲突时,商定为准);

      2、在商品同时有网站演示与图片演示,且站演与图演不一致时,默认按图演作为纠纷评判依据(特别声明或有商定除外);

      3、在没有"无任何正当退款依据"的前提下,写有"一旦售出,概不支持退款"等类似的声明,视为无效声明;

      4、虽然交易产生纠纷的几率很小,但请尽量保留如聊天记录这样的重要信息,以防产生纠纷时便于16Aspx源码介入快速处理。

    • 16Aspx源码声明
    • 1、16Aspx源码作为第三方中介平台,依据交易合同(商品描述、交易前商定的内容)来保障交易的安全及买卖双方的权益;

      2、非平台线上交易的项目,出现任何后果均与16Aspx源码无关;无论卖家以何理由要求线下交易的,请联系管理举报。

  • 宝贝数量:7080
  • 创店时间:2016/6/13 21:24:13
  • 联系客服

    330199865

    店内搜索
  • 商品:
  • 价格: -
  • 本店销量榜

    1微信公众平台Bee.WeiXin开发源码

    2BS拖拽工作流设计及研发源码

    3通用权限管理系统(含文档、数据库)源码

    4Easyui之权限系统源码

    5ASP.NETMVC+EF框架+EasyUI实现权限管理源码

    6仿东软OA协同办公服务管理源码

    7通用OA系统增强源码

    8Entity Framework4.1+MVC3+Jquery EasyUI的DEMO源码

    9基于FineUI的通用权限管理框架源码

    10大型固定资产管理系统源码

    广而告之