diff --git a/frontend/src/stores/appearance.ts b/frontend/src/stores/appearance.ts index 33d328d6..3abb26e7 100644 --- a/frontend/src/stores/appearance.ts +++ b/frontend/src/stores/appearance.ts @@ -2,9 +2,8 @@ import { defineStore } from 'pinia' import { store } from '@/stores/index' // import { defaultFont, list } from '@/api/font' import { request } from '@/utils/request' -import colorFunctions from 'less/lib/less/functions/color.js' -import colorTree from 'less/lib/less/tree/color.js' -import { setTitle } from '@/utils/utils' + +import { setTitle, setCurrentColor } from '@/utils/utils' const basePath = import.meta.env.VITE_API_BASE_URL const baseUrl = basePath + '/system/appearance/picture/' @@ -32,7 +31,6 @@ interface AppearanceState { loaded: boolean showDemoTips?: boolean demoTipsContent?: string - community: boolean fontList?: Array<{ name: string; id: string; isDefault: boolean }> } @@ -65,7 +63,6 @@ export const useAppearanceStore = defineStore('appearanceStore', { loaded: false, showDemoTips: false, demoTipsContent: '', - community: true, fontList: [], } }, @@ -142,9 +139,6 @@ export const useAppearanceStore = defineStore('appearanceStore', { getDemoTipsContent(): string { return this.demoTipsContent! }, - getCommunity(): boolean { - return this.community - }, getShowAi(): boolean { return isBtnShow(this.showAi!) }, @@ -208,7 +202,7 @@ export const useAppearanceStore = defineStore('appearanceStore', { setLoaded(data: boolean) { this.loaded = data }, - async setAppearance(isDataEaseBi?: boolean) { + async setAppearance() { // const desktop = wsCache.get('app.desktop') // if (desktop) { // this.loaded = true @@ -252,43 +246,28 @@ export const useAppearanceStore = defineStore('appearanceStore', { // document.title = '' // } const obj = LicenseGenerator.getLicense() - if (obj?.status !== 'valid') return + if (obj?.status !== 'valid') { + setCurrentColor('#1CBA90') + document.title = 'SQLBot' + setLinkIcon() + return + } const resData = await request.get('/system/appearance') this.loaded = true if (!resData?.length) { - if (!isDataEaseBi) { - document.title = 'SQLBot' - setLinkIcon() - } return } - const data: AppearanceState = { loaded: false, community: true } - let isCommunity = false + const data: AppearanceState = { loaded: false } resData.forEach((item: KeyValue) => { ;( data as { [key: string]: any } )[item.pkey] = item.pval - if (item.pkey === 'community') { - isCommunity = true - } }) - data.community = isCommunity - this.community = data.community - if (this.community) { - this.showDemoTips = data.showDemoTips - this.demoTipsContent = data.demoTipsContent - this.loaded = true - setLinkIcon() - return - } + this.navigate = data.navigate - this.mobileLogin = data.mobileLogin - this.mobileLoginBg = data.mobileLoginBg this.help = data.help - this.showAi = data.showAi - this.showCopilot = data.showCopilot this.showDoc = data.showDoc this.showAbout = data.showAbout this.navigateBg = data.navigateBg @@ -300,53 +279,12 @@ export const useAppearanceStore = defineStore('appearanceStore', { : this.isBlue ? '#3370ff' : '#1CBA90' - document.documentElement.style.setProperty('--ed-color-primary', currentColor) - document.documentElement.style.setProperty('--van-blue', currentColor) - document.documentElement.style.setProperty( - '--ed-color-primary-light-5', - colorFunctions - .mix(new colorTree('ffffff'), new colorTree(currentColor.substr(1)), { value: 40 }) - .toRGB() - ) - document.documentElement.style.setProperty( - '--ed-color-primary-light-3', - colorFunctions - .mix(new colorTree('ffffff'), new colorTree(currentColor.substr(1)), { value: 15 }) - .toRGB() - ) - - document.documentElement.style.setProperty( - '--ed-color-primary-60', - colorFunctions - .mix(new colorTree('ffffff'), new colorTree(currentColor.substr(1)), { value: 60 }) - .toRGB() - ) - - document.documentElement.style.setProperty( - '--ed-color-primary-80', - colorFunctions - .mix(new colorTree('ffffff'), new colorTree(currentColor.substr(1)), { value: 80 }) - .toRGB() - ) - document.documentElement.style.setProperty('--ed-color-primary-1a', `${currentColor}1a`) - document.documentElement.style.setProperty('--ed-color-primary-14', `${currentColor}14`) - document.documentElement.style.setProperty('--ed-color-primary-33', `${currentColor}33`) - document.documentElement.style.setProperty('--ed-color-primary-99', `${currentColor}99`) - document.documentElement.style.setProperty( - '--ed-color-primary-dark-2', - colorFunctions - .mix(new colorTree('000000'), new colorTree(currentColor.substr(1)), { value: 15 }) - .toRGB() - ) - + setCurrentColor(currentColor) this.bg = data.bg this.login = data.login this.slogan = data.slogan this.web = data.web this.name = data.name - this.foot = data.foot - this.footContent = data.footContent - if (isDataEaseBi) return if (this.name) { document.title = this.name setTitle(this.name) diff --git a/frontend/src/utils/utils.ts b/frontend/src/utils/utils.ts index a94078fc..6c17941e 100644 --- a/frontend/src/utils/utils.ts +++ b/frontend/src/utils/utils.ts @@ -1,5 +1,8 @@ import dayjs from 'dayjs' import { useCache } from '@/utils/useCache' +import colorFunctions from 'less/lib/less/functions/color.js' +import colorTree from 'less/lib/less/tree/color.js' + const { wsCache } = useCache() const getCheckDate = (timestamp: any) => { if (!timestamp) return false @@ -103,3 +106,44 @@ export const isBtnShow = (val: string) => { export const setTitle = (title?: string) => { document.title = title || 'SQLBot' } + +export const setCurrentColor = (currentColor: any) => { + document.documentElement.style.setProperty('--ed-color-primary', currentColor) + document.documentElement.style.setProperty('--van-blue', currentColor) + document.documentElement.style.setProperty( + '--ed-color-primary-light-5', + colorFunctions + .mix(new colorTree('ffffff'), new colorTree(currentColor.substr(1)), { value: 40 }) + .toRGB() + ) + document.documentElement.style.setProperty( + '--ed-color-primary-light-3', + colorFunctions + .mix(new colorTree('ffffff'), new colorTree(currentColor.substr(1)), { value: 15 }) + .toRGB() + ) + + document.documentElement.style.setProperty( + '--ed-color-primary-60', + colorFunctions + .mix(new colorTree('ffffff'), new colorTree(currentColor.substr(1)), { value: 60 }) + .toRGB() + ) + + document.documentElement.style.setProperty( + '--ed-color-primary-80', + colorFunctions + .mix(new colorTree('ffffff'), new colorTree(currentColor.substr(1)), { value: 80 }) + .toRGB() + ) + document.documentElement.style.setProperty('--ed-color-primary-1a', `${currentColor}1a`) + document.documentElement.style.setProperty('--ed-color-primary-14', `${currentColor}14`) + document.documentElement.style.setProperty('--ed-color-primary-33', `${currentColor}33`) + document.documentElement.style.setProperty('--ed-color-primary-99', `${currentColor}99`) + document.documentElement.style.setProperty( + '--ed-color-primary-dark-2', + colorFunctions + .mix(new colorTree('000000'), new colorTree(currentColor.substr(1)), { value: 15 }) + .toRGB() + ) +} diff --git a/frontend/src/views/system/embedded/SetUi.vue b/frontend/src/views/system/embedded/SetUi.vue index 2b4748b0..5b9de567 100644 --- a/frontend/src/views/system/embedded/SetUi.vue +++ b/frontend/src/views/system/embedded/SetUi.vue @@ -307,12 +307,7 @@ defineExpose({
- +