人脸审批管理

src/components/processDrawer/index.vue

@@ -0,0 +1,112 @@
+<template>
+	<!-- 流程审批抽屉 -->
+	<el-drawer v-model="processDrawerVisible" direction="rtl" size="400px">
+		<template #header>
+			<h3>{{ curAssignTask?.processName }}</h3>
+		</template>
+		<template #default>
+			<div class="w-full h-full" v-loading="loading">
+				<el-card class="box-card" v-if="curAssignTask.taskId">
+					<form-render ref="formRenderRef" :form-list="currentOpenFlowForm" />
+				</el-card>
+				<flow-node-format
+					:disableSelect="true"
+					:formData="formValue"
+					:task-id="curAssignTask.taskId"
+					:processInstanceId="curAssignTask.processInstanceId"
+					:flow-id="curAssignTask.flowId"
+					ref="flowNodeFormatRef"
+					class="mt-4"
+				/>
+			</div>
+		</template>
+		<template #footer>
+			<div style="flex: auto">
+				<el-button size="large" type="danger" icon="Close" @click="refuseTask" :disabled="loading">拒绝</el-button>
+				<el-button size="large" type="primary" icon="Check" @click="submitTask" :disabled="loading">提交</el-button>
+				<el-button size="large" type="info" icon="Share" @click="transferTask" :disabled="loading">转办</el-button>
+			</div>
+		</template>
+	</el-drawer>
+
+	<!--同意提交处理-->
+	<agree-handle @taskSubmitEvent="taskSubmitEvent" ref="agreeHandler"></agree-handle>
+
+	<!--拒绝审核处理-->
+	<refuse-handle @taskSubmitEvent="taskSubmitEvent" ref="refuseHandler"></refuse-handle>
+
+	<!--转办处理-->
+	<transfer-handle @taskSubmitEvent="taskSubmitEvent" ref="transferHandler"></transfer-handle>
+</template>
+
+<script setup lang="ts">
+import { FlowFormItem } from "./types"
+import FormRender from "/@/views/flow/form/render/FormRender.vue"
+import FlowNodeFormat from "/@/views/flow/form/tools/FlowNodeFormatData.vue"
+import AgreeHandle from "./agree.vue"
+import RefuseHandle from "./refuse.vue"
+import TransferHandle from "./transfer.vue"
+import { queryAssignTaskOne, queryTask } from "/@/api/flow/task"
+
+const emit = defineEmits(["taskSubmitEvent"])
+
+const processDrawerVisible = ref<boolean>(false)
+const curAssignTask = ref<any>({})
+const currentOpenFlowForm = ref<FlowFormItem[]>([])
+const loading = ref(false)
+const agreeHandler = ref()
+const refuseHandler = ref()
+const transferHandler = ref()
+
+// 打开流程审批抽屉
+const openProcessDrawer = async (row: any) => {
+	processDrawerVisible.value = true
+
+	loading.value = true
+	try {
+		const assignTask = await queryAssignTaskOne({ processInstanceId: row.processId })
+		if (assignTask.code === 0) {
+			curAssignTask.value = assignTask.data
+		}
+
+		const res = await queryTask(curAssignTask.value.taskId, false).finally(() => (loading.value = false))
+		if (res.code === 0) {
+			currentOpenFlowForm.value = res.data.formItems
+		}
+	} catch (error) {
+		curAssignTask.value = {}
+		currentOpenFlowForm.value = []
+	} finally {
+		loading.value = false
+	}
+}
+
+// 提交任务
+const submitTask = () => {
+	agreeHandler.value.handle(curAssignTask.value, currentOpenFlowForm.value)
+}
+// 拒绝任务
+const refuseTask = () => {
+	refuseHandler.value.handle(curAssignTask.value, currentOpenFlowForm.value)
+}
+// 转办任务
+const transferTask = () => {
+	transferHandler.value.handle(curAssignTask.value, currentOpenFlowForm.value)
+}
+
+// 流程提交
+const taskSubmitEvent = () => emit("taskSubmitEvent")
+
+const formValue = computed(() => {
+	const obj: any = {}
+
+	for (let item of currentOpenFlowForm.value) {
+		obj[item.id] = item.props.value
+	}
+	return obj
+})
+
+defineExpose({
+	openProcessDrawer,
+})
+</script>