mirror of
https://git.roussel.pro/telecom-paris/pact.git
synced 2026-02-09 02:20:17 +01:00
hook stats
This commit is contained in:
26
code/interface_admin/hooks/stats.js
Normal file
26
code/interface_admin/hooks/stats.js
Normal file
@@ -0,0 +1,26 @@
|
||||
import { useEffect } from "react";
|
||||
import { api } from "../config/reviewsApi";
|
||||
|
||||
export default function useStats(limit, interval) {
|
||||
const [stats, setStats] = useState({});
|
||||
const [loading, setLoading] = useState(true);
|
||||
const [error, setError] = useState(false);
|
||||
|
||||
async function fetchData(limit, interval) {
|
||||
const response = await fetch("http://" + api.HOST + `/get_stats?interval=${interval}&limit=${limit}`)
|
||||
if(response.ok) {
|
||||
const data = await response.json();
|
||||
setStats(data);
|
||||
setError(false);
|
||||
}else {
|
||||
setError(true)
|
||||
}
|
||||
setLoading(false);
|
||||
}
|
||||
|
||||
useEffect(() => {
|
||||
fetchData(limit, interval);
|
||||
})
|
||||
|
||||
return {stats, loading, error};
|
||||
}
|
||||
@@ -6,11 +6,11 @@ import styles from "../styles/Home.module.css"
|
||||
|
||||
|
||||
export default function Home() {
|
||||
const [datasets, setDatasets] = useState([
|
||||
]);
|
||||
const [averages, setAverages] = useState([]);
|
||||
const [differences, setDifferences] = useState([]);
|
||||
const [datasets, setDatasets] = useState(null);
|
||||
const [averages, setAverages] = useState(null);
|
||||
const [differences, setDifferences] = useState(null);
|
||||
useEffect(() => {
|
||||
if (datasets) {
|
||||
let newAverages = []
|
||||
let newDifferences = []
|
||||
for (let i = 0; i < datasets.length; i++) {
|
||||
@@ -19,6 +19,7 @@ export default function Home() {
|
||||
}
|
||||
setAverages(newAverages);
|
||||
setDifferences(newDifferences);
|
||||
}
|
||||
}, [datasets]);
|
||||
|
||||
useEffect(() => setDatasets([
|
||||
@@ -26,7 +27,7 @@ export default function Home() {
|
||||
{ title: "Notes moyennes", current: [1, 2, 3, 4, 5, 6, 7], previous: [7, 6, 5, 4, 3, 2, 1] }
|
||||
]), []);
|
||||
function dataVisualizer(title, current, previous, average, difference) {
|
||||
return <>
|
||||
return <div key={title}>
|
||||
<h3>{title}</h3>
|
||||
<Card className={styles.averageCard}>
|
||||
<Card.Title>Moyenne</Card.Title>
|
||||
@@ -34,12 +35,12 @@ export default function Home() {
|
||||
<div
|
||||
className={styles.averageMainValue}
|
||||
>
|
||||
{Math.round(average*1e2)/1e2}
|
||||
{Math.round(average * 1e2) / 1e2}
|
||||
</div>
|
||||
<div
|
||||
className={[styles.averageCardSecondaryValue, difference >= 0 ? styles.averagePositive : styles.averageNegative].join(' ')}
|
||||
>
|
||||
{(difference >= 0 ? "+" : "-") + Math.round(difference*1e2)/1e2}
|
||||
{(difference >= 0 ? "+" : "-") + Math.round(difference * 1e2) / 1e2}
|
||||
</div>
|
||||
</Card.Body>
|
||||
</Card>
|
||||
@@ -51,7 +52,7 @@ export default function Home() {
|
||||
data1={previous}
|
||||
/>
|
||||
<hr />
|
||||
</>
|
||||
</div>
|
||||
}
|
||||
|
||||
return (
|
||||
@@ -64,7 +65,7 @@ export default function Home() {
|
||||
<Card>
|
||||
<Card.Header as="h2">Vos performances cette semaine</Card.Header>
|
||||
<Card.Body>
|
||||
{datasets.map((set, i) => dataVisualizer(set.title, set.current, set.previous, averages[i], differences[i]))}
|
||||
{datasets && averages && differences && datasets.map((set, i) => dataVisualizer(set.title, set.current, set.previous, averages[i], differences[i]))}
|
||||
</Card.Body>
|
||||
<div className='col col-12 col-lg-8 mx-auto'>
|
||||
</div>
|
||||
|
||||
Reference in New Issue
Block a user