ui/web/README.md

   1 # Web UI
   2
   3 The Web UI code and configuration is in the repository directory [ui/web](./../../ui/web/). Commands execution is relative to that directory.
   4
   5 ## Project setup
   6
   7 ### Dependencies
   8
   9 ```shell
  10 corepack enable
  11 corepack prepare pnpm@latest --activate
  12 pnpm install
  13 ```
  14
  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:
  20
  21 ```json
  22   "uiServer": {
  23     "enabled": true,
  24     "type": "ws",
  25     "authentication": {
  26       "enabled": true,
  27       "type": "protocol-basic-auth",
  28       "username": "admin",
  29       "password": "admin"
  30     }
  31   },
  32 ```
  33
  34 See [here](./../../README.md#charging-stations-simulator-configuration) for more details.
  35
  36 #### Web UI configuration
  37
  38 Copy the configuration template [src/assets/config-template.json](./src/assets/config-template.json) to `public/config.json`.
  39
  40 ### Run
  41
  42 #### Compiles for production and preview locally
  43
  44 ```shell
  45 pnpm preview
  46 ```
  47
  48 #### Try it out
  49
  50 You can now follow the link displayed in the terminal. The Web UI looks like the following:
  51
  52 ![webui](./src/assets/webui.png)
  53
  54 1. With the buttons on the top you can stop, start the simulator, add new charging stations and refresh the content.
  55 2. Each charging station is a row in the table with specific 'Actions' to execute. Try 'Stop Charging Station' and refresh with the large blue button and see the status 'Started' turns from 'Yes' into 'No'.
  56
  57 ### Development
  58
  59 #### Compiles and run for development
  60
  61 ```shell
  62 pnpm dev
  63 ```
  64
  65 #### Formats files
  66
  67 ```shell
  68 pnpm format
  69 ```
  70
  71 #### Lints and fixes files
  72
  73 ```shell
  74 pnpm lint:fix
  75 ```