zsqy-naive-ui/src/store/modules/projectSetting.ts

117 lines
3.0 KiB
TypeScript

import { store } from '@/store';
import { defineStore } from 'pinia';
import projectSetting from '@/settings/projectSetting';
import type {
IHeaderSetting,
IMenuSetting,
IMultiTabsSetting,
ICrumbsSetting,
} from '/#/config';
import { getUserStyleSetting } from '@/api/system/user';
import { useDesignSetting } from './designSetting';
const {
navMode,
navTheme,
isMobile,
headerSetting,
showFooter,
menuSetting,
multiTabsSetting,
crumbsSetting,
// permissionMode,
isPageAnimate,
pageAnimateType,
} = projectSetting;
interface ProjectSettingState {
navMode: string; //导航模式
navTheme: string; //导航风格
headerSetting: IHeaderSetting; //顶部设置
showFooter: boolean; //页脚
menuSetting: IMenuSetting; //多标签
multiTabsSetting: IMultiTabsSetting; //多标签
crumbsSetting: ICrumbsSetting; //面包屑
// permissionMode: string; //权限模式
isPageAnimate: boolean; //是否开启路由动画
pageAnimateType: string; //路由动画类型
isMobile: boolean; // 是否处于移动端模式
}
export const useProjectSettingStore = defineStore({
id: 'app-project-setting',
state: (): ProjectSettingState => ({
navMode: navMode,
navTheme,
isMobile,
headerSetting,
showFooter,
menuSetting,
multiTabsSetting,
crumbsSetting,
// permissionMode,
isPageAnimate,
pageAnimateType,
}),
getters: {
getNavMode(): string {
return this.navMode;
},
getNavTheme(): string {
return this.navTheme;
},
getIsMobile(): boolean {
return this.isMobile;
},
getHeaderSetting(): object {
return this.headerSetting;
},
getShowFooter(): boolean {
return this.showFooter;
},
getMenuSetting(): object {
return this.menuSetting;
},
getMultiTabsSetting(): object {
return this.multiTabsSetting;
},
getCrumbsSetting(): object {
return this.crumbsSetting;
},
// getPermissionMode(): string {
// return this.permissionMode;
// },
getIsPageAnimate(): boolean {
return this.isPageAnimate;
},
getPageAnimateType(): string {
return this.pageAnimateType;
},
},
actions: {
async setProjectSetting() {
const useDesignSettingStore = useDesignSetting();
const { data } = await getUserStyleSetting();
this.navMode = data.navMode;
this.navTheme = data.navTheme;
this.isMobile = data.isMobile;
this.headerSetting = data.headerSetting;
this.showFooter = data.showFooter;
this.menuSetting = data.menuSetting;
this.multiTabsSetting = data.multiTabsSetting;
this.crumbsSetting = data.crumbsSetting;
this.isPageAnimate = data.isPageAnimate;
this.pageAnimateType = data.pageAnimateType;
useDesignSettingStore.setAppTheme(data.appTheme);
},
setIsMobile(value: boolean): void {
this.isMobile = value;
},
},
});
export function useProjectSetting() {
return useProjectSettingStore(store);
}