This is an automated email from the ASF dual-hosted git repository. rohit pushed a commit to branch master in repository https://gitbox.apache.org/repos/asf/cloudstack-primate.git
The following commit(s) were added to refs/heads/master by this push: new 89c6745 views: fix dashboard and autogenview css issues 89c6745 is described below commit 89c674553ec2a3043caf6cafef61a8ef378f0d10 Author: Rohit Yadav <rohit.ya...@shapeblue.com> AuthorDate: Tue Jun 16 23:31:41 2020 +0530 views: fix dashboard and autogenview css issues Signed-off-by: Rohit Yadav <rohit.ya...@shapeblue.com> --- src/components/widgets/Breadcrumb.vue | 1 - src/views/AutogenView.vue | 29 ++++++++++------------------- src/views/compute/InstanceHardware.vue | 2 +- src/views/dashboard/CapacityDashboard.vue | 16 +++++++++------- src/views/dashboard/UsageDashboard.vue | 19 ++++++++++++++----- src/views/infra/InfraSummary.vue | 4 ++-- 6 files changed, 36 insertions(+), 35 deletions(-) diff --git a/src/components/widgets/Breadcrumb.vue b/src/components/widgets/Breadcrumb.vue index a6f8e1e..c13c0ea 100644 --- a/src/components/widgets/Breadcrumb.vue +++ b/src/components/widgets/Breadcrumb.vue @@ -101,7 +101,6 @@ export default { <style> .ant-breadcrumb { vertical-align: text-bottom; - margin-bottom: 8px; } .ant-breadcrumb .anticon { diff --git a/src/views/AutogenView.vue b/src/views/AutogenView.vue index 70ef866..452d70b 100644 --- a/src/views/AutogenView.vue +++ b/src/views/AutogenView.vue @@ -22,20 +22,15 @@ <a-col :span="device === 'mobile' ? 24 : 12" style="padding-left: 12px"> <breadcrumb :resource="resource"> <span slot="end"> - <a-tooltip placement="bottom"> - <template slot="title"> - {{ $t('label.refresh') }} - </template> - <a-button - style="margin-top: 4px" - :loading="loading" - shape="round" - size="small" - icon="reload" - @click="fetchData()"> - {{ $t('label.refresh') }} - </a-button> - </a-tooltip> + <a-button + :loading="loading" + style="margin-bottom: 5px" + shape="round" + size="small" + icon="reload" + @click="fetchData()"> + {{ $t('label.refresh') }} + </a-button> <a-tooltip placement="right"> <template slot="title"> {{ $t('label.filterby') }} @@ -971,7 +966,7 @@ export default { .breadcrumb-card { margin-left: -24px; margin-right: -24px; - margin-top: -18px; + margin-top: -16px; margin-bottom: 12px; } @@ -983,8 +978,4 @@ export default { .ant-breadcrumb { vertical-align: text-bottom; } - -.ant-breadcrumb .anticon { - margin-left: 8px; -} </style> diff --git a/src/views/compute/InstanceHardware.vue b/src/views/compute/InstanceHardware.vue index 2d0fe93..4d9dacb 100644 --- a/src/views/compute/InstanceHardware.vue +++ b/src/views/compute/InstanceHardware.vue @@ -75,7 +75,7 @@ <div class="label">{{ $t('label.physicalsize') }}</div> <div>{{ (item.physicalsize / (1024 * 1024 * 1024.0)).toFixed(4) }} GB</div> </div> - <div class="attribute"> + <div class="attribute" v-if="item.storage"> <div class="label">{{ $t('label.storagepool') }}</div> <div>{{ item.storage }} ({{ item.storagetype }})</div> </div> diff --git a/src/views/dashboard/CapacityDashboard.vue b/src/views/dashboard/CapacityDashboard.vue index f717e3d..4820d12 100644 --- a/src/views/dashboard/CapacityDashboard.vue +++ b/src/views/dashboard/CapacityDashboard.vue @@ -17,7 +17,7 @@ <template> <a-row class="capacity-dashboard" :gutter="12"> - <a-col :xl="18"> + <a-col :xl="16"> <div class="capacity-dashboard-wrapper"> <div class="capacity-dashboard-select"> <a-select @@ -48,11 +48,12 @@ <a-col :xs="12" :sm="8" - :md="6" + :md="8" :style="{ marginBottom: '12px' }" v-for="stat in stats" :key="stat.type"> <chart-card :loading="loading"> + <router-link :to="{ path: '/zone/' + zoneSelected.id }"> <div class="capacity-dashboard-chart-card-inner"> <h3>{{ $t(ts[stat.name]) }}</h3> <a-progress @@ -63,18 +64,19 @@ :strokeColor="getStrokeColour(parseFloat(stat.percentused))" :width="100" /> </div> + </router-link> <template slot="footer"><center>{{ displayData(stat.name, stat.capacityused) }} / {{ displayData(stat.name, stat.capacitytotal) }}</center></template> </chart-card> </a-col> </a-row> </a-col> - <a-col :xl="6"> + <a-col :xl="8"> <chart-card> <div style="text-align: center"> <a-tooltip placement="bottom" class="capacity-dashboard-button-wrapper"> <template slot="title"> - View Hosts in Alert State + {{ $t('label.view') + ' ' + $t('label.host.alerts') }} </template> <a-button type="danger" shape="circle"> <router-link :to="{ name: 'host', query: {'state': 'Alert'} }"> @@ -84,7 +86,7 @@ </a-tooltip> <a-tooltip placement="bottom" class="capacity-dashboard-button-wrapper"> <template slot="title"> - View Alerts + {{ $t('label.view') + ' ' + $t('label.alerts') }} </template> <a-button shape="circle"> <router-link :to="{ name: 'alert' }"> @@ -94,7 +96,7 @@ </a-tooltip> <a-tooltip placement="bottom" class="capacity-dashboard-button-wrapper"> <template slot="title"> - View Events + {{ $t('label.view') + ' ' + $t('label.events') }} </template> <a-button shape="circle"> <router-link :to="{ name: 'event' }"> @@ -227,7 +229,7 @@ export default { listEvents () { const params = { page: 1, - pagesize: 6, + pagesize: 7, listall: true } this.loading = true diff --git a/src/views/dashboard/UsageDashboard.vue b/src/views/dashboard/UsageDashboard.vue index f3f8c16..bde8d8c 100644 --- a/src/views/dashboard/UsageDashboard.vue +++ b/src/views/dashboard/UsageDashboard.vue @@ -60,7 +60,11 @@ :xl="8"> <chart-card> <div class="usage-dashboard-chart-card-inner"> - <a-button><router-link :to="{ name: 'event' }">View Events</router-link></a-button> + <a-button> + <router-link :to="{ name: 'event' }"> + {{ $t('label.view') + ' ' + $t('label.events') }} + </router-link> + </a-button> </div> <template slot="footer"> <div class="usage-dashboard-chart-footer"> @@ -139,6 +143,11 @@ export default { }, resource (newData, oldData) { this.project = newData + }, + '$i18n.locale' (to, from) { + if (to !== from) { + this.fetchData() + } } }, methods: { @@ -149,21 +158,21 @@ export default { if (json && json.listvirtualmachinesresponse) { count = json.listvirtualmachinesresponse.count } - this.stats.splice(0, 1, { name: 'Running VMs', count: count, path: 'vm' }) + this.stats.splice(0, 1, { name: this.$t('label.running'), count: count, path: 'vm' }) }) api('listVirtualMachines', { state: 'Stopped', listall: true }).then(json => { var count = 0 if (json && json.listvirtualmachinesresponse) { count = json.listvirtualmachinesresponse.count } - this.stats.splice(1, 1, { name: 'Stopped VMs', count: count, path: 'vm' }) + this.stats.splice(1, 1, { name: this.$t('label.stopped'), count: count, path: 'vm' }) }) api('listVirtualMachines', { listall: true }).then(json => { var count = 0 if (json && json.listvirtualmachinesresponse) { count = json.listvirtualmachinesresponse.count } - this.stats.splice(2, 1, { name: 'Total VMs', count: count, path: 'vm' }) + this.stats.splice(2, 1, { name: this.$t('label.total.vms'), count: count, path: 'vm' }) }) api('listVolumes', { listall: true }).then(json => { var count = 0 @@ -184,7 +193,7 @@ export default { if (json && json.listpublicipaddressesresponse) { count = json.listpublicipaddressesresponse.count } - this.stats.splice(5, 1, { name: 'Public IP Addresses', count: count, path: 'publicip' }) + this.stats.splice(5, 1, { name: this.$t('label.public.ip.addresses'), count: count, path: 'publicip' }) }) this.listEvents() }, diff --git a/src/views/infra/InfraSummary.vue b/src/views/infra/InfraSummary.vue index c416bba..bffbb48 100644 --- a/src/views/infra/InfraSummary.vue +++ b/src/views/infra/InfraSummary.vue @@ -315,8 +315,8 @@ export default { <style lang="scss" scoped> .breadcrumb-card { - margin-left: -36px; - margin-right: -36px; + margin-left: -24px; + margin-right: -24px; margin-top: -16px; margin-bottom: 12px; }