LoongPanel-Asp/web/strores/UseMainLayoutStore.ts

88 lines
2.5 KiB
TypeScript
Executable File

import {defineStore} from 'pinia'
import type {OnlineUser, UserInfoType} from "~/types/UserType";
import type {serverValueItem} from "~/components/SettingCard.vue";
import type {LayoutItem} from "grid-layout-plus";
import {SymbolKind} from "vscode-languageserver-types";
import Object = SymbolKind.Object;
import {object} from "yup";
export interface IGridItem extends LayoutItem {
serverValues?: serverValueItem[],
selectChart?: string,
chartRage?: number,
type: "chart" | "card"
cardConfig?: cardConfigType,
selectCard?: string,
}
export type cardConfigType = {
[key: string]: cardConfigItemType;
};
type cardConfigItemType = {
label: string,
value: string,
type: 'text' | 'color'
}
export interface Layouts {
'md': IGridItem[]
'lg': IGridItem[]
'sm': IGridItem[]
'xs': IGridItem[]
[key: string]: IGridItem[];
}
const defaultLayouts: Layouts = {
'md': [],
'lg': [],
'xl': [],
'sm': [],
'xs': [],
};
export const useMainLayoutStore = defineStore('MainLayoutStore', {
state: () => {
return {
IsLeftSidebarMini: false,
SelectServer: <{ name: string, id?: string }>{}, // 选中的服务器
UserInfo: <UserInfoType>{},
OnlineUsers: <OnlineUser[]>[],
ServerConfig: <{ key: string, value: string }[]>[], // 服务器配置
LayoutsConfig: <Layouts>{...defaultLayouts}, // 布局配置
IsScrolling: false,
}
}, actions: {
toggleLeftSidebarMini() {
this.IsLeftSidebarMini = !this.IsLeftSidebarMini
},
setUserInfo(userInfo: UserInfoType) {
this.UserInfo = userInfo
},
setOnlineUsers(onlineUsers: OnlineUser[]) {
this.OnlineUsers = onlineUsers
},
addLayout(layout: IGridItem) {
const index = this.LayoutsConfig.lg.length
const newLayout = layout
newLayout.y = index + 12
newLayout.x = (index * 2) % 12
for (const layoutsConfigKey in this.LayoutsConfig) {
this.LayoutsConfig[layoutsConfigKey].push(newLayout)
}
},
deleteLayout(layoutId: string) {
const index = this.LayoutsConfig.lg.findIndex(item => item.i === layoutId)
if (index !== -1) {
for (const layoutsConfigKey in this.LayoutsConfig) {
this.LayoutsConfig[layoutsConfigKey].splice(index, 1)
}
}
}
}, persist: {
storage: persistedState.localStorage,
},
})