From 53b8ccb7c92d98d465ad911b3474bc34c1a3b642 Mon Sep 17 00:00:00 2001
From: Ryan Wang <i@ryanc.cc>
Date: Wed, 19 Jul 2023 11:26:13 +0800
Subject: [PATCH] fix: delay issue in the theme settings tab switch (#4240)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

#### What type of PR is this?

/area console
/kind bug
/milestone 2.8.x

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

修复主题设置选项卡切换的延迟问题。

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

Fixes #4239

#### Special notes for your reviewer:

需要测试：

1. 进入主题设置，尝试对设置选项卡进行切换，观察选项卡和实际的设置表单是否一致。

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

```release-note
None
```
---
 console/src/modules/interface/themes/ThemeSetting.vue        | 3 +--
 console/src/modules/interface/themes/layouts/ThemeLayout.vue | 1 +
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/console/src/modules/interface/themes/ThemeSetting.vue b/console/src/modules/interface/themes/ThemeSetting.vue
index 465e5276f..421910b98 100644
--- a/console/src/modules/interface/themes/ThemeSetting.vue
+++ b/console/src/modules/interface/themes/ThemeSetting.vue
@@ -10,7 +10,6 @@ import type { Ref } from "vue";
 import type { ConfigMap, Setting, Theme } from "@halo-dev/api-client";
 
 // hooks
-import { useRouteParams } from "@vueuse/router";
 import { apiClient } from "@/utils/api-client";
 import { useSettingFormConvert } from "@/composables/use-setting-form";
 import { useI18n } from "vue-i18n";
@@ -19,7 +18,7 @@ import { useQuery, useQueryClient } from "@tanstack/vue-query";
 const { t } = useI18n();
 const queryClient = useQueryClient();
 
-const group = useRouteParams<string>("group");
+const group = inject<Ref<string>>("activeTab", ref(""));
 
 const selectedTheme = inject<Ref<Theme | undefined>>("selectedTheme");
 const setting = inject<Ref<Setting | undefined>>("setting", ref());
diff --git a/console/src/modules/interface/themes/layouts/ThemeLayout.vue b/console/src/modules/interface/themes/layouts/ThemeLayout.vue
index 475d38839..46efdff82 100644
--- a/console/src/modules/interface/themes/layouts/ThemeLayout.vue
+++ b/console/src/modules/interface/themes/layouts/ThemeLayout.vue
@@ -66,6 +66,7 @@ const selectedTheme = ref<Theme>();
 const themesModal = ref(false);
 const previewModal = ref(false);
 const activeTab = ref(tabs.value[0].id);
+provide<Ref<string>>("activeTab", activeTab);
 
 const { loading, isActivated, handleActiveTheme } =
   useThemeLifeCycle(selectedTheme);