fix: the setting form of the preview theme page may not be rendered (#3706)

#### What type of PR is this?

/kind bug

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

修复预览主题页面的设置表单可能因为接口请求速度导致无法正常渲染表单的问题。

<img width="1226" alt="image" src="https://user-images.githubusercontent.com/21301288/230562109-0858098f-c67e-4d93-bebd-a85400de9285.png">

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

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

#### Special notes for your reviewer:

测试方式：

1. 在主题管理页面点击预览按钮，检查设置表单是否可以正常渲染即可。

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

```release-note
修复 Console 端预览主题页面的设置表单可能出现无法渲染的问题。
```

console/src/modules/interface/themes/components/preview/ThemePreviewModal.vue

@@ -129,7 +129,7 @@ const settingTabs = ref<SettingTab[]>([] as SettingTab[]);
 const activeSettingTab = ref("");
 const settingsVisible = ref(false);
 
-const { data: setting, refetch: handleFetchSettings } = useQuery<Setting>({
+const { data: setting } = useQuery<Setting>({
   queryKey: ["theme-setting", selectedTheme],
   queryFn: async () => {
     const { data } = await apiClient.theme.fetchThemeSetting({
@@ -139,7 +139,22 @@ const { data: setting, refetch: handleFetchSettings } = useQuery<Setting>({
     return data;
   },
   refetchOnWindowFocus: false,
-  enabled: computed(() => !!selectedTheme.value?.spec.settingName),
+  onSuccess(data) {
+    if (data) {
+      const { forms } = data.spec;
+      settingTabs.value = forms.map((item: SettingForm) => {
+        return {
+          id: item.group,
+          label: item.label || "",
+        };
+      });
+    }
+
+    activeSettingTab.value = settingTabs.value[0].id;
+  },
+  enabled: computed(
+    () => props.visible && !!selectedTheme.value?.spec.settingName
+  ),
 });
 
 const { data: configMap, refetch: handleFetchConfigMap } = useQuery<ConfigMap>({
@@ -151,7 +166,9 @@ const { data: configMap, refetch: handleFetchConfigMap } = useQuery<ConfigMap>({
     return data;
   },
   refetchOnWindowFocus: false,
-  enabled: computed(() => !!selectedTheme.value?.spec.configMapName),
+  enabled: computed(
+    () => !!setting.value && !!selectedTheme.value?.spec.configMapName
+  ),
 });
 
 const { formSchema, configMapFormData, convertToSave } = useSettingFormConvert(
@@ -177,7 +194,6 @@ const handleSaveConfigMap = async () => {
 
   Toast.success(t("core.common.toast.save_success"));
 
-  await handleFetchSettings();
   await handleFetchConfigMap();
 
   saving.value = false;
@@ -185,28 +201,6 @@ const handleSaveConfigMap = async () => {
   handleRefresh();
 };
 
-watch(
-  () => selectedTheme.value,
-  async () => {
-    if (selectedTheme.value) {
-      await handleFetchSettings();
-      await handleFetchConfigMap();
-
-      if (setting.value) {
-        const { forms } = setting.value.spec;
-        settingTabs.value = forms.map((item: SettingForm) => {
-          return {
-            id: item.group,
-            label: item.label || "",
-          };
-        });
-      }
-
-      activeSettingTab.value = settingTabs.value[0].id;
-    }
-  }
-);
-
 const handleOpenSettings = (theme?: Theme) => {
   if (theme) {
     selectedTheme.value = theme;
@@ -348,7 +342,7 @@ const iframeClasses = computed(() => {
                   <FormKit
                     v-if="
                       tab.id === activeSettingTab &&
-                      configMapFormData &&
+                      configMapFormData[tab.id] &&
                       formSchema
                     "
                     :id="`preview-setting-${tab.id}`"