jjkiers/cloudron-box
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

graphs: make intervalSecs configurable

Browse Source 
for smaller durations, we need more granularity
This commit is contained in:
Girish Ramakrishnan
2025-07-04 21:37:37 +02:00
parent a98fce2160
commit 9377701ad1
2 changed files with 16 additions and 16 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dashboard/src/components/app/Graphs.vue
+8 -8
View File
@@ -17,13 +17,13 @@ const appsModel = AppsModel.create();
const systemModel = SystemModel.create();
const periods = [
{ hours: 0, label: t('app.graphs.period.live'), format: 'hh:mm A', tooltipFormat: 'hh:mm:ss A' },
{ hours: 1, label: t('app.graphs.period.1h'), format: 'hh:mm A', tooltipFormat: 'hh:mm:ss A' },
{ hours: 6, label: t('app.graphs.period.6h'), format: 'hh:mm A', tooltipFormat: 'hh:mm A' },
{ hours: 12, label: t('app.graphs.period.12h'), format: 'hh:mm A', tooltipFormat: 'hh:mm A' },
{ hours: 24, label: t('app.graphs.period.24h'), format: 'hh:mm A', tooltipFormat: 'hh:mm A' },
{ hours: 24*7, label: t('app.graphs.period.7d'), format: 'DD MMM', tooltipFormat: 'DD MMM hh:mm A' },
{ hours: 24*30, label: t('app.graphs.period.30d'), format: 'DD MMM', tooltipFormat: 'DD MMM hh:mm A' },
{ hours: 0, label: t('app.graphs.period.live'), tickFormat: 'hh:mm A', tooltipFormat: 'hh:mm:ss A' },
{ hours: 1, intervalSecs: 20, label: t('app.graphs.period.1h'), tickFormat: 'hh:mm A', tooltipFormat: 'hh:mm:ss A' }, // 180 points
{ hours: 6, intervalSecs: 60, label: t('app.graphs.period.6h'), tickFormat: 'hh:mm A', tooltipFormat: 'hh:mm A' },
{ hours: 12, intervalSecs: 240, label: t('app.graphs.period.12h'), tickFormat: 'hh:mm A', tooltipFormat: 'hh:mm A' },
{ hours: 24, intervalSecs: 480, label: t('app.graphs.period.24h'), tickFormat: 'hh:mm A', tooltipFormat: 'hh:mm A' },
{ hours: 24*7, intervalSecs: 960, label: t('app.graphs.period.7d'), tickFormat: 'DD MMM', tooltipFormat: 'DD MMM hh:mm A' },
{ hours: 24*30, intervalSecs: 960, label: t('app.graphs.period.30d'), tickFormat: 'DD MMM', tooltipFormat: 'DD MMM hh:mm A' }, // 2700 points
];
const busy = ref(true);
@@ -69,7 +69,7 @@ async function onPeriodChange() {
if (period.value.hours === 0) return await liveRefresh();
const [error, metrics] = await appsModel.getMetrics(app.id, { fromSecs: period.value.hours * 60 * 60, intervalSecs: 300 });
const [error, metrics] = await appsModel.getMetrics(app.id, { fromSecs: period.value.hours * 60 * 60, intervalSecs: period.value.intervalSecs });
if (error) return console.error(error);
cpuGraphItem.value.setData(metrics.cpu);