diff --git a/frontend/src/layout/index.vue b/frontend/src/layout/index.vue index 2892f4616..d3d3ff0a9 100644 --- a/frontend/src/layout/index.vue +++ b/frontend/src/layout/index.vue @@ -20,11 +20,9 @@ import { Sidebar, Footer, AppMain, MobileHeader, Tabs } from './components'; import useResize from './hooks/useResize'; import { GlobalStore, MenuStore, TabsStore } from '@/store'; import { DeviceType } from '@/enums/app'; -import { useI18n } from 'vue-i18n'; -import { useTheme } from '@/hooks/use-theme'; -import { getLicenseStatus, getSettingInfo, getSystemAvailable } from '@/api/modules/setting'; +import { getSystemAvailable } from '@/api/modules/setting'; import { useRoute, useRouter } from 'vue-router'; -import { getXpackSetting, initFavicon, resetXSetting } from '@/utils/xpack'; +import { loadProductProFromDB } from '@/utils/xpack'; useResize(); const router = useRouter(); @@ -33,11 +31,8 @@ const menuStore = MenuStore(); const globalStore = GlobalStore(); const tabsStore = TabsStore(); -const i18n = useI18n(); const loading = ref(false); const loadingText = ref(); -const themeConfig = computed(() => globalStore.themeConfig); -const { switchTheme } = useTheme(); let timer: NodeJS.Timer | null = null; @@ -71,49 +66,6 @@ const handleMenuClick = async (path) => { tabsStore.activeTabPath = route.path; }; -const loadDataFromDB = async () => { - const res = await getSettingInfo(); - document.title = res.data.panelName; - i18n.locale.value = res.data.language; - i18n.warnHtmlMessage = false; - globalStore.entrance = res.data.securityEntrance; - globalStore.setOpenMenuTabs(res.data.menuTabs === 'enable'); - globalStore.updateLanguage(res.data.language); - globalStore.setThemeConfig({ ...themeConfig.value, theme: res.data.theme, panelName: res.data.panelName }); -}; - -const loadDataFromXDB = async () => { - const res = await getXpackSetting(); - if (res) { - globalStore.setThemeConfig({ - ...themeConfig.value, - title: res.data.title, - logo: res.data.logo, - logoWithText: res.data.logoWithText, - favicon: res.data.favicon, - isGold: res.data.theme === 'dark-gold', - }); - } - initFavicon(); -}; - -const loadProductProFromDB = async () => { - const res = await getLicenseStatus(); - if (!res.data) { - globalStore.isProductPro = false; - return; - } - globalStore.isProductPro = - res.data.status === 'Enable' || res.data.status === 'Lost01' || res.data.status === 'Lost02'; - - if (globalStore.isProductPro) { - loadDataFromXDB(); - globalStore.productProExpires = Number(res.data.productPro); - } else { - resetXSetting(); - } -}; - const loadStatus = async () => { loading.value = globalStore.isLoading; loadingText.value = globalStore.loadingText; @@ -145,10 +97,7 @@ onMounted(() => { } loadStatus(); - initFavicon(); - loadDataFromDB(); loadProductProFromDB(); - switchTheme(); }); diff --git a/frontend/src/utils/xpack.ts b/frontend/src/utils/xpack.ts index 65dc24344..e5e94c56e 100644 --- a/frontend/src/utils/xpack.ts +++ b/frontend/src/utils/xpack.ts @@ -1,11 +1,15 @@ +import { getLicenseStatus } from '@/api/modules/setting'; +import { useTheme } from '@/hooks/use-theme'; import { GlobalStore } from '@/store'; const globalStore = GlobalStore(); +const { switchTheme } = useTheme(); export function resetXSetting() { globalStore.themeConfig.title = ''; globalStore.themeConfig.logo = ''; globalStore.themeConfig.logoWithText = ''; globalStore.themeConfig.favicon = ''; + globalStore.themeConfig.isGold = false; } export function initFavicon() { @@ -20,7 +24,7 @@ export function initFavicon() { export async function getXpackSetting() { const searchXSettingGlob = import.meta.glob('xpack/api/modules/setting.ts'); const module = await searchXSettingGlob?.['../xpack/api/modules/setting.ts']?.(); - const res = module?.searchXSetting(); + const res = await module?.searchXSetting(); if (!res) { resetXSetting(); return; @@ -28,6 +32,61 @@ export async function getXpackSetting() { return res; } +export async function loadProductProFromDB() { + const res = await getLicenseStatus(); + if (!res.data) { + resetXSetting(); + globalStore.isProductPro = false; + return; + } else { + globalStore.isProductPro = + res.data.status === 'Enable' || res.data.status === 'Lost01' || res.data.status === 'Lost02'; + if (globalStore.isProductPro) { + globalStore.productProExpires = Number(res.data.productPro); + } + } + switchTheme(); + initFavicon(); +} + +export async function getXpackSettingForTheme() { + const res = await getLicenseStatus(); + if (!res.data) { + globalStore.isProductPro = false; + resetXSetting(); + switchTheme(); + initFavicon(); + return; + } + globalStore.isProductPro = + res.data.status === 'Enable' || res.data.status === 'Lost01' || res.data.status === 'Lost02'; + if (globalStore.isProductPro) { + globalStore.productProExpires = Number(res.data.productPro); + } + if (!globalStore.isProductPro) { + globalStore.isProductPro = false; + resetXSetting(); + switchTheme(); + initFavicon(); + return; + } + + const searchXSettingGlob = import.meta.glob('xpack/api/modules/setting.ts'); + const module = await searchXSettingGlob?.['../xpack/api/modules/setting.ts']?.(); + const res2 = await module?.searchXSetting(); + if (res2) { + globalStore.themeConfig.title = res2.data?.title; + globalStore.themeConfig.logo = res2.data?.logo; + globalStore.themeConfig.logoWithText = res2.data?.logoWithText; + globalStore.themeConfig.favicon = res2.data?.favicon; + globalStore.themeConfig.isGold = res2.data?.theme === 'dark-gold'; + } else { + resetXSetting(); + } + switchTheme(); + initFavicon(); +} + export async function updateXpackSettingByKey(key: string, value: string) { const searchXSettingGlob = import.meta.glob('xpack/api/modules/setting.ts'); const module = await searchXSettingGlob?.['../xpack/api/modules/setting.ts']?.(); diff --git a/frontend/src/views/login/components/login-form.vue b/frontend/src/views/login/components/login-form.vue index 0a61c6bc5..6b86f630e 100644 --- a/frontend/src/views/login/components/login-form.vue +++ b/frontend/src/views/login/components/login-form.vue @@ -171,12 +171,12 @@ import { useRouter } from 'vue-router'; import type { ElForm } from 'element-plus'; import { loginApi, getCaptcha, mfaLoginApi, checkIsDemo, getLanguage } from '@/api/modules/auth'; import { GlobalStore, MenuStore, TabsStore } from '@/store'; -import i18n from '@/lang'; import { MsgSuccess } from '@/utils/message'; import { useI18n } from 'vue-i18n'; -import { getLicenseStatus } from '@/api/modules/setting'; -import { initFavicon } from '@/utils/xpack'; +import { getSettingInfo } from '@/api/modules/setting'; +const i18n = useI18n(); +const themeConfig = computed(() => globalStore.themeConfig); const globalStore = GlobalStore(); const menuStore = MenuStore(); const tabsStore = TabsStore(); @@ -208,8 +208,8 @@ const loginForm = reactive({ }); const loginRules = reactive({ - name: computed(() => [{ required: true, message: i18n.global.t('commons.rule.username'), trigger: 'blur' }]), - password: computed(() => [{ required: true, message: i18n.global.t('commons.rule.password'), trigger: 'blur' }]), + name: computed(() => [{ required: true, message: i18n.t('commons.rule.username'), trigger: 'blur' }]), + password: computed(() => [{ required: true, message: i18n.t('commons.rule.password'), trigger: 'blur' }]), }); let isLoggingIn = false; @@ -303,8 +303,8 @@ const login = (formEl: FormInstance | undefined) => { globalStore.setAgreeLicense(true); menuStore.setMenuList([]); tabsStore.removeAllTabs(); - MsgSuccess(i18n.global.t('commons.msg.loginSuccess')); - loadProductProFromDB(); + MsgSuccess(i18n.t('commons.msg.loginSuccess')); + loadDataFromDB(); router.push({ name: 'home' }); } catch (error) { loginVerify(); @@ -330,8 +330,8 @@ const mfaLogin = async (auto: boolean) => { globalStore.setLogStatus(true); menuStore.setMenuList([]); tabsStore.removeAllTabs(); - MsgSuccess(i18n.global.t('commons.msg.loginSuccess')); - loadProductProFromDB(); + MsgSuccess(i18n.t('commons.msg.loginSuccess')); + loadDataFromDB(); router.push({ name: 'home' }); } }; @@ -355,29 +355,20 @@ const loadLanguage = async () => { } catch (error) {} }; -const loadProductProFromDB = async () => { - const res = await getLicenseStatus(); - if (!res.data) { - globalStore.isProductPro = false; - return; - } - globalStore.isProductPro = - res.data.status === 'Enable' || res.data.status === 'Lost01' || res.data.status === 'Lost02'; - - if (globalStore.isProductPro) { - globalStore.productProExpires = Number(res.data.productPro); - } else { - globalStore.themeConfig.title = ''; - globalStore.themeConfig.logo = ''; - globalStore.themeConfig.logoWithText = ''; - globalStore.themeConfig.favicon = ''; - } +const loadDataFromDB = async () => { + const res = await getSettingInfo(); + document.title = res.data.panelName; + i18n.locale.value = res.data.language; + i18n.warnHtmlMessage = false; + globalStore.entrance = res.data.securityEntrance; + globalStore.setOpenMenuTabs(res.data.menuTabs === 'enable'); + globalStore.updateLanguage(res.data.language); + globalStore.setThemeConfig({ ...themeConfig.value, theme: res.data.theme, panelName: res.data.panelName }); }; onMounted(() => { globalStore.isOnRestart = false; loginVerify(); - initFavicon(); loadLanguage(); document.title = globalStore.themeConfig.panelName; loginForm.agreeLicense = globalStore.agreeLicense; diff --git a/frontend/src/views/login/entrance/index.vue b/frontend/src/views/login/entrance/index.vue index 12ec52019..af74d26af 100644 --- a/frontend/src/views/login/entrance/index.vue +++ b/frontend/src/views/login/entrance/index.vue @@ -48,7 +48,7 @@ import ErrDomain from '@/components/error-message/err_domain.vue'; import ErrFound from '@/components/error-message/404.vue'; import { ref, onMounted, watch } from 'vue'; import { GlobalStore } from '@/store'; -import { getXpackSetting, initFavicon } from '@/utils/xpack'; +import { getXpackSettingForTheme } from '@/utils/xpack'; const globalStore = GlobalStore(); const screenWidth = ref(null); @@ -81,25 +81,13 @@ const getStatus = async () => { await checkIsSafety(code) .then(() => { loading.value = false; - loadDataFromXDB(); + getXpackSettingForTheme(); }) .catch(() => { loading.value = false; }); }; -const loadDataFromXDB = async () => { - const res = await getXpackSetting(); - if (res) { - globalStore.themeConfig.title = res.data.title; - globalStore.themeConfig.logo = res.data.logo; - globalStore.themeConfig.logoWithText = res.data.logoWithText; - globalStore.themeConfig.favicon = res.data.favicon; - } - loading.value = false; - initFavicon(); -}; - onMounted(() => { globalStore.isOnRestart = false; getStatus(); diff --git a/frontend/src/views/login/index.vue b/frontend/src/views/login/index.vue index 28e9abb2c..6176286ce 100644 --- a/frontend/src/views/login/index.vue +++ b/frontend/src/views/login/index.vue @@ -24,7 +24,7 @@ import LoginForm from './components/login-form.vue'; import { ref, onMounted } from 'vue'; import router from '@/routers'; import { GlobalStore } from '@/store'; -import { getXpackSetting, initFavicon } from '@/utils/xpack'; +import { getXpackSettingForTheme } from '@/utils/xpack'; const gStore = GlobalStore(); const loading = ref(); @@ -35,30 +35,18 @@ const getStatus = async () => { loading.value = true; await checkIsSafety(gStore.entrance) .then((res) => { + loading.value = false; if (res.data === 'unpass') { - loading.value = false; router.replace({ name: 'entrance', params: { code: gStore.entrance } }); return; } - loadDataFromXDB(); + getXpackSettingForTheme(); }) .catch(() => { loading.value = false; }); }; -const loadDataFromXDB = async () => { - const res = await getXpackSetting(); - if (res) { - gStore.themeConfig.title = res.data.title; - gStore.themeConfig.logo = res.data.logo; - gStore.themeConfig.logoWithText = res.data.logoWithText; - gStore.themeConfig.favicon = res.data.favicon; - } - loading.value = false; - initFavicon(); -}; - onMounted(() => { getStatus(); screenWidth.value = document.body.clientWidth;