library_client_vue3_store_vuex

An opinionated library for vue3 with vuex store for the library_client_vue3.

Requirements

NodeJs

NodeJs version 18+

Installation

Store Setup

Store.js

Setup the 'store/store.js' as follows:

import Vue from 'vue';
import VuexPersist from 'vuex-persist';

import LibraryClientConstants from '@thzero/library_client_vue/constants';

import BaseStore from '@/library_vue/store';

class AppStore extends BaseStore {
	_init() {
		return {
			modules: {
			},
			state: {
				version: null
			},
			actions: {
				async getVersion({ commit }, correlationId) {
					const service = LibraryClientUtility.$injector.getService(LibraryClientConstants.InjectorKeys.SERVICE_VERSION);
					const version = await service.version(correlationId);
					this.$logger.debug('store', 'getVersion', 'version', version, correlationId);
					commit('setVersion', { correlationId : correlationId, version: version });
				},
				async initialize({ commit }, correlationId) {
          // TODO: Call any services that are required during initialization
				},
				async setSettings({ commit }, params) {
					commit('setSettings', params);
				}
			},
			getters: {
			},
			mutations: {
				setVersion(state, params) {
					this.$logger.debug('store', 'setVersion', 'version', params.version, params.correlationId);
					state.version = params.version;
				}
			},
			dispatcher: {
				async getVersion(correlationId) {
					await LibraryClientUtility.$store.dispatch('getVersion', correlationId);
				},
				async initialize(correlationId) {
					await LibraryClientUtility.$store.dispatch('initialize', correlationId);
				}
			}
		};
	}

	_initModules() {
    // Initialize any store modules
    // i.e. this._addModule('yourmodulename', yourmodule);
	}

	_initPluginPersist() {
		return new VuexPersist({
			storage: window.localStorage,
			reducer: state => ({
        // TODO: any reducers?
				version: state.version
			})
		});
	}
}

export default AppStore;