X-Git-Url: https://git.piment-noir.org/?a=blobdiff_plain;f=ui%2Fweb%2FREADME.md;h=1035fe9ae821929077269f2605c24fd4634a61eb;hb=cfab8dc9ea7801746461d4e8d6ac9852deb678b5;hp=5b7f5d6f3d8bdfe8a703ba70721e77f44d0597cf;hpb=8228f972d374b250307c36b1e7c91f720f692195;p=e-mobility-charging-stations-simulator.git diff --git a/ui/web/README.md b/ui/web/README.md index 5b7f5d6f..1035fe9a 100644 --- a/ui/web/README.md +++ b/ui/web/README.md @@ -1,9 +1,13 @@ # Web UI +The Web UI code and configuration is in the repository directory [ui/web](./../../ui/web/). Commands execution is relative to that directory. + ## Project setup ```shell -npm install +corepack enable +corepack prepare pnpm@latest --activate +pnpm install ``` The simulator UI server must be enabled, use WebSocket and disable authentication. The simulator main configuration file should have a `uiServer` section like this: @@ -21,32 +25,39 @@ The simulator UI server must be enabled, use WebSocket and disable authenticatio }, ``` -See [here](../README.md#charging-stations-simulator-configuration) for more details. +See [here](./../../README.md#charging-stations-simulator-configuration) for more details. ### Run -For both solution you can then follow the link displayed in the terminal at the end of compilation - #### Compiles and run for production ```shell -npm start +pnpm start ``` #### Compiles and run for development ```shell -npm run serve +pnpm serve ``` +#### Try it out + +For both options above you can then follow the link displayed in the terminal at the end of compilation. The Web UI looks like the following + +![webui](./assets/webui.png) + +1. With the top 2 buttons you can now stop and afterwards start the simulator and inspect the server console for the number of charging stations, e.g. with the default configuration: `Charging stations simulator ... started with 10 charging station(s)` +2. Each charging station is a row in the table below, try "Stop Charging Station" and refresh with the large blue button and see the status Started turns from Yes into No. + ### Compiles and minifies for production ```shell -npm run build +pnpm build ``` ### Lints files ```shell -npm run lint +pnpm lint ```