X-Git-Url: https://git.piment-noir.org/?a=blobdiff_plain;f=ui%2Fweb%2Fsrc%2Fmain.ts;h=a39c049ba99052c4e48a2898fe3039508f1aab15;hb=1091427efe95a8f1733282589dc1794a5be7e785;hp=7b36de586262d0ad129fee1f7e69b2b7d6f60b0a;hpb=c317ae3edbd335e6dc52616df7d702c0d8419fd4;p=e-mobility-charging-stations-simulator.git diff --git a/ui/web/src/main.ts b/ui/web/src/main.ts index 7b36de58..a39c049b 100644 --- a/ui/web/src/main.ts +++ b/ui/web/src/main.ts @@ -1,45 +1,71 @@ -import { createApp } from 'vue' -import type { ConfigurationData, ResponsePayload } from './types' -import { router } from '@/router' -import { UIClient } from '@/composables' +import 'vue-toast-notification/dist/theme-bootstrap.css' + +import { type App as AppType, createApp, ref } from 'vue' +import ToastPlugin from 'vue-toast-notification' + import App from '@/App.vue' +import { getFromLocalStorage, setToLocalStorage, UIClient } from '@/composables' +import { router } from '@/router' +import type { ChargingStationData, ConfigurationData, UIServerConfigurationSection } from '@/types' + +const app = createApp(App) -const initializeApp = (config: ConfigurationData) => { - const app = createApp(App) +const initializeApp = (app: AppType, config: ConfigurationData) => { app.config.errorHandler = (error, instance, info) => { console.error('Error:', error) console.info('Vue instance:', instance) console.info('Error info:', info) // TODO: add code for UI notifications or other error handling logic } - app.config.globalProperties.$uiClient = UIClient.getInstance(config) - app.config.globalProperties.$uiClient.registerWSonOpenListener(() => { - app.config.globalProperties.$uiClient - .listChargingStations() - .then((response: ResponsePayload) => { - app.config.globalProperties.$chargingStations = response.chargingStations + if (!Array.isArray(config.uiServer)) { + config.uiServer = [config.uiServer] + } + if (app.config.globalProperties.$configuration == null) { + app.config.globalProperties.$configuration = ref(config) + } + if (!Array.isArray(app.config.globalProperties.$templates?.value)) { + app.config.globalProperties.$templates = ref([]) + } + if (!Array.isArray(app.config.globalProperties.$chargingStations?.value)) { + app.config.globalProperties.$chargingStations = ref([]) + } + if ( + getFromLocalStorage('uiServerConfigurationIndex', undefined) == null || + getFromLocalStorage('uiServerConfigurationIndex', 0) > + (app.config.globalProperties.$configuration.value.uiServer as UIServerConfigurationSection[]) + .length - + 1 + ) { + setToLocalStorage('uiServerConfigurationIndex', 0) + } + if (app.config.globalProperties.$uiClient == null) { + app.config.globalProperties.$uiClient = UIClient.getInstance( + (app.config.globalProperties.$configuration.value.uiServer as UIServerConfigurationSection[])[ + getFromLocalStorage('uiServerConfigurationIndex', 0) + ] + ) + } + app.use(router).use(ToastPlugin).mount('#app') +} + +fetch('/config.json') + .then(response => { + if (!response.ok) { + // TODO: add code for UI notifications or other error handling logic + console.error('Failed to fetch app configuration') + return + } + response + .json() + .then(config => { + initializeApp(app, config) }) - .catch((error: Error) => { + .catch(error => { // TODO: add code for UI notifications or other error handling logic - console.error('Error at fetching charging stations:', error) - throw error - }) - .finally(() => { - app.use(router).mount('#app') + console.error('Error at deserializing JSON app configuration:', error) }) }) -} - -fetch('/config.json') - .then(response => response.json()) .catch(error => { + // TODO: add code for UI notifications or other error handling logic console.error('Error at fetching app configuration:', error) - throw error - }) - .then(config => { - initializeApp(config) - }) - .catch(error => { - console.error('Error at initializing app:', error) - throw error })