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

This commit is contained in:
2025-10-03 09:57:19 -03:00
parent 6c2821609c
commit 958e76f513

View File

@@ -1403,13 +1403,13 @@
</button> </button>
</li> </li>
<li> <li>
<button class="pf-v6-c-dropdown__menu-item pf-m-selected" onclick="selectTimeRange('24h', 'Last 24 Hours')"> <button class="pf-v6-c-dropdown__menu-item" onclick="selectTimeRange('6h', 'Last 6 Hours')">
Last 24 Hours Last 6 Hours
</button> </button>
</li> </li>
<li> <li>
<button class="pf-v6-c-dropdown__menu-item" onclick="selectTimeRange('6h', 'Last 6 Hours')"> <button class="pf-v6-c-dropdown__menu-item pf-m-selected" onclick="selectTimeRange('24h', 'Last 24 Hours')">
Last 6 Hours Last 24 Hours
</button> </button>
</li> </li>
<li> <li>
@@ -2730,8 +2730,8 @@
// Create charts after DOM is updated // Create charts after DOM is updated
setTimeout(() => { setTimeout(() => {
createCPUChart(cpuChartId, cpuData); createCPUChart(cpuChartId, cpuData, timeRange);
createMemoryChart(memoryChartId, memoryData); createMemoryChart(memoryChartId, memoryData, timeRange);
}, 100); }, 100);
} }
@@ -2905,7 +2905,7 @@
}; };
} }
function createCPUChart(containerId, cpuData) { function createCPUChart(containerId, cpuData, timeRange = '24h') {
const container = document.getElementById(containerId); const container = document.getElementById(containerId);
if (!container) return; if (!container) return;
@@ -2953,11 +2953,19 @@
}, },
tickFormat: (t) => { tickFormat: (t) => {
const date = new Date(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', { return date.toLocaleTimeString('pt-BR', {
hour: '2-digit', hour: '2-digit',
minute: '2-digit' minute: '2-digit'
}); });
} }
}
}), }),
React.createElement(Victory.VictoryLine, { React.createElement(Victory.VictoryLine, {
key: 'cpu-line', key: 'cpu-line',
@@ -2989,7 +2997,7 @@
ReactDOM.render(chart, container); ReactDOM.render(chart, container);
} }
function createMemoryChart(containerId, memoryData) { function createMemoryChart(containerId, memoryData, timeRange = '24h') {
const container = document.getElementById(containerId); const container = document.getElementById(containerId);
if (!container) return; if (!container) return;
@@ -3037,11 +3045,19 @@
}, },
tickFormat: (t) => { tickFormat: (t) => {
const date = new Date(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', { return date.toLocaleTimeString('pt-BR', {
hour: '2-digit', hour: '2-digit',
minute: '2-digit' minute: '2-digit'
}); });
} }
}
}), }),
React.createElement(Victory.VictoryLine, { React.createElement(Victory.VictoryLine, {
key: 'memory-line', key: 'memory-line',