RefuseForm.vue 5.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130
  1. <template>
  2. <Dialog :title="formType === 'details' ? '详情' : t('common.audit')" v-model="dialogVisible">
  3. <el-descriptions title="" border :column="1">
  4. <el-descriptions-item label="学校名称">{{ formatName(info?.school?.schoolName) }}</el-descriptions-item>
  5. <el-descriptions-item label="老师昵称">{{ info?.school?.teacherNickname || '-' }}</el-descriptions-item>
  6. <el-descriptions-item label="联系电话">{{ info?.school?.phone || '-' }}</el-descriptions-item>
  7. <el-descriptions-item label="学校地址">{{ info?.school?.schoolAdderss || '-' }}</el-descriptions-item>
  8. <el-descriptions-item label="创建时间">{{ info?.school?.createDate ? formatDate(info?.school?.createDate) : '-' }}</el-descriptions-item>
  9. <el-descriptions-item label="在岗证明图片">
  10. <el-image class="!w-80px h-80px" :src="info?.schoolQualificaions?.jobImg || ''" hide-on-click-modal :preview-src-list="[info?.schoolQualificaions?.jobImg]"/>
  11. </el-descriptions-item>
  12. <el-descriptions-item label="身份证正面图片">
  13. <el-image class="!w-80px h-80px" :src="info?.schoolQualificaions?.schoolLegalPersonIdCardImg1 || ''" hide-on-click-modal :preview-src-list="[info?.schoolQualificaions?.schoolLegalPersonIdCardImg1]"/>
  14. </el-descriptions-item>
  15. <el-descriptions-item label="身份证背面图片">
  16. <el-image class="!w-80px h-80px" :src="info?.schoolQualificaions?.schoolLegalPersonIdCardImg2 || ''" hide-on-click-modal :preview-src-list="[info?.schoolQualificaions?.schoolLegalPersonIdCardImg2]"/>
  17. </el-descriptions-item>
  18. <el-descriptions-item v-if="refuseMessage && info?.school?.authStatus === '2'" label="审核拒绝原因">{{ refuseMessage || '-' }}</el-descriptions-item>
  19. </el-descriptions>
  20. <el-form
  21. v-if="formType === 'refuse'"
  22. ref="formRef"
  23. :model="formData"
  24. :rules="formRules"
  25. label-width="80px"
  26. class="mt-50px"
  27. v-loading="formLoading"
  28. >
  29. <el-form-item label="拒绝原因" prop="message">
  30. <el-input v-model="formData.message" type="textarea" placeholder="请输入拒绝原因" />
  31. </el-form-item>
  32. </el-form>
  33. <template #footer>
  34. <el-button v-if="formType === 'agree'" @click="handleAgree" type="success" :disabled="formLoading">通 过</el-button>
  35. <el-button v-if="formType === 'refuse'" @click="handleRefuse" type="danger" :disabled="formLoading">拒绝</el-button>
  36. <el-button @click="dialogVisible = false">取 消</el-button>
  37. </template>
  38. </Dialog>
  39. </template>
  40. <script setup lang="ts">
  41. /** 门墩儿-学校注册申请拒绝 表单 */
  42. defineOptions({ name: 'SchoolRegisterRejectForm' })
  43. import { formatName } from '@/utils'
  44. import { formatDate } from '@/utils/formatTime'
  45. import { FlameSchoolApi } from '@/api/menduner/schoolRegisterExamine'
  46. const { t } = useI18n() // 国际化
  47. const message = useMessage() // 消息弹窗
  48. const dialogVisible = ref(false) // 弹窗的是否展示
  49. const formRef = ref() // 表单 Ref
  50. const formType = ref('')
  51. const formLoading = ref(false) // 表单的加载中:1)修改时的数据加载;2)提交的按钮禁用
  52. const formRules = reactive({
  53. message: [{ required: true, message: '拒绝原因不能为空', trigger: 'blur' }]
  54. })
  55. const formData = ref({
  56. message: ''
  57. })
  58. const query = ref({})
  59. const handleAgree = async () => {
  60. try {
  61. await message.confirm('确定要通过该学校注册申请吗?')
  62. await FlameSchoolApi.flameSchoolExamine({ ...query.value, status: 1, message: '' })
  63. dialogVisible.value = false
  64. message.success('操作成功')
  65. // 发送操作成功的事件
  66. emit('success')
  67. } catch {}
  68. }
  69. const handleRefuse = async () => {
  70. // 校验表单
  71. await formRef.value.validate()
  72. formLoading.value = true
  73. try {
  74. await FlameSchoolApi.flameSchoolExamine({ ...query.value, status: 0, message: formData.value.message })
  75. formLoading.value = false
  76. dialogVisible.value = false
  77. message.success('操作成功')
  78. // 发送操作成功的事件
  79. emit('success')
  80. } catch (err) {
  81. message.error('拒绝失败')
  82. } finally {
  83. formLoading.value = false
  84. dialogVisible.value = false
  85. }
  86. }
  87. /** 打开弹窗 */
  88. const info = ref({})
  89. const refuseMessage = ref('')
  90. const emit = defineEmits(['success']) // 定义 success 事件,用于操作成功后的回调
  91. const open = async (id: Number, type: string) => {
  92. formType.value = type
  93. dialogVisible.value = true
  94. if (type === 'refuse') resetForm()
  95. if (id) {
  96. const data = await FlameSchoolApi.flameSchoolDetail({ schoolId: id })
  97. info.value = data || {}
  98. query.value = {
  99. title: '门墩儿管理员',
  100. userType: 1,
  101. entityId: data.school.schoolId
  102. }
  103. // 如果审核状态为拒绝,则获取拒绝理由
  104. if (data?.school?.authStatus === '2') {
  105. const result = await FlameSchoolApi.flameSchoolExamineReasonById({ schoolId: id })
  106. refuseMessage.value = result?.message
  107. }
  108. }
  109. }
  110. defineExpose({ open }) // 提供 open 方法,用于打开弹窗
  111. /** 重置表单 */
  112. const resetForm = () => {
  113. formData.value = {
  114. message: ''
  115. }
  116. formRef.value?.resetFields()
  117. }
  118. </script>