191 lines
7.2 KiB
Vue
191 lines
7.2 KiB
Vue
<template>
|
|
<el-descriptions :column="3" border>
|
|
<el-descriptions-item label="审批状态" label-align="left" align="left">
|
|
{{ formData.check_status_text }}
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="当前审核人" label-align="left" align="left">
|
|
{{ formData.check_admin_users || "审批结束" }}
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="抄送人" label-align="left" align="left">
|
|
{{ formData.copy_users }}
|
|
</el-descriptions-item>
|
|
</el-descriptions>
|
|
<el-descriptions :column="1" border>
|
|
<el-descriptions-item label="审批流程" label-align="left" align="left">
|
|
<el-steps class="mb-4" style="max-width: 50vw" :space="200" :active="findActive() + 2" simple>
|
|
<el-step :icon="Clock" :title="formData.record[formData.record.length - 1].check_user_name + '创建'" />
|
|
<el-step :icon="Clock" :title="flowTypeToText(item.flow_type, item)" v-for="item in formData.steps" />
|
|
</el-steps>
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="审批记录" label-align="left" align="left">
|
|
<p v-for="item in formData.record">
|
|
<span>{{ item.check_user_name + item.status_text }} </span>了申请
|
|
{{ item.check_time }}
|
|
<span>
|
|
操作意见：
|
|
{{ item.content }}
|
|
</span>
|
|
</p>
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="审批节点" label-align="left" align="left"
|
|
v-if="formData.flow_info.check_type == 2 && formData.check_status != 3 && formData.check_status != 2 && formData.admin_id != userStore.id && showTextarea()">
|
|
<div class="flex" style="position: relative;">
|
|
<el-radio-group v-model="form.check_node">
|
|
<el-radio :label="1">审批结束</el-radio>
|
|
<el-radio :label="2">下一审批人</el-radio>
|
|
</el-radio-group>
|
|
<div class="w-280[px]" style="position: absolute;left:250px">
|
|
<el-input v-show="form.check_node == 2" v-model="form.check_admin_names" placeholder="点击选择下一审批人"
|
|
clearable readonly @click="userclick" />
|
|
</div>
|
|
</div>
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="审批意见" label-align="left" align="left"
|
|
v-if="showTextarea() && formData.admin_id != userStore.id">
|
|
<el-input type="textarea" v-model="form.content"></el-input>
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="操作" label-align="left" align="left" v-if="showTextarea()">
|
|
<el-button type="primary" @click="form.check = 1, handCheck()" v-if="formData.admin_id != userStore.id">
|
|
通过
|
|
</el-button>
|
|
<el-button @click="form.check = 2, handCheck()"
|
|
v-if="formData.admin_id != userStore.id && formData.flow_info.check_type != 3">
|
|
拒绝
|
|
</el-button>
|
|
<el-button @click="form.check = 2, handCheck()"
|
|
v-if="formData.admin_id != userStore.id && formData.flow_info.check_type == 3">
|
|
回退
|
|
</el-button>
|
|
<el-button type="info" @click=" showBackDialog = true" v-if="formData.admin_id == userStore.id">
|
|
撤回
|
|
</el-button>
|
|
</el-descriptions-item>
|
|
<el-descriptions-item label="操作" label-align="left" align="left"
|
|
v-if="formData.check_status == 3 && formData.record[formData.record.length - 1].check_user_id == userStore.id">
|
|
<el-button type="info" @click="reEdit">
|
|
重新编辑
|
|
</el-button>
|
|
</el-descriptions-item>
|
|
</el-descriptions>
|
|
<div v-if="showPerDialog">
|
|
<personnelselector ref="personnel" @confirm="submituser" type="1">
|
|
</personnelselector>
|
|
</div>
|
|
<el-dialog v-model="showBackDialog" title="撤回审批" width="550px">
|
|
<el-form-item label="撤回原因">
|
|
<el-input v-model="form.content" type="textarea"> </el-input>
|
|
</el-form-item>
|
|
<el-form-item label="">
|
|
<el-button type="primary" @click="backFn">撤回</el-button>
|
|
<el-button @click="showBackDialog = false">取消</el-button>
|
|
</el-form-item>
|
|
</el-dialog>
|
|
</template>
|
|
|
|
<script setup lang="ts">
|
|
import { apiOaoaApproveCheck } from "@/api/oa_initiate"
|
|
import useUserStore from "@/stores/modules/user";
|
|
import { Clock } from '@element-plus/icons-vue'
|
|
import feedback from '@/utils/feedback'
|
|
import { defineProps } from "vue"
|
|
|
|
let props = defineProps({
|
|
formData: {
|
|
type: Object,
|
|
}
|
|
})
|
|
|
|
const emit = defineEmits(["success", "close", "reEdit"]);
|
|
const showPerDialog = ref(false);
|
|
const personnel = ref(null);
|
|
const userStore = useUserStore().userInfo;
|
|
const showBackDialog = ref(false)
|
|
|
|
const form = reactive({
|
|
"id": props.formData.id,
|
|
"check": '',
|
|
"content": "",
|
|
"check_node": 1,
|
|
"check_admin_ids": '',
|
|
check_admin_names: ""
|
|
})
|
|
|
|
|
|
const backFn = () => {
|
|
if (!form.content) return feedback.msgError("请填写撤回原因");
|
|
form.check = 3
|
|
handCheck()
|
|
}
|
|
const userclick = async () => {
|
|
showPerDialog.value = true;
|
|
await nextTick();
|
|
personnel.value.open();
|
|
};
|
|
|
|
const submituser = (e) => {
|
|
form.check_admin_names = e.name;
|
|
form.check_admin_ids = e.id;
|
|
showPerDialog.value = false;
|
|
};
|
|
|
|
|
|
const flowTypeToText = (type, item) => {
|
|
if (type == 0) return item.user_id_info[0].name;
|
|
if (type == 1) return "部门负责人";
|
|
if (type == 2) return "或签";
|
|
if (type == 3) return "会签";
|
|
if (type == 4) return item.user_id_info[0].name;
|
|
}
|
|
|
|
const findActive = () => {
|
|
let index = props.formData.steps.findIndex(item => { return item.sort == props.formData.check_step_sort })
|
|
return index
|
|
}
|
|
|
|
// 关闭回调
|
|
const handleClose = () => {
|
|
emit('close')
|
|
}
|
|
|
|
const hdClose = () => {
|
|
emit('close')
|
|
}
|
|
|
|
|
|
// 审批
|
|
const handCheck = async () => {
|
|
if (props.formData.check_admin_ids && props.formData.record[props.formData.record.length - 1].check_user_id == form.check_admin_ids) {
|
|
return feedback.msgError("下一级审批人不能是发起审批人")
|
|
|
|
}
|
|
if (props.formData.flow_info.check_type != 2) delete form.check_node;
|
|
form.id = props.formData.id
|
|
const res = await apiOaoaApproveCheck({ ...form })
|
|
handleClose()
|
|
}
|
|
|
|
// 显示
|
|
const showActionList = reactive([4, 3, 2])
|
|
const showTextarea = () => {
|
|
if (showActionList.includes(props.formData.check_status)) return false;
|
|
if (props.formData.admin_id == userStore.id) return true;
|
|
if (props.formData?.check_admin_ids.length > 1) {
|
|
if (props.formData.steps[findActive()].check_list.map(item => item.check_user_id).includes(userStore.id)) return false;
|
|
else return (props.formData?.check_admin_ids.split(',').map(Number).includes(userStore.id)); // 判断是否是当前用户
|
|
} else {
|
|
return (props.formData?.check_admin_ids == userStore.id)
|
|
}
|
|
}
|
|
|
|
//重新编辑
|
|
const reEdit = () => {
|
|
emit('reEdit')
|
|
}
|
|
|
|
</script>
|
|
<style lang="scss" scoped>
|
|
:deep(.el-step__icon) {
|
|
margin-top: 10px !important;
|
|
}
|
|
</style>
|