Commit | Line | Data |
---|---|---|
32de5a57 LM |
1 | # Web UI |
2 | ||
98262391 | 3 | The Web UI code and configuration is in the repository directory [ui/web](./../../ui/web/). Commands execution is relative to that directory. |
603f3fdd | 4 | |
32de5a57 LM |
5 | ## Project setup |
6 | ||
217db058 JB |
7 | ### Dependencies |
8 | ||
d6b76da3 | 9 | ```shell |
603f1011 | 10 | corepack enable |
1a662d29 | 11 | corepack prepare pnpm@latest --activate |
603f1011 | 12 | pnpm install |
32de5a57 LM |
13 | ``` |
14 | ||
217db058 JB |
15 | ### Configuration |
16 | ||
17 | #### Simulator UI Server Configuration | |
18 | ||
19 | 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: | |
8228f972 JB |
20 | |
21 | ```json | |
22 | "uiServer": { | |
23 | "enabled": true, | |
24 | "type": "ws", | |
25 | "authentication": { | |
329eab0e JB |
26 | "enabled": true, |
27 | "type": "protocol-basic-auth", | |
8228f972 JB |
28 | "username": "admin", |
29 | "password": "admin" | |
30 | } | |
31 | }, | |
32 | ``` | |
33 | ||
b4c9f3c1 | 34 | See [here](./../../README.md#charging-stations-simulator-configuration) for more details. |
8228f972 | 35 | |
217db058 JB |
36 | #### Web UI configuration |
37 | ||
f80e9e18 | 38 | Copy the configuration template [src/assets/config-template.json](./src/assets/config-template.json) to `public/config.json`. |
217db058 | 39 | |
32de5a57 LM |
40 | ### Run |
41 | ||
0d7042e2 | 42 | #### Compiles for production and preview locally |
217db058 JB |
43 | |
44 | ```shell | |
45 | pnpm preview | |
46 | ``` | |
47 | ||
d07e35d2 MK |
48 | #### Try it out |
49 | ||
0d7042e2 | 50 | You can now follow the link displayed in the terminal. The Web UI looks like the following: |
d07e35d2 | 51 | |
9d76f5ec | 52 | ![webui](./src/assets/webui.png) |
d07e35d2 MK |
53 | |
54 | 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)` | |
55 | 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. | |
32de5a57 | 56 | |
217db058 JB |
57 | ### Development |
58 | ||
59 | #### Compiles and run for development | |
32de5a57 | 60 | |
d6b76da3 | 61 | ```shell |
217db058 JB |
62 | pnpm dev |
63 | ``` | |
64 | ||
65 | #### Formats files | |
66 | ||
67 | ```shell | |
68 | pnpm format | |
32de5a57 LM |
69 | ``` |
70 | ||
217db058 | 71 | #### Lints and fixes files |
32de5a57 | 72 | |
d6b76da3 | 73 | ```shell |
217db058 | 74 | pnpm lint:fix |
32de5a57 | 75 | ``` |