use-global-store.ts 1.2 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546
  1. import type { GlobalState } from "./pinia.types";
  2. import { defineStore } from "pinia";
  3. import { toRefs, reactive } from "vue";
  4. const useStore = defineStore("globalStore", () => {
  5. const state: GlobalState = reactive({
  6. globalLoading: false,
  7. routerLoading: false,
  8. requestLoading: false,
  9. fullScreenLoading: false,
  10. isPageSwitching: false,
  11. theme: "light",
  12. statusBarHeight: 0
  13. // theme: 'dark',
  14. });
  15. const setGlobalTheme = (payload: string) => {
  16. state.theme = payload;
  17. };
  18. const setBarHeight = (payload: number) => {
  19. state.statusBarHeight = payload;
  20. };
  21. const setGlobalLoading = (payload: boolean) => {
  22. state.globalLoading = payload;
  23. };
  24. const setRouterLoading = (payload: boolean) => {
  25. state.routerLoading = payload;
  26. };
  27. const setRequestLoading = (payload: boolean) => {
  28. state.requestLoading = payload;
  29. };
  30. const setFullScreenLoading = (payload: boolean) => {
  31. state.fullScreenLoading = payload;
  32. };
  33. return {
  34. ...toRefs(state),
  35. setGlobalLoading,
  36. setBarHeight,
  37. setGlobalTheme,
  38. setRouterLoading,
  39. setRequestLoading,
  40. setFullScreenLoading,
  41. };
  42. });
  43. export default useStore; // 导出