processTask.vue 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178
  1. <template>
  2. <view class="havedone-container">
  3. <uni-nav-bar fixed="true" statusBar="true" left-icon="back" :title="uniNavBarTitle"
  4. background-color="#157A2C" color="#fff"
  5. @clickLeft="back"></uni-nav-bar>
  6. <view v-if="processInstance.processDefinition">
  7. <async-biz-form-component :taskId="listData.taskId" :businessId="listData.businessId" :id="listData.id"
  8. :taskDefinitionKey="listData.taskDefinitionKey" @activeCompChange="activeCompChange"
  9. @handleClose="handleClose" ref="bziRef"></async-biz-form-component>
  10. </view>
  11. <view v-for="(item, index) in runningTasks" :key="index">
  12. <div v-if="processInstance.processDefinition">
  13. <async-sub-form-component :taskId="listData.taskId" :businessId="listData.businessId" :id="listData.id"
  14. :taskDefinitionKey="listData.taskDefinitionKey" @handleAudit="handleAudit"
  15. @getTableValue="getTableValue" @handleUpdateAssignee="handleUpdateAssignee(item)"
  16. @handleBackList="handleBackList(item)" @submit="submit" ref="subForm">
  17. </async-sub-form-component>
  18. </div>
  19. </view>
  20. <u-toast ref="uToast"></u-toast>
  21. </view>
  22. </template>
  23. <script>
  24. import {
  25. getProcessInstance,
  26. getTaskListByProcessInstanceId
  27. } from '@/api/wt/index.js'
  28. import Vue from 'vue'
  29. export default {
  30. name: 'processTask',
  31. data() {
  32. return {
  33. uniNavBarTitle: '',
  34. processInstanceLoading: false,
  35. listData: {},
  36. processInstance: {},
  37. runningTasks: [],
  38. auditForms: [],
  39. }
  40. },
  41. onLoad(option) {
  42. console.log(option)
  43. this.listData = option
  44. this.getDetail()
  45. },
  46. methods: {
  47. /** 获得流程实例 */
  48. getDetail() {
  49. // 获得流程实例相关
  50. this.processInstanceLoading = true;
  51. getProcessInstance({
  52. id: this.listData.id
  53. }).then((response) => {
  54. if (!response) {
  55. this.$message.error('查询不到流程信息!');
  56. return;
  57. }
  58. // 设置流程信息
  59. this.processInstance = response;
  60. this.uniNavBarTitle =
  61. `${ this.processInstance.name } 【${ this.processInstance.startUser?.nickname}】`
  62. //将业务表单,注册为动态组件
  63. Vue.component('async-biz-form-component', (resolve) => {
  64. require(['pages/home' + this.listData.miniHandleRouter], resolve);
  65. });
  66. Vue.component('async-sub-form-component', (resolve) => {
  67. require(['pages/home' + this.listData.miniViewRouter], resolve);
  68. });
  69. console.log(getCurrentPages())
  70. // 取消加载中
  71. this.processInstanceLoading = false;
  72. });
  73. this.runningTasks = [];
  74. this.auditForms = [];
  75. getTaskListByProcessInstanceId({
  76. processInstanceId: this.listData.id
  77. }).then((response) => {
  78. console.log(response, 'response');
  79. // 审批记录
  80. this.tasks = [];
  81. // 移除已取消的审批
  82. response.forEach((task) => {
  83. if (task.result !== 4) {
  84. this.tasks.push(task);
  85. }
  86. });
  87. // 排序,将未完成的排在前面,已完成的排在后面;
  88. this.tasks.sort((a, b) => {
  89. // 有已完成的情况,按照完成时间倒序
  90. if (a.endTime && b.endTime) {
  91. return b.endTime - a.endTime;
  92. } else if (a.endTime) {
  93. return 1;
  94. } else if (b.endTime) {
  95. return -1;
  96. // 都是未完成,按照创建时间倒序
  97. } else {
  98. return b.createTime - a.createTime;
  99. }
  100. });
  101. // 需要审核的记录
  102. let userInfo = wx.getStorageSync("userInfo");
  103. this.tasks.forEach((task) => {
  104. if (task.result !== 1 && task.result !== 6) {
  105. // 只有待处理才需要
  106. return;
  107. }
  108. if (!task.assigneeUser || task.assigneeUser.id !== userInfo.userId) {
  109. // 自己不是处理人
  110. return;
  111. }
  112. if (task.taskDefinitionKey !== this.listData.taskDefinitionKey) {
  113. // 不是当前流程的
  114. return;
  115. }
  116. this.runningTasks.push({
  117. ...task
  118. });
  119. console.log(this.runningTasks, ' this.runningTasks');
  120. this.auditForms.push({
  121. reason: ''
  122. });
  123. });
  124. });
  125. },
  126. /** 处理审批通过和不通过的操作 */
  127. handleAudit(data) {
  128. let text = data.status === 1 ? '通过' : '不通过';
  129. this.$refs.uToast.show({
  130. type: 'success',
  131. message: `审批${data.title || text}成功!`,
  132. iconUrl: 'https://cdn.uviewui.com/uview/demo/toast/success.png'
  133. })
  134. // 获得最新详情
  135. setTimeout(() => {
  136. uni.navigateBack()
  137. }, 1000)
  138. // const index = this.runningTasks.indexOf(task);
  139. // this.$refs['form' + index][0].validate((valid) => {
  140. // if (!valid) {
  141. // return;
  142. // }
  143. // const data = {
  144. // id: task.id,
  145. // reason: this.auditForms[index].reason
  146. // };
  147. // if (pass) {
  148. // approveTask(data).then((response) => {
  149. // this.$message.success('审批通过成功!');
  150. // this.handleClose(); // 获得最新详情
  151. // });
  152. // } else {
  153. // rejectTask(data).then((response) => {
  154. // this.$message.success('审批不通过成功!');
  155. // this.handleClose(); // 获得最新详情
  156. // });
  157. // }
  158. // });
  159. },
  160. getTableValue(fn) {
  161. fn(this.$refs.bziRef.getTableValue());
  162. }
  163. }
  164. }
  165. </script>
  166. <style>
  167. </style>