cmc-oa/oa-ui-app/pages/message/apply/detail.vue

<!--
 * @Author: ysh
 * @Date: 2025-02-06 09:48:52
 * @LastEditors: Please set LastEditors
 * @LastEditTime: 2025-04-16 15:12:13
-->
<template>
	<view>
		<!-- 动态加载表单组件 -->
		<component :is="currentForm" :taskForm="taskForm" :taskName="taskName" :startUserName="startUserName"
			@goBack="goBack" v-if="!isEmpty" />
		<component :is="'EmptyBox'" v-if="isEmpty" />
	</view>
</template>

<script>
import {
	getProcessVariables
} from "@/api/flowable/definition";
import Declare from '@/pages/form/declare/declare.vue';
import Borrow from "@/pages/form/borrow/borrow.vue";
import Device from "@/pages/form/device/device.vue";
import Car from "@/pages/form/car/car.vue";
import EmptyBox from "../../emptyBox.vue";
export default {
	components: {
		Declare,
		EmptyBox,
		Borrow,
		Device,
		Car,
	},
	data() {
		return {
			procDefName: '', // 流程名称
			taskName: '', // 当前节点
			startUserName: '', // 流程发起人
			formId: '',
			taskForm: {
				returnTaskShow: false, // 是否展示回退表单
				delegateTaskShow: false, // 是否展示回退表单
				defaultTaskShow: true, // 默认处理
				comment: "", // 意见内容
				procInsId: "", // 流程实例编号
				instanceId: "", // 流程实例编号
				deployId: "",  // 流程定义编号
				taskId: "",// 流程任务编号
				procDefId: "",  // 流程编号
				targetKey: "",
				variables: {
					variables: {}
				},
			},
			currentForm: null, // 当前加载的表单组件
			isEmpty: false,
		};
	},
	onLoad(options) {
		const params = JSON.parse(decodeURIComponent(options.params));
		// 接收传递的参数
		this.procDefName = params.procDefName;
		this.taskName = params.taskName;
		this.startUserName = params.startUserName;
		this.taskForm.taskId = params.taskId;
		this.taskForm.deployId = params.deployId;
		this.taskForm.procInsId = params.procInsId;
		this.taskForm.executionId = params.executionId;
		this.taskForm.instanceId = params.procInsId;
		getProcessVariables(params.taskId).then(res => {
			this.taskForm.formId = res.data.formId;
			// 根据流程名称加载不同的表单组件
			this.loadForm();
		})
	},
	methods: {
		loadForm() {
			this.isEmpty = false;
			switch (this.procDefName) {
				case '工作填报':
					this.currentForm = 'Declare';
					break;
				case '借款审批':
					this.currentForm = 'Borrow';
					break;
				case '设备审批':
					this.currentForm = 'Device';
					break;
				case '用车审批':
					this.currentForm = 'Car';
					break;
				default:
					console.log('未知流程');
					this.isEmpty = true;
					break;
			}
		},
		goBack() {
			uni.navigateTo({
				url: '/pages/message/apply/apply'
			})
		}
	}
}
</script>

<style lang="scss"></style>