demo.html 2.1 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465
  1. <!DOCTYPE html>
  2. <html xmlns:v="urn:schemas-microsoft-com:vml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  5. <title>流程图DEMO</title>
  6. <!--[if lt IE 9]>
  7. <?import namespace="v" implementation="#default#VML" ?>
  8. <![endif]-->
  9. <link rel="stylesheet" type="text/css" href="../codebase/fonts/iconflow.css"/>
  10. <link rel="stylesheet" type="text/css" href="../codebase/GooFlow.css"/>
  11. <script type="text/javascript" src="data2.js"></script>
  12. <script type="text/javascript" src="../plugin/jquery.min.js"></script>
  13. <script type="text/javascript" src="../codebase/GooFunc.js"></script>
  14. <script type="text/javascript" src="../plugin/json2.js"></script>
  15. <link rel="stylesheet" type="text/css" href="default.css"/>
  16. <script type="text/javascript" src="../codebase/GooFlow.js"></script>
  17. <script type="text/javascript" src="../codebase/GooFlow.color.js"></script>
  18. <script type="text/javascript">
  19. var property={
  20. width:1200,
  21. height:540,
  22. toolBtns:["start round mix","end round","task","node","chat","state","plug","join","fork","complex mix"],
  23. haveHead:true,
  24. headLabel:true,
  25. headBtns:["new","open","save","undo","redo","reload"],//如果haveHead=true,则定义HEAD区的按钮
  26. haveTool:true,
  27. haveGroup:true,
  28. useOperStack:true
  29. };
  30. var remark={
  31. cursor:"选择指针",
  32. direct:"结点连线",
  33. start:"入口结点",
  34. "end":"结束结点",
  35. "task":"任务结点",
  36. node:"自动结点",
  37. chat:"决策结点",
  38. state:"状态结点",
  39. plug:"附加插件",
  40. fork:"分支结点",
  41. "join":"联合结点",
  42. "complex":"复合结点",
  43. group:"组织划分框编辑开关"
  44. };
  45. var demo;
  46. $(document).ready(function(){
  47. demo=$.createGooFlow($("#demo"),property);
  48. demo.setNodeRemarks(remark);
  49. demo.loadData(jsondata);
  50. //demo.reinitSize(1000,520);
  51. });
  52. var out;
  53. function Export(){
  54. document.getElementById("result").value=demo.exportData();
  55. // alert(demo.$lineOper.data("tid"));
  56. console.log(demo.exportData())
  57. }
  58. </script>
  59. </head>
  60. <body>
  61. <div id="demo" style="margin:10px"></div>
  62. <input id="submit" type="button" value='导出结果' onclick="Export()"/>
  63. <textarea id="result" row="6"></textarea>
  64. </body>
  65. </html>