Cześć, robię aplikację i muszę pobrać tam dane z ostatniej godziny. Teraz mam ustawione na jeden dzień i nie wiem jak to przekształcić. Czy mógłby ktoś podpowiedzieć? Chodzi o tą linijkę i jedynkę na końcu:
const response = await fetch(`${serverConfig.serverUrl}data/${i}/1`, {
A tu cały kod:
import './DeviceState.css';
import {useState, useEffect} from "react";
import serverConfig from "../server-config";
import DevicesState from "./DevicesState";
import {sortElemsByDeviceId} from "../utils/helper";
import Loader from "./shared/Loader";
import {DataModel} from "../models/data.model";
import Charts from './Charts';
function Home() {
const [additionalData, setAdditionalData] = useState<DataModel[] | null>(null);
const [loaderChart, setLoaderChart] = useState(true);
const [lastItem, setLastItem] = useState<DataModel | null>(null);
const [data, setData] = useState<DataModel[] | null>(null);
const [loaderState, setLoaderState] = useState(true);
useEffect(() => {
fetchData();
fetchAdditionalData();
}, []);
const fetchAdditionalData = async () => {
setLoaderChart(true);
const allData = [];
try {
for (let i = 1; i <= 16; i++) {
const response = await fetch(`${serverConfig.serverUrl}data/${i}/1`, {
method: "GET",
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
'x-auth-token': localStorage.getItem('token') || ''
}
});
if (!response.ok) {
throw new Error(`HTTP error! Status: ${response.status}`);
}
const data = await response.json();
allData.push(data);
}
// Example: Set last item and additional data
if (allData.length > 0) {
setLastItem(allData[allData.length - 1][allData[allData.length - 1].length - 1]);
setAdditionalData(allData.flat()); // Flatten array if needed
}
setLoaderChart(false);
} catch (error) {
console.error('Error fetching additional data:', error);
}
};
const fetchData = () => {
setLoaderState(true);
fetch(`${serverConfig.serverUrl}data/latest`)
.then(response => response.json())
.then(data => {
setData(sortElemsByDeviceId(data));
setLoaderState(false)
})
.catch(error => {
console.error('Error fetching data:', error);
});
};
return (
<>
<div style={{
display: 'flex',
flexDirection: 'column', // Ustawienie układu w kolumnie
alignItems: 'center',
justifyContent: "center",
borderBottom: '10px solid #fff',
padding: '50px'
}}>
<div style={{ marginBottom: '20px' }}>
{loaderChart && <Loader />}
{!loaderChart && additionalData && <Charts data={additionalData} />} {/* Wykres, jeśli dane są dostępne */}
</div>
</div>
<div style={{ display: 'flex', justifyContent: 'center', width: '100%' }}>
{loaderState && <Loader />}
{!loaderState && data && <DevicesState data={data} />}
</div>
</>
)
}
export default Home;