Skip to content

Commit

Permalink
different fixes and features
Browse files Browse the repository at this point in the history
  • Loading branch information
JohanGrims committed Oct 18, 2024
1 parent 0e1dc3c commit a627b98
Show file tree
Hide file tree
Showing 8 changed files with 181 additions and 112 deletions.
2 changes: 1 addition & 1 deletion src/admin/Students.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -281,7 +281,7 @@ export default function Students() {
onClick={() => {
navigate(`/admin/students/${classId}/true`);
}}
></mdui-segmented-button>{" "}
></mdui-segmented-button>
<mdui-segmented-button
icon="delete"
onClick={() => classId && removeClass(classId)}
Expand Down
2 changes: 1 addition & 1 deletion src/admin/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -13,7 +13,7 @@ export default function Admin(props) {
const [authUser, setAuthUser] = React.useState(false);
const [loading, setLoading] = React.useState(true);

const [open, setOpen] = React.useState(true);
const [open, setOpen] = React.useState(window.innerWidth > 1024);

React.useEffect(() => {
const listen = onAuthStateChanged(auth, (user) => {
Expand Down
2 changes: 1 addition & 1 deletion src/admin/navigation/DrawerList.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -219,7 +219,7 @@ export default function DrawerList() {
active={active === "students"}
title={"SchülerInnen"}
icon={"people"}
onCLick={() => navigate("/admin/students")}
onCLick={() => navigate("/admin/students/add")}
/>

<br />
Expand Down
16 changes: 11 additions & 5 deletions src/admin/navigation/VoteDrawer.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -69,11 +69,17 @@ export default function VoteDrawer({}) {
flexDirection: "column",
}}
>
<DrawerItem
icon={"arrow_back"}
title={data?.title}
onCLick={() => navigate("/admin")}
/>
<mdui-tooltip
variant="rich"
headline="Zurück"
content="Kehren Sie zur Übersicht zurück."
>
<DrawerItem
icon={"arrow_back"}
title={data?.title}
onCLick={() => navigate("/admin")}
/>
</mdui-tooltip>
<mdui-divider></mdui-divider>
<br />
<mdui-tooltip
Expand Down
18 changes: 17 additions & 1 deletion src/admin/vote/Answers.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -9,6 +9,7 @@ import { confirm } from "mdui";
import React from "react";
import { useLoaderData } from "react-router-dom";
import { db } from "../../firebase";
import { useNavigate } from "react-router-dom";

export default function Answers() {
const { vote, options, answers } = useLoaderData();
Expand All @@ -19,6 +20,8 @@ export default function Answers() {

const grades = [...new Set(answers.map((answer) => answer.grade))];

const navigate = useNavigate();

React.useEffect(() => {
if (search) {
const query = search.toLowerCase();
Expand All @@ -38,7 +41,18 @@ export default function Answers() {

return (
<div className="mdui-prose">
<h2>Antworten</h2>
<div
style={{
display: "flex",
justifyContent: "space-between",
}}
>
<h2>Antworten</h2>
<mdui-chip onClick={() => navigate("../match")}>
Mit Klassenlisten abgleichen
</mdui-chip>
</div>
<br />
<mdui-radio-group value={mode}>
<mdui-radio value="by-option" onClick={() => setMode("by-option")}>
Nach Erstwahl
Expand All @@ -50,6 +64,8 @@ export default function Answers() {
Nach Name
</mdui-radio>
</mdui-radio-group>
<br />

<p />
{mode === "by-option" && (
<mdui-tabs
Expand Down
192 changes: 129 additions & 63 deletions src/admin/vote/Match.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -10,76 +10,142 @@ export default function Match() {
choices: any[];
};

const [mode, setMode] = React.useState("database");

const sortedClasses = classes.sort((a, b) => a.grade - b.grade);

return (
<div className="mdui-prose">
<h2>Abgleichen</h2>
<mdui-tabs value={sortedClasses[0].id}>
{sortedClasses.map((c) => (
<mdui-tab value={c.id}>
Klasse {c.grade}
<mdui-badge>{c.students.length}</mdui-badge>
</mdui-tab>
))}
<p />
{sortedClasses.map((c) => (
<mdui-tab-panel slot="panel" value={c.id}>
<div style={{ padding: "10px" }}>
<div className="mdui-table">
<table>
<thead>
<tr>
<th>Name</th>
<th>#</th>
<th>Name</th>
</tr>
</thead>
<tbody>
{c.students.map((s) => (
<mdui-radio-group value={mode}>
<mdui-radio value="database" onClick={() => setMode("database")}>
Datenbank
</mdui-radio>
<mdui-radio value="answers" onClick={() => setMode("answers")}>
Antworten
</mdui-radio>
</mdui-radio-group>

{mode === "database" && (
<mdui-tabs value={sortedClasses[0].id}>
{sortedClasses.map((c) => (
<mdui-tab value={c.id}>
Klasse {c.grade}
<mdui-badge>{c.students.length}</mdui-badge>
</mdui-tab>
))}
<p />
{sortedClasses.map((c) => (
<mdui-tab-panel slot="panel" value={c.id}>
<div style={{ padding: "10px" }}>
<div className="mdui-table">
<table>
<thead>
<tr>
<td>{s.name}</td>
<td>{s.listIndex}</td>
<td>
<Link
to={`../answers?search=${
choices.filter(
(choice) =>
choice.listIndex === s.listIndex.toString() &&
choice.grade === c.grade.toString()
)[0]?.id
}`}
>
{
choices.filter(
(choice) =>
choice.listIndex === s.listIndex.toString() &&
choice.grade === c.grade.toString()
)[0]?.name
}
</Link>
{choices.filter(
(choice) =>
choice.listIndex === s.listIndex.toString() &&
choice.grade === c.grade.toString()
).length > 1 &&
" + " +
(choices.filter(
(choice) =>
choice.listIndex === s.listIndex.toString() &&
choice.grade === c.grade.toString()
).length -
1) +
" weitere"}{" "}
</td>
<th>Name</th>
<th>#</th>
<th>Name</th>
</tr>
))}
</tbody>
</table>
</thead>
<tbody>
{c.students.map((s) => (
<tr>
<td>{s.name}</td>
<td>{s.listIndex}</td>
<td>
<Link
to={`../answers?search=${
choices.filter(
(choice) =>
choice.listIndex ===
s.listIndex.toString() &&
choice.grade === c.grade.toString()
)[0]?.id
}`}
>
{
choices.filter(
(choice) =>
choice.listIndex ===
s.listIndex.toString() &&
choice.grade === c.grade.toString()
)[0]?.name
}
</Link>
{choices.filter(
(choice) =>
choice.listIndex === s.listIndex.toString() &&
choice.grade === c.grade.toString()
).length > 1 &&
" + " +
(choices.filter(
(choice) =>
choice.listIndex ===
s.listIndex.toString() &&
choice.grade === c.grade.toString()
).length -
1) +
" weitere"}{" "}
</td>
</tr>
))}
</tbody>
</table>
</div>
</div>
</div>
</mdui-tab-panel>
))}
</mdui-tabs>
</mdui-tab-panel>
))}
</mdui-tabs>
)}

{mode === "answers" && (
<div>
<div className="mdui-table">
<table>
<thead>
<tr>
<th>Name</th>
<th>#</th>
<th>Klasse</th>
<th>Name</th>
</tr>
</thead>
<tbody>
{choices
.sort((a, b) => {
if (a.grade === b.grade) {
return a.listIndex - b.listIndex;
}
return a.grade - b.grade;
})
.map((choice) => (
<tr key={choice.id}>
<td>
<Link to={`../answers?search=${choice.id}`}>
{choice.name}
</Link>
</td>
<td>{choice.listIndex}</td>
<td>{choice.grade}</td>
<td>
{
sortedClasses
.find(
(c) => Number(c.grade) === Number(choice.grade)
)
?.students.find(
(s) =>
Number(s.listIndex) === Number(choice.listIndex)
)?.name
}
</td>
</tr>
))}
</tbody>
</table>
</div>
</div>
)}
</div>
);
}
Expand Down
59 changes: 20 additions & 39 deletions src/admin/vote/index.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -11,27 +11,23 @@ export default function AdminVote() {
<div className="mdui-prose">
<div style={{ display: "flex", justifyContent: "space-between" }}>
<h2>{vote.title}</h2>
<mdui-tooltip
variant="rich"
headline="Status"
content={`Diese Wahl ist ${
vote.active && vote.endTime.seconds * 1000 > Date.now()
? vote.startTime.seconds * 1000 < Date.now()
? "aktiv"
: "geplant"
: "beendet"
}.`}
>
<mdui-icon
name={
vote.active && vote.endTime.seconds * 1000 > Date.now()
? vote.startTime.seconds * 1000 < Date.now()
? "event_available"
: "event"
: "done_all"
}
></mdui-icon>
</mdui-tooltip>
<mdui-chip onClick={() => navigate("./schedule")}>
{!vote.active
? "Nicht aktiv"
: `${new Date(vote.startTime.seconds * 1000).toLocaleString([], {
hour: "2-digit",
minute: "2-digit",
day: "2-digit",
month: "2-digit",
year: "numeric",
})} - ${new Date(vote.endTime.seconds * 1000).toLocaleString([], {
hour: "2-digit",
minute: "2-digit",
day: "2-digit",
month: "2-digit",
year: "numeric",
})}`}
</mdui-chip>
</div>
<p />
<div
Expand Down Expand Up @@ -94,26 +90,11 @@ export default function AdminVote() {
variant="filled"
style={{ padding: "20px", flex: 1 }}
clickable
onClick={() => navigate(`/admin/${vote.id}/schedule`)}
onClick={() => navigate(`/admin/${vote.id}/match`)}
>
<h3>
{vote.active && vote.endTime.seconds * 1000 > Date.now()
? vote.startTime.seconds * 1000 < Date.now()
? "Beenden"
: "Planen"
: "Starten"}
</h3>
<h3>Abgleichen</h3>
<p style={{ fontSize: "50px" }}>
<mdui-icon
name={
vote.active && vote.endTime.seconds * 1000 > Date.now()
? vote.startTime.seconds * 1000 < Date.now()
? "pause"
: "scheduled"
: "play_arrow"
}
style={{ fontSize: "50px" }}
/>
<mdui-icon name={"fact_check"} style={{ fontSize: "50px" }} />
</p>
</mdui-card>
<mdui-card
Expand Down
2 changes: 1 addition & 1 deletion src/main.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -83,7 +83,7 @@ const routes = [
element: <NewVote />,
},
{
path: "students/:classId?/:edit?",
path: "students/:classId/:edit?",
element: <Students />,
loader: studentsLoader,
},
Expand Down

0 comments on commit a627b98

Please sign in to comment.