2 <h1 id="action">Add Charging Stations</h1>
4 <select v-model="state.template">
5 <option disabled value="">Please select a template</option>
7 v-for="template in $templates.value"
8 v-show="Array.isArray($templates.value) && $templates.value.length > 0"
13 <p>Number of stations:</p>
15 id="number-of-stations"
16 v-model="state.numberOfStations"
19 name="number-of-stations"
20 placeholder="number of stations"
22 <p>Template options overrides:</p>
23 <ul id="template-options">
28 v-model.trim="state.supervisionUrl"
30 name="supervision-url"
36 <input v-model="state.autoStart" type="checkbox" true-value="true" false-value="false" />
39 Persistent configuration:
41 v-model="state.persistentConfiguration"
48 OCPP strict compliance:
50 v-model="state.ocppStrictCompliance"
57 Performance statistics:
59 v-model="state.enableStatistics"
72 .addChargingStations(state.template, state.numberOfStations, {
73 supervisionUrls: state.supervisionUrl.length > 0 ? state.supervisionUrl : undefined,
74 autoStart: convertToBoolean(state.autoStart),
75 persistentConfiguration: convertToBoolean(state.persistentConfiguration),
76 ocppStrictCompliance: convertToBoolean(state.ocppStrictCompliance),
77 enableStatistics: convertToBoolean(state.enableStatistics)
80 $toast.success('Charging stations successfully added')
82 .catch((error: Error) => {
83 $toast.error('Error at adding charging stations')
84 console.error('Error at adding charging stations:', error)
87 $router.push({ name: 'charging-stations' })
96 <script setup lang="ts">
97 import { ref } from 'vue'
98 import Button from '@/components/buttons/Button.vue'
99 import { convertToBoolean } from '@/composables'
103 numberOfStations: number
104 supervisionUrl: string
106 persistentConfiguration: boolean
107 ocppStrictCompliance: boolean
108 enableStatistics: boolean
114 persistentConfiguration: true,
115 ocppStrictCompliance: true,
116 enableStatistics: false
121 #number-of-stations {
132 list-style: circle inside;