2 <h1 id="action">Action</h1>
3 <h2>Add Charging Stations</h2>
5 <select v-show="state.ready" v-model="state.template">
6 <option disabled value="">Please select a template</option>
7 <option v-for="template in app?.appContext.config.globalProperties.$templates">
11 <p>Number of stations:</p>
13 id="number-of-stations"
14 v-model="state.numberOfStations"
17 name="number-of-stations"
18 placeholder="number of stations"
20 <p>Template options overrides:</p>
26 v-model.trim="state.supervisionUrl"
28 name="supervision-url"
34 <input v-model="state.autoStart" type="checkbox" true-value="true" false-value="false" />
37 Persistent configuration:
39 v-model="state.persistentConfiguration"
46 OCPP strict compliance:
48 v-model="state.ocppStrictCompliance"
55 Performance statistics:
57 v-model="state.enableStatistics"
70 .addChargingStations(state.template, state.numberOfStations, {
71 supervisionUrls: state.supervisionUrl.length > 0 ? state.supervisionUrl : undefined,
72 autoStart: convertToBoolean(state.autoStart),
73 persistentConfiguration: convertToBoolean(state.persistentConfiguration),
74 ocppStrictCompliance: convertToBoolean(state.ocppStrictCompliance),
75 enableStatistics: convertToBoolean(state.enableStatistics)
78 $toast.success('Charging stations successfully added')
80 .catch((error: Error) => {
81 $toast.error('Error at adding charging stations')
82 console.error('Error at adding charging stations:', error)
85 $router.push({ name: 'charging-stations' })
92 <Button id="action-button" @click="$router.push({ name: 'charging-stations' })">Cancel</Button>
95 <script setup lang="ts">
96 import { getCurrentInstance, onMounted, reactive } from 'vue'
97 import { useToast } from 'vue-toast-notification'
98 import Button from '@/components/buttons/Button.vue'
99 import type { ResponsePayload } from '@/types'
100 import { convertToBoolean } from '@/composables'
102 const state = reactive({
108 persistentConfiguration: true,
109 ocppStrictCompliance: true,
110 enableStatistics: false
113 const app = getCurrentInstance()
114 const uiClient = app?.appContext.config.globalProperties.$uiClient
116 const $toast = useToast()
121 .then((response: ResponsePayload) => {
122 if (app != null && app.appContext.config.globalProperties.$templates == null) {
123 app.appContext.config.globalProperties.$templates = response.templates
126 .catch((error: Error) => {
127 $toast.error('Error at fetching charging station templates')
128 console.error('Error at fetching charging station templates:', error)
137 #number-of-stations {