2 <tr v-for="(connector, index) in getConnectors()" class="cs-table__row">
6 :connector-id="index + 1"
7 :transaction-id="connector.transactionId"
10 <td class="cs-table__column">{{ getId() }}</td>
11 <td class="cs-table__column">{{ getStarted() }}</td>
12 <td class="cs-table__column">{{ getSupervisionUrl() }}</td>
13 <td class="cs-table__column">{{ getWsState() }}</td>
14 <td class="cs-table__column">{{ getRegistrationStatus() }}</td>
15 <td class="cs-table__column">{{ getInfo().templateName }}</td>
16 <td class="cs-table__column">{{ getVendor() }}</td>
17 <td class="cs-table__column">{{ getModel() }}</td>
18 <td class="cs-table__column">{{ getFirmwareVersion() }}</td>
22 <script setup lang="ts">
23 // import { reactive } from 'vue'
24 import CSConnector from '@/components/charging-stations/CSConnector.vue'
25 import type { ChargingStationData, ChargingStationInfo, ConnectorStatus } from '@/types'
27 const props = defineProps<{
28 chargingStation: ChargingStationData
33 // isTagModalVisible: boolean
37 // const state: State = reactive({
38 // isTagModalVisible: false,
42 function getConnectors(): ConnectorStatus[] {
43 if (Array.isArray(props.chargingStation.evses) && props.chargingStation.evses.length > 0) {
44 const connectorsStatus: ConnectorStatus[] = []
45 for (const [evseId, evseStatus] of props.chargingStation.evses.entries()) {
46 if (evseId > 0 && Array.isArray(evseStatus.connectors) && evseStatus.connectors.length > 0) {
47 for (const connectorStatus of evseStatus.connectors) {
48 connectorsStatus.push(connectorStatus)
52 return connectorsStatus
54 return props.chargingStation.connectors?.slice(1)
56 function getInfo(): ChargingStationInfo {
57 return props.chargingStation.stationInfo
59 function getHashId(): string {
60 return getInfo().hashId
62 function getId(): string {
63 return getInfo().chargingStationId ?? 'Ø'
65 function getModel(): string {
66 return getInfo().chargePointModel
68 function getVendor(): string {
69 return getInfo().chargePointVendor
71 function getFirmwareVersion(): string {
72 return getInfo().firmwareVersion ?? 'Ø'
74 function getStarted(): string {
75 return props.chargingStation.started === true ? 'Yes' : 'No'
77 function getSupervisionUrl(): string {
78 const supervisionUrl = new URL(props.chargingStation.supervisionUrl)
79 return `${supervisionUrl.protocol}//${supervisionUrl.host.split('.').join('.\u200b')}`
81 function getWsState(): string {
82 switch (props.chargingStation?.wsState) {
83 case WebSocket.CONNECTING:
87 case WebSocket.CLOSING:
89 case WebSocket.CLOSED:
95 function getRegistrationStatus(): string {
96 return props.chargingStation?.bootNotificationResponse?.status ?? 'Ø'
98 // function showTagModal(): void {
99 // state.isTagModalVisible = true
101 // function hideTagModal(): void {
102 // state.isTagModalVisible = false