<template>
	<el-dialog v-model="state.dialogVisible" draggable title="甄别详情" ref="dialogRef" width="50%" append-to-body destroy-on-close>
		<el-form label-width="110px" ref="ruleFormRef" :model="state.ruleForm" class="show-info-form">
			<el-row :gutter="10">
				<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
					<el-form-item label="工单编号"> {{ state.ruleForm?.no }} </el-form-item>
				</el-col>
				<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
					<el-form-item label="工单标题"> {{ state.ruleForm?.visit?.order?.title }} </el-form-item>
				</el-col>
				<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
					<el-form-item label="申请人">{{ state.ruleForm?.creatorName }} </el-form-item>
				</el-col>
				<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
					<el-form-item label="申请部门">{{ state.ruleForm?.creatorOrgName }} </el-form-item>
				</el-col>
				<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
					<el-form-item label="申请时间">{{ formatDate(state.ruleForm?.creationTime, 'YYYY-mm-dd HH:MM:SS') }} </el-form-item>
				</el-col>
				<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
					<el-form-item label="申请类型"> {{ state.ruleForm?.typeDicName }} </el-form-item>
				</el-col>
				<el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12">
					<el-form-item label="是否省甄别">{{ state.ruleForm?.isProDelay ? '是' : '否' }} </el-form-item>
				</el-col>
				<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
					<el-form-item label="申请理由">{{ state.ruleForm?.content }} </el-form-item>
				</el-col>
				<el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24">
					<el-form-item label="附件">
						<annex-list name="查看附件" readonly :businessId="state.ruleForm.id" classify="查看附件" />
					</el-form-item>
				</el-col>
			</el-row>
		</el-form>
		<template #footer>
			<span class="dialog-footer">
				<el-button @click="closeDialog" class="default-button">关 闭</el-button>
				<el-button type="primary" @click="processDetail">流程明细</el-button>
				<el-button type="primary" @click="onAudit" v-if="[0,1,3].includes(state.ruleForm.status) && state.ruleForm.isCanHandle">甄别审批</el-button>
			</span>
		</template>
	</el-dialog>
	<!-- 审核记录 -->
	<audit-record ref="auditRecordRef" />
	<!--  流程审批  -->
	<process-audit ref="processAuditRef" @orderProcessSuccess="closeDialog"></process-audit>
</template>
<script setup lang="ts" name="discernDetail">
import {defineAsyncComponent, reactive, ref} from 'vue';
import {formatDate} from '/@/utils/formatTime';
import {screenDetail} from '/@/api/business/discern';
import {commonEnum} from "/@/utils/constants";

const AuditRecord = defineAsyncComponent(() => import('/@/components/AuditRecord/index.vue')); // 流程明细
const AnnexList = defineAsyncComponent(() => import('/@/components/AnnexList/index.vue')); // 附件列表
const ProcessAudit = defineAsyncComponent(() => import('/@/components/ProcessAudit/index.vue')); // 流程审批

const emit = defineEmits(['updateList']); // 定义事件
// 定义变量内容
const state = reactive<any>({
	dialogVisible: false, // 是否显示弹窗
	loading: false, // 是否显示加载
	ruleForm: {},
});
/*
 * @params row 工单详情
 * @description 打开弹窗
 * */
const openDialog = async (row: any) => {
	state.loading = true;
	try {
		const res = await screenDetail(row.id);
		state.ruleForm = res.result ?? {};
		state.dialogVisible = true;
		state.loading = false;
	} catch (e) {
		console.log(e);
		state.loading = false;
	}
};
// 关闭弹窗
const closeDialog = () => {
	state.dialogVisible = false;
	emit('updateList');
};
// 流程明细
const auditRecordRef = ref<RefType>(); // 审核记录ref
const processDetail = () => {
	const params = {
		dialogTitle: `甄别记录 （${state.ruleForm?.visit?.order?.title}）`,
		...state.ruleForm,
	};
	auditRecordRef.value.openDialog(params);
};
// 甄别审批
const processAuditRef = ref<RefType>();
const onAudit = () => {
  try {
    const orderDetail = {
      visitId:state.ruleForm?.visitId,
      ...state.ruleForm?.visit?.order
    }
    let params = <EmptyObjectType>{};
    switch (state.ruleForm.status) {
      case 0: // 待办 申请甄别
        params = {
          id: state.ruleForm.workflowId,
          commonEnum:commonEnum.Discriminate,
          processType: '甄别审批',
          orderDetail,
          extra: {
            dialogTitle: '甄别审批',
            inputPlaceholder: '审批意见',
            annexName:'甄别附件',
            classify:'甄别上传'
          },
        };
        processAuditRef.value.openDialog(params);
        break;
      case 1: // 审批中 甄别审批
        params = {
          id: state.ruleForm.workflowId,
          commonEnum:commonEnum.Discriminate,
          processType: '甄别审批',
          orderDetail,
          extra: {
            dialogTitle: '甄别审批',
            inputPlaceholder: '审批意见',
            annexName:'甄别附件',
            classify:'甄别上传'
          },
        };
        processAuditRef.value.openDialog(params);
        break;
      case 2: // 审批完成

        break;
      case 3:// 审批拒绝 重新申请
        params = {
          id: state.ruleForm.workflowId,
          commonEnum:commonEnum.Discriminate,
          processType: '甄别申请',
          orderDetail,
          extra: {
            dialogTitle: '甄别申请',
            inputPlaceholder: '请输入甄别意见',
            annexName:'甄别附件',
            classify:'甄别上传'
          },
        };
        processAuditRef.value.openDialog(params);
        break;
      default:
    }
  } catch (error) {
    console.log(error);
  }
};
defineExpose({
	openDialog,
	closeDialog,
});
</script>
