taskInfo.html 9.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166
  1. <!doctype html>
  2. <html lang="en">
  3. <head>
  4. <script src="jquery-3.4.1.min.js"></script>
  5. <meta charset="UTF-8">
  6. <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
  7. <meta http-equiv="X-UA-Compatible" content="ie=edge">
  8. <script src="vue.js"></script>
  9. <link rel="stylesheet" href="bootstrap/css/bootstrap.css"></link>
  10. <title>Task Information</title>
  11. <style>
  12. table {
  13. table-layout: auto;
  14. }
  15. table,
  16. td,
  17. th,
  18. tr {
  19. border-color: black!important;
  20. text-overflow: ellipsis;
  21. overflow: hidden;
  22. white-space: nowrap;
  23. max-width: 400px;
  24. min-width: 150px;
  25. }
  26. .ID {
  27. width: 10%;
  28. }
  29. </style>
  30. </head>
  31. <body>
  32. <div class="row" style="margin-top: 40px;">
  33. <div class="col-md-7" style="margin:0 auto" id="taskInfo" v-if="show">
  34. <nav aria-label="breadcrumb">
  35. <ol class="breadcrumb" style="padding-left:0;background-color: white">
  36. <li class="breadcrumb-item" @click="gotoHome"><a href="#">{{"Home~首页" | lang}}</a></li>
  37. <li class="breadcrumb-item active" aria-current="page" style="color: black">{{"Task Information~任务信息" | lang}}</li>
  38. </ol>
  39. </nav>
  40. <h4 style="text-align: center;">{{"Task Information~任务信息" | lang}}</h4>
  41. <p>{{"Task Name:~任务名称:" | lang}} {{task["name"]}}</p>
  42. <p style="word-wrap: break-word;word-break: break-all;overflow: hidden;max-height: 100px;">{{"Task Description:~任务描述:" | lang}} {{task["desc"]}}</p>
  43. <p style="word-wrap: break-word;word-break: break-all;overflow: hidden;max-height: 100px;">{{"Example URL:~样例网址:" | lang}} {{task["url"]}}</p>
  44. <p style="word-wrap: break-word;word-break: break-all;overflow: hidden;max-height: 100px;">{{"Create Time:~创建时间:" | lang}} {{dateFormat(task["create_time"])}}</p>
  45. <p style="word-wrap: break-word;word-break: break-all;overflow: hidden;max-height: 100px;">{{"Update Time:~更新时间:" | lang}} {{dateFormat(task["update_time"])}}</p>
  46. <p>{{"Operations (Please close this window and select 'Design Task' button if you want to modify task with a browser)~操作(如要带浏览器修改任务流程请关闭此窗口并选择设计任务)" | lang}}</p>
  47. <p><a style="margin-top: 5px;" href="javascript:void(0)" v-on:click="modifyTask(task['id'],task['url'])" class="btn btn-primary">{{"Modify Task Workflow~修改任务流程" | lang}}</a>
  48. <a style="margin-top: 5px;" href="javascript:void(0)" v-on:click="invokeTask(task['id'],task['url'])" class="btn btn-primary">{{"Invoke Task~调用任务" | lang}}</a></p>
  49. <p>{{"Input Parameters~输入参数" | lang}}</p>
  50. <table class="table table-bordered">
  51. <tbody>
  52. <tr>
  53. <th style="min-width: 50px; text-align: center">ID</th>
  54. <th style="text-align: center">{{"Parameter Name~参数名称" | lang}}</th>
  55. <th style="text-align: center">{{"Invoke Name~调用名称" | lang}}</th>
  56. <th style="text-align: center">{{"Parameter Type~参数类型" | lang}}</th>
  57. <th>{{"Example Value~示例值" | lang}}</th>
  58. <th>{{"Parameter Description~参数描述" | lang}}</th>
  59. </tr>
  60. <tr v-if="task.inputParameters.length>0" v-for="i in task.inputParameters.length">
  61. <td style="min-width: 50px; text-align: center">{{i}}</td>
  62. <td style="text-align: center">{{task.inputParameters[i-1]["nodeName"]}}</td>
  63. <td style="text-align: center">{{task.inputParameters[i-1]["name"]}}</td>
  64. <td style="text-align: center">{{task.inputParameters[i-1]["type"]}}</td>
  65. <td>{{task.inputParameters[i-1]["exampleValue"]}}</td>
  66. <td>{{task.inputParameters[i-1]["desc"]}}</td>
  67. </tr>
  68. <tr v-if="task.inputParameters.length==0">
  69. <td style="text-align: center">{{"Empty~无" | lang}}</td>
  70. <td style="text-align: center">{{"Empty~无" | lang}}</td>
  71. <td style="text-align: center">{{"Empty~无" | lang}}</td>
  72. <td style="text-align: center">{{"Empty~无" | lang}}</td>
  73. <td style="text-align: center">{{"Empty~无" | lang}}</td>
  74. <td style="text-align: center">{{"Empty~无" | lang}}</td>
  75. </tr>
  76. </tbody>
  77. </table>
  78. <p>{{"Output Parameters~输出参数" | lang}}</p>
  79. <table class="table table-bordered">
  80. <tbody>
  81. <tr>
  82. <th style="min-width: 50px; text-align: center">ID</th>
  83. <th style="text-align: center">{{"Parameter Name~参数名称" | lang}}</th>
  84. <th style="text-align: center">{{"Parameter Type~参数类型" | lang}}</th>
  85. <th>{{"Example Value~示例值" | lang}}</th>
  86. <th>{{"Parameter Description~参数描述" | lang}}</th>
  87. <th style="text-align: center">{{"Record as a field~作为字段保存" | lang}}</th>
  88. </tr>
  89. <tr v-if="task.outputParameters.length>0" v-for="i in task.outputParameters.length">
  90. <td style="min-width: 50px; text-align: center">{{i}}</td>
  91. <td style="text-align: center">{{task.outputParameters[i-1]["name"]}}</td>
  92. <td style="text-align: center">{{task.outputParameters[i-1]["type"]}}</td>
  93. <td>{{task.outputParameters[i-1]["exampleValue"]}}</td>
  94. <td>{{task.outputParameters[i-1]["desc"]}}</td>
  95. <td style="text-align: center">{{task.outputParameters[i-1]["recordASField"] == 1? "Yes~是": "No~否" | lang}}</td>
  96. </tr>
  97. <tr v-if="task.outputParameters.length==0">
  98. <td style="min-width: 50px;text-align: center">{{"Empty~无" | lang}}</td>
  99. <td style="text-align: center">{{"Empty~无" | lang}}</td>
  100. <td style="text-align: center">{{"Empty~无" | lang}}</td>
  101. <td style="text-align: center">{{"Empty~无" | lang}}</td>
  102. <td style="text-align: center">{{"Empty~无" | lang}}</td>
  103. <td style="text-align: center">{{"Empty~无" | lang}}</td>
  104. </tr>
  105. </tbody>
  106. </table>
  107. </div>
  108. </div>
  109. </body>
  110. </html>
  111. <script src="global.js"></script>
  112. <script>
  113. var sId = getUrlParam('id');
  114. var app = new Vue({
  115. el: '#taskInfo',
  116. data: {
  117. task: {},
  118. show: false, //是否渲染
  119. backEndAddressServiceWrapper: getUrlParam("backEndAddressServiceWrapper"),
  120. },
  121. methods: {
  122. dateFormat: DateFormat,
  123. gotoHome:function(){
  124. let url = "";
  125. if(getUrlParam("lang")=="zh"){
  126. url = "taskList.html?lang=zh&type="+getUrlParam("type")+"&wsport="+getUrlParam("wsport")+"&backEndAddressServiceWrapper="+ app.$data.backEndAddressServiceWrapper
  127. } else{
  128. url = "taskList.html?lang=en&type="+getUrlParam("type")+"&wsport="+getUrlParam("wsport")+"&backEndAddressServiceWrapper="+ app.$data.backEndAddressServiceWrapper
  129. }
  130. window.location.href= url;
  131. },
  132. modifyTask: function(id, url) {
  133. let message = { //显示flowchart
  134. type: 1, //消息类型,传递链接
  135. message: {
  136. "id": id,
  137. }
  138. };
  139. // ws.send(JSON.stringify(message));
  140. // window.location.href = url; //跳转链接
  141. if(getUrlParam("lang")=="zh"){
  142. window.location.href = "FlowChart_CN.html?type="+getUrlParam("type")+"&lang="+getUrlParam("lang")+"&id=" + id + "&wsport="+getUrlParam("wsport")+"&backEndAddressServiceWrapper="+ app.$data.backEndAddressServiceWrapper
  143. } else{
  144. window.location.href = "FlowChart.html?type="+getUrlParam("type")+"&lang="+getUrlParam("lang")+"&id=" + id + "&wsport="+getUrlParam("wsport")+"&backEndAddressServiceWrapper="+ app.$data.backEndAddressServiceWrapper
  145. }
  146. },
  147. invokeTask: function(id) {
  148. window.location.href = "invokeTask.html?type="+getUrlParam("type")+"&lang="+getUrlParam("lang")+"&id=" + id + "&wsport="+getUrlParam("wsport")+"&backEndAddressServiceWrapper="+ app.$data.backEndAddressServiceWrapper;
  149. },
  150. }
  151. });
  152. $.get(app.$data.backEndAddressServiceWrapper + "/queryTask?id=" + sId, function(result) {
  153. app.$data.task = result;
  154. app.$data.show = true;
  155. });
  156. </script>