Team4388/ScoutingApp2022
1
0
Fork 0
mirror of https://github.com/Team4388/ScoutingApp2022.git synced 2026-06-09 08:48:05 -06:00
Code Issues Packages Projects Releases Wiki Activity

re-render on pdb update

Browse Source
This commit is contained in:
Evan Lanham
2022-03-14 16:17:39 -06:00
parent d32bf23dd3
commit f7e82d1f5a
5 changed files with 152 additions and 137 deletions
Download Patch File Download Diff File Expand all files Collapse all files
webserver/src/Pages/DashboardPage/DashboardPage.jsx
+40 -21
View File
@@ -1,35 +1,50 @@
import React from "react";
import { useLocalDb } from "../../DbContext";
import { useProcessedDataBucket } from "../../ProcessedDataBucketContext";
import { ProcessedDataBucketContext, useProcessedDataBucket } from "../../ProcessedDataBucketContext";
import Chart from "react-apexcharts";
import { DataGrid } from "@mui/x-data-grid";
import { Box } from "@mui/material";
const DashboardPage = () => {
//https://react-charts.js.org/examples/column
const pdb = useProcessedDataBucket();
const makePieChartData = (pdb, team_num) => {
// console.log(team_num);
// console.log(pdb.teamData);
return {
labels: ["None", "Low", "Mid", "High", "Transversal"],
datasets: [
{
label: "Climbs",
data: pdb.teamData[4388].climb_counts,
backgroundColor: ["rgba(230,20,20)", "rgba(230,150,20)", "rgba(160,220,20)", "rgba(20,230,70)", "rgba(20,200,180)"],
},
],
};
};
console.log(pdb);
// <ProcessedDataBucketContext.Consumer>
{
/* {(pdbCtx) => { */
}
// const pdb = useProcessedDataBucket().processedDataBucket;
// const makePieChartData = (pdb, team_num) => {
// // console.log(team_num);
// // console.log(pdb.teamData);
// return {
// labels: ["None", "Low", "Mid", "High", "Transversal"],
// datasets: [
// {
// label: "Climbs",
// data: pdb.teamData[4388].climb_counts,
// backgroundColor: ["rgba(230,20,20)", "rgba(230,150,20)", "rgba(160,220,20)", "rgba(20,230,70)", "rgba(20,200,180)"],
// },
// ],
// };
// };
let { processedDataBucket, setProcessedDataBucket } = useProcessedDataBucket();
console.log(processedDataBucket);
if (processedDataBucket == null) {
return <div />;
}
// const { processedDataBucket, setProcessedDataBucket } = pdbCtx;
// console.log(pdbCtx);
//format data for the data grid
let grid_data = [];
//turns the values of the key value pairs in the list into an array
let team_data_array = Object.values(pdb.teamData);
console.log(processedDataBucket.teamData);
let team_data_array = Object.values(processedDataBucket.teamData);
// let team_data_array = Array.from(processedDataBucket.teamData);
const roundPlaces = (n, d) => Math.round(n * Math.pow(10, d)) / Math.pow(10, d);
team_data_array.forEach((value, index, array) => {
// team_data_array.forEach((value, index, array) => {
for (const property in processedDataBucket.teamData) {
console.log(property);
let value = processedDataBucket.teamData[property];
console.log(value);
grid_data.push({
id: value.team_number,
average_auto_points: roundPlaces(value.average_auto_points, 2),
@@ -37,7 +52,8 @@ const DashboardPage = () => {
average_climb_points: roundPlaces(value.average_climb_points, 2),
average_total_match_points: roundPlaces(value.average_total_match_points, 2),
});
});
}
// });
console.log(grid_data);
return (
@@ -60,6 +76,7 @@ const DashboardPage = () => {
// { field: "matched_played", headerName: "Matches", width: 100 },
]}
checkboxSelection
pageSize={15}
rowsPerPageOptions={[15]}
/>
</Box>
@@ -77,6 +94,8 @@ const DashboardPage = () => {
/> */}
</div>
);
//}}
// </ProcessedDataBucketContext.Consumer>
};
export default DashboardPage;