submit.vue 3.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158
  1. <template>
  2. <el-col :span="16" :offset="6">
  3. <el-form label-width="100px" ref="formRef" :model="form">
  4. <el-form-item
  5. label="审批建议"
  6. style="margin-bottom: 20px"
  7. :rules="{
  8. required: true,
  9. message: '请选择',
  10. trigger: 'change'
  11. }"
  12. >
  13. <el-input
  14. type="textarea"
  15. v-model="form.reason"
  16. placeholder="请输入审批建议"
  17. />
  18. </el-form-item>
  19. </el-form>
  20. <div style="margin-left: 10%; margin-bottom: 20px; font-size: 14px">
  21. <el-button
  22. icon="el-icon-edit-outline"
  23. type="success"
  24. size="mini"
  25. @click="handleAudit(1)"
  26. >通过
  27. </el-button>
  28. <el-button
  29. icon="el-icon-circle-close"
  30. type="danger"
  31. size="mini"
  32. @click="handleAudit(0)"
  33. v-if="!['starter'].includes(taskDefinitionKey)"
  34. >驳回
  35. </el-button>
  36. <el-dropdown
  37. @command="(command) => handleCommand(command)"
  38. style="margin-left: 30px"
  39. >
  40. <span class="el-dropdown-link"
  41. >更多<i class="el-icon-arrow-down el-icon--right"></i
  42. ></span>
  43. <el-dropdown-menu slot="dropdown">
  44. <el-dropdown-item command="cancel">作废</el-dropdown-item>
  45. </el-dropdown-menu>
  46. </el-dropdown>
  47. </div>
  48. </el-col>
  49. </template>
  50. <script>
  51. import {approveTaskWithVariables, rejectTask,cancelTask} from '@/api/bpm/task';
  52. import { save } from '@/api/bpm/components/marketManagem/index';
  53. // 流程实例的详情页,可用于审批
  54. export default {
  55. name: '',
  56. components: {
  57. },
  58. props: {
  59. businessId: {
  60. default: ''
  61. },
  62. taskId: {
  63. default: ''
  64. },
  65. id: {
  66. default: ''
  67. },
  68. taskDefinitionKey: {
  69. default: ''
  70. }
  71. },
  72. data() {
  73. return {
  74. form: {
  75. reason: ''
  76. },
  77. };
  78. },
  79. created() {
  80. },
  81. methods: {
  82. /** 处理转办审批人 */
  83. handleUpdateAssignee() {
  84. this.$emit('handleUpdateAssignee');
  85. },
  86. /** 退回 */
  87. handleBackList() {
  88. this.$emit('handleBackList');
  89. },
  90. async handleAudit(status, type) {
  91. let res = await this.getTableValue();
  92. if(res){
  93. await save(res)
  94. }
  95. this._approveTaskWithVariables(status);
  96. },
  97. async _approveTaskWithVariables(status) {
  98. let variables = {
  99. pass: !!status
  100. };
  101. let API = !!status ? approveTaskWithVariables : rejectTask;
  102. API({
  103. id: this.taskId,
  104. reason: this.form.reason,
  105. variables
  106. }).then((res) => {
  107. if (res.data.code != '-1') {
  108. this.$emit('handleAudit', {
  109. status,
  110. title: status === 0 ? '驳回' : ''
  111. });
  112. }
  113. });
  114. },
  115. getTableValue() {
  116. return new Promise((resolve, reject) => {
  117. this.$emit('getTableValue', async (data) => {
  118. resolve(await data);
  119. });
  120. });
  121. },
  122. //更多
  123. handleCommand(command) {
  124. if (command === 'cancel') {
  125. this.$confirm('是否确认作废?', {
  126. type: 'warning',
  127. cancelButtonText: '取消',
  128. confirmButtonText: '确定'
  129. })
  130. .then(() => {
  131. cancelTask({
  132. id: this.id,
  133. taskId: this.taskId,
  134. reason: this.form.reason,
  135. businessId: this.businessId
  136. })
  137. .then(() => {
  138. this.$emit('handleClose');
  139. })
  140. .catch(() => {
  141. this.$message.error('流程作废失败');
  142. });
  143. })
  144. .catch(() => {});
  145. }
  146. }
  147. }
  148. };
  149. </script>
  150. <style lang="scss"></style>