diff --git a/client/src/components/Canvas/views/AdminTabs/MEDataEntry.jsx b/client/src/components/Canvas/views/AdminTabs/MEDataEntry.jsx index 25078b2..75afa54 100644 --- a/client/src/components/Canvas/views/AdminTabs/MEDataEntry.jsx +++ b/client/src/components/Canvas/views/AdminTabs/MEDataEntry.jsx @@ -1,5 +1,5 @@ import { useState } from 'react'; -import { Box, Button, ButtonGroup, Text, List, HStack, RadioGroup, Table, createListCollection } from "@chakra-ui/react" +import { Box, Button, ButtonGroup, Text, List, HStack, RadioGroup, Table, Checkbox, createListCollection } from "@chakra-ui/react" import DropDownMenu from "../../CanvasComponents/DropDownMenu" const startYear = 1970; @@ -38,9 +38,122 @@ const sections = createListCollection({ ], }) +// Sample entries for visual reference - remove before flight +const items = [ + { + id: "r1", + section: "Com", + volcano: "Nevado del Ruiz", + country: "COL", + start: "2024-01-15", + end: "2024-01-30", + type: "Training", + vpi10: "Yes", + downstream: 1200, + male: 600, + female: 600, + total: 1200, + }, + { + id: "r2", + section: "Gas", + volcano: "Etna", + country: "ITA", + start: "2024-02-01", + end: "2024-02-20", + type: "Assistance", + vpi10: "No", + downstream: 900, + male: 450, + female: 450, + total: 900, + }, + { + id: "r3", + section: "Eng", + volcano: "Kilauea", + country: "USA", + start: "2024-03-10", + end: "2024-03-25", + type: "Support", + vpi10: "Yes", + downstream: 2000, + male: 1000, + female: 1000, + total: 2000, + }, + { + id: "r4", + section: "Geophys", + volcano: "Fuji", + country: "JPN", + start: "2024-04-05", + end: "2024-04-18", + type: "Monitoring", + vpi10: "Yes", + downstream: 1500, + male: 700, + female: 800, + total: 1500, + }, + { + id: "r5", + section: "IT", + volcano: "Merapi", + country: "IDN", + start: "2024-05-02", + end: "2024-05-12", + type: "Deployment", + vpi10: "No", + downstream: 1100, + male: 550, + female: 550, + total: 1100, + }, + ]; + export function MEDataEntry() { - const [value, setValue] = useState("") - const [rows, setRows] = useState([]); + const [value, setValue] = useState(""); + // const [rows, setRows] = useState([]); + const [selection, setSelection] = useState([]); + const rows = items.map((item) => ( + + + { + setSelection((prev) => + changes.checked + ? [...prev, item.id] + : prev.filter((id) => id !== item.id ), + ); + }} + > + + + + + + + {item.section} + {item.volcano} + {item.country} + {item.start} + {item.end} + {item.type} + {item.vpi10} + {item.downstream} + {item.male} + {item.female} + {item.total} + + )) return( @@ -63,10 +176,11 @@ export function MEDataEntry() { - setValue(e.value)}> + {/* setValue(e.value)}> */} + {/* padding for checkboxes */} Section Volcano Country @@ -82,38 +196,10 @@ export function MEDataEntry() { - {rows.length === 0 ? ( - - - No data yet - - - ) : ( - rows.map((r) => ( - - - - - - - - {r.section} - {r.volcano} - {r.country} - {r.start} - {r.end} - {r.type} - {r.vpi10} - {r.downstream} - {r.male} - {r.female} - {r.total} - - ))) - } + {rows} - + {/* */} {/* Row actions aligned right */}