diff --git a/mayfly_go_web/package.json b/mayfly_go_web/package.json index b6b1eb7b..4ac24da8 100644 --- a/mayfly_go_web/package.json +++ b/mayfly_go_web/package.json @@ -9,7 +9,7 @@ "lint-fix": "eslint --fix --ext .js --ext .jsx --ext .vue src/" }, "dependencies": { - "@element-plus/icons-vue": "^2.1.0", + "@element-plus/icons-vue": "^2.3.1", "@vueuse/core": "^10.7.0", "asciinema-player": "^3.6.3", "axios": "^1.6.2", @@ -33,7 +33,7 @@ "splitpanes": "^3.1.5", "sql-formatter": "^14.0.0", "uuid": "^9.0.1", - "vue": "^3.4.0", + "vue": "^3.4.5", "vue-router": "^4.2.5", "xterm": "^5.3.0", "xterm-addon-fit": "^0.8.0", @@ -47,8 +47,8 @@ "@types/sortablejs": "^1.15.3", "@typescript-eslint/eslint-plugin": "^6.7.4", "@typescript-eslint/parser": "^6.7.4", - "@vitejs/plugin-vue": "^4.5.2", - "@vue/compiler-sfc": "^3.3.11", + "@vitejs/plugin-vue": "^5.0.2", + "@vue/compiler-sfc": "^3.4.3", "dotenv": "^16.3.1", "eslint": "^8.35.0", "eslint-plugin-vue": "^9.19.2", diff --git a/mayfly_go_web/src/App.vue b/mayfly_go_web/src/App.vue index 44a1f7e5..ffc77c88 100644 --- a/mayfly_go_web/src/App.vue +++ b/mayfly_go_web/src/App.vue @@ -22,12 +22,9 @@ import { ref, onMounted, onUnmounted, nextTick, watch } from 'vue'; import { useRoute } from 'vue-router'; import { storeToRefs } from 'pinia'; import { useThemeConfig } from '@/store/themeConfig'; -import { getLocal } from '@/common/utils/storage'; import LockScreen from '@/layout/lockScreen/index.vue'; import Setings from '@/layout/navBars/breadcrumb/setings.vue'; import mittBus from '@/common/utils/mitt'; -import { getThemeConfig } from './common/utils/storage'; -import { useWatermark } from '@/common/sysconfig'; import { useIntervalFn } from '@vueuse/core'; const setingsRef = ref(); @@ -49,17 +46,8 @@ onMounted(() => { openSetingsDrawer(); }); - // 获取缓存中的布局配置 - const tc = getThemeConfig(); - if (tc) { - themeConfigStores.setThemeConfig({ themeConfig: tc }); - document.documentElement.style.cssText = getLocal('themeConfigStyle'); - } - - // 是否开启水印 - useWatermark().then((res) => { - themeConfigStores.setWatermarkConfig(res); - }); + // 初始化系统主题 + themeConfigStores.initThemeConfig(); }); }); diff --git a/mayfly_go_web/src/common/Api.ts b/mayfly_go_web/src/common/Api.ts index 06d1436d..bc8a5323 100644 --- a/mayfly_go_web/src/common/Api.ts +++ b/mayfly_go_web/src/common/Api.ts @@ -1,5 +1,5 @@ import request from './request'; -import { useApiFetch } from './useRequest'; +import { useApiFetch } from '@/hooks/useRequest'; /** * 可用于各模块定义各自api请求 diff --git a/mayfly_go_web/src/common/request.ts b/mayfly_go_web/src/common/request.ts index 93f12a58..bb312c58 100755 --- a/mayfly_go_web/src/common/request.ts +++ b/mayfly_go_web/src/common/request.ts @@ -4,7 +4,7 @@ import { getClientId, getToken } from './utils/storage'; import { templateResolve } from './utils/string'; import { ElMessage } from 'element-plus'; import axios from 'axios'; -import { useApiFetch } from './useRequest'; +import { useApiFetch } from '../hooks/useRequest'; import Api from './Api'; export default { diff --git a/mayfly_go_web/src/common/sysconfig.ts b/mayfly_go_web/src/common/sysconfig.ts index 76323f19..fd5fcddf 100644 --- a/mayfly_go_web/src/common/sysconfig.ts +++ b/mayfly_go_web/src/common/sysconfig.ts @@ -1,9 +1,77 @@ import openApi from './openApi'; // 登录是否使用验证码配置key -const AccountLoginSecurity = 'AccountLoginSecurity'; -const UseWatermarkConfigKey = 'UseWatermark'; -const MachineConfig = 'MachineConfig'; +const AccountLoginSecurityKey = 'AccountLoginSecurity'; +const MachineConfigKey = 'MachineConfig'; +const SysStyleConfigKey = 'SysStyleConfig'; + +/** + * 获取账号登录安全配置 + * + * @returns + */ +export async function getAccountLoginSecurity(): Promise { + const value = await getConfigValue(AccountLoginSecurityKey); + if (!value) { + return null; + } + const jsonValue = JSON.parse(value); + jsonValue.useCaptcha = convertBool(jsonValue.useCaptcha, true); + jsonValue.useOtp = convertBool(jsonValue.useOtp, true); + return jsonValue; +} + +/** + * 获取全局系统样式配置（logo、title等） + * + * @returns + */ +export async function getSysStyleConfig(): Promise { + const value = await getConfigValue(SysStyleConfigKey); + const defaultValue = { + useWatermark: true, + }; + if (!value) { + return defaultValue; + } + + const jsonValue = JSON.parse(value); + // 将字符串转为bool + jsonValue.useWatermark = convertBool(jsonValue.useWatermark, true); + return jsonValue; +} + +/** + * 获取LDAP登录配置 + * + * @returns + */ +export async function getLdapEnabled(): Promise { + const value = await openApi.getLdapEnabled(); + return convertBool(value, false); +} + +/** + * 获取机器配置 + * + * @returns + */ +export async function getMachineConfig(): Promise { + const value = await getConfigValue(MachineConfigKey); + const defaultValue = { + // 默认1gb + uploadMaxFileSize: '1GB', + }; + if (!value) { + return defaultValue; + } + try { + const jsonValue = JSON.parse(value); + return jsonValue; + } catch (e) { + return defaultValue; + } +} /** * 获取系统配置值 @@ -27,77 +95,6 @@ export async function getBoolConfigValue(key: string, defaultValue: boolean): Pr return convertBool(value, defaultValue); } -/** - * 获取账号登录安全配置 - * - * @returns - */ -export async function getAccountLoginSecurity(): Promise { - const value = await getConfigValue(AccountLoginSecurity); - if (!value) { - return null; - } - const jsonValue = JSON.parse(value); - jsonValue.useCaptcha = convertBool(jsonValue.useCaptcha, true); - jsonValue.useOtp = convertBool(jsonValue.useOtp, true); - return jsonValue; -} - -/** - * 是否启用水印信息配置 - * - * @returns - */ -export async function useWatermark(): Promise { - const value = await getConfigValue(UseWatermarkConfigKey); - const defaultValue = { - isUse: true, - }; - if (!value) { - return defaultValue; - } - try { - const jsonValue = JSON.parse(value); - // 将字符串转为bool - jsonValue.isUse = convertBool(jsonValue.isUse, true); - return jsonValue; - } catch (e) { - return defaultValue; - } -} - -/** - * 获取LDAP登录配置 - * - * @returns - */ -export async function getLdapEnabled(): Promise { - const value = await openApi.getLdapEnabled(); - return convertBool(value, false); -} - -/** - * 是否启用水印信息配置 - * - * @returns - */ -export async function getMachineConfig(): Promise { - const value = await getConfigValue(MachineConfig); - const defaultValue = { - // 默认1gb - uploadMaxFileSize: '1GB', - }; - if (!value) { - return defaultValue; - } - try { - const jsonValue = JSON.parse(value); - return jsonValue; - } catch (e) { - return defaultValue; - } -} - function convertBool(value: string, defaultValue: boolean) { if (!value) { return defaultValue; diff --git a/mayfly_go_web/src/common/useRequest.ts b/mayfly_go_web/src/hooks/useRequest.ts similarity index 93% rename from mayfly_go_web/src/common/useRequest.ts rename to mayfly_go_web/src/hooks/useRequest.ts index 78101fe6..788915c1 100644 --- a/mayfly_go_web/src/common/useRequest.ts +++ b/mayfly_go_web/src/hooks/useRequest.ts @@ -1,13 +1,13 @@ -import router from '../router'; -import { getClientId, getToken } from './utils/storage'; -import { templateResolve } from './utils/string'; +import router from '@/router'; +import { getClientId, getToken } from '@/common/utils/storage'; +import { templateResolve } from '@/common/utils/string'; import { ElMessage } from 'element-plus'; import { createFetch } from '@vueuse/core'; -import Api from './Api'; -import { Result, ResultEnum } from './request'; -import config from './config'; +import Api from '@/common/Api'; +import { Result, ResultEnum } from '@/common/request'; +import config from '@/common/config'; import { unref } from 'vue'; -import { URL_401 } from '../router/staticRouter'; +import { URL_401 } from '@/router/staticRouter'; const baseUrl: string = config.baseApiUrl; diff --git a/mayfly_go_web/src/layout/logo/index.vue b/mayfly_go_web/src/layout/logo/index.vue index 54235c80..fb67b6f2 100644 --- a/mayfly_go_web/src/layout/logo/index.vue +++ b/mayfly_go_web/src/layout/logo/index.vue @@ -1,6 +1,6 @@ diff --git a/mayfly_go_web/src/store/themeConfig.ts b/mayfly_go_web/src/store/themeConfig.ts index c0c9fa9f..353733d3 100644 --- a/mayfly_go_web/src/store/themeConfig.ts +++ b/mayfly_go_web/src/store/themeConfig.ts @@ -1,6 +1,12 @@ import { defineStore } from 'pinia'; import { dateFormat2 } from '@/common/utils/date'; import { useUserInfo } from '@/store/userInfo'; +import { getSysStyleConfig } from '@/common/sysconfig'; +import { getLocal, getThemeConfig } from '@/common/utils/storage'; + +// 系统默认logo图标，对应于@/assets/image/logo.svg +const logoIcon = + 'data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNjIxODU5MDA5NjA1IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9Ijk3MDkiIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMjAwIiBoZWlnaHQ9IjIwMCI+PGRlZnM+PHN0eWxlIHR5cGU9InRleHQvY3NzIj48L3N0eWxlPjwvZGVmcz48cGF0aCBkPSJNODIwLjIwMzkyMiA4MTIuMTcyNTQ5SDY4NC42NzQ1MXYtNDUuMTc2NDcxaDExMi40MzkyMTVWMjc5LjA5MDE5Nkg2MzMuNDc0NTFsLTg1LjMzMzMzNCAyNzcuMDgyMzUzYy0zLjAxMTc2NSAxMC4wMzkyMTYtMTIuMDQ3MDU5IDE2LjA2Mjc0NS0yMi4wODYyNzQgMTYuMDYyNzQ1LTEwLjAzOTIxNiAwLTE5LjA3NDUxLTcuMDI3NDUxLTIxLjA4MjM1My0xNy4wNjY2NjdsLTcxLjI3ODQzMS0yODAuMDk0MTE3aC0xODAuNzA1ODgzVjc2Mi45ODAzOTJoMTIwLjQ3MDU4OXY0NS4xNzY0NzFIMjI5Ljg5ODAzOWMtMTIuMDQ3MDU5IDAtMjIuMDg2Mjc1LTEwLjAzOTIxNi0yMi4wODYyNzQtMjIuMDg2Mjc1VjI1Mi45ODgyMzVjMC0xMi4wNDcwNTkgMTAuMDM5MjE2LTIyLjA4NjI3NSAyMi4wODYyNzQtMjIuMDg2Mjc0SDQ1MS43NjQ3MDZjMTAuMDM5MjE2IDAgMTkuMDc0NTEgNy4wMjc0NTEgMjIuMDg2Mjc0IDE3LjA2NjY2Nmw1NS4yMTU2ODcgMjE4Ljg1NDkwMkw1OTUuMzI1NDkgMjUwLjk4MDM5MmMzLjAxMTc2NS05LjAzNTI5NCAxMi4wNDcwNTktMTYuMDYyNzQ1IDIxLjA4MjM1My0xNi4wNjI3NDVoMjAyLjc5MjE1N2MxMi4wNDcwNTkgMCAyMi4wODYyNzUgMTAuMDM5MjE2IDIyLjA4NjI3NSAyMi4wODYyNzV2NTMzLjA4MjM1M2MxLjAwMzkyMiAxMi4wNDcwNTktOS4wMzUyOTQgMjIuMDg2Mjc1LTIxLjA4MjM1MyAyMi4wODYyNzR6IG0wIDAiIGZpbGw9IiNlMjU4MTMiIHAtaWQ9Ijk3MTAiPjwvcGF0aD48cGF0aCBkPSJNNzMxLjg1ODgyNCA0MjUuNjYyNzQ1YzQuMDE1Njg2LTEyLjA0NzA1OS0yLjAwNzg0My0yNS4wOTgwMzktMTQuMDU0OTAyLTI5LjExMzcyNS0xMi4wNDcwNTktNC4wMTU2ODYtMjUuMDk4MDM5IDIuMDA3ODQzLTI5LjExMzcyNiAxNC4wNTQ5MDJMNTYzLjIgNzY2Ljk5NjA3OGgtNzMuMjg2Mjc1TDM3MS40NTA5OCA0MTAuNjAzOTIyYy00LjAxNTY4Ni0xMi4wNDcwNTktMTcuMDY2NjY3LTE4LjA3MDU4OC0yOC4xMDk4MDQtMTQuMDU0OTAyLTEyLjA0NzA1OSA0LjAxNTY4Ni0xOC4wNzA1ODggMTcuMDY2NjY3LTE0LjA1NDkwMSAyOC4xMDk4MDRsMTIzLjQ4MjM1MiAzNzEuNDUwOThjMy4wMTE3NjUgOS4wMzUyOTQgMTIuMDQ3MDU5IDE1LjA1ODgyNCAyMS4wODIzNTMgMTUuMDU4ODIzaDcyLjI4MjM1M2wtNTMuMjA3ODQzIDE2MC42Mjc0NTEgNDYuMTgwMzkyIDIuMDA3ODQ0IDE5Mi43NTI5NDItNTQ4LjE0MTE3N3oiIGZpbGw9IiMyYzJjMmMiIHAtaWQ9Ijk3MTEiPjwvcGF0aD48L3N2Zz4='; export const useThemeConfig = defineStore('themeConfig', { state: (): ThemeConfigState => ({ @@ -130,7 +136,9 @@ export const useThemeConfig = defineStore('themeConfig', { // 网站主标题（菜单导航、浏览器当前网页标题） globalTitle: 'mayfly', // 网站副标题（登录页顶部文字） - globalViceTitle: 'mayfly', + globalViceTitle: 'mayfly-go', + // 网站logo icon, base64编码内容 + logoIcon: logoIcon, // 默认初始语言，可选值""，默认 zh-cn globalI18n: 'zh-cn', // 默认全局组件大小，可选值"<|large|default|small>"，默认 '' @@ -142,19 +150,34 @@ export const useThemeConfig = defineStore('themeConfig', { }, }), actions: { - // 设置布局配置 - setThemeConfig(data: ThemeConfigState) { - this.themeConfig = data.themeConfig; - }, - // 设置水印配置信息 - setWatermarkConfig(useWatermarkConfig: any) { - this.themeConfig.watermarkText = []; - this.themeConfig.isWatermark = useWatermarkConfig.isUse; - if (!useWatermarkConfig.isUse) { - return; + initThemeConfig() { + // 获取缓存中的布局配置 + const tc = getThemeConfig(); + if (tc) { + this.themeConfig = tc; + document.documentElement.style.cssText = getLocal('themeConfigStyle'); } - // 索引2为用户自定义水印信息 - this.themeConfig.watermarkText[2] = useWatermarkConfig.content; + + // 根据后台系统配置初始化 + getSysStyleConfig().then((res) => { + if (res?.title) { + this.themeConfig.globalTitle = res.title; + } + if (res?.viceTitle) { + this.themeConfig.globalViceTitle = res.viceTitle; + } + if (res?.logoIcon) { + this.themeConfig.logoIcon = res.logoIcon; + } + + this.themeConfig.watermarkText = []; + this.themeConfig.isWatermark = res?.useWatermark; + if (!res?.useWatermark) { + return; + } + // 索引2为用户自定义水印信息 + this.themeConfig.watermarkText[2] = res.watermarkContent; + }); }, // 设置水印用户信息 setWatermarkUser(del: boolean = false) { diff --git a/mayfly_go_web/src/types/pinia.d.ts b/mayfly_go_web/src/types/pinia.d.ts index ba9a33d0..e2a29c63 100644 --- a/mayfly_go_web/src/types/pinia.d.ts +++ b/mayfly_go_web/src/types/pinia.d.ts @@ -49,6 +49,7 @@ declare interface ThemeConfigState { isRequestRoutes: boolean; globalTitle: string; globalViceTitle: string; + logoIcon: string; globalI18n: string; globalComponentSize: string; terminalForeground: string; diff --git a/mayfly_go_web/src/views/login/index.vue b/mayfly_go_web/src/views/login/index.vue index c62c3f3d..52476005 100644 --- a/mayfly_go_web/src/views/login/index.vue +++ b/mayfly_go_web/src/views/login/index.vue @@ -2,9 +2,9 @@