src/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__vendor-col">{{ getVendor() }}</td>
  12     <td class="cs-table__model-col">{{ getModel() }}</td>
  13     <td class="cs-table__firmware-col">{{ getFirmwareVersion() }}</td>
  14   </tr>
  15 </template>
  16
  17 <script setup lang="ts">
  18 import CSConnector from './CSConnector.vue';
  19
  20 // import { reactive } from 'vue';
  21 import Utils from '@/composable/Utils';
  22 import {
  23   ChargingStationData,
  24   ChargingStationInfo,
  25   ConnectorStatus,
  26 } from '@/type/ChargingStationType';
  27
  28 const props = defineProps<{
  29   chargingStation: ChargingStationData;
  30   idTag: string;
  31 }>();
  32
  33 // type State = {
  34 //   isTagModalVisible: boolean;
  35 //   idTag: string;
  36 // };
  37
  38 // const state: State = reactive({
  39 //   isTagModalVisible: false,
  40 //   idTag: '',
  41 // });
  42
  43 function getHashId(): string {
  44   return props.chargingStation.hashId;
  45 }
  46 function getConnectors(): ConnectorStatus[] {
  47   return props.chargingStation.connectors.slice(1);
  48 }
  49 function getInfo(): ChargingStationInfo {
  50   return props.chargingStation.stationInfo;
  51 }
  52 function getId(): string {
  53   return Utils.ifUndefined<string>(getInfo().chargingStationId, 'Ø');
  54 }
  55 function getModel(): string {
  56   return getInfo().chargePointModel;
  57 }
  58 function getVendor(): string {
  59   return getInfo().chargePointVendor;
  60 }
  61 function getFirmwareVersion(): string {
  62   return Utils.ifUndefined<string>(getInfo().firmwareVersion, 'Ø');
  63 }
  64 // function showTagModal(): void {
  65 //   state.isTagModalVisible = true;
  66 // }
  67 // function hideTagModal(): void {
  68 //   state.isTagModalVisible = false;
  69 // }
  70 </script>