-
Notifications
You must be signed in to change notification settings - Fork 25
/
Copy pathdemo-view.html
98 lines (83 loc) · 3.85 KB
/
demo-view.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<link type="text/css" href="lib/jquery-ui-1.8.4.custom/css/smoothness/jquery-ui-1.8.4.custom.css" rel="stylesheet" />
<script type="text/javascript" src="lib/raphael.js"></script>
<script type="text/javascript" src="lib/jquery-ui-1.8.4.custom/js/jquery-1.4.2.min.js"></script>
<script type="text/javascript" src="lib/jquery-ui-1.8.4.custom/js/jquery-ui-1.8.4.custom.min.js"></script>
<script type="text/javascript" src="myflow.js"></script>
<script type="text/javascript" src="myflow.jpdl4.js"></script>
<script type="text/javascript">
$(function(){
$('#myflow').myflow({basePath : "",
restore:({states:{rect4:{type:'start',text:{text:'开始'}, attr:{ x:507, y:63, width:50, height:50}, props:{text:{value:'开始'},temp1:{value:''},temp2:{value:''}}},rect5:{type:'state',text:{text:'状态2'}, attr:{ x:487, y:284, width:100, height:50}, props:{text:{value:'状态2'},temp1:{value:''},temp2:{value:''}}},rect6:{type:'task',text:{text:'任务1'}, attr:{ x:311, y:284, width:100, height:50}, props:{text:{value:'任务1'},temp1:{value:''},temp2:{value:''}}},rect7:{type:'task',text:{text:'任务3'}, attr:{ x:675, y:287, width:100, height:50}, props:{text:{value:'任务3'},temp1:{value:''},temp2:{value:''}}},rect8:{type:'fork',text:{text:'分支'}, attr:{ x:509, y:176, width:50, height:50}, props:{text:{value:'分支'},temp1:{value:''},temp2:{value:''}}},rect9:{type:'join',text:{text:'合并'}, attr:{ x:517, y:398, width:50, height:50}, props:{text:{value:'合并'},temp1:{value:''},temp2:{value:''}}},rect10:{type:'end',text:{text:'结束'}, attr:{ x:519, y:517, width:50, height:50}, props:{text:{value:'结束'},temp1:{value:''},temp2:{value:''}}}},paths:{path11:{from:'rect4',to:'rect8', dots:[],text:{text:'TO 分支'},textPos:{x:32,y:-5}, props:{text:{value:''}}},path12:{from:'rect8',to:'rect5', dots:[],text:{text:'TO 状态2'},textPos:{x:27,y:-5}, props:{text:{value:''}}},path13:{from:'rect5',to:'rect9', dots:[],text:{text:'TO 合并'},textPos:{x:23,y:-8}, props:{text:{value:''}}},path14:{from:'rect9',to:'rect10', dots:[],text:{text:'TO 结束'},textPos:{x:27,y:-10}, props:{text:{value:''}}},path15:{from:'rect8',to:'rect6', dots:[],text:{text:'TO 任务1'},textPos:{x:-20,y:-11}, props:{text:{value:''}}},path16:{from:'rect6',to:'rect9', dots:[],text:{text:'TO 合并'},textPos:{x:6,y:-10}, props:{text:{value:''}}},path17:{from:'rect8',to:'rect7', dots:[],text:{text:'TO 任务3'},textPos:{x:16,y:-13}, props:{text:{value:''}}},path18:{from:'rect7',to:'rect9', dots:[],text:{text:'TO 合并'},textPos:{x:31,y:7}, props:{text:{value:''}}}}}),
editable:false,
activeRects : {// 当前激活状态
rects : [{name:'任务1',paths:[]}]
},
historyRects : {// 历史激活状态
rects : [{name:'开始',paths:['TO 分支']},{name:'分支',paths:['TO 任务1']},{name:'任务1',paths:[]}]
}});
});
</script>
<style type="text/css">
body {
margin : 0;
pading: 0;
text-align: left;
font-family: Arial, sans-serif, Helvetica, Tahoma;
font-size: 12px;
line-height: 1.5;
color: black;
background-image: url(img/bg.png);
}
.node {
width : 70px;
text-align : center;
vertical-align:middle;
border: 1px solid #fff;
}
.mover{
border: 1px solid #ddd;
background-color: #ddd;
}
.selected{
background-color: #ddd;
}
.state{}
#myflow_props table{
}
#myflow_props th {
letter-spacing: 2px;
text-align: left;
padding: 6px;
background: #ddd;
}
#myflow_props td {
background: #fff;
padding: 6px;
}
#pointer {
background-repeat:no-repeat;
background-position:center;
}
#path {
background-repeat:no-repeat;
background-position:center;
}
#task{
background-repeat:no-repeat;
background-position:center;
}
#state{
background-repeat:no-repeat;
background-position:center;
}
</style>
</head>
<body >
<div id="myflow">
</div>
</body>
</html>