submit.vue 3.3 KB

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