1<template>
2  <overview-card
3    :title="$t('pageOverview.inventory')"
4    :to="`/hardware-status/inventory`"
5  >
6    <b-row class="mt-3">
7      <b-col sm="6">
8        <dl sm="6">
9          <dt>{{ $t('pageOverview.systemIdentifyLed') }}</dt>
10          <dd>
11            <b-form-checkbox
12              id="identifyLedSwitch"
13              v-model="systems.locationIndicatorActive"
14              data-test-id="overviewInventory-checkbox-identifyLed"
15              switch
16              @change="toggleIdentifyLedSwitch"
17            >
18              <span v-if="systems.locationIndicatorActive">
19                {{ $t('global.status.on') }}
20              </span>
21              <span v-else>{{ $t('global.status.off') }}</span>
22            </b-form-checkbox>
23          </dd>
24        </dl>
25      </b-col>
26    </b-row>
27  </overview-card>
28</template>
29
30<script>
31import OverviewCard from './OverviewCard';
32
33export default {
34  name: 'Inventory',
35  components: {
36    OverviewCard,
37  },
38  computed: {
39    systems() {
40      let systemData = this.$store.getters['system/systems'][0];
41      return systemData ? systemData : {};
42    },
43  },
44  created() {
45    this.$store.dispatch('system/getSystem').finally(() => {
46      this.$root.$emit('overview-inventory-complete');
47    });
48  },
49  methods: {
50    toggleIdentifyLedSwitch(state) {
51      this.$store
52        .dispatch('system/changeIdentifyLedState', state)
53        .catch(({ message }) => this.errorToast(message));
54    },
55  },
56};
57</script>
58