diff options
author | Dixsie Wolmers <dixsie@ibm.com> | 2020-02-13 22:29:40 +0300 |
---|---|---|
committer | Gunnar Mills <gmills@us.ibm.com> | 2020-02-25 01:50:31 +0300 |
commit | 9d40e308fb33d5cef91deb8d78451ab021614898 (patch) | |
tree | 08a2c0b46fecb551bb95becc5138e2803486cef5 /src/views/Overview/OverviewNetwork.vue | |
parent | 0e893f03bbcb2fa2cc6ce128091ba68b8ea93e8f (diff) | |
download | webui-vue-9d40e308fb33d5cef91deb8d78451ab021614898.tar.xz |
Update overview events table and overview network layout
- Convert events list group to bootstrap table
- Add ethernet interfaces to overview using redfish
Signed-off-by: Dixsie Wolmers <dixsie@ibm.com>
Change-Id: I633f03ba4a65358861664a869b35adf5358c45e6
Diffstat (limited to 'src/views/Overview/OverviewNetwork.vue')
-rw-r--r-- | src/views/Overview/OverviewNetwork.vue | 72 |
1 files changed, 72 insertions, 0 deletions
diff --git a/src/views/Overview/OverviewNetwork.vue b/src/views/Overview/OverviewNetwork.vue new file mode 100644 index 00000000..69a727de --- /dev/null +++ b/src/views/Overview/OverviewNetwork.vue @@ -0,0 +1,72 @@ +<template> + <div> + <div v-if="ethernetData.length === 0"> + {{ $t('global.state.notAvailable') }} + </div> + <div + v-for="ethernetInterface in ethernetData" + v-else + :key="ethernetInterface.id" + > + <p class="h6 interface-name font-weight-bold"> + {{ ethernetInterface.Id }} + </p> + <b-row> + <b-col md="12" lg="4"> + <dl> + <dt>{{ $t('overview.network.hostname') }}</dt> + <dd>{{ ethernetInterface.HostName }}</dd> + </dl> + </b-col> + <b-col md="12" lg="4"> + <dl> + <dt>{{ $t('overview.network.macAddress') }}</dt> + <dd>{{ ethernetInterface.MACAddress }}</dd> + </dl> + </b-col> + <b-col md="12" lg="4"> + <dl> + <dt>{{ $t('overview.network.ipAddress') }}</dt> + <dd + v-for="(ip, $index) in ethernetInterface.IPv4Addresses" + :key="$index" + > + {{ ip.Address }} + </dd> + </dl> + </b-col> + </b-row> + </div> + </div> +</template> + +<script> +export default { + name: 'Network', + computed: { + ethernetData() { + return this.$store.getters['networkSettings/ethernetData']; + } + }, + created() { + this.getEthernetData(); + }, + methods: { + getEthernetData() { + this.$store.dispatch('networkSettings/getEthernetData'); + } + } +}; +</script> + +<style lang="scss" scoped> +.interface-name { + text-transform: capitalize; +} +dd { + margin-bottom: 0; + white-space: nowrap; + overflow: hidden; + text-overflow: ellipsis; +} +</style> |