mirror of
https://github.com/r-ca/kidshift-web.git
synced 2024-10-26 00:34:01 +00:00
wip
This commit is contained in:
parent
56da18c40e
commit
43d824f52b
|
@ -1,8 +1,8 @@
|
||||||
import { ActionTree } from 'vuex';
|
import { ActionTree } from 'vuex';
|
||||||
import { StateInterface } from '../index';
|
import { RootStateInterface } from '../index';
|
||||||
import { AccountStateInterface } from './state';
|
import { AccountStateInterface } from './state';
|
||||||
|
|
||||||
const actions: ActionTree<AccountStateInterface, StateInterface> = {
|
const actions: ActionTree<AccountStateInterface, RootStateInterface> = {
|
||||||
logout(context) {
|
logout(context) {
|
||||||
context.commit('setToken', '');
|
context.commit('setToken', '');
|
||||||
context.commit('setUsername', '');
|
context.commit('setUsername', '');
|
||||||
|
|
|
@ -1,8 +1,7 @@
|
||||||
import { GetterTree } from 'vuex';
|
import { GetterTree } from 'vuex';
|
||||||
import { StateInterface } from '../index';
|
|
||||||
import { AccountStateInterface } from './state';
|
import { AccountStateInterface } from './state';
|
||||||
|
|
||||||
const getters: GetterTree<AccountStateInterface, StateInterface> = {
|
const getters: GetterTree<AccountStateInterface, any> = {
|
||||||
getToken(state: AccountStateInterface): string {
|
getToken(state: AccountStateInterface): string {
|
||||||
return state.token;
|
return state.token;
|
||||||
},
|
},
|
||||||
|
|
|
@ -1,11 +1,11 @@
|
||||||
import { Module } from 'vuex';
|
import { Module } from 'vuex';
|
||||||
import { StateInterface } from '../index';
|
import { RootStateInterface } from '../index';
|
||||||
import state, { AccountStateInterface } from './state';
|
import state, { AccountStateInterface } from './state';
|
||||||
import actions from './actions';
|
import actions from './actions';
|
||||||
import getters from './getters';
|
import getters from './getters';
|
||||||
import mutations from './mutations';
|
import mutations from './mutations';
|
||||||
|
|
||||||
const accountStateModule: Module<AccountStateInterface, StateInterface> = {
|
const accountStateModule: Module<AccountStateInterface, RootStateInterface> = {
|
||||||
namespaced: true,
|
namespaced: true,
|
||||||
actions,
|
actions,
|
||||||
getters,
|
getters,
|
||||||
|
|
|
@ -1,63 +1,59 @@
|
||||||
import { store } from 'quasar/wrappers'
|
import { store } from 'quasar/wrappers';
|
||||||
import { InjectionKey } from 'vue'
|
|
||||||
import { Router } from 'vue-router'
|
|
||||||
import {
|
import {
|
||||||
createStore,
|
createStore,
|
||||||
Store as VuexStore,
|
Module,
|
||||||
useStore as vuexUseStore,
|
createComposable,
|
||||||
} from 'vuex'
|
Getters,
|
||||||
|
Mutations,
|
||||||
|
} from 'vuex-smart-module';
|
||||||
|
import { AccountStateInterface } from './account/state';
|
||||||
|
|
||||||
// import example from './module-example'
|
class RootState {
|
||||||
// import { ExampleStateInterface } from './module-example/state';
|
count = 1;
|
||||||
|
|
||||||
/*
|
|
||||||
* If not building with SSR mode, you can
|
|
||||||
* directly export the Store instantiation;
|
|
||||||
*
|
|
||||||
* The function below can be async too; either use
|
|
||||||
* async/await or return a Promise which resolves
|
|
||||||
* with the Store instance.
|
|
||||||
*/
|
|
||||||
|
|
||||||
export interface StateInterface {
|
|
||||||
// Define your own store structure, using submodules if needed
|
|
||||||
// example: ExampleStateInterface;
|
|
||||||
// Declared as unknown to avoid linting issue. Best to strongly type as per the line above.
|
|
||||||
example: unknown
|
|
||||||
}
|
}
|
||||||
|
|
||||||
// provide typings for `this.$store`
|
class RootGetters extends Getters<RootState> {
|
||||||
declare module '@vue/runtime-core' {
|
get count () {
|
||||||
interface ComponentCustomProperties {
|
return this.state.count;
|
||||||
$store: VuexStore<StateInterface>
|
}
|
||||||
|
|
||||||
|
multiply (multiplier: number) {
|
||||||
|
return this.state.count * multiplier;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// provide typings for `useStore` helper
|
class RootMutations extends Mutations<RootState> {
|
||||||
export const storeKey: InjectionKey<VuexStore<StateInterface>> = Symbol('vuex-key')
|
add (payload: number) {
|
||||||
|
this.state.count += payload;
|
||||||
// Provide typings for `this.$router` inside Vuex stores
|
|
||||||
declare module "vuex" {
|
|
||||||
// eslint-disable-next-line @typescript-eslint/no-unused-vars
|
|
||||||
export interface Store<S> {
|
|
||||||
readonly $router: Router;
|
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// This is the config of the root module
|
||||||
|
// You can define a root state/getters/mutations/actions here
|
||||||
|
// Or do everything in separate modules
|
||||||
|
const rootConfig = {
|
||||||
|
state: RootState,
|
||||||
|
getters: RootGetters,
|
||||||
|
mutations: RootMutations,
|
||||||
|
modules: {
|
||||||
|
//
|
||||||
|
},
|
||||||
|
};
|
||||||
|
|
||||||
|
export const root = new Module(rootConfig);
|
||||||
|
|
||||||
export default store(function (/* { ssrContext } */) {
|
export default store(function (/* { ssrContext } */) {
|
||||||
const Store = createStore<StateInterface>({
|
const rootStore = createStore(root, {
|
||||||
modules: {
|
strict: !!process.env.DEBUGGING,
|
||||||
// example
|
// plugins: []
|
||||||
},
|
// and other options, normally passed to Vuex `createStore`
|
||||||
|
});
|
||||||
|
|
||||||
// enable strict mode (adds overhead!)
|
return rootStore;
|
||||||
// for dev mode and --debug builds only
|
});
|
||||||
strict: !!process.env.DEBUGGING
|
|
||||||
})
|
|
||||||
|
|
||||||
return Store;
|
export const useStore = createComposable(root);
|
||||||
})
|
|
||||||
|
|
||||||
export function useStore() {
|
export interface RootStateInterface {
|
||||||
return vuexUseStore(storeKey)
|
account: AccountStateInterface;
|
||||||
}
|
}
|
||||||
|
|
Loading…
Reference in New Issue
Block a user