This is an automated email from the ASF dual-hosted git repository.
joao pushed a commit to branch 4.20
in repository https://gitbox.apache.org/repos/asf/cloudstack.git
The following commit(s) were added to refs/heads/4.20 by this push:
new e57a82a4f52 UI: Fixes in the Usage UI (#10000)
e57a82a4f52 is described below
commit e57a82a4f52593d7c1885e261a431203cc31aa72
Author: Bernardo De Marco Gonçalves <[email protected]>
AuthorDate: Mon Dec 9 14:25:03 2024 -0300
UI: Fixes in the Usage UI (#10000)
* fixes on usage ui
* dont call API when caller does not have access to it
* handle when lastheartbeat is undefined
* hide last collection datetime when lastheartbeat is undefined
* apply Pearl's suggestions
Co-authored-by: Pearl Dsilva <[email protected]>
* apply Pearl's suggestions
Co-authored-by: Pearl Dsilva <[email protected]>
* apply Pearl's suggestions
Co-authored-by: Pearl Dsilva <[email protected]>
* apply Pearl's suggestions
Co-authored-by: Pearl Dsilva <[email protected]>
* apply Pearl's suggestions
Co-authored-by: Pearl Dsilva <[email protected]>
---------
Co-authored-by: Pearl Dsilva <[email protected]>
---
ui/public/locales/en.json | 1 +
ui/src/components/view/ListView.vue | 2 +-
ui/src/views/infra/UsageRecords.vue | 21 ++++++++++++++++-----
3 files changed, 18 insertions(+), 6 deletions(-)
diff --git a/ui/public/locales/en.json b/ui/public/locales/en.json
index d56ab379b3f..c89b8746e54 100644
--- a/ui/public/locales/en.json
+++ b/ui/public/locales/en.json
@@ -1528,6 +1528,7 @@
"label.networkspeed": "Network speed",
"label.networktype": "Network type",
"label.networkwrite": "Network write",
+"label.never": "Never",
"label.new": "New",
"label.new.autoscale.vmgroup": "New AutoScaling Group",
"label.new.instance.group": "New Instance group",
diff --git a/ui/src/components/view/ListView.vue
b/ui/src/components/view/ListView.vue
index 032985c730e..848edb534ee 100644
--- a/ui/src/components/view/ListView.vue
+++ b/ui/src/components/view/ListView.vue
@@ -26,7 +26,7 @@
:rowSelection="explicitlyAllowRowSelection || enableGroupAction() ||
$route.name === 'event' ? {selectedRowKeys: selectedRowKeys, onChange:
onSelectChange, columnWidth: 30} : null"
:rowClassName="getRowClassName"
@resizeColumn="handleResizeColumn"
- style="overflow-y: auto"
+ :style="{ 'overflow-y': this.$route.name === 'usage' ? 'hidden' : 'auto' }"
>
<template #customFilterDropdown>
<div style="padding: 8px" class="filter-dropdown">
diff --git a/ui/src/views/infra/UsageRecords.vue
b/ui/src/views/infra/UsageRecords.vue
index 735d91c5b8a..16ff9b5dd13 100644
--- a/ui/src/views/infra/UsageRecords.vue
+++ b/ui/src/views/infra/UsageRecords.vue
@@ -50,6 +50,7 @@
<a-row justify="end">
<a-col>
<tooltip-button
+ v-if="'generateUsageRecords' in $store.getters.apis"
type="primary"
icon="hdd-outlined"
:tooltip="$t('label.usage.records.generate')"
@@ -58,6 +59,7 @@
</a-col>
<a-col>
<tooltip-button
+ v-if="'removeRawUsageRecords' in $store.getters.apis"
type="danger"
icon="delete-outlined"
:tooltip="$t('label.usage.records.purge')"
@@ -70,7 +72,7 @@
</a-card>
</a-affix>
<a-col>
- <a-card size="small" :loading="serverMetricsLoading">
+ <a-card size="small" :loading="serverMetricsLoading"
v-if="'listUsageServerMetrics' in $store.getters.apis">
<a-row justify="space-around">
<a-card-grid style="width: 30%; text-align: center; font-size: small;">
<a-statistic
@@ -86,10 +88,10 @@
<a-card-grid style="width: 35%; text-align: center; font-size: small;">
<a-statistic
:title="$t('label.lastheartbeat')"
- :value="$toLocaleDate(serverStats.lastheartbeat)"
+ :value="serverStats.lastheartbeat ?
$toLocaleDate(serverStats.lastheartbeat) : $t('label.never')"
valueStyle="font-size: medium"
/>
- <a-card-meta :description="getTimeSince(serverStats.collectiontime)"
/>
+ <a-card-meta v-if="!!serverStats.lastheartbeat"
:description="getTimeSince(serverStats.collectiontime)" />
</a-card-grid>
<a-card-grid style="width: 35%; text-align: center; font-size: small;">
<a-statistic
@@ -159,7 +161,7 @@
/>
</a-form-item>
</a-col>
- <a-col :span="3">
+ <a-col :span="3" v-if="'listUsageTypes' in $store.getters.apis">
<a-form-item
ref="type"
name="type"
@@ -173,7 +175,7 @@
/>
</a-form-item>
</a-col>
- <a-col :span="3">
+ <a-col :span="3" v-if="'listUsageTypes' in $store.getters.apis">
<a-form-item
ref="id"
name="id"
@@ -501,6 +503,11 @@ export default {
}
},
listUsageServerMetrics () {
+ if (!('listUsageServerMetrics' in this.$store.getters.apis)) {
+ this.serverMetricsLoading = false
+ return
+ }
+
this.serverMetricsLoading = true
api('listUsageServerMetrics').then(json => {
this.stats = []
@@ -637,6 +644,10 @@ export default {
})
},
getUsageTypes () {
+ if (!('listUsageTypes' in this.$store.getters.apis)) {
+ return
+ }
+
api('listUsageTypes').then(json => {
if (json && json.listusagetypesresponse &&
json.listusagetypesresponse.usagetype) {
this.usageTypes = [{ id: null, value: '' },
...json.listusagetypesresponse.usagetype.map(x => {
