Vben
2021-04-07 5b8eb4a49a097a47caf491c44df427522ab58daa
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
import type { ProjectConfig } from '/#/config';
import type { BeforeMiniState } from '../types';
 
import { VuexModule, getModule, Module, Mutation, Action } from 'vuex-module-decorators';
import store from '/@/store';
 
import { PROJ_CFG_KEY, APP_DARK_MODE_KEY_ } from '/@/enums/cacheEnum';
 
import { hotModuleUnregisterModule } from '/@/utils/helper/vuexHelper';
import { Persistent } from '/@/utils/cache/persistent';
import { deepMerge } from '/@/utils';
 
import { resetRouter } from '/@/router';
import { ThemeEnum } from '../../enums/appEnum';
 
import { darkMode } from '/@/settings/designSetting';
 
export interface LockInfo {
  pwd: string | undefined;
  isLock: boolean;
}
 
let timeId: TimeoutHandle;
const NAME = 'app';
hotModuleUnregisterModule(NAME);
@Module({ dynamic: true, namespaced: true, store, name: NAME })
export default class App extends VuexModule {
  private darkMode;
 
  // Page loading status
  private pageLoadingState = false;
 
  // project config
  private projectConfigState: ProjectConfig | null = Persistent.getLocal(PROJ_CFG_KEY);
 
  // set main overflow hidden
  private lockMainScrollState = false;
 
  // When the window shrinks, remember some states, and restore these states when the window is restored
  private beforeMiniState: BeforeMiniState = {};
 
  get getPageLoading() {
    return this.pageLoadingState;
  }
 
  get getDarkMode() {
    return this.darkMode || localStorage.getItem(APP_DARK_MODE_KEY_) || darkMode;
  }
 
  get getBeforeMiniState() {
    return this.beforeMiniState;
  }
 
  get getLockMainScrollState() {
    return this.lockMainScrollState;
  }
 
  get getProjectConfig(): ProjectConfig {
    return this.projectConfigState || ({} as ProjectConfig);
  }
 
  @Mutation
  commitPageLoadingState(loading: boolean): void {
    this.pageLoadingState = loading;
  }
 
  @Mutation
  commitDarkMode(mode: ThemeEnum): void {
    this.darkMode = mode;
    localStorage.setItem(APP_DARK_MODE_KEY_, mode);
  }
 
  @Mutation
  commitBeforeMiniState(state: BeforeMiniState): void {
    this.beforeMiniState = state;
  }
 
  @Mutation
  commitLockMainScrollState(lock: boolean): void {
    this.lockMainScrollState = lock;
  }
 
  @Mutation
  commitProjectConfigState(proCfg: DeepPartial<ProjectConfig>): void {
    this.projectConfigState = deepMerge(this.projectConfigState || {}, proCfg);
    Persistent.setLocal(PROJ_CFG_KEY, this.projectConfigState);
  }
 
  @Action
  async resumeAllState() {
    resetRouter();
    Persistent.clearAll();
  }
 
  @Action
  public async setPageLoadingAction(loading: boolean): Promise<void> {
    if (loading) {
      clearTimeout(timeId);
      // Prevent flicker
      timeId = setTimeout(() => {
        this.commitPageLoadingState(loading);
      }, 50);
    } else {
      this.commitPageLoadingState(loading);
      clearTimeout(timeId);
    }
  }
}
export const appStore = getModule<App>(App);