1<template> 2 <overview-card 3 :title="$t('pageOverview.serverInformation')" 4 :to="`/hardware-status/inventory`" 5 > 6 <b-row class="mt-3"> 7 <b-col sm="6"> 8 <dl> 9 <dt>{{ $t('pageOverview.model') }}</dt> 10 <dd>{{ dataFormatter(serverModel) }}</dd> 11 <dt>{{ $t('pageOverview.serialNumber') }}</dt> 12 <dd>{{ dataFormatter(serverSerialNumber) }}</dd> 13 </dl> 14 </b-col> 15 <b-col sm="6"> 16 <dl> 17 <dt>{{ $t('pageOverview.serverManufacturer') }}</dt> 18 <dd>{{ dataFormatter(serverManufacturer) }}</dd> 19 </dl> 20 </b-col> 21 </b-row> 22 </overview-card> 23</template> 24 25<script> 26import OverviewCard from './OverviewCard'; 27import DataFormatterMixin from '@/components/Mixins/DataFormatterMixin'; 28import { mapState } from 'vuex'; 29import { useI18n } from 'vue-i18n'; 30 31export default { 32 name: 'Server', 33 components: { 34 OverviewCard, 35 }, 36 mixins: [DataFormatterMixin], 37 data() { 38 return { 39 $t: useI18n().t, 40 }; 41 }, 42 computed: { 43 ...mapState({ 44 server: (state) => state.system.systems[0], 45 serverModel() { 46 return this.server?.model; 47 }, 48 serverSerialNumber() { 49 return this.server?.serialNumber; 50 }, 51 serverManufacturer() { 52 return this.server?.manufacturer; 53 }, 54 }), 55 }, 56 created() { 57 this.$store.dispatch('system/getSystem').finally(() => { 58 this.$root.$emit('overview-server-complete'); 59 }); 60 }, 61}; 62</script> 63