chore: Optimizing Microservices

src/views/workflow/extension/form/helper/WorkflowFormDesign.vue

@@ -6,7 +6,6 @@
     :showCancelBtn="false"
     :showOkBtn="false"
     @register="registerModal"
-    @visible-change="handleVisibleChange"
   >
     <div id="formDesign"/>
     <template #centerFooter>
@@ -17,7 +16,7 @@
   </BasicModal>
 </template>
 <script lang="ts" setup>
-  import { reactive } from 'vue';
+  import { reactive, onBeforeUnmount } from 'vue';
   import { BasicModal, ModalProps, useModalInner } from '/@/components/Modal';
   import { loadMicroApp, MicroApp } from 'qiankun';
   import { getSubDefineProps } from '/@/qiankun/state';
@@ -54,6 +53,7 @@
   const emit = defineEmits(['success', 'register']);
   const microAppStore = useMicroAppStore();
   const [registerModal, { setModalProps, closeModal, changeLoading }] = useModalInner(async (data: BoxPayload = { _tag: '' }) => {
+    if (!state.formDesignApp || state.formDesignApp.getStatus() === 'NOT_MOUNTED') {
       changeLoading();
       state.formDesignApp = loadMicroApp(Object.assign({} , apps.find(item => item.name == 'form-design'), {
         container: '#formDesign',
@@ -66,6 +66,7 @@
       state.formDesignApp.mountPromise.then(() => {
         changeLoading(false);
       });
+    }
     // 处理清除脏数据
     formDesignProps.options = {};
     const id = data.id;
@@ -78,9 +79,9 @@
     setModalProps(props);
   });
 
-  function handleVisibleChange(visible: boolean) {
-    !visible && state.formDesignApp?.unmount();
-  }
+  onBeforeUnmount(() => {
+    state.formDesignApp?.getStatus() === 'MOUNTED' && state.formDesignApp.unmount();
+  });
 
   /** 处理弹出框提交 */
   async function handleSubmitForm(status: string) {