作者 小范

工单管理页面新增已完成部分

@@ -11,6 +11,8 @@ export const create = params => { return http.post(`${baseUrl}/deployment/create @@ -11,6 +11,8 @@ export const create = params => { return http.post(`${baseUrl}/deployment/create
11 11
12 //流程实例管理 12 //流程实例管理
13 export const instanceList = params => { return http.get(`${baseUrl}/process/instanceList`, params); }; 13 export const instanceList = params => { return http.get(`${baseUrl}/process/instanceList`, params); };
  14 +export const histroyList = params => { return http.get(`${baseUrl}/process/histroyList`, params); };
  15 +
14 export const processDiagram = params => { return http.getStream(`${baseUrl}/processDiagram`, params); }; 16 export const processDiagram = params => { return http.getStream(`${baseUrl}/processDiagram`, params); };
15 17
16 //任务管理 18 //任务管理
@@ -146,11 +146,11 @@ @@ -146,11 +146,11 @@
146 label="有效起始日期" 146 label="有效起始日期"
147 width="180"> 147 width="180">
148 </el-table-column> 148 </el-table-column>
149 - <el-table-column 149 + <el-table-c
150 prop="effEnddate" 150 prop="effEnddate"
151 label="有效结束日期" 151 label="有效结束日期"
152 width="180"> 152 width="180">
153 - </el-table-column> 153 + </el-table-c>
154 </el-table> 154 </el-table>
155 <el-pagination 155 <el-pagination
156 @size-change="handleSizeChange" 156 @size-change="handleSizeChange"
@@ -23,7 +23,7 @@ @@ -23,7 +23,7 @@
23 <el-table 23 <el-table
24 v-loading="tableloading" 24 v-loading="tableloading"
25 :data="tableData" 25 :data="tableData"
26 - style="width: 100%"npm run dev 26 + style="width: 100%"
27 :default-sort = "{prop: 'date', order: 'descending'}" 27 :default-sort = "{prop: 'date', order: 'descending'}"
28 :header-cell-style="{background:'#6F8294',color:'#FFFFFF'}" size="small"> 28 :header-cell-style="{background:'#6F8294',color:'#FFFFFF'}" size="small">
29 <el-table-column type="expand"> 29 <el-table-column type="expand">
1 <template> 1 <template>
2 <el-container> 2 <el-container>
3 <el-main> 3 <el-main>
4 - <!--检索条件-->  
5 - <el-row class="toolbar" style="background-color: white;margin-bottom: 10px">  
6 - <el-col :span="6">  
7 - <el-input v-model="queryinfo.processInstanceId " placeholder="实例ID" style="width: 200px" clearable>  
8 - <template slot="prepend">实例ID</template>  
9 - </el-input>  
10 - </el-col>  
11 - <el-col :span="7">  
12 - <el-input v-model="queryinfo.processDefinitionKey" placeholder="实例关键字" style="width: 220px" clearable>  
13 - <template slot="prepend">实例关键字</template>  
14 - </el-input>  
15 - </el-col>  
16 - <el-col :span="8">  
17 - <el-button type="primary" v-on:click="getList">查询</el-button>  
18 - </el-col>  
19 - </el-row>  
20 <el-row> 4 <el-row>
21 - <el-table  
22 - v-loading="tableloading"  
23 - :data="tableData"  
24 - style="width: 100%"  
25 - :default-sort = "{prop: 'date', order: 'descending'}"  
26 - :header-cell-style="{background:'#6F8294',color:'#FFFFFF'}" size="small">  
27 - <el-table-column type="expand">  
28 - <template slot-scope="props">  
29 - <el-form label-position="right" label-width="120px" style="text-align: left">  
30 - <el-row>  
31 - <el-form-item label="变量数量:">  
32 - <span>{{ props.row.variableCount }}</span>  
33 - </el-form-item>  
34 - </el-row>  
35 - <el-row>  
36 - <el-form-item label="瞬时变量:">  
37 - <span>{{ JSON.stringify(props.row.transientVariables) }}</span>  
38 - </el-form-item>  
39 - </el-row>  
40 - <el-row>  
41 - <el-form-item label="流程定义ID:">  
42 - <span>{{ props.row.processDefinitionId}}</span>  
43 - </el-form-item>  
44 - </el-row>  
45 - <el-row>  
46 - <el-form-item label="流程实例ID:">  
47 - <span>{{ props.row.processInstanceId }}</span>  
48 - </el-form-item>  
49 - </el-row>  
50 - <el-row>  
51 - <el-form-item label="流程定义版本:">  
52 - <span>{{ props.row.processDefinitionVersion }}</span>  
53 - </el-form-item>  
54 - </el-row>  
55 - </el-form>  
56 - </template>  
57 - </el-table-column>  
58 - <el-table-column  
59 - fixed="left"  
60 - label="操作">  
61 - <template slot-scope="scope">  
62 - <el-button type="success" size="mini" @click="chart(scope.$index,scope.row)">流程图</el-button>  
63 - <!-- <el-button type="warning" size="mini" @click="remove(scope.$index,scope.row)">删除</el-button>-->  
64 - <!-- <el-button type="danger" size="mini" @click="removeDel(scope.$index,scope.row)">彻底删除</el-button>-->  
65 - </template>  
66 - </el-table-column>  
67 - <el-table-column  
68 - label="实例名称"  
69 - prop="name"  
70 - width="160">  
71 - </el-table-column>  
72 - <el-table-column  
73 - label="开始时间"  
74 - prop="startTime"  
75 - width="160">  
76 - </el-table-column>  
77 - <el-table-column  
78 - label="执行中"  
79 - prop="isActive">  
80 - </el-table-column>  
81 - <el-table-column  
82 - label="是否结束"  
83 - prop="isEnded">  
84 - </el-table-column>  
85 - <el-table-column  
86 - label="租户"  
87 - prop="tenantId">  
88 - </el-table-column>  
89 - <el-table-column  
90 - label="流程状态"  
91 - prop="suspensionState">  
92 - <template slot-scope="scope">  
93 - <span v-if="scope.row.suspensionState ===1">活跃</span>  
94 - <span v-else>中断</span>  
95 - </template>  
96 - </el-table-column>  
97 - <el-table-column  
98 - label="实例关键字"  
99 - prop="processDefinitionKey">  
100 - </el-table-column>  
101 - </el-table>  
102 - </el-row>  
103 - <!--分页模块-->  
104 - <el-row style="float: right;margin-top: 20px">  
105 - <el-col>  
106 - <div class="block">  
107 - <el-pagination  
108 - @size-change="handleSizeChange"  
109 - @current-change="handleCurrentChange"  
110 - :current-page="queryinfo.pageNum"  
111 - :page-sizes="[10, 20, 30, 40]"  
112 - :page-size="queryinfo.pageSize"  
113 - layout="total, sizes, prev, pager, next, jumper"  
114 - :total="total">  
115 - </el-pagination>  
116 - </div>  
117 - </el-col> 5 + <el-tabs type="border-card" @tab-click="handleClick">
  6 + <el-tab-pane label="执行中">
  7 + <!--检索条件-->
  8 + <el-row class="toolbar" style="background-color: white;margin-bottom: 10px">
  9 + <el-col :span="6">
  10 + <el-input v-model="queryinfo.processInstanceId " placeholder="实例ID" style="width: 200px" clearable>
  11 + <template slot="prepend">实例ID</template>
  12 + </el-input>
  13 + </el-col>
  14 + <el-col :span="7">
  15 + <el-input v-model="queryinfo.processDefinitionKey" placeholder="实例关键字" style="width: 220px" clearable>
  16 + <template slot="prepend">实例关键字</template>
  17 + </el-input>
  18 + </el-col>
  19 + <el-col :span="8">
  20 + <el-button type="primary" v-on:click="getList">查询</el-button>
  21 + </el-col>
  22 + </el-row>
  23 + <el-row>
  24 + <el-table
  25 + v-loading="tableloading"
  26 + :data="tableData"
  27 + style="width: 100%"
  28 + :default-sort = "{prop: 'date', order: 'descending'}"
  29 + :header-cell-style="{background:'#6F8294',color:'#FFFFFF'}" size="small">
  30 + <el-table-column type="expand">
  31 + <template slot-scope="props">
  32 + <el-form label-position="right" label-width="120px" style="text-align: left">
  33 + <el-row>
  34 + <el-form-item label="id:">
  35 + <span>{{ props.row.id}}</span>
  36 + </el-form-item>
  37 + </el-row>
  38 + <el-row>
  39 + <el-form-item label="执行人id:">
  40 + <span>{{ props.row.deploymentId}}</span>
  41 + </el-form-item>
  42 + </el-row>
  43 + <el-row>
  44 + <el-form-item label="变量数量:">
  45 + <span>{{ props.row.variableCount}}</span>
  46 + </el-form-item>
  47 + </el-row>
  48 + <el-row>
  49 + <el-form-item label="瞬时变量:">
  50 + <span>{{ JSON.stringify(props.row.transientVariables)}}</span>
  51 + </el-form-item>
  52 + </el-row>
  53 + <el-row>
  54 + <el-form-item label="流程定义ID:">
  55 + <span>{{ props.row.processDefinitionId}}</span>
  56 + </el-form-item>
  57 + </el-row>
  58 + <el-row>
  59 + <el-form-item label="流程实例ID:">
  60 + <span>{{ props.row.processInstanceId}}</span>
  61 + </el-form-item>
  62 + </el-row>
  63 + <el-row>
  64 + <el-form-item label="流程定义版本:">
  65 + <span>{{ props.row.processDefinitionVersion}}</span>
  66 + </el-form-item>
  67 + </el-row>
  68 + </el-form>
  69 + </template>
  70 + </el-table-column>
  71 + <el-table-column
  72 + fixed="left"
  73 + label="操作">
  74 + <template slot-scope="scope">
  75 + <el-button type="success" size="mini" @click="chart(scope.$index,scope.row)">流程图</el-button>
  76 + <!-- <el-button type="warning" size="mini" @click="remove(scope.$index,scope.row)">删除</el-button>-->
  77 + <!-- <el-button type="danger" size="mini" @click="removeDel(scope.$index,scope.row)">彻底删除</el-button>-->
  78 + </template>
  79 + </el-table-column>
  80 + <el-table-column
  81 + label="实例名称"
  82 + prop="name"
  83 + width="160">
  84 + </el-table-column>
  85 + <el-table-column
  86 + label="开始时间"
  87 + prop="startTime"
  88 + width="160">
  89 + </el-table-column>
  90 + <el-table-column
  91 + label="结束时间"
  92 + prop="endTime"
  93 + width="160">
  94 + </el-table-column>
  95 + <el-table-column
  96 + label="执行中"
  97 + prop="isActive">
  98 + </el-table-column>
  99 + <el-table-column
  100 + label="是否结束"
  101 + prop="isEnded">
  102 + </el-table-column>
  103 + <el-table-column
  104 + label="流程状态"
  105 + prop="suspensionState">
  106 + <template slot-scope="scope">
  107 + <span v-if="scope.row.suspensionState ===1">活跃</span>
  108 + <span v-else>中断</span>
  109 + </template>
  110 + </el-table-column>
  111 + <el-table-column
  112 + label="实例关键字"
  113 + prop="processDefinitionKey">
  114 + </el-table-column>
  115 + <el-table-column
  116 + label="用时"
  117 + prop="durationInMillis">
  118 + <template slot-scope="scope">
  119 + <span>
  120 + {{ scope.row.durationInMillis | formatSeconds }}
  121 + </span>
  122 + </template>
  123 + </el-table-column>
  124 + <el-table-column
  125 + label="流程定义名称"
  126 + prop="processDefinitionName"
  127 + width="140">
  128 + </el-table-column>
  129 + <el-table-column
  130 + label="isDeleted"
  131 + prop="isDeleted">
  132 + </el-table-column>
  133 + </el-table>
  134 + </el-row>
  135 + <!--分页模块-->
  136 + <el-row style="float: right;margin-top: 20px">
  137 + <el-col>
  138 + <div class="block">
  139 + <el-pagination
  140 + @size-change="handleSizeChange"
  141 + @current-change="handleCurrentChange"
  142 + :current-page="queryinfo.pageNum"
  143 + :page-sizes="[10, 20, 30, 40]"
  144 + :page-size="queryinfo.pageSize"
  145 + layout="total, sizes, prev, pager, next, jumper"
  146 + :total="total">
  147 + </el-pagination>
  148 + </div>
  149 + </el-col>
  150 + </el-row>
  151 + </el-tab-pane>
  152 + <el-tab-pane label="已完成">
  153 + <!--检索条件-->
  154 + <el-row class="toolbar" style="background-color: white;margin-bottom: 10px">
  155 + <el-col :span="6">
  156 + <el-input v-model="queryinfo.processInstanceId " placeholder="实例ID" style="width: 200px" clearable>
  157 + <template slot="prepend">实例ID</template>
  158 + </el-input>
  159 + </el-col>
  160 + <el-col :span="7">
  161 + <el-input v-model="queryinfo.processDefinitionKey" placeholder="实例关键字" style="width: 220px" clearable>
  162 + <template slot="prepend">实例关键字</template>
  163 + </el-input>
  164 + </el-col>
  165 + <el-col :span="8">
  166 + <el-button type="primary" v-on:click="getHistroyList">查询</el-button>
  167 + </el-col>
  168 + </el-row>
  169 + <el-row>
  170 + <el-table
  171 + v-loading="tableloading"
  172 + :data="tableData"
  173 + style="width: 100%"
  174 + :default-sort = "{prop: 'date', order: 'descending'}"
  175 + :header-cell-style="{background:'#6F8294',color:'#FFFFFF'}" size="small">
  176 + <el-table-column type="expand">
  177 + <template slot-scope="props">
  178 + <el-form label-position="right" label-width="120px" style="text-align: left">
  179 + <el-row>
  180 + <el-form-item label="id:">
  181 + <span>{{ props.row.id}}</span>
  182 + </el-form-item>
  183 + </el-row>
  184 + <el-row>
  185 + <el-form-item label="执行人id:">
  186 + <span>{{ props.row.deploymentId}}</span>
  187 + </el-form-item>
  188 + </el-row>
  189 + <el-row>
  190 + <el-form-item label="变量数量:">
  191 + <span>{{ props.row.variableCount}}</span>
  192 + </el-form-item>
  193 + </el-row>
  194 + <el-row>
  195 + <el-form-item label="瞬时变量:">
  196 + <span>{{ JSON.stringify(props.row.transientVariables)}}</span>
  197 + </el-form-item>
  198 + </el-row>
  199 + <el-row>
  200 + <el-form-item label="流程定义ID:">
  201 + <span>{{ props.row.processDefinitionId}}</span>
  202 + </el-form-item>
  203 + </el-row>
  204 + <el-row>
  205 + <el-form-item label="流程实例ID:">
  206 + <span>{{ props.row.processInstanceId}}</span>
  207 + </el-form-item>
  208 + </el-row>
  209 + <el-row>
  210 + <el-form-item label="流程定义版本:">
  211 + <span>{{ props.row.processDefinitionVersion}}</span>
  212 + </el-form-item>
  213 + </el-row>
  214 + </el-form>
  215 + </template>
  216 + </el-table-column>
  217 + <el-table-column
  218 + fixed="left"
  219 + label="操作">
  220 + <template slot-scope="scope">
  221 + <el-button type="success" size="mini" @click="chart(scope.$index,scope.row)">流程图</el-button>
  222 + <!-- <el-button type="warning" size="mini" @click="remove(scope.$index,scope.row)">删除</el-button>-->
  223 + <!-- <el-button type="danger" size="mini" @click="removeDel(scope.$index,scope.row)">彻底删除</el-button>-->
  224 + </template>
  225 + </el-table-column>
  226 + <el-table-column
  227 + label="实例名称"
  228 + prop="name"
  229 + width="160">
  230 + </el-table-column>
  231 + <el-table-column
  232 + label="开始时间"
  233 + prop="startTime"
  234 + width="160">
  235 + </el-table-column>
  236 + <el-table-column
  237 + label="结束时间"
  238 + prop="endTime"
  239 + width="160">
  240 + </el-table-column>
  241 + <el-table-column
  242 + label="执行中"
  243 + prop="isActive">
  244 + </el-table-column>
  245 + <el-table-column
  246 + label="是否结束"
  247 + prop="isEnded">
  248 + </el-table-column>
  249 + <el-table-column
  250 + label="流程状态"
  251 + prop="suspensionState">
  252 + <template slot-scope="scope">
  253 + <span v-if="scope.row.suspensionState ===1">活跃</span>
  254 + <span v-else>中断</span>
  255 + </template>
  256 + </el-table-column>
  257 + <el-table-column
  258 + label="实例关键字"
  259 + prop="processDefinitionKey">
  260 + </el-table-column>
  261 + <el-table-column
  262 + prop="durationInMillis"
  263 + label="用时">
  264 + <template slot-scope="scope">
  265 + <span>
  266 + {{ scope.row.durationInMillis | formatSeconds }}
  267 + </span>
  268 + </template>
  269 + </el-table-column>
  270 + <el-table-column
  271 + label="流程定义名称"
  272 + prop="processDefinitionName"
  273 + width="140">
  274 + </el-table-column>
  275 + <el-table-column
  276 + label="isDeleted"
  277 + prop="isDeleted">
  278 + </el-table-column>
  279 + </el-table>
  280 + </el-row>
  281 + <!--分页模块-->
  282 + <el-row style="float: right;margin-top: 20px">
  283 + <el-col>
  284 + <div class="block">
  285 + <el-pagination
  286 + @size-change="handleSizeChange"
  287 + @current-change="handleCurrentChange"
  288 + :current-page="queryinfo.pageNum"
  289 + :page-sizes="[10, 20, 30, 40]"
  290 + :page-size="queryinfo.pageSize"
  291 + layout="total, sizes, prev, pager, next, jumper"
  292 + :total="total">
  293 + </el-pagination>
  294 + </div>
  295 + </el-col>
  296 + </el-row>
  297 + </el-tab-pane>
  298 +
  299 + </el-tabs>
118 </el-row> 300 </el-row>
119 <!-- 流程图弹框--> 301 <!-- 流程图弹框-->
120 <el-row> 302 <el-row>
@@ -139,7 +321,7 @@ @@ -139,7 +321,7 @@
139 </template> 321 </template>
140 322
141 <script> 323 <script>
142 - import {instanceList,processDiagram} from "../../api/technological"; 324 + import {instanceList,processDiagram,histroyList} from "../../api/technological";
143 325
144 export default { 326 export default {
145 name: "example", 327 name: "example",
@@ -160,10 +342,55 @@ @@ -160,10 +342,55 @@
160 } 342 }
161 } 343 }
162 }, 344 },
  345 + filters: {
  346 + formatSeconds(value) {
  347 + console.log(value)
  348 + let result = parseInt(value);
  349 +
  350 + let y =
  351 + Math.floor(result / 86400000) < 10
  352 + ? "0" + Math.floor(result / 86400000)
  353 + : Math.floor(result / 86400000);
  354 +
  355 + let h =
  356 + Math.floor((result / 3600000) % 24) < 10
  357 + ? "0" + Math.floor((result / 3600000) % 24)
  358 + : Math.floor((result / 3600000) % 24);
  359 +
  360 + let m =
  361 + Math.floor((result / 60000) % 60) < 10
  362 + ? "0" + Math.floor((result / 60000) % 60)
  363 + : Math.floor((result / 60000) % 60);
  364 +
  365 + let s =
  366 + Math.floor(result % 60) < 10
  367 + ? "0" + Math.floor(result % 60)
  368 + : Math.floor(result % 60);
  369 +
  370 + let res = "";
  371 + if (y !== "00") res += `${y}天`;
  372 +
  373 + if (h !== "00") res += `${h}时`;
  374 +
  375 + if (m !== "00") res += `${m}分`;
  376 +
  377 + res += `${s}秒`;
  378 +
  379 + return res;
  380 + },
  381 + },
