ui/web/src/components/charging-stations/CSData.vue

   1 <template>
   2   <tr v-for="(connector, index) in getConnectors()" class="cs-table__row">
   3     <CSConnector
   4       :hash-id="getHashId()"
   5       :connector="connector"
   6       :connector-id="index + 1"
   7       :transaction-id="connector.transactionId"
   8       :id-tag="props.idTag"
   9     />
  10     <td class="cs-table__name-col">{{ getId() }}</td>
  11     <td class="cs-table__started-col">{{ getStarted() }}</td>
  12     <td class="cs-table__wsState-col">{{ getWsState() }}</td>
  13     <td class="cs-table__registration-status-col">{{ getRegistrationStatus() }}</td>
  14     <td class="cs-table__vendor-col">{{ getVendor() }}</td>
  15     <td class="cs-table__model-col">{{ getModel() }}</td>
  16     <td class="cs-table__firmware-col">{{ getFirmwareVersion() }}</td>
  17   </tr>
  18 </template>
  19
  20 <script setup lang="ts">
  21 // import { reactive } from 'vue'
  22 import CSConnector from './CSConnector.vue'
  23 import type { ChargingStationData, ChargingStationInfo, ConnectorStatus } from '@/types'
  24 import { ifUndefined } from '@/composables/Utils'
  25
  26 const props = defineProps<{
  27   chargingStation: ChargingStationData
  28   idTag: string
  29 }>()
  30
  31 // type State = {
  32 //   isTagModalVisible: boolean
  33 //   idTag: string
  34 // }
  35
  36 // const state: State = reactive({
  37 //   isTagModalVisible: false,
  38 //   idTag: ''
  39 // })
  40
  41 function getConnectors(): ConnectorStatus[] {
  42   if (Array.isArray(props.chargingStation.evses) && props.chargingStation.evses.length > 0) {
  43     const connectorsStatus: ConnectorStatus[] = []
  44     for (const [evseId, evseStatus] of props.chargingStation.evses.entries()) {
  45       if (evseId > 0 && Array.isArray(evseStatus.connectors) && evseStatus.connectors.length > 0) {
  46         for (const connectorStatus of evseStatus.connectors) {
  47           connectorsStatus.push(connectorStatus)
  48         }
  49       }
  50     }
  51     return connectorsStatus
  52   }
  53   return props.chargingStation.connectors?.slice(1)
  54 }
  55 function getInfo(): ChargingStationInfo {
  56   return props.chargingStation.stationInfo
  57 }
  58 function getHashId(): string {
  59   return getInfo().hashId
  60 }
  61 function getId(): string {
  62   return ifUndefined<string>(getInfo().chargingStationId, 'Ø')
  63 }
  64 function getModel(): string {
  65   return getInfo().chargePointModel
  66 }
  67 function getVendor(): string {
  68   return getInfo().chargePointVendor
  69 }
  70 function getFirmwareVersion(): string {
  71   return ifUndefined<string>(getInfo().firmwareVersion, 'Ø')
  72 }
  73 function getStarted(): string {
  74   return props.chargingStation.started === true ? 'Yes' : 'No'
  75 }
  76 function getWsState(): string {
  77   switch (props.chargingStation?.wsState) {
  78     case WebSocket.CONNECTING:
  79       return 'Connecting'
  80     case WebSocket.OPEN:
  81       return 'Open'
  82     case WebSocket.CLOSING:
  83       return 'Closing'
  84     case WebSocket.CLOSED:
  85       return 'Closed'
  86     default:
  87       return 'Ø'
  88   }
  89 }
  90 function getRegistrationStatus(): string {
  91   return props.chargingStation?.bootNotificationResponse?.status ?? 'Ø'
  92 }
  93 // function showTagModal(): void {
  94 //   state.isTagModalVisible = true
  95 // }
  96 // function hideTagModal(): void {
  97 //   state.isTagModalVisible = false
  98 // }
  99 </script>