if (
getFromLocalStorage<number>('uiServerConfigurationIndex', 0) !== state.uiServerIndex
) {
- $uiClient.setConfiguration($configuration.value.uiServer[state.uiServerIndex])
+ $uiClient.setConfiguration(
+ ($configuration.value.uiServer as UIServerConfigurationSection[])[
+ state.uiServerIndex
+ ]
+ )
registerWSEventListeners()
$uiClient.registerWSEventListener(
'open',
() => {
setToLocalStorage<number>('uiServerConfigurationIndex', state.uiServerIndex)
clearToggleButtons()
- $router.currentRoute.value.name !== 'charging-stations' &&
+ $route.name !== 'charging-stations' &&
$router.push({ name: 'charging-stations' })
},
{ once: true }
0
)
$uiClient.setConfiguration(
- $configuration.value.uiServer[
+ ($configuration.value.uiServer as UIServerConfigurationSection[])[
getFromLocalStorage<number>('uiServerConfigurationIndex', 0)
]
)
<ToggleButton
:id="'simulator'"
:key="state.renderSimulator"
- :status="state.simulatorState?.started"
+ :status="simulatorState?.started"
:on="() => startSimulator()"
:off="() => stopSimulator()"
:class="simulatorButtonClass"
</template>
<script setup lang="ts">
-import { computed, getCurrentInstance, onMounted, onUnmounted, ref } from 'vue'
+import { computed, getCurrentInstance, onMounted, onUnmounted, ref, watch } from 'vue'
import { useToast } from 'vue-toast-notification'
import CSTable from '@/components/charging-stations/CSTable.vue'
-import type { ResponsePayload, SimulatorState, UIServerConfigurationSection } from '@/types'
+import type {
+ ChargingStationData,
+ ResponsePayload,
+ SimulatorState,
+ UIServerConfigurationSection
+} from '@/types'
import Container from '@/components/Container.vue'
import ReloadButton from '@/components/buttons/ReloadButton.vue'
import {
getFromLocalStorage,
getLocalStorage,
randomUUID,
- setToLocalStorage
+ setToLocalStorage,
+ useUIClient
} from '@/composables'
import ToggleButton from '@/components/buttons/ToggleButton.vue'
+const simulatorState = ref<SimulatorState | undefined>(undefined)
+
+const simulatorButtonClass = computed<string>(() =>
+ simulatorState.value?.started === true ? 'simulator-stop-button' : 'simulator-start-button'
+)
+const simulatorButtonMessage = computed<string>(
+ () =>
+ `${simulatorState.value?.started === true ? 'Stop' : 'Start'} Simulator${simulatorState.value?.version != null ? ` (${simulatorState.value.version})` : ''}`
+)
+
const state = ref<{
renderSimulator: `${string}-${string}-${string}-${string}-${string}`
renderAddChargingStations: `${string}-${string}-${string}-${string}-${string}`
gettingSimulatorState: boolean
gettingTemplates: boolean
gettingChargingStations: boolean
- simulatorState?: SimulatorState
uiServerIndex: number
}>({
renderSimulator: randomUUID(),
uiServerIndex: getFromLocalStorage<number>('uiServerConfigurationIndex', 0)
})
-const simulatorButtonClass = computed<string>(() =>
- state.value.simulatorState?.started === true ? 'simulator-stop-button' : 'simulator-start-button'
-)
-const simulatorButtonMessage = computed<string>(
- () =>
- `${state.value.simulatorState?.started === true ? 'Stop' : 'Start'} Simulator${state.value.simulatorState?.version != null ? ` (${state.value.simulatorState.version})` : ''}`
-)
-
const clearToggleButtons = (): void => {
for (const key in getLocalStorage()) {
if (key.includes('toggle-button')) {
const app = getCurrentInstance()
+watch(app!.appContext.config.globalProperties.$chargingStations, () => {
+ state.value.renderChargingStations = randomUUID()
+})
+
+watch(simulatorState, () => {
+ state.value.renderSimulator = randomUUID()
+})
+
+const clearTemplates = (): void => {
+ if (app != null) {
+ app.appContext.config.globalProperties.$templates.value = []
+ }
+}
+
const clearChargingStations = (): void => {
if (app != null) {
app.appContext.config.globalProperties.$chargingStations.value = []
}
- state.value.renderChargingStations = randomUUID()
}
-const uiClient = app?.appContext.config.globalProperties.$uiClient
+const uiClient = useUIClient()
const $toast = useToast()
uiClient
.simulatorState()
.then((response: ResponsePayload) => {
- state.value.simulatorState = response.state as SimulatorState
+ simulatorState.value = response.state as SimulatorState
})
.catch((error: Error) => {
$toast.error('Error at fetching simulator state')
console.error('Error at fetching simulator state:', error)
})
.finally(() => {
- state.value.renderSimulator = randomUUID()
state.value.gettingSimulatorState = false
})
}
.listTemplates()
.then((response: ResponsePayload) => {
if (app != null) {
- app.appContext.config.globalProperties.$templates.value = response.templates
+ app.appContext.config.globalProperties.$templates.value = response.templates as string[]
}
})
.catch((error: Error) => {
- if (app != null) {
- app.appContext.config.globalProperties.$templates.value = []
- }
+ clearTemplates()
$toast.error('Error at fetching charging station templates')
console.error('Error at fetching charging station templates:', error)
})
.listChargingStations()
.then((response: ResponsePayload) => {
if (app != null) {
- app.appContext.config.globalProperties.$chargingStations.value = response.chargingStations
+ app.appContext.config.globalProperties.$chargingStations.value =
+ response.chargingStations as ChargingStationData[]
}
})
.catch((error: Error) => {
- if (app != null) {
- app.appContext.config.globalProperties.$chargingStations.value = []
- }
+ clearChargingStations()
$toast.error('Error at fetching charging stations')
console.error('Error at fetching charging stations:', error)
})
.finally(() => {
- state.value.renderChargingStations = randomUUID()
state.value.gettingChargingStations = false
})
}
unregisterWSEventListeners()
})
-const uiServerConfigurations: { index: number; configuration: UIServerConfigurationSection }[] =
- app?.appContext.config.globalProperties.$configuration.value.uiServer.map(
- (configuration: UIServerConfigurationSection, index: number) => ({
- index,
- configuration
- })
- )
+const uiServerConfigurations: { index: number; configuration: UIServerConfigurationSection }[] = (
+ app?.appContext.config.globalProperties.$configuration.value
+ .uiServer as UIServerConfigurationSection[]
+).map((configuration: UIServerConfigurationSection, index: number) => ({
+ index,
+ configuration
+}))
const startSimulator = (): void => {
uiClient
uiClient
.stopSimulator()
.then(() => {
- if (app != null) {
- app.appContext.config.globalProperties.$chargingStations.value = []
- }
+ clearChargingStations()
$toast.success('Simulator successfully stopped')
})
.catch((error: Error) => {