fix: 抽离全局设置的位置
This commit is contained in:
parent
d2fabeae5f
commit
4bf319dcb4
@ -112,8 +112,8 @@ const handleClick = (key: 'close' | 'remove' | 'resize' | 'fullResize') => {
|
|||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
border-radius: 50%;
|
border-radius: 50%;
|
||||||
&.mini {
|
&.mini {
|
||||||
width: 10px;
|
width: 8px;
|
||||||
height: 10px;
|
height: 8px;
|
||||||
margin: 0 2px;
|
margin: 0 2px;
|
||||||
}
|
}
|
||||||
&.disabled {
|
&.disabled {
|
||||||
|
@ -38,8 +38,6 @@
|
|||||||
<script script lang="ts" setup>
|
<script script lang="ts" setup>
|
||||||
import { reactive } from 'vue'
|
import { reactive } from 'vue'
|
||||||
import { ListType } from './index.d'
|
import { ListType } from './index.d'
|
||||||
import { useLangStore } from '@/store/modules/langStore/langStore'
|
|
||||||
import { useDesignStore } from '@/store/modules/designStore/designStore'
|
|
||||||
import { useSettingStore } from '@/store/modules/settingStore/settingStore'
|
import { useSettingStore } from '@/store/modules/settingStore/settingStore'
|
||||||
import { SettingStoreEnums } from '@/store/modules/settingStore/settingStore.d'
|
import { SettingStoreEnums } from '@/store/modules/settingStore/settingStore.d'
|
||||||
import { icon } from '@/plugins'
|
import { icon } from '@/plugins'
|
||||||
@ -52,17 +50,15 @@ defineProps({
|
|||||||
modelShow: Boolean
|
modelShow: Boolean
|
||||||
})
|
})
|
||||||
|
|
||||||
const langStore = useLangStore()
|
|
||||||
const designStore = useDesignStore()
|
|
||||||
const settingStore = useSettingStore()
|
const settingStore = useSettingStore()
|
||||||
|
|
||||||
const list = reactive<ListType[]>([
|
const list = reactive<ListType[]>([
|
||||||
{
|
{
|
||||||
key: 'aollapsed',
|
key: SettingStoreEnums.ASIDE_ALL_COLLAPSED,
|
||||||
value: designStore.asideAllCollapsed,
|
value: settingStore.getAsideAllCollapsed,
|
||||||
type: 'switch',
|
type: 'switch',
|
||||||
name: '菜单折叠',
|
name: '菜单折叠',
|
||||||
desc: '左侧菜单全部折叠',
|
desc: '首页菜单折叠时隐藏全部',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: SettingStoreEnums.HIDE_PACKAGE_ONE_CATEGORY,
|
key: SettingStoreEnums.HIDE_PACKAGE_ONE_CATEGORY,
|
||||||
@ -72,8 +68,8 @@ const list = reactive<ListType[]>([
|
|||||||
desc: '工作空间表单分类只有单项时隐藏',
|
desc: '工作空间表单分类只有单项时隐藏',
|
||||||
},
|
},
|
||||||
{
|
{
|
||||||
key: 'lang',
|
key: SettingStoreEnums.CHANGE_LANG_RELOAD,
|
||||||
value: langStore.getReload,
|
value: settingStore.getChangeLangReload,
|
||||||
type: 'switch',
|
type: 'switch',
|
||||||
name: '切换语言',
|
name: '切换语言',
|
||||||
desc: '切换语言重新加载页面',
|
desc: '切换语言重新加载页面',
|
||||||
@ -86,17 +82,7 @@ const closeHandle = () => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
const handleChange = (e: Event, item: ListType) => {
|
const handleChange = (e: Event, item: ListType) => {
|
||||||
switch (item.key) {
|
settingStore.setItem(item.key, item.value)
|
||||||
case 'lang':
|
|
||||||
langStore.changeReload(item.value)
|
|
||||||
break
|
|
||||||
case 'aollapsed':
|
|
||||||
designStore.changeAsideAllCollapsed()
|
|
||||||
break
|
|
||||||
case SettingStoreEnums.HIDE_PACKAGE_ONE_CATEGORY:
|
|
||||||
settingStore.setItem(SettingStoreEnums.HIDE_PACKAGE_ONE_CATEGORY, item.value)
|
|
||||||
break
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
|
@ -43,6 +43,9 @@ export const asideWidth = '270'
|
|||||||
// 侧边栏折叠后的宽度,支持全部折叠会覆盖为 0
|
// 侧边栏折叠后的宽度,支持全部折叠会覆盖为 0
|
||||||
export const asideCollapsedWidth = '60'
|
export const asideCollapsedWidth = '60'
|
||||||
|
|
||||||
|
// 弹窗是否可以通过点击遮罩关闭
|
||||||
|
export const maskClosable = false
|
||||||
|
|
||||||
// 修改边框圆角
|
// 修改边框圆角
|
||||||
export const borderRadius = '6px'
|
export const borderRadius = '6px'
|
||||||
|
|
||||||
|
@ -1,10 +1,10 @@
|
|||||||
// * 系统全局设置
|
// * 系统全局设置
|
||||||
|
|
||||||
// 侧边栏是否支持全持全部折叠
|
// 侧边栏折叠是否隐藏全部
|
||||||
export const asideAllCollapsed = true
|
export const asideAllCollapsed = true
|
||||||
|
|
||||||
// 弹窗是否可以通过点击遮罩关闭
|
|
||||||
export const maskClosable = false
|
|
||||||
|
|
||||||
// 拖拽页面左侧表单分类只有一项的时候是否隐藏
|
// 拖拽页面左侧表单分类只有一项的时候是否隐藏
|
||||||
export const hidePackageOneCategory = true
|
export const hidePackageOneCategory = true
|
||||||
|
|
||||||
|
// 切换语言是否进行路由刷新
|
||||||
|
export const changeLangReload = true
|
||||||
|
@ -9,6 +9,4 @@ export interface DesignStateType {
|
|||||||
appTheme: string
|
appTheme: string
|
||||||
//系统内置风格
|
//系统内置风格
|
||||||
appThemeList: string[]
|
appThemeList: string[]
|
||||||
// 侧边栏是否全收缩
|
|
||||||
asideAllCollapsed: boolean
|
|
||||||
}
|
}
|
||||||
|
@ -1,7 +1,6 @@
|
|||||||
import { defineStore } from 'pinia'
|
import { defineStore } from 'pinia'
|
||||||
import { store } from '@/store'
|
import { store } from '@/store'
|
||||||
import { theme, asideCollapsedWidth } from '@/settings/designSetting'
|
import { theme } from '@/settings/designSetting'
|
||||||
import { asideAllCollapsed } from '@/settings/systemSetting'
|
|
||||||
import { DesignStateType } from './designStore.d'
|
import { DesignStateType } from './designStore.d'
|
||||||
import { setLocalStorage, getLocalStorage } from '@/utils'
|
import { setLocalStorage, getLocalStorage } from '@/utils'
|
||||||
import { StorageEnum } from '@/enums/storageEnum'
|
import { StorageEnum } from '@/enums/storageEnum'
|
||||||
@ -25,8 +24,6 @@ export const useDesignStore = defineStore({
|
|||||||
appTheme,
|
appTheme,
|
||||||
// 颜色列表
|
// 颜色列表
|
||||||
appThemeList,
|
appThemeList,
|
||||||
// 侧边栏
|
|
||||||
asideAllCollapsed
|
|
||||||
},
|
},
|
||||||
getters: {
|
getters: {
|
||||||
getDarkTheme(e): boolean {
|
getDarkTheme(e): boolean {
|
||||||
@ -37,9 +34,6 @@ export const useDesignStore = defineStore({
|
|||||||
},
|
},
|
||||||
getAppThemeList(): string[] {
|
getAppThemeList(): string[] {
|
||||||
return this.appThemeList
|
return this.appThemeList
|
||||||
},
|
|
||||||
getAsideCollapsedWidth(): string {
|
|
||||||
return this.asideAllCollapsed ? '0' : asideCollapsedWidth
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
actions: {
|
actions: {
|
||||||
@ -48,10 +42,6 @@ export const useDesignStore = defineStore({
|
|||||||
this.themeName = this.darkTheme ? ThemeEnum.dark : ThemeEnum.light
|
this.themeName = this.darkTheme ? ThemeEnum.dark : ThemeEnum.light
|
||||||
setLocalStorage(GO_DESIGN_STORE, this.$state)
|
setLocalStorage(GO_DESIGN_STORE, this.$state)
|
||||||
},
|
},
|
||||||
changeAsideAllCollapsed(): void {
|
|
||||||
this.asideAllCollapsed = !this.asideAllCollapsed
|
|
||||||
setLocalStorage(GO_DESIGN_STORE, this.$state)
|
|
||||||
}
|
|
||||||
}
|
}
|
||||||
})
|
})
|
||||||
|
|
||||||
|
2
src/store/modules/langStore/langStore.d.ts
vendored
2
src/store/modules/langStore/langStore.d.ts
vendored
@ -2,6 +2,4 @@ import { LangEnum } from '@/enums/styleEnum'
|
|||||||
export interface LangStateType {
|
export interface LangStateType {
|
||||||
// 当前语言
|
// 当前语言
|
||||||
lang: LangEnum,
|
lang: LangEnum,
|
||||||
// 是否刷新
|
|
||||||
isReload: boolean
|
|
||||||
}
|
}
|
||||||
|
@ -5,6 +5,8 @@ import { LangEnum } from '@/enums/styleEnum'
|
|||||||
import i18n from '@/i18n/index'
|
import i18n from '@/i18n/index'
|
||||||
import { setLocalStorage, getLocalStorage, reloadRoutePage } from '@/utils'
|
import { setLocalStorage, getLocalStorage, reloadRoutePage } from '@/utils'
|
||||||
import { StorageEnum } from '@/enums/storageEnum'
|
import { StorageEnum } from '@/enums/storageEnum'
|
||||||
|
import { useSettingStore } from '@/store/modules/settingStore/settingStore'
|
||||||
|
const settingStore = useSettingStore()
|
||||||
|
|
||||||
const { GO_LANG_STORE } = StorageEnum
|
const { GO_LANG_STORE } = StorageEnum
|
||||||
|
|
||||||
@ -16,29 +18,20 @@ export const useLangStore = defineStore({
|
|||||||
state: (): LangStateType =>
|
state: (): LangStateType =>
|
||||||
storageLang || {
|
storageLang || {
|
||||||
lang,
|
lang,
|
||||||
isReload: false
|
|
||||||
},
|
},
|
||||||
getters: {
|
getters: {
|
||||||
getLang(): LangEnum {
|
getLang(): LangEnum {
|
||||||
return this.lang
|
return this.lang
|
||||||
},
|
|
||||||
getReload(): boolean {
|
|
||||||
return this.isReload
|
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
actions: {
|
actions: {
|
||||||
changeReload(value: boolean): void {
|
|
||||||
this.isReload = value
|
|
||||||
setLocalStorage(GO_LANG_STORE, this.$state)
|
|
||||||
},
|
|
||||||
changeLang(lang: LangEnum): void {
|
changeLang(lang: LangEnum): void {
|
||||||
if (this.lang === lang) return
|
if (this.lang === lang) return
|
||||||
this.lang = lang
|
this.lang = lang
|
||||||
i18n.global.locale = lang
|
i18n.global.locale = lang
|
||||||
|
|
||||||
setLocalStorage(GO_LANG_STORE, this.$state)
|
setLocalStorage(GO_LANG_STORE, this.$state)
|
||||||
|
|
||||||
if (this.getReload) {
|
if (settingStore.getChangeLangReload) {
|
||||||
reloadRoutePage()
|
reloadRoutePage()
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
@ -1,7 +1,11 @@
|
|||||||
export enum SettingStoreEnums {
|
export enum SettingStoreEnums {
|
||||||
HIDE_PACKAGE_ONE_CATEGORY = 'hidePackageOneCategory',
|
HIDE_PACKAGE_ONE_CATEGORY = 'hidePackageOneCategory',
|
||||||
|
CHANGE_LANG_RELOAD = 'changeLangReload',
|
||||||
|
ASIDE_ALL_COLLAPSED = 'asideAllCollapsed',
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface SettingStoreType {
|
export interface SettingStoreType {
|
||||||
[SettingStoreEnums.HIDE_PACKAGE_ONE_CATEGORY]: boolean
|
[SettingStoreEnums.HIDE_PACKAGE_ONE_CATEGORY]: boolean
|
||||||
|
[SettingStoreEnums.CHANGE_LANG_RELOAD]: boolean
|
||||||
|
[SettingStoreEnums.ASIDE_ALL_COLLAPSED]: boolean
|
||||||
}
|
}
|
||||||
|
@ -1,5 +1,10 @@
|
|||||||
import { defineStore } from 'pinia'
|
import { defineStore } from 'pinia'
|
||||||
import { hidePackageOneCategory } from '@/settings/systemSetting'
|
import {
|
||||||
|
hidePackageOneCategory,
|
||||||
|
changeLangReload,
|
||||||
|
asideAllCollapsed
|
||||||
|
} from '@/settings/systemSetting'
|
||||||
|
import { asideCollapsedWidth } from '@/settings/designSetting'
|
||||||
import { SettingStoreType } from './settingStore.d'
|
import { SettingStoreType } from './settingStore.d'
|
||||||
import { setLocalStorage, getLocalStorage } from '@/utils'
|
import { setLocalStorage, getLocalStorage } from '@/utils'
|
||||||
import { StorageEnum } from '@/enums/storageEnum'
|
import { StorageEnum } from '@/enums/storageEnum'
|
||||||
@ -13,15 +18,26 @@ export const useSettingStore = defineStore({
|
|||||||
state: (): SettingStoreType =>
|
state: (): SettingStoreType =>
|
||||||
storageSetting || {
|
storageSetting || {
|
||||||
hidePackageOneCategory,
|
hidePackageOneCategory,
|
||||||
|
changeLangReload,
|
||||||
|
asideAllCollapsed
|
||||||
},
|
},
|
||||||
getters: {
|
getters: {
|
||||||
getHidePackageOneCategory(): boolean {
|
getHidePackageOneCategory(): boolean {
|
||||||
return this.hidePackageOneCategory
|
return this.hidePackageOneCategory
|
||||||
},
|
},
|
||||||
|
getChangeLangReload(): boolean {
|
||||||
|
return this.changeLangReload
|
||||||
|
},
|
||||||
|
getAsideAllCollapsed(): boolean {
|
||||||
|
return this.asideAllCollapsed
|
||||||
|
},
|
||||||
|
getAsideCollapsedWidth(): string {
|
||||||
|
return this.asideAllCollapsed ? '0' : asideCollapsedWidth
|
||||||
|
}
|
||||||
},
|
},
|
||||||
actions: {
|
actions: {
|
||||||
setItem(key: string, value: boolean): void {
|
setItem(key: string, value: boolean): void {
|
||||||
;(this as any)[key] = value
|
; (this as any)[key] = value
|
||||||
setLocalStorage(GO_SYSTEM_SETTING, this.$state)
|
setLocalStorage(GO_SYSTEM_SETTING, this.$state)
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
@ -1,7 +1,7 @@
|
|||||||
import { icon } from '@/plugins'
|
import { icon } from '@/plugins'
|
||||||
import { DialogEnum } from '@/enums/pluginEnum'
|
import { DialogEnum } from '@/enums/pluginEnum'
|
||||||
import { dialogIconSize } from '@/settings/designSetting'
|
import { dialogIconSize } from '@/settings/designSetting'
|
||||||
import { maskClosable } from '@/settings/systemSetting'
|
import { maskClosable } from '@/settings/designSetting'
|
||||||
import { DialogReactive } from 'naive-ui'
|
import { DialogReactive } from 'naive-ui'
|
||||||
const { InformationCircleIcon } = icon.ionicons5
|
const { InformationCircleIcon } = icon.ionicons5
|
||||||
import { renderIcon } from '@/utils'
|
import { renderIcon } from '@/utils'
|
||||||
|
@ -22,7 +22,6 @@
|
|||||||
:collapsed-width="getAsideCollapsedWidth"
|
:collapsed-width="getAsideCollapsedWidth"
|
||||||
:collapsed-icon-size="22"
|
:collapsed-icon-size="22"
|
||||||
:default-expanded-keys="defaultExpandedKeys"
|
:default-expanded-keys="defaultExpandedKeys"
|
||||||
@update:value="handleUpdateValue"
|
|
||||||
/>
|
/>
|
||||||
</aside>
|
</aside>
|
||||||
<!-- 底部提示 -->
|
<!-- 底部提示 -->
|
||||||
@ -39,11 +38,11 @@ import { Create } from '../Create/index'
|
|||||||
import { AsideFooter } from '../AsideFooter/index'
|
import { AsideFooter } from '../AsideFooter/index'
|
||||||
import { asideWidth, asideCollapsedWidth } from '@/settings/designSetting'
|
import { asideWidth, asideCollapsedWidth } from '@/settings/designSetting'
|
||||||
import { useRoute } from 'vue-router'
|
import { useRoute } from 'vue-router'
|
||||||
import { useDesignStore } from '@/store/modules/designStore/designStore'
|
import { useSettingStore } from '@/store/modules/settingStore/settingStore'
|
||||||
import { menuOptionsInit, expandedKeys } from './menu'
|
import { menuOptionsInit, expandedKeys } from './menu'
|
||||||
|
|
||||||
const collapsed = ref<boolean>(false)
|
const collapsed = ref<boolean>(false)
|
||||||
const { getAsideCollapsedWidth } = toRefs(useDesignStore())
|
const { getAsideCollapsedWidth } = toRefs(useSettingStore())
|
||||||
|
|
||||||
const route = useRoute()
|
const route = useRoute()
|
||||||
const routeRame = computed(() => route.name)
|
const routeRame = computed(() => route.name)
|
||||||
|
Loading…
x
Reference in New Issue
Block a user