fix: system settings form could not be loaded (halo-dev/console#787)

#### What type of PR is this?

/kind bug

#### What this PR does / why we need it:

修复系统设置页面切换选项卡无法正常加载表单的问题。

#### Which issue(s) this PR fixes:

Fixes https://github.com/halo-dev/halo/issues/3001

#### Special notes for your reviewer:

测试方式：

1. 测试系统设置页面的选项卡切换和保存功能。

#### Does this PR introduce a user-facing change?

```release-note
修复 Console 端系统设置页面切换选项卡无法正常加载表单的问题。
```

src/modules/system/settings/SystemSetting.vue

@@ -33,31 +33,36 @@ await handleFetchSettings();
 await handleFetchConfigMap();
 </script>
 <template>
-  <div class="bg-white p-4">
+  <Transition mode="out-in" name="fade">
-    <div>
+    <div class="bg-white p-4">
-      <FormKit
+      <div>
-        v-if="group && formSchema && configMapFormData"
+        <FormKit
-        :id="group"
+          v-if="group && formSchema && configMapFormData"
-        v-model="configMapFormData[group]"
+          :id="group"
-        :name="group"
+          v-model="configMapFormData[group]"
-        :actions="false"
+          :name="group"
-        :preserve="true"
+          :actions="false"
-        type="form"
+          :preserve="true"
-        @submit="handleSaveConfigMap"
+          type="form"
-      >
+          @submit="handleSaveConfigMap"
-        <FormKitSchema :schema="formSchema" :data="configMapFormData[group]" />
-      </FormKit>
-    </div>
-    <div v-permission="['system:configmaps:manage']" class="pt-5">
-      <div class="flex justify-start">
-        <VButton
-          :loading="saving"
-          type="secondary"
-          @click="$formkit.submit(group || '')"
         >
-          保存
+          <FormKitSchema
-        </VButton>
+            :schema="formSchema"
+            :data="configMapFormData[group]"
+          />
+        </FormKit>
+      </div>
+      <div v-permission="['system:configmaps:manage']" class="pt-5">
+        <div class="flex justify-start">
+          <VButton
+            :loading="saving"
+            type="secondary"
+            @click="$formkit.submit(group || '')"
+          >
+            保存
+          </VButton>
+        </div>
       </div>
     </div>
-  </div>
+  </Transition>
 </template>

src/modules/system/settings/layouts/SystemSettingsLayout.vue

@@ -113,14 +113,12 @@ watch([() => route.name, () => route.params], async () => {
       <div class="bg-white">
         <RouterView :key="activeTab" v-slot="{ Component }">
           <template v-if="Component">
-            <Transition appear mode="out-in" name="fade">
+            <Suspense>
-              <Suspense>
+              <component :is="Component"></component>
-                <component :is="Component"></component>
+              <template #fallback>
-                <template #fallback>
+                <VLoading />
-                  <VLoading />
+              </template>
-                </template>
+            </Suspense>
-              </Suspense>
-            </Transition>
           </template>
         </RouterView>
       </div>