6c06ccef5f546f82d4dedf4f96c11744b4874335
[e-mobility-charging-stations-simulator.git] / ui / web / src / components / actions / SetSupervisionUrl.vue
1 <template>
2 <h2>Action Set Supervision Url</h2>
3 <h3>Charging Station {{ chargingStationId }}</h3>
4 <p>Supervision Url:</p>
5 <input
6 id="supervision-url"
7 v-model.trim="state.supervisionUrl"
8 type="url"
9 name="supervision-url"
10 placeholder="wss://"
11 />
12 <br />
13 <Button
14 id="action-button"
15 @click="
16 () => {
17 uiClient
18 .setSupervisionUrl(props.hashId, state.supervisionUrl)
19 .then(() => {
20 $toast.success('Supervision url successfully set')
21 })
22 .catch((error: Error) => {
23 $toast.error('Error at setting supervision url')
24 console.error('Error at setting supervision url:', error)
25 })
26 .finally(() => {
27 $router.push({ name: 'charging-stations' })
28 })
29 }
30 "
31 >
32 Set Supervision Url
33 </Button>
34 <Button id="action-button" @click="$router.push({ name: 'charging-stations' })">Cancel</Button>
35 </template>
36
37 <script setup lang="ts">
38 import { getCurrentInstance, reactive } from 'vue'
39 import Button from '@/components/buttons/Button.vue'
40
41 const props = defineProps<{
42 hashId: string
43 chargingStationId: string
44 }>()
45
46 const state = reactive({
47 supervisionUrl: ''
48 })
49
50 const uiClient = getCurrentInstance()?.appContext.config.globalProperties.$uiClient
51 </script>
52
53 <style>
54 #supervision-url {
55 width: 90%;
56 text-align: left;
57 }
58 </style>