Reverse-audit.vue 3.1 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697
  1. <template>
  2. <el-dialog v-model="state.dialogVisible" draggable title="扭转评判" width="40%" append-to-body destroy-on-close @close="close">
  3. <div class="collapse-container" v-loading="state.loading">
  4. <el-form label-width="110px" ref="ruleFormRef" :model="state.ruleForm">
  5. <el-row :gutter="35">
  6. <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="12">
  7. <el-form-item label="评判结果" prop="isAgree" :rules="[{ required: true, message: '请选择评判结果', trigger: 'change' }]">
  8. <el-radio-group v-model="state.ruleForm.isAgree">
  9. <el-radio :label="true">同意</el-radio>
  10. <el-radio :label="false">不同意</el-radio>
  11. </el-radio-group>
  12. </el-form-item>
  13. </el-col>
  14. <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
  15. <el-form-item label="评判意见" prop="judgeContent" :rules="[{ required: true, message: '请填评判意见', trigger: 'blur' }]">
  16. <el-input v-model="state.ruleForm.judgeContent" type="textarea" :autosize="{ minRows: 6, maxRows: 10 }" placeholder="请填评判意见" />
  17. </el-form-item>
  18. </el-col>
  19. </el-row>
  20. </el-form>
  21. </div>
  22. <template #footer>
  23. <span class="dialog-footer">
  24. <el-button @click="closeDialog" class="default-button">取 消</el-button>
  25. <el-button type="primary" @click="onAudit(ruleFormRef)" :loading="state.loading">确 定</el-button>
  26. </span>
  27. </template>
  28. </el-dialog>
  29. </template>
  30. <script setup lang="ts">
  31. import { defineAsyncComponent, reactive, ref } from 'vue';
  32. import { ElNotification, FormInstance } from 'element-plus';
  33. import { visitTurnSatisfaction } from '@/api/business/visit';
  34. // 引入组件
  35. const AnnexList = defineAsyncComponent(() => import('@/components/AnnexList/index.vue'));
  36. // 定义子组件向父组件传值/事件
  37. const emit = defineEmits(['updateList']);
  38. // 定义变量内容
  39. const state = reactive<any>({
  40. dialogVisible: false, // 是否显示弹窗
  41. loading: false, // 是否显示加载
  42. ruleForm: {
  43. judgeContent: '', // 评判内容
  44. isAgree: true, // 是否通过
  45. },
  46. });
  47. const ruleFormRef = ref<RefType>();
  48. const ids = ref<any>([]);
  49. // 打开弹窗
  50. const openDialog = async (val: any) => {
  51. ids.value = val;
  52. state.dialogVisible = true;
  53. };
  54. // 关闭弹窗
  55. const closeDialog = () => {
  56. state.dialogVisible = false;
  57. };
  58. const close = () => {
  59. ruleFormRef.value?.clearValidate();
  60. ruleFormRef.value?.resetFields();
  61. state.loading = false;
  62. };
  63. // 审批
  64. const onAudit = (formEl: FormInstance | undefined) => {
  65. if (!formEl) return;
  66. formEl.validate((valid: boolean) => {
  67. if (!valid) return;
  68. state.loading = true;
  69. const request = {
  70. ids: ids.value,
  71. judgeContent: state.ruleForm.judgeContent,
  72. isAgree: state.ruleForm.isAgree,
  73. };
  74. visitTurnSatisfaction(request)
  75. .then((res: any) => {
  76. state.loading = false;
  77. closeDialog();
  78. emit('updateList');
  79. ElNotification({
  80. type: 'info',
  81. title: '评判完成',
  82. message: `成功评判${res.result?.successCount}条,失败${res.result?.errorCount}条`,
  83. });
  84. })
  85. .catch(() => {
  86. state.loading = false;
  87. });
  88. });
  89. };
  90. defineExpose({
  91. openDialog,
  92. closeDialog,
  93. });
  94. </script>