X-Git-Url: https://git.piment-noir.org/?a=blobdiff_plain;f=ui%2Fweb%2Fsrc%2Fcomposables%2FUIClient.ts;h=51d61f263f7788adcd45e930ef79103dbd92d883;hb=47521384ba9d093d453f8a71b847afcac37d68e4;hp=fa1479ef7d4c1655c446cc436190648b4a03d401;hpb=8d6f479075c85b8731a6530431b1ab75efc34719;p=e-mobility-charging-stations-simulator.git diff --git a/ui/web/src/composables/UIClient.ts b/ui/web/src/composables/UIClient.ts index fa1479ef..51d61f26 100644 --- a/ui/web/src/composables/UIClient.ts +++ b/ui/web/src/composables/UIClient.ts @@ -1,11 +1,15 @@ +import { useToast } from 'vue-toast-notification' import { + ApplicationProtocol, + AuthenticationType, + type ChargingStationOptions, ProcedureName, type ProtocolResponse, type RequestPayload, type ResponsePayload, - ResponseStatus + ResponseStatus, + type UIServerConfigurationSection } from '@/types' -import config from '@/assets/config' type ResponseHandler = { procedureName: ProcedureName @@ -19,20 +23,29 @@ export class UIClient { private ws!: WebSocket private responseHandlers: Map - private constructor() { + private constructor(private uiServerConfiguration: UIServerConfigurationSection) { this.openWS() this.responseHandlers = new Map() } - public static getInstance() { + public static getInstance(uiServerConfiguration: UIServerConfigurationSection): UIClient { if (UIClient.instance === null) { - UIClient.instance = new UIClient() + UIClient.instance = new UIClient(uiServerConfiguration) } return UIClient.instance } - public registerWSonOpenListener(listener: (event: Event) => void) { - this.ws.addEventListener('open', listener) + public setConfiguration(uiServerConfiguration: UIServerConfigurationSection): void { + this.ws.close() + this.uiServerConfiguration = uiServerConfiguration + this.openWS() + } + + public registerWSEventListener( + event: K, + listener: (event: WebSocketEventMap[K]) => void + ) { + this.ws.addEventListener(event, listener) } public async startSimulator(): Promise { @@ -43,10 +56,37 @@ export class UIClient { return this.sendRequest(ProcedureName.STOP_SIMULATOR, {}) } + public async listTemplates(): Promise { + return this.sendRequest(ProcedureName.LIST_TEMPLATES, {}) + } + public async listChargingStations(): Promise { return this.sendRequest(ProcedureName.LIST_CHARGING_STATIONS, {}) } + public async addChargingStations( + template: string, + numberOfStations: number, + options?: ChargingStationOptions + ): Promise { + return this.sendRequest(ProcedureName.ADD_CHARGING_STATIONS, { + template, + numberOfStations, + options + }) + } + + public async deleteChargingStation(hashId: string): Promise { + return this.sendRequest(ProcedureName.DELETE_CHARGING_STATIONS, { hashIds: [hashId] }) + } + + public async setSupervisionUrl(hashId: string, supervisionUrl: string): Promise { + return this.sendRequest(ProcedureName.SET_SUPERVISION_URL, { + hashIds: [hashId], + url: supervisionUrl + }) + } + public async startChargingStation(hashId: string): Promise { return this.sendRequest(ProcedureName.START_CHARGING_STATION, { hashIds: [hashId] }) } @@ -110,16 +150,33 @@ export class UIClient { } private openWS(): void { + const protocols = + this.uiServerConfiguration.authentication?.enabled === true && + this.uiServerConfiguration.authentication?.type === AuthenticationType.PROTOCOL_BASIC_AUTH + ? [ + `${this.uiServerConfiguration.protocol}${this.uiServerConfiguration.version}`, + `authorization.basic.${btoa(`${this.uiServerConfiguration.authentication.username}:${this.uiServerConfiguration.authentication.password}`).replace(/={1,2}$/, '')}` + ] + : `${this.uiServerConfiguration.protocol}${this.uiServerConfiguration.version}` this.ws = new WebSocket( - `ws://${config.uiServer.host}:${config.uiServer.port}`, - config.uiServer.protocol + `${this.uiServerConfiguration.secure === true ? ApplicationProtocol.WSS : ApplicationProtocol.WS}://${this.uiServerConfiguration.host}:${this.uiServerConfiguration.port}`, + protocols ) + this.ws.onopen = () => { + useToast().success( + `WebSocket to UI server '${this.uiServerConfiguration.host}' successfully opened` + ) + } this.ws.onmessage = this.responseHandler.bind(this) this.ws.onerror = errorEvent => { - console.error('WebSocket error: ', errorEvent) + useToast().error(`Error in WebSocket to UI server '${this.uiServerConfiguration.host}'`) + console.error( + `Error in WebSocket to UI server '${this.uiServerConfiguration.host}'`, + errorEvent + ) } - this.ws.onclose = closeEvent => { - console.info('WebSocket closed: ', closeEvent) + this.ws.onclose = () => { + useToast().info(`WebSocket to UI server '${this.uiServerConfiguration.host}' closed`) } } @@ -128,16 +185,13 @@ export class UIClient { payload: RequestPayload ): Promise { return new Promise((resolve, reject) => { - if (this.ws.readyState !== WebSocket.OPEN) { - this.openWS() - } if (this.ws.readyState === WebSocket.OPEN) { const uuid = crypto.randomUUID() const msg = JSON.stringify([uuid, procedureName, payload]) const sendTimeout = setTimeout(() => { this.responseHandlers.delete(uuid) - return reject(new Error(`Send request '${procedureName}' message timeout`)) - }, 60 * 1000) + return reject(new Error(`Send request '${procedureName}' message: connection timeout`)) + }, 60000) try { this.ws.send(msg) this.responseHandlers.set(uuid, { procedureName, resolve, reject }) @@ -148,7 +202,7 @@ export class UIClient { clearTimeout(sendTimeout) } } else { - throw new Error(`Send request '${procedureName}' message: connection not opened`) + reject(new Error(`Send request '${procedureName}' message: connection closed`)) } }) } @@ -172,8 +226,10 @@ export class UIClient { reject(responsePayload) break default: - console.error( - `Response status for procedure '${procedureName}' not supported: '${responsePayload.status}'` + reject( + new Error( + `Response status for procedure '${procedureName}' not supported: '${responsePayload.status}'` + ) ) } this.responseHandlers.delete(uuid)