github/cosin
1
0
Fork 0
mirror of https://github.com/chatopera/cosin.git synced 2025-08-01 16:38:02 +08:00
Code Issues Releases Wiki Activity

fix: save apperance by localstorage

Browse Source 
Signed-off-by: Kaifuny <superbiger.github@gmail.com>
This commit is contained in:
Kaifuny 2023-07-24 12:25:50 +08:00
parent 11f47964f5
commit 25b86b2f92
9 changed files with 92 additions and 75 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
contact-frontend/package.json
View File

@ -24,6 +24,7 @@
"idb": "^7.1.1",
"pinia": "^2.1.4",
"vue": "^3.3.4",
"vue-i18n": "9.3.0-beta.19",
"vue-router": "^4.2.4"
},
"devDependencies": {
@ -46,7 +47,6 @@
"typescript": "^5.0.2",
"vite": "^4.4.0",
"vitest": "^0.33.0",
"vue-i18n": "^9.2.2",
"vue-tsc": "^1.8.3"
},
"msw": {

32
contact-frontend/packages/apps/web/src/layouts/NavLayout.vue
View File

@ -39,35 +39,37 @@ const dropdownMenus = [
{ label: '退出登录', value: 'logout' },
]
const current = ref<string>(ROUTE_NAME.DASHBOARD_INDEX)
const drawerShow = ref(false)
const currentPath = ref<string>(ROUTE_NAME.DASHBOARD_INDEX)
const path = window.location.pathname.split('/')[1]
switch (path) {
case 'dashboard':
current.value = ROUTE_NAME.DASHBOARD_INDEX
currentPath.value = ROUTE_NAME.DASHBOARD_INDEX
break
case 'chat':
current.value = ROUTE_NAME.CHAT_INDEX
currentPath.value = ROUTE_NAME.CHAT_INDEX
break
case 'work-order':
current.value = ROUTE_NAME.WORK_ORDER_INDEX
currentPath.value = ROUTE_NAME.WORK_ORDER_INDEX
break
case 'seats':
current.value = ROUTE_NAME.SEATS_INDEX
currentPath.value = ROUTE_NAME.SEATS_INDEX
break
case 'organization':
current.value = ROUTE_NAME.ORGANIZATION_INDEX
currentPath.value = ROUTE_NAME.ORGANIZATION_INDEX
break
case 'setting':
current.value = ROUTE_NAME.SETTING_INDEX
currentPath.value = ROUTE_NAME.SETTING_INDEX
break
case 'system':
current.value = ROUTE_NAME.SYSTEM_INDEX
currentPath.value = ROUTE_NAME.SYSTEM_INDEX
break
case 'profile':
current.value = ROUTE_NAME.PROFILE_INDEX
currentPath.value = ROUTE_NAME.PROFILE_INDEX
break
default:
current.value = ROUTE_NAME.PAGE_NOT_FOUND
currentPath.value = ROUTE_NAME.PAGE_NOT_FOUND
}
const router = useRouter()
@ -82,8 +84,6 @@ function handleClickNav(name: string) {
}
router.push({ name })
}
const active = ref(false)
</script>
<template>
<div class="flex flex-col h-screen bg-gray-100">
@ -92,7 +92,7 @@ const active = ref(false)
到期（剩余30天），如继续试用请联系管理员
</n-alert>
<Nav
v-model:current="current"
v-model:current="currentPath"
avatar-url="https://avatars.githubusercontent.com/u/16386583?v=4"
:navigations="navigations"
:dropdown-menus="dropdownMenus"
@ -100,7 +100,7 @@ const active = ref(false)
>
<template #production>
<div class="flex items-center space-x-2">
<div class="text-sm">XX公司官网</div>
<div class="text-sm">XX 公司官网</div>
<span>-</span>
<div class="text-sm">默认客服部门</div>
</div>
@ -114,7 +114,7 @@ const active = ref(false)
class="flex items-center cursor-pointer"
:component="NotificationsOutline"
size="25"
@click="active = !active"
@click="drawerShow = !drawerShow"
/>
</n-badge>
@ -151,7 +151,7 @@ const active = ref(false)
<router-view></router-view>
</div>
<n-drawer
v-model:show="active"
v-model:show="drawerShow"
:width="502"
:height="200"
placement="right"

18
contact-frontend/packages/modules/common/src/store/modules/apperance.ts
View File

