Merge remote-tracking branch 'origin/master'

src/views/approve/launch/ItemDrawer.vue

@@ -7,9 +7,10 @@
 		size="760px"
 		@update:model-value="updateModelValue"
 	>
+		<div v-if="validateForm.loading" v-loading="true" class="local_loading"></div>
 		<div class="info-wrap">
 			<el-divider content-position="left">{{ record.processName }}表单</el-divider>
-			<FormCreate class="form-wrap" :option="formOption" :rule="formRule" />
+			<FormCreate v-model:api="validateForm.api" class="form-wrap" :option="validateForm.option" :rule="validateForm.rule" />
 			<el-divider content-position="left">审批流程</el-divider>
 			<el-timeline class="timeline-wrap">
 				<el-timeline-item v-for="(v, index) in processTimelineList" :key="index">
@@ -51,12 +52,14 @@
 			<el-divider></el-divider>
 		</div>
 
-		<template #footer> 123 </template>
+		<template #footer>
+			<el-button @click="updateModelValue(false)">{{ $t('le.btn.cancel') }}</el-button>
+			<el-button :disabled="validateForm.loading" type="primary" style="margin-left: 8px" @click="onSubmit">{{ $t('le.btn.confirm') }}</el-button>
+		</template>
 	</el-drawer>
 	<use-select ref="useSelectRef"></use-select>
 </template>
 <script setup lang="ts">
-import SvgIcon from '@/components/SvgIcon/index.vue'
 import model from '@/api/flow/process'
 import viewForm from '@/utils/form'
 import { ref, shallowRef, computed, reactive } from 'vue'
@@ -82,37 +85,43 @@ const selectHandler = (name: string, type: number) => {
 	useSelectRef.value.open(type, userMap.value.get(name).assignees)
 }
 const FormCreate = viewForm.$form()
-const formOption = ref({
-	onSubmit(formData) {
-		// console.error(formData, 'formData')
-		const processId = props.record.processId
-		formOption.value.submitBtn.loading = true
-		const processForm: any[] = JSON.parse(cur_processForm_str)
-		processForm.forEach(v => {
-			// 填写的数据存储(local_: 本地数据处理标识)
-			v.local_value = formData[v.field]
-		})
-		model
-			.processLaunchApi({
-				processId, // 流程ID
-				processForm: JSON.stringify(processForm), // 流程表单JSON内容 & local_value 保存
-				assigneeMap: userMap.value // 流程节点审批人
-			})
-			.then(res => {
-				ElMessage.success('提交成功')
-				updateModelValue(false)
-			})
-			.finally(() => {
-				formOption.value.submitBtn.loading = false
-			})
+const validateForm = ref({
+	api: {},
+	option: {
+		submitBtn: false
 	},
-	submitBtn: { loading: false }
+	rule: [],
+	loading: false
 })
+const onSubmit = async () => {
+	const api = validateForm.value.api
+	await api.validate()
+	const values = api.formData()
+	// console.warn(values, 'values')
+	const processId = props.record.processId
+	validateForm.value.loading = true
+	const processForm: any[] = JSON.parse(cur_processForm_str)
+	processForm.forEach(v => {
+		// 填写的数据存储(local_: 本地数据处理标识)
+		v.local_value = values[v.field]
+	})
+	model
+		.processLaunchApi({
+			processId, // 流程ID
+			processForm: JSON.stringify(processForm), // 流程表单JSON内容 & local_value 保存
+			assigneeMap: userMap.value // 流程节点审批人
+		})
+		.then(res => {
+			ElMessage.success('提交成功')
+			updateModelValue(false)
+		})
+		.finally(() => {
+			validateForm.value.loading = false
+		})
+}
 
 // 当前form 表单数据字符串
 let cur_processForm_str = '[]'
-const formRule = shallowRef([])
-const loading = ref(true)
 const processChecked = reactive({
 	/*'local_条件分支_期限': '短期'*/
 })
@@ -165,20 +174,28 @@ const packageProcess = (data, list = []) => {
 const processTimelineList = computed(() => {
 	return packageProcess(localProcessData.value)
 })
+validateForm.value.loading = true
+Promise.all([
+	model.processListNodeMapApi(props.record.processId).then((res: any) => {
+		localProcessData.value = res
+	}),
+	model.processDetailApi(props.record.processId).then(res => {
+		/*let local_workflow = {}
+		try {
+			console.log(JSON.parse(res.modelContent))
+			const modelContent = JSON.parse(res.modelContent)
+			local_workflow = modelContent.nodeConfig ?? modelContent.childNode
+		} catch (e) {}*/
+		cur_processForm_str = res.processForm || '[]'
+		// const x = JSON.parse(cur_processForm_str)
+		// x[0].validate = [{ required: true, message: '请输入商品简介', trigger: 'blur' }]
 
-model.processListNodeMapApi(props.record.processId).then(res => {
-	localProcessData.value = res
-})
-model.processDetailApi(props.record.processId).then(res => {
-	let local_workflow = {}
-	try {
-		console.log(JSON.parse(res.modelContent))
-		const modelContent = JSON.parse(res.modelContent)
-		local_workflow = modelContent.nodeConfig ?? modelContent.childNode
-	} catch (e) {}
-	cur_processForm_str = res.processForm || '[]'
-	// processForm 动态表单
-	formRule.value = [...JSON.parse(cur_processForm_str) /*, { ...workflowItem, value: local_workflow }*/ /*, { type: 'input', field: 'test_3' }*/]
+		// processForm 动态表单
+		// validateForm.value.rule = [...JSON.parse(cur_processForm_str) /*, { ...workflowItem, value: local_workflow }*/ /*, { type: 'input', field: 'test_3' }*/]
+		validateForm.value.rule = JSON.parse(cur_processForm_str)
+	})
+]).finally(() => {
+	validateForm.value.loading = false
 })
 </script>
 <style lang="scss">
@@ -199,8 +216,12 @@ model.processDetailApi(props.record.processId).then(res => {
 	}
 	.el-drawer__body {
 		position: relative;
-		//display: flex;
-		//flex-direction: column;
+		display: flex;
+		flex-direction: column;
+	}
+	.el-drawer__footer {
+		border-top: 1px solid var(--el-border-color-lighter);
+		padding: 12px 24px;
 	}
 	.local_loading {
 		position: absolute;