form回显

src/utils/formCreate.ts

@@ -13,7 +13,7 @@ export const encodeFields = (designerRef: object) => {
     // @ts-ignore
     const rule = designerRef.value.getRule()
     const fields: string[] = []
-  rule.forEach((item) => {
+    rule.forEach(item => {
         fields.push(JSON.stringify(item))
     })
     return fields
@@ -22,7 +22,7 @@ export const encodeFields = (designerRef: object) => {
 // 解码表单 Fields
 export const decodeFields = (fields: string[]) => {
     const rule: object[] = []
-  fields.forEach((item) => {
+    fields.forEach(item => {
         rule.push(JSON.parse(item))
     })
     return rule
@@ -37,12 +37,7 @@ export const setConfAndFields = (designerRef: object, conf: string, fields: stri
 }
 
 // 设置表单的 Conf 和 Fields，适用 form-create 场景
-export const setConfAndFields2 = (
-  detailPreview: object,
-  conf: string,
-  fields: string[],
-  value?: object
-) => {
+export const setConfAndFields2 = (detailPreview: object, conf: string, fields: string[], value?: object) => {
     if (isRef(detailPreview)) {
         detailPreview = detailPreview.value
     }
@@ -55,3 +50,9 @@ export const setConfAndFields2 = (
         detailPreview.value = value
     }
 }
+
+// 清除表单的 Conf 和 Fields，适用 form-create 场景
+export const resetConfAndFields = (detailPreview: object) => {
+    // @ts-ignore
+    detailPreview.value = {}
+}

src/views/system/bpm/processInstance/detail/ProcessInstanceTaskList.vue

@@ -89,7 +89,7 @@
     <!-- 弹窗：子任务  -->
     <TaskSignList ref='taskSignListRef' @success='refresh' />
     <!-- 弹窗：表单 -->
-    <el-dialog title='表单详情' v-model='taskFormVisible' width='750'>
+    <el-dialog title='表单详情' v-model='taskFormVisible' width='750' @closed="closeForm">
         <form-create ref='fApi' v-model='taskForm.value' :option='taskForm.option' :rule='taskForm.rule' />
     </el-dialog>
 </template>
@@ -100,7 +100,7 @@ import { propTypes } from '@/utils/propTypes'
 import { isEmpty } from '@/utils/is'
 import TaskSignList from './dialog/TaskSignList.vue'
 import type { ApiAttrs } from '@form-create/element-ui/types/config'
-import { setConfAndFields2 } from '@/utils/formCreate'
+import { setConfAndFields2 ,resetConfAndFields} from '@/utils/formCreate'
 
 defineOptions({ name: 'BpmProcessInstanceTaskList' })
 
@@ -204,7 +204,7 @@ const taskForm = ref({
     value: {}
 }) // 流程任务的表单详情
 const taskFormVisible = ref(false)
-const handleFormDetail = async row => {
+const handleFormDetail = async (row:any) => {
     // 设置表单
     setConfAndFields2(taskForm, row.formConf, row.formFields, row.formVariables)
     // 弹窗打开
@@ -215,6 +215,10 @@ const handleFormDetail = async row => {
     fApi.value?.fapi?.resetBtn.show(false)
     fApi.value?.fapi?.disabled(true)
 }
+//关闭表单
+const closeForm=()=>{
+  resetConfAndFields(taskForm)
+}
 
 /** 刷新数据 */
 const emit = defineEmits(['refresh']) // 定义 success 事件，用于操作成功后的回调