admin-sjzx/src/views/system/workflow/model/modelDesign.vue

<template>
	<el-card>
		<Workflow
			v-model="modelDesignData.modelValue"
			:form-field-list-value="formFieldListValue"
			:record-data="recordData"
			:sn-template-array="snTemplateArray"
			:print-template-array="printTemplateArray"
			:execution-listener-array="executionListenerArray"
			:execution-listener-selector-for-custom-event-array="executionListenerSelectorForCustomEventArray"
			:task-listener-array="taskListenerArray"
			:selector-api-function="selectorApiFunction"
		/>
	</el-card>
</template>
<script setup name="modelDesign">
	import Workflow from '@/components/XnWorkflow/index.vue'
    import { ref } from 'vue'
	// import modelApi from '@/api/flw/modelApi'
	// import userCenterApi from '@/api/sys/userCenterApi'
	// import templatePrintApi from '@/api/flw/templatePrintApi'
	// import templateSnApi from '@/api/flw/templateSnApi'
    import {
        executionListenerSelector,
        executionListenerSelectorForCustomEvent,
        taskListenerSelector
    } from '@/api/workflow-boot/model'
    import { deptList, deptTreeSelector, getDeptListByIds } from '@/api/user-boot/dept'
    import { flwTemplatePrintSelector, flwTemplateSnSelector } from '@/api/workflow-boot/template'
    import { allRoleList, getRoleListByIds } from '@/api/user-boot/role'
    import { getUserListByIds, listAllUserByDeptId } from '@/api/user-boot/user'

	// 模型设计器的值
	const modelDesignData = ref({})
	// 模型主题值
	const recordData = ref({})
	// 序列号列表
	const snTemplateArray = ref([])
	// 打印模板列表
	const printTemplateArray = ref([])
	// 执行监听器数据
	const executionListenerArray = ref([])
	// 自定义事件执行监听器选择器
	const executionListenerSelectorForCustomEventArray = ref([])
	// 任务监听器数据
	const taskListenerArray = ref([])

	const formFieldListValue = ref([])
	// 获取值
	const getValue = () => {
		return modelDesignData.value.modelValue
	}

	// 回显值
	const setValue = (value, record) => {
		modelDesignData.value = value
		recordData.value = record
		// 获取序列号列表
        flwTemplateSnSelector().then((data) => {
			snTemplateArray.value = data.map((item) => {
				return {
					value: item['id'],
					label: item['name']
				}
			})
		})

		// 获取打印模板列表
        flwTemplatePrintSelector().then((data) => {
			printTemplateArray.value = data.map((item) => {
				return {
					value: item['id'],
					label: item['name']
				}
			})
		})
		// 获取执行监听器数据
        executionListenerSelector().then((data) => {
			executionListenerArray.value = data.map((item) => {
				return {
					label: item,
					value: item
				}
			})
		})
		// 获取自定义事件执行监听器选择器
        executionListenerSelectorForCustomEvent().then((data) => {
			executionListenerSelectorForCustomEventArray.value = data.map((item) => {
				return {
					label: item,
					value: item
				}
			})
		})
		// 获取任务监听器数据
        taskListenerSelector().then((data) => {
			taskListenerArray.value = data.map((item) => {
				return {
					label: item,
					value: item
				}
			})
		})
	}
	// 传字段的数据过来
	const setFormFieldListValue = (value) => {
		if (value) {
			formFieldListValue.value = JSON.parse(JSON.stringify(value))
		}
	}
	// 传递设计器需要的API
	const selectorApiFunction = {
		orgTreeApi: (param) => {
			return deptTreeSelector(param).then((orgTree) => {
				return Promise.resolve(orgTree)
			})
		},
		orgPageApi: (param) => {
			return deptList(param).then((data) => {
				return Promise.resolve(data)
			})
		},
		rolePageApi: (param) => {
			return allRoleList(param).then((data) => {
				return Promise.resolve(data)
			})
		},
		// posPageApi: (param) => {
		// 	return modelApi.modelPositionSelector(param).then((data) => {
		// 		return Promise.resolve(data)
		// 	})
		// },
		userPageApi: (param) => {
			return listAllUserByDeptId('').then((data) => {
				return Promise.resolve(data)
			})
		},
		checkedUserListApi: (param) => {
			return getUserListByIds(param).then((data) => {
				return Promise.resolve(data)
			})
		},
		// checkedPosListApi: (param) => {
		// 	return userCenterApi.userCenterGetPositionListByIdList(param).then((data) => {
		// 		return Promise.resolve(data)
		// 	})
		// },
		checkedOrgListApi: (param) => {
			return getDeptListByIds(param).then((data) => {
				return Promise.resolve(data)
			})
		},
		checkedRoleListApi: (param) => {
			return getRoleListByIds(param).then((data) => {
				return Promise.resolve(data)
			})
		}
	}
	// 抛出钩子
	defineExpose({
		getValue,
		setValue,
		setFormFieldListValue
	})
</script>