X-Git-Url: https://git.piment-noir.org/?a=blobdiff_plain;f=ui%2Fweb%2FREADME.md;h=1a129e14132574deb40be07d82f4352c8659a7a8;hb=0475290acf98bb3575aeeb62c772f0d60b440048;hp=1035fe9ae821929077269f2605c24fd4634a61eb;hpb=b4c9f3c1d3161c8891e848601e60a54937ec18ab;p=e-mobility-charging-stations-simulator.git diff --git a/ui/web/README.md b/ui/web/README.md index 1035fe9a..1a129e14 100644 --- a/ui/web/README.md +++ b/ui/web/README.md @@ -4,21 +4,27 @@ The Web UI code and configuration is in the repository directory [ui/web](./../. ## Project setup +### Dependencies + ```shell 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: +### Configuration + +#### Simulator UI Server Configuration + +The simulator UI server must be enabled, use WebSocket transport type and have authentication disabled. The simulator main configuration file should have a `uiServer` section like this: ```json "uiServer": { "enabled": true, "type": "ws", "authentication": { - "enabled": false, - "type": "basic-auth", + "enabled": true, + "type": "protocol-basic-auth", "username": "admin", "password": "admin" } @@ -27,37 +33,43 @@ The simulator UI server must be enabled, use WebSocket and disable authenticatio See [here](./../../README.md#charging-stations-simulator-configuration) for more details. -### Run +#### Web UI configuration -#### Compiles and run for production +Copy the configuration template [src/assets/config-template.json](./src/assets/config-template.json) to `public/config.json`. -```shell -pnpm start -``` +### Run -#### Compiles and run for development +#### Compiles for production and preview locally ```shell -pnpm serve +pnpm preview ``` #### 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 +You can now follow the link displayed in the terminal. The Web UI looks like the following: -![webui](./assets/webui.png) +![webui](./src/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 +### Development + +#### Compiles and run for development + +```shell +pnpm dev +``` + +#### Formats files ```shell -pnpm build +pnpm format ``` -### Lints files +#### Lints and fixes files ```shell -pnpm lint +pnpm lint:fix ```