Merge branch 'main' into dependabot/npm_and_yarn/eslint-plugin-jsdoc-48.2.0
[e-mobility-charging-stations-simulator.git] / ui / web / src / components / actions / AddChargingStations.vue
index f2af0905660aa0d3c01761d8d76c8098f38e0a7d..0ddf612e56a7f441690128d310ed1cadef75fec7 100644 (file)
@@ -1,7 +1,8 @@
 <template>
-  <h2>Action Add Charging Stations</h2>
+  <h1 id="action">Action</h1>
+  <h2>Add Charging Stations</h2>
   <p>Template:</p>
-  <select v-if="state.ready" v-model="state.template">
+  <select v-show="state.ready" v-model="state.template">
     <option disabled value="">Please select a template</option>
     <option v-for="template in app?.appContext.config.globalProperties.$templates">
       {{ template }}
     name="number-of-stations"
     placeholder="number of stations"
   />
+  <p>Options:</p>
+  <ul>
+    <li>
+      Auto start:
+      <input v-model="state.autoStart" type="checkbox" true-value="true" false-value="false" />
+    </li>
+  </ul>
   <br />
   <Button
     id="action-button"
     @click="
       () => {
         uiClient
-          .addChargingStations(state.template, state.numberOfStations)
+          .addChargingStations(state.template, state.numberOfStations, {
+            autoStart: convertToBoolean(state.autoStart)
+          })
           .then(() => {
             $toast.success('Charging stations successfully added')
           })
@@ -46,11 +56,13 @@ import { getCurrentInstance, onMounted, reactive } from 'vue'
 import { useToast } from 'vue-toast-notification'
 import Button from '@/components/buttons/Button.vue'
 import type { ResponsePayload } from '@/types'
+import { convertToBoolean } from '@/composables'
 
 const state = reactive({
   ready: false,
   template: '',
-  numberOfStations: 1
+  numberOfStations: 1,
+  autoStart: false
 })
 
 const app = getCurrentInstance()