|
@@ -71,7 +71,6 @@
|
|
|
v-if="currentStep === 2"
|
|
|
v-model="formData"
|
|
|
ref="processDesignRef"
|
|
|
- @success="handleDesignSuccess"
|
|
|
/>
|
|
|
</div>
|
|
|
</div>
|
|
@@ -118,7 +117,8 @@ const validateProcess = async () => {
|
|
|
await processDesignRef.value?.validate()
|
|
|
}
|
|
|
|
|
|
-const currentStep = ref(0) // 步骤控制
|
|
|
+const currentStep = ref(-1) // 步骤控制 一开始全部不展示等当前页面数据初始化完成
|
|
|
+
|
|
|
const steps = [
|
|
|
{ title: '基本信息', validator: validateBasic },
|
|
|
{ title: '表单设计', validator: validateForm },
|
|
@@ -145,17 +145,27 @@ const formData: any = ref({
|
|
|
managerUserIds: []
|
|
|
})
|
|
|
|
|
|
+//流程数据
|
|
|
+const processData = ref<any>()
|
|
|
+
|
|
|
+provide("processData", processData)
|
|
|
+
|
|
|
// 数据列表
|
|
|
const formList = ref([])
|
|
|
const categoryList = ref([])
|
|
|
const userList = ref<UserApi.UserVO[]>([])
|
|
|
|
|
|
+
|
|
|
/** 初始化数据 */
|
|
|
const initData = async () => {
|
|
|
const modelId = route.params.id as string
|
|
|
if (modelId) {
|
|
|
// 修改场景
|
|
|
formData.value = await ModelApi.getModel(modelId)
|
|
|
+ // 复制场景
|
|
|
+ if (route.params.type === 'copy') {
|
|
|
+ delete formData.value.id
|
|
|
+ }
|
|
|
} else {
|
|
|
// 新增场景
|
|
|
formData.value.managerUserIds.push(userStore.getUser.id)
|
|
@@ -167,59 +177,49 @@ const initData = async () => {
|
|
|
categoryList.value = await CategoryApi.getCategorySimpleList()
|
|
|
// 获取用户列表
|
|
|
userList.value = await UserApi.getSimpleUserList()
|
|
|
+
|
|
|
+ currentStep.value = 0
|
|
|
}
|
|
|
|
|
|
+//根据类型切换流程数据
|
|
|
+watch(async () => formData.value.type, (newValue, oldValue) => {
|
|
|
+ if (formData.value.type === BpmModelType.BPMN) {
|
|
|
+ processData.value = formData.value.bpmnXml
|
|
|
+ } else if (formData.value.type === BpmModelType.SIMPLE) {
|
|
|
+ processData.value = formData.value.simpleModel
|
|
|
+ }
|
|
|
+ console.log('加载流程数据', processData.value)
|
|
|
+}, {
|
|
|
+ immediate: true,
|
|
|
+})
|
|
|
+
|
|
|
/** 校验所有步骤数据是否完整 */
|
|
|
const validateAllSteps = async () => {
|
|
|
try {
|
|
|
// 基本信息校验
|
|
|
- await basicInfoRef.value?.validate()
|
|
|
- if (!formData.value.key || !formData.value.name || !formData.value.category) {
|
|
|
+ try {
|
|
|
+ await validateBasic()
|
|
|
+ } catch (error) {
|
|
|
currentStep.value = 0
|
|
|
throw new Error('请完善基本信息')
|
|
|
}
|
|
|
|
|
|
// 表单设计校验
|
|
|
- await formDesignRef.value?.validate()
|
|
|
- if (formData.value.formType === 10 && !formData.value.formId) {
|
|
|
- currentStep.value = 1
|
|
|
- throw new Error('请选择流程表单')
|
|
|
- }
|
|
|
- if (
|
|
|
- formData.value.formType === 20 &&
|
|
|
- (!formData.value.formCustomCreatePath || !formData.value.formCustomViewPath)
|
|
|
- ) {
|
|
|
+ try {
|
|
|
+ await validateForm()
|
|
|
+ } catch (error) {
|
|
|
currentStep.value = 1
|
|
|
throw new Error('请完善自定义表单信息')
|
|
|
}
|
|
|
|
|
|
// 流程设计校验
|
|
|
- // 如果已经有流程数据,则不需要重新校验
|
|
|
- if (!formData.value.bpmnXml && !formData.value.simpleModel) {
|
|
|
- // 如果当前不在第三步,需要先保存当前步骤数据
|
|
|
- if (currentStep.value !== 2) {
|
|
|
- await steps[currentStep.value].validator()
|
|
|
- // 切换到第三步
|
|
|
- currentStep.value = 2
|
|
|
- // 等待组件渲染完成
|
|
|
- await nextTick()
|
|
|
- }
|
|
|
|
|
|
- // 校验流程设计
|
|
|
- await processDesignRef.value?.validate()
|
|
|
- const processData = await processDesignRef.value?.getProcessData()
|
|
|
- if (!processData) {
|
|
|
- throw new Error('请设计流程')
|
|
|
- }
|
|
|
-
|
|
|
- // 保存流程数据
|
|
|
- if (formData.value.type === BpmModelType.BPMN) {
|
|
|
- formData.value.bpmnXml = processData
|
|
|
- formData.value.simpleModel = null
|
|
|
- } else {
|
|
|
- formData.value.bpmnXml = null
|
|
|
- formData.value.simpleModel = processData
|
|
|
- }
|
|
|
+ // 表单设计校验
|
|
|
+ try {
|
|
|
+ await validateProcess()
|
|
|
+ } catch (error) {
|
|
|
+ currentStep.value = 2
|
|
|
+ throw new Error('请设计流程')
|
|
|
}
|
|
|
|
|
|
return true
|
|
@@ -239,20 +239,6 @@ const handleSave = async () => {
|
|
|
...formData.value
|
|
|
}
|
|
|
|
|
|
- // 如果当前在第三步,获取最新的流程设计数据
|
|
|
- if (currentStep.value === 2) {
|
|
|
- const processData = await processDesignRef.value?.getProcessData()
|
|
|
- if (processData) {
|
|
|
- if (formData.value.type === BpmModelType.BPMN) {
|
|
|
- modelData.bpmnXml = processData
|
|
|
- modelData.simpleModel = null
|
|
|
- } else {
|
|
|
- modelData.bpmnXml = null
|
|
|
- modelData.simpleModel = processData
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
if (formData.value.id) {
|
|
|
// 修改场景
|
|
|
await ModelApi.updateModel(modelData)
|
|
@@ -308,20 +294,6 @@ const handleDeploy = async () => {
|
|
|
...formData.value
|
|
|
}
|
|
|
|
|
|
- // 如果当前在第三步,获取最新的流程设计数据
|
|
|
- if (currentStep.value === 2) {
|
|
|
- const processData = await processDesignRef.value?.getProcessData()
|
|
|
- if (processData) {
|
|
|
- if (formData.value.type === BpmModelType.BPMN) {
|
|
|
- modelData.bpmnXml = processData
|
|
|
- modelData.simpleModel = null
|
|
|
- } else {
|
|
|
- modelData.bpmnXml = null
|
|
|
- modelData.simpleModel = processData
|
|
|
- }
|
|
|
- }
|
|
|
- }
|
|
|
-
|
|
|
// 先保存所有数据
|
|
|
if (formData.value.id) {
|
|
|
await ModelApi.updateModel(modelData)
|
|
@@ -344,59 +316,26 @@ const handleDeploy = async () => {
|
|
|
/** 步骤切换处理 */
|
|
|
const handleStepClick = async (index: number) => {
|
|
|
try {
|
|
|
- // 如果是切换到第三步(流程设计),需要校验key和name
|
|
|
- if (index === 2) {
|
|
|
- if (!formData.value.key || !formData.value.name) {
|
|
|
- message.warning('请先填写流程标识和流程名称')
|
|
|
- return
|
|
|
- }
|
|
|
+ console.log('index', index);
|
|
|
+ if (index !== 0) {
|
|
|
+ await validateBasic()
|
|
|
}
|
|
|
-
|
|
|
- // 保存当前步骤的数据
|
|
|
- if (currentStep.value === 2) {
|
|
|
- const processData = await processDesignRef.value?.getProcessData()
|
|
|
- if (processData) {
|
|
|
- if (formData.value.type === BpmModelType.BPMN) {
|
|
|
- formData.value.bpmnXml = processData
|
|
|
- formData.value.simpleModel = null
|
|
|
- } else {
|
|
|
- formData.value.bpmnXml = null
|
|
|
- formData.value.simpleModel = processData
|
|
|
- }
|
|
|
- }
|
|
|
- } else {
|
|
|
- // 只有在向后切换时才进行校验
|
|
|
- if (index > currentStep.value) {
|
|
|
- if (typeof steps[currentStep.value].validator === 'function') {
|
|
|
- await steps[currentStep.value].validator()
|
|
|
- }
|
|
|
- }
|
|
|
+ if (index !== 1) {
|
|
|
+ await validateForm()
|
|
|
+ }
|
|
|
+ if (index !== 2) {
|
|
|
+ await validateProcess()
|
|
|
}
|
|
|
|
|
|
// 切换步骤
|
|
|
currentStep.value = index
|
|
|
|
|
|
- // 如果切换到流程设计步骤,等待组件渲染完成后刷新设计器
|
|
|
- if (index === 2) {
|
|
|
- await nextTick()
|
|
|
- // 等待更长时间确保组件完全初始化
|
|
|
- await new Promise(resolve => setTimeout(resolve, 200))
|
|
|
- if (processDesignRef.value?.refresh) {
|
|
|
- await processDesignRef.value.refresh()
|
|
|
- }
|
|
|
- }
|
|
|
} catch (error) {
|
|
|
console.error('步骤切换失败:', error)
|
|
|
message.warning('请先完善当前步骤必填信息')
|
|
|
}
|
|
|
}
|
|
|
|
|
|
-/** 处理设计器保存成功 */
|
|
|
-const handleDesignSuccess = (bpmnXml?: string) => {
|
|
|
- if (bpmnXml) {
|
|
|
- formData.value.bpmnXml = bpmnXml
|
|
|
- }
|
|
|
-}
|
|
|
|
|
|
/** 返回列表页 */
|
|
|
const handleBack = () => {
|