aizuda-web-vue3/src/views/flow/create/components/FlowDesign.vue

<script setup name="FlowDesign">
import { computed, onMounted, reactive, ref } from 'vue'
import ScWorkflow from '@/components/scWorkflow'
import process from '@/api/flow/process'
import useFlowStore from '@/store/modules/flow'
import { storeToRefs } from 'pinia'
import { useRoute } from 'vue-router'
const route = useRoute()

defineProps({
	label: {
		type: String
	},
	name: {
		type: String
	}
})

const flowStore = useFlowStore()
const { flowProcessId, basicInfo, processForm, modelContent } = storeToRefs(flowStore)
const formRef = ref()
let form = ref({
	// "name": "请假审批",
	processConfig: {
		nodeName: '发起人',
		type: 0,
		nodeRoleList: []
	}
})
const validate = () => {
	return new Promise(resolve => {
		// return new Promise((resolve, reject) => {
		resolve(form.value)
		/*formRef.value.validate((valid, errObj) => {
			if (valid) {
				console.error('valid 成功')
				// cb?.(form.value)
				resolve(form.value)
				// return form.value
				return
			}
			return reject([props.name, errObj])
		})*/
	})
}

// 接口保存审批流程
const saveDesign = async jsonStr => {
	try {
		const params = {
      ...basicInfo.value,
			processId: flowProcessId.value,
			processForm: processForm.value,
			modelContent: JSON.stringify(jsonStr)
		}
		const res = await process.progressCreateApi(params)
		flowProcessId.value = res
	} catch (e) {
		console.log(e)
	}
}

// 当前是否是编辑
const queryObj = computed(() => route.query)

onMounted(() => {
	if (queryObj.value.id) {
		const _val = JSON.parse(modelContent.value || '{}')
		form.value = Object.assign(_val, {})
	}
})

defineExpose({
	formRef,
	validate,
	saveDesign
})
</script>

<template>
	<ScWorkflow v-model="form.processConfig"></ScWorkflow>
</template>

<style scoped>
.flow-design-wrap {
	background: #f6f8f9;
	margin-bottom: 10px;
}
</style>