<template>
|
<div>
|
<el-dialog
|
v-model="dialogFormVisible"
|
:title="operationType === 'add' ? '新增审批流程' : '编辑审批流程'"
|
width="700px"
|
@close="closeDia"
|
>
|
<el-form :model="{ activities }" ref="formRef" label-position="top">
|
<el-timeline style="max-width: 600px">
|
<el-timeline-item
|
v-for="(activity, index) in activities"
|
:key="index"
|
:type="activity.current ? 'primary' : ''"
|
:hollow="activity.current"
|
:timestamp="activity.approveNodeTime"
|
>
|
<el-card>
|
<span style="font-size: 18px;font-weight: 700">节点{{activity.approveNodeOrder}}</span>
|
<div style="margin: 10px 0">
|
<span style="font-size: 16px;font-weight: 600">审批人：{{activity.approveNodeUser}}</span>
|
</div>
|
<div>
|
<span style="margin-bottom: 8px;display: inline-block;font-size: 16px;font-weight: 600">审批意见：</span>
|
<el-form-item
|
v-if="activity.approveNodeRemark == 1"
|
:prop="'activities.' + index + '.approveNodeReason'"
|
:rules="[{ required: true, message: '审批意见不能为空', trigger: 'blur' }]"
|
>
|
<el-input v-model="activity.approveNodeReason" clearable type="textarea" :disabled="operationType === 'view'"></el-input>
|
</el-form-item>
|
<el-form-item v-else>
|
<el-input v-model="activity.approveNodeReason" clearable type="textarea" disabled></el-input>
|
</el-form-item>
|
</div>
|
</el-card>
|
</el-timeline-item>
|
</el-timeline>
|
</el-form>
|
<template #footer v-if="operationType === 'approval'">
|
<div class="dialog-footer">
|
<el-button type="primary" @click="submitForm(2)">不通过</el-button>
|
<el-button type="primary" @click="submitForm(1)">通过</el-button>
|
<el-button @click="closeDia">取消</el-button>
|
</div>
|
</template>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script setup>
|
import {getCurrentInstance, ref} from "vue";
|
import {approveProcessDetails, updateApproveNode} from "../../../../api/collaborativeApproval/approvalProcess.js";
|
const emit = defineEmits(['close'])
|
const { proxy } = getCurrentInstance()
|
|
const dialogFormVisible = ref(false);
|
const operationType = ref('')
|
const activities = ref([])
|
const formRef = ref(null);
|
|
// 打开弹框
|
const openDialog = (type, row) => {
|
operationType.value = type;
|
dialogFormVisible.value = true;
|
approveProcessDetails(row.approveId).then((res) => {
|
console.log(res)
|
activities.value = res.data
|
})
|
}
|
// 提交审批
|
const submitForm = (status) => {
|
const filteredActivities = activities.value.filter(activity => activity.approveNodeRemark == 1);
|
filteredActivities[0].approveNodeStatus = status
|
updateApproveNode(filteredActivities[0]).then(() => {
|
proxy.$modal.msgSuccess("提交成功");
|
closeDia();
|
})
|
}
|
// 关闭弹框
|
const closeDia = () => {
|
proxy.resetForm("formRef");
|
dialogFormVisible.value = false;
|
emit('close')
|
};
|
defineExpose({
|
openDialog,
|
});
|
</script>
|
|
<style scoped>
|
.el-timeline {
|
padding-left: 10px;
|
}
|
</style>
|
