anobre/openshift-resource-governance
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Fix: correct dropdown order and add day format for 7d/30d charts

Browse Source
This commit is contained in:
Anderson
2025-10-03 09:57:19 -03:00
parent 6c2821609c
commit 958e76f513
1 changed files with 38 additions and 22 deletions
Download Patch File Download Diff File Expand all files Collapse all files

60
app/static/index.html
View File

@@ -1403,13 +1403,13 @@
</button>
</li>
<li>
<button class="pf-v6-c-dropdown__menu-item pf-m-selected" onclick="selectTimeRange('24h', 'Last 24 Hours')">
Last 24 Hours
<button class="pf-v6-c-dropdown__menu-item" onclick="selectTimeRange('6h', 'Last 6 Hours')">
Last 6 Hours
</button>
</li>
<li>
<button class="pf-v6-c-dropdown__menu-item" onclick="selectTimeRange('6h', 'Last 6 Hours')">
Last 6 Hours
<button class="pf-v6-c-dropdown__menu-item pf-m-selected" onclick="selectTimeRange('24h', 'Last 24 Hours')">
Last 24 Hours
</button>
</li>
<li>
@@ -2730,8 +2730,8 @@
// Create charts after DOM is updated
setTimeout(() => {
createCPUChart(cpuChartId, cpuData);
createMemoryChart(memoryChartId, memoryData);
createCPUChart(cpuChartId, cpuData, timeRange);
createMemoryChart(memoryChartId, memoryData, timeRange);
}, 100);
}
@@ -2905,7 +2905,7 @@
};
}
function createCPUChart(containerId, cpuData) {
function createCPUChart(containerId, cpuData, timeRange = '24h') {
const container = document.getElementById(containerId);
if (!container) return;
@@ -2951,13 +2951,21 @@
tickLabels: { fill: '#FFFFFF', fontSize: 12 },
grid: { stroke: '#404040' }
},
tickFormat: (t) => {
const date = new Date(t);
return date.toLocaleTimeString('pt-BR', {
hour: '2-digit',
minute: '2-digit'
});
}
tickFormat: (t) => {
const date = new Date(t);
// Check if we're dealing with days (7d or 30d)
if (timeRange === '7d' || timeRange === '30d') {
return date.toLocaleDateString('pt-BR', {
day: '2-digit',
month: '2-digit'
});
} else {
return date.toLocaleTimeString('pt-BR', {
hour: '2-digit',
minute: '2-digit'
});
}
}
}),
React.createElement(Victory.VictoryLine, {
key: 'cpu-line',
@@ -2989,7 +2997,7 @@
ReactDOM.render(chart, container);
}
function createMemoryChart(containerId, memoryData) {
function createMemoryChart(containerId, memoryData, timeRange = '24h') {
const container = document.getElementById(containerId);
if (!container) return;
@@ -3035,13 +3043,21 @@
tickLabels: { fill: '#FFFFFF', fontSize: 12 },
grid: { stroke: '#404040' }
},
tickFormat: (t) => {
const date = new Date(t);
return date.toLocaleTimeString('pt-BR', {
hour: '2-digit',
minute: '2-digit'
});
}
tickFormat: (t) => {
const date = new Date(t);
// Check if we're dealing with days (7d or 30d)
if (timeRange === '7d' || timeRange === '30d') {
return date.toLocaleDateString('pt-BR', {
day: '2-digit',
month: '2-digit'
});
} else {
return date.toLocaleTimeString('pt-BR', {
hour: '2-digit',
minute: '2-digit'
});
}
}
}),
React.createElement(Victory.VictoryLine, {
key: 'memory-line',