163 mounted() { 382 mounted() {
164 this.getList(); 383 this.getList();
165 }, 384 },
166 methods: { 385 methods: {
  386 +
  387 + handleClick(tab){
  388 + if (tab.index == 0) {
  389 + this.getList();
  390 + } else {
  391 + this.getHistroyList();
  392 + }
  393 + },
167 // 分页 394 // 分页
168 handleSizeChange(val) { 395 handleSizeChange(val) {
169 this.queryinfo.pageSize= val 396 this.queryinfo.pageSize= val
@@ -197,6 +424,30 @@ @@ -197,6 +424,30 @@
197 424
198 }) 425 })
199 }, 426 },
  427 + getHistroyList() {
  428 + const _this = this
  429 + this.tableloading = true;
  430 + histroyList(this.queryinfo).then((response) => {
  431 + console.log(response);
  432 + const res = response.data
  433 + if (res.code != '200') {
  434 + return _this.$message.error('获取消息收发记录,失败!')
  435 + }
  436 + // 获取列表数据
  437 + _this.tableData = res.data;
  438 + // 获取列表的总记录数
  439 +
  440 + _this.total = res.total
  441 + this.tableloading = false;
  442 + _this.$message.success('获取消息收发记录,成功!')
  443 + }).catch(error => {
  444 +
  445 + // 关闭加载
  446 + _this.$message.error(error.toString())
  447 + this.tableloading = false;
  448 +
  449 + })
  450 + },