@ -1,18 +1,24 @@
import { defineStore } from 'pinia'
import { Apperance } from '@cskefu/models'
import { useStorage } from '@vueuse/core'
export const useApperance = defineStore('alerts', {
state: (): Apperance => ({ lang: 'zh-CN', darkMode: false }),
state: () => ({
apperance: useStorage<Apperance>('apperance', {
lang: 'zh-CN',
darkMode: false,
}),
}),
getters: {
isDarkMode: (state) => state.darkMode,
getLang: (state) => state.lang,
isDarkMode: (state) => state.apperance.darkMode,
getLang: (state) => state.apperance.lang,
},
actions: {
toggleDarkMode() {
this.darkMode = !this.darkMode
this.apperance.darkMode = !this.apperance.darkMode
},
changeLang(lang: string) {
this.lang = lang
setLang(lang: string) {
this.apperance.lang = lang
},
},
})

0
contact-frontend/packages/modules/common/src/store/modules/auth.ts Normal file
View File

0
contact-frontend/packages/modules/common/src/store/modules/navigate.ts Normal file
View File

3
contact-frontend/packages/modules/i18n/package.json
View File

@ -3,6 +3,9 @@
"private": true,
"version": "0.0.0",
"type": "module",
"dependencies": {
"@cskefu/models": "*"
},
"exports": {
".": {
"import": {

20
contact-frontend/packages/modules/i18n/src/index.ts
View File

@ -1,6 +1,9 @@
import { App } from 'vue'
import { createI18n } from 'vue-i18n'
import _ from 'lodash-es'
import { useLocalStorage } from '@vueuse/core'
import { Apperance } from '@cskefu/models'
/**
* 语言支持类型
@ -10,14 +13,21 @@ export const defaultLocale = 'zh-CN'
const localPathPrefix = './locales/'
const getValidLocale = (defaults: string = defaultLocale): string => {
const locale = window.localStorage.getItem('locale')
if (locale && locales.includes(locale)) {
return locale
}
const storage = useLocalStorage<Apperance>('apperance', {
lang: defaults,
darkMode: false,
})
const param = new URLSearchParams(window.location.search).get('lang')
if (param && locales.includes(param)) {
return param
storage.value.lang = param
}
const lang = storage.value?.lang || defaults
if (locales.includes(lang)) {
return lang
}
return defaults
}

3
contact-frontend/packages/modules/i18n/tsconfig.json
View File

@ -2,12 +2,13 @@
"extends": "../../../tsconfig.json",
"include": ["src/**/*.ts"],
"compilerOptions": {
"baseUrl": "./",
"types": ["vite/client"],
"composite": true,
"skipLibCheck": true,
"module": "ESNext",
"moduleResolution": "bundler",
"resolvePackageJsonExports": false,
"resolvePackageJsonExports": true,
"allowSyntheticDefaultImports": true,
}
}

89
contact-frontend/pnpm-lock.yaml generated
View File

@ -26,13 +26,16 @@ importers:
vue:
specifier: ^3.3.4
version: 3.3.4
vue-i18n:
specifier: 9.3.0-beta.19
version: 9.3.0-beta.19(vue@3.3.4)
vue-router:
specifier: ^4.2.4
version: 4.2.4(vue@3.3.4)
devDependencies:
'@intlify/unplugin-vue-i18n':
specifier: ^0.12.0
version: 0.12.0(vue-i18n@9.2.2)
version: 0.12.0(vue-i18n@9.3.0-beta.19)
'@types/lodash-es':
specifier: ^4.17.8
version: 4.17.8
@ -87,9 +90,6 @@ importers:
vitest:
specifier: ^0.33.0
version: 0.33.0
vue-i18n:
specifier: ^9.2.2
version: 9.2.2(vue@3.3.4)
vue-tsc:
specifier: ^1.8.3
version: 1.8.3(typescript@5.1.6)
@ -163,7 +163,11 @@ importers:
specifier: '*'
version: link:../models
packages/modules/i18n: {}
packages/modules/i18n:
dependencies:
'@cskefu/models':
specifier: '*'
version: link:../models
packages/modules/mocks: {}
@ -1123,7 +1127,7 @@ packages:
resolution: {integrity: sha512-ZnQMnLV4e7hDlUvw8H+U8ASL02SS2Gn6+9Ac3wGGLIe7+je2AeAOxPY+izIPJDfFDb7eDjev0Us8MO1iFRN8hA==}
dev: true
/@intlify/bundle-utils@7.0.2(vue-i18n@9.2.2):
/@intlify/bundle-utils@7.0.2(vue-i18n@9.3.0-beta.19):
resolution: {integrity: sha512-8wbx9xhbawBFTE5LPTECiK26RRqrNS31jyWSur72ZXZZ4it5jiZTcG6eUJlNirr4+jXYio2DGY299JsGVT4cpw==}
engines: {node: '>= 14.16'}
peerDependencies:
@ -1144,34 +1148,31 @@ packages:
magic-string: 0.30.1
mlly: 1.4.0
source-map-js: 1.0.2
vue-i18n: 9.2.2(vue@3.3.4)
vue-i18n: 9.3.0-beta.19(vue@3.3.4)
yaml-eslint-parser: 0.3.2
dev: true
/@intlify/core-base@9.2.2:
resolution: {integrity: sha512-JjUpQtNfn+joMbrXvpR4hTF8iJQ2sEFzzK3KIESOx+f+uwIjgw20igOyaIdhfsVVBCds8ZM64MoeNSx+PHQMkA==}
engines: {node: '>= 14'}
/@intlify/core-base@9.3.0-beta.19:
resolution: {integrity: sha512-mlpVZ1w6ZwnP9QZAs+RzGuFMCuYjZPboX3hX7JzhV49vUcsLj0R4667cmcLpPZzXJguIy/zaqbIyoUvLV8HONQ==}
engines: {node: '>= 16'}
dependencies:
'@intlify/devtools-if': 9.2.2
'@intlify/message-compiler': 9.2.2
'@intlify/shared': 9.2.2
'@intlify/vue-devtools': 9.2.2
dev: true
'@intlify/devtools-if': 9.3.0-beta.19
'@intlify/message-compiler': 9.3.0-beta.19
'@intlify/shared': 9.3.0-beta.19
'@intlify/vue-devtools': 9.3.0-beta.19
/@intlify/devtools-if@9.2.2:
resolution: {integrity: sha512-4ttr/FNO29w+kBbU7HZ/U0Lzuh2cRDhP8UlWOtV9ERcjHzuyXVZmjyleESK6eVP60tGC9QtQW9yZE+JeRhDHkg==}
engines: {node: '>= 14'}
/@intlify/devtools-if@9.3.0-beta.19:
resolution: {integrity: sha512-L4NyqMcuQURejKy9XX0m/2kb37f56NAUvbiXKRx96pahSBclY6T+E0TrKXup0Hx6T0qY55QYGRwyVLeHXIHAMA==}
engines: {node: '>= 16'}
dependencies:
'@intlify/shared': 9.2.2
dev: true
'@intlify/shared': 9.3.0-beta.19
/@intlify/message-compiler@9.2.2:
resolution: {integrity: sha512-IUrQW7byAKN2fMBe8z6sK6riG1pue95e5jfokn8hA5Q3Bqy4MBJ5lJAofUsawQJYHeoPJ7svMDyBaVJ4d0GTtA==}
engines: {node: '>= 14'}
/@intlify/message-compiler@9.3.0-beta.19:
resolution: {integrity: sha512-5RBn5tMOsWh5FqM65IfEJvfpRS8R0lHEUVNDa2rNc9Y7oGEI7swezlbFqU9Kc5FyHy5Kx2jHtdgFIipDwnIYFQ==}
engines: {node: '>= 16'}
dependencies:
'@intlify/shared': 9.2.2
'@intlify/shared': 9.3.0-beta.19
source-map: 0.6.1
dev: true
/@intlify/message-compiler@9.3.0-beta.24:
resolution: {integrity: sha512-prhHATkgp0mpPqoVgiAtLmUc1JMvs8fMH6w53AVEBn+VF87dLhzanfmWY5FoZWORG51ag54gBDBOoM/VFv3m3A==}
@ -1181,10 +1182,9 @@ packages:
source-map-js: 1.0.2
dev: true
/@intlify/shared@9.2.2:
resolution: {integrity: sha512-wRwTpsslgZS5HNyM7uDQYZtxnbI12aGiBZURX3BTR9RFIKKRWpllTsgzHWvj3HKm3Y2Sh5LPC1r0PDCKEhVn9Q==}
engines: {node: '>= 14'}
dev: true
/@intlify/shared@9.3.0-beta.19:
resolution: {integrity: sha512-+lhQggrLvlQ/O5OmIYAc9gadcYXMoaDi0Doef+X/f6TLZFr9PTMjOpBWmpwNNHi026e54jckntUn6GzqDtIN4w==}
engines: {node: '>= 16'}
/@intlify/shared@9.3.0-beta.20:
resolution: {integrity: sha512-RucSPqh8O9FFxlYUysQTerSw0b9HIRpyoN1Zjogpm0qLiHK+lBNSa5sh1nCJ4wSsNcjphzgpLQCyR60GZlRV8g==}
@ -1196,7 +1196,7 @@ packages:
engines: {node: '>= 16'}
dev: true
/@intlify/unplugin-vue-i18n@0.12.0(vue-i18n@9.2.2):
/@intlify/unplugin-vue-i18n@0.12.0(vue-i18n@9.3.0-beta.19):
resolution: {integrity: sha512-L155p03eZpzYUIU1YKbb38xq++GcaW6bsqo800GdonmkQXY8nc4/HsKQRQY5lRoAOkbhO0Vyt7yrsU11vVrqnw==}
engines: {node: '>= 14.16'}
peerDependencies:
@ -1211,7 +1211,7 @@ packages:
vue-i18n-bridge:
optional: true
dependencies:
'@intlify/bundle-utils': 7.0.2(vue-i18n@9.2.2)
'@intlify/bundle-utils': 7.0.2(vue-i18n@9.3.0-beta.19)
'@intlify/shared': 9.3.0-beta.20
'@rollup/pluginutils': 5.0.2
'@vue/compiler-sfc': 3.3.4
@ -1223,19 +1223,18 @@ packages:
picocolors: 1.0.0
source-map-js: 1.0.2
unplugin: 1.3.2
vue-i18n: 9.2.2(vue@3.3.4)
vue-i18n: 9.3.0-beta.19(vue@3.3.4)
transitivePeerDependencies:
- rollup
- supports-color
dev: true
/@intlify/vue-devtools@9.2.2:
resolution: {integrity: sha512-+dUyqyCHWHb/UcvY1MlIpO87munedm3Gn6E9WWYdWrMuYLcoIoOEVDWSS8xSwtlPU+kA+MEQTP6Q1iI/ocusJg==}
engines: {node: '>= 14'}
/@intlify/vue-devtools@9.3.0-beta.19:
resolution: {integrity: sha512-7yz8sUbovPUIf8sCX3+sMdw/xEyeHKBCc7Agxcxv54PiQz3zwsVl0hC1X+JXUy46FiPsMEoFfY8O27xOFLupaw==}
engines: {node: '>= 16'}
dependencies:
'@intlify/core-base': 9.2.2
'@intlify/shared': 9.2.2
dev: true
'@intlify/core-base': 9.3.0-beta.19
'@intlify/shared': 9.3.0-beta.19
/@jest/schemas@29.6.0:
resolution: {integrity: sha512-rxLjXyJBTL4LQeJW3aKo0M/+GkCOXsO+8i9Iu7eDb6KwtP65ayoDsitrdPBtujxQ88k4wI2FNYfa6TOGwSn6cQ==}
@ -3969,7 +3968,6 @@ packages:
/source-map@0.6.1:
resolution: {integrity: sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==}
engines: {node: '>=0.10.0'}
dev: true
/stackback@0.0.2:
resolution: {integrity: sha512-1XMJE5fQo1jGH6Y/7ebnwPOBEkIEnT4QF32d5R1+VXdXveM0IBMJt8zfaxX1P3QhVwrYe+576+jkANtSS2mBbw==}
@ -4446,18 +4444,17 @@ packages:
- supports-color
dev: true
/vue-i18n@9.2.2(vue@3.3.4):
resolution: {integrity: sha512-yswpwtj89rTBhegUAv9Mu37LNznyu3NpyLQmozF3i1hYOhwpG8RjcjIFIIfnu+2MDZJGSZPXaKWvnQA71Yv9TQ==}
engines: {node: '>= 14'}
/vue-i18n@9.3.0-beta.19(vue@3.3.4):
resolution: {integrity: sha512-1pbEcoAbxaAPuR5hODnQJ5CtIimnVD+aUVnCztuuRaOZPLP1i4FxkWVvb1lu8JIRC5pePyODZxi3yoy3PUYheA==}
engines: {node: '>= 16'}
peerDependencies:
vue: ^3.0.0
dependencies:
'@intlify/core-base': 9.2.2
'@intlify/shared': 9.2.2
'@intlify/vue-devtools': 9.2.2
'@intlify/core-base': 9.3.0-beta.19
'@intlify/shared': 9.3.0-beta.19
'@intlify/vue-devtools': 9.3.0-beta.19
'@vue/devtools-api': 6.5.0
vue: 3.3.4
dev: true
/vue-router@4.2.4(vue@3.3.4):
resolution: {integrity: sha512-9PISkmaCO02OzPVOMq2w82ilty6+xJmQrarYZDkjZBfl4RvYAlt4PKnEX21oW4KTtWfa9OuO/b3qk1Od3AEdCQ==}