1<template> 2 <page-section 3 :section-title="$t('pageInventory.systemIndicator.sectionTitle')" 4 > 5 <div class="form-background pl-4 pt-4 pb-1"> 6 <b-row> 7 <b-col sm="6" md="3"> 8 <dl> 9 <dt>{{ $t('pageInventory.systemIndicator.powerStatus') }}</dt> 10 <dd> 11 {{ $t(powerStatus) }} 12 </dd> 13 </dl> 14 </b-col> 15 <b-col sm="6" md="3"> 16 <dl> 17 <dt> 18 {{ $t('pageInventory.systemIndicator.identifyLed') }} 19 </dt> 20 <dd> 21 <b-form-checkbox 22 id="identifyLedSwitchService" 23 v-model="systems.locationIndicatorActive" 24 data-test-id="inventoryService-toggle-identifyLed" 25 switch 26 @change="toggleIdentifyLedSwitch" 27 > 28 <span v-if="systems.locationIndicatorActive"> 29 {{ $t('global.status.on') }} 30 </span> 31 <span v-else>{{ $t('global.status.off') }}</span> 32 </b-form-checkbox> 33 </dd> 34 </dl> 35 </b-col> 36 </b-row> 37 </div> 38 </page-section> 39</template> 40<script> 41import PageSection from '@/components/Global/PageSection'; 42import BVToastMixin from '@/components/Mixins/BVToastMixin'; 43 44export default { 45 components: { PageSection }, 46 mixins: [BVToastMixin], 47 computed: { 48 systems() { 49 let systemData = this.$store.getters['system/systems'][0]; 50 return systemData ? systemData : {}; 51 }, 52 serverStatus() { 53 return this.$store.getters['global/serverStatus']; 54 }, 55 powerStatus() { 56 if (this.serverStatus === 'unreachable') { 57 return `global.status.off`; 58 } 59 return `global.status.${this.serverStatus}`; 60 }, 61 }, 62 created() { 63 this.$store.dispatch('system/getSystem').finally(() => { 64 // Emit initial data fetch complete to parent component 65 this.$root.$emit('hardware-status-service-complete'); 66 }); 67 }, 68 methods: { 69 toggleIdentifyLedSwitch(state) { 70 this.$store 71 .dispatch('system/changeIdentifyLedState', state) 72 .catch(({ message }) => this.errorToast(message)); 73 }, 74 }, 75}; 76</script> 77