200 // 打开流程图 451 // 打开流程图
201 chart(index, row) { 452 chart(index, row) {
202 this.dialogFormVisible = true 453 this.dialogFormVisible = true
@@ -208,7 +459,8 @@ @@ -208,7 +459,8 @@
208 }); 459 });
209 460
210 }, 461 },
211 - } 462 + },
  463 +
212 } 464 }
213 </script> 465 </script>
214 466
@@ -119,7 +119,7 @@ @@ -119,7 +119,7 @@
119 width="160"> 119 width="160">
120 </el-table-column> 120 </el-table-column>
121 <el-table-column 121 <el-table-column
122 - prop="taskDefinitionKey " 122 + prop="taskDefinitionKey"
123 label="关键字"> 123 label="关键字">
124 </el-table-column> 124 </el-table-column>
125 <el-table-column 125 <el-table-column
@@ -127,8 +127,8 @@ @@ -127,8 +127,8 @@
127 label="所有者"> 127 label="所有者">
128 </el-table-column> 128 </el-table-column>
129 <el-table-column 129 <el-table-column
130 - prop="assignee "  
131 - label="执行者" 130 + prop="assignee"
  131 + label="执行人"
132 width="160" 132 width="160"
133 show-overflow-tooltip> 133 show-overflow-tooltip>
134 </el-table-column> 134 </el-table-column>
@@ -200,7 +200,7 @@ @@ -200,7 +200,7 @@
200 width="160"> 200 width="160">
201 </el-table-column> 201 </el-table-column>
202 <el-table-column 202 <el-table-column
203 - prop="taskDefinitionKey " 203 + prop="taskDefinitionKey"
204 label="关键字"> 204 label="关键字">
205 </el-table-column> 205 </el-table-column>
206 <el-table-column 206 <el-table-column
@@ -208,7 +208,7 @@ @@ -208,7 +208,7 @@
208 label="所有者"> 208 label="所有者">
209 </el-table-column> 209 </el-table-column>
210 <el-table-column 210 <el-table-column
211 - prop="assignee " 211 + prop="assignee"
212 label="执行者" 212 label="执行者"
213 width="160" 213 width="160"
214 show-overflow-tooltip> 214 show-overflow-tooltip>
1 { 1 {
2 - "nmmsVer": "1.30" 2 + "nmmsVer": "1.31"
3 } 3 }