mirror of
https://github.com/aaronleetw/savage-tracking.git
synced 2024-11-14 19:11:39 -08:00
fixed structure, added dashboard header format
This commit is contained in:
parent
4fd2900f5b
commit
af65bb7191
3 changed files with 65 additions and 53 deletions
|
@ -3,7 +3,7 @@ import { useRouter } from "next/navigation";
|
||||||
import { useEffect } from "react";
|
import { useEffect } from "react";
|
||||||
import { api } from "~/utils/api";
|
import { api } from "~/utils/api";
|
||||||
|
|
||||||
export default function DashboardHeader() {
|
export default function DashboardHeader({ url }: { url: string }) {
|
||||||
const { push } = useRouter();
|
const { push } = useRouter();
|
||||||
const session = api.admin.session.useQuery();
|
const session = api.admin.session.useQuery();
|
||||||
const logout = api.admin.logout.useMutation();
|
const logout = api.admin.logout.useMutation();
|
||||||
|
@ -15,7 +15,8 @@ export default function DashboardHeader() {
|
||||||
}, [logout.isSuccess])
|
}, [logout.isSuccess])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="text-3xl md:text-5xl font-bold bg-indigo-100 p-5 pb-0">
|
<div className="text-3xl md:text-5xl font-bold bg-indigo-100">
|
||||||
|
<div className="p-5 pb-0">
|
||||||
<div className="flex items-center w-full mb-3">
|
<div className="flex items-center w-full mb-3">
|
||||||
<img className="h-16 md:h-24 m-2" src="/favicon.png" alt="" />
|
<img className="h-16 md:h-24 m-2" src="/favicon.png" alt="" />
|
||||||
<div>
|
<div>
|
||||||
|
@ -27,13 +28,19 @@ export default function DashboardHeader() {
|
||||||
</button>
|
</button>
|
||||||
</div>
|
</div>
|
||||||
<div className="flex items-center w-full gap-3">
|
<div className="flex items-center w-full gap-3">
|
||||||
<Link href="/dash/time">
|
<Link href="/dash">
|
||||||
<button className="text-xl bg-sky-600 px-3 py-2 rounded-lg rounded-b-none text-white focus:ring focus:ring-sky-200 focus:ring-opacity-70 disabled:bg-sky-400" disabled={logout.isLoading}>
|
<button className={[
|
||||||
|
"text-xl px-3 py-2 rounded-lg rounded-b-none focus:ring focus:ring-sky-200 focus:ring-opacity-70",
|
||||||
|
url == "/dash" ? "bg-sky-600 text-white" : "bg-sky-300 text-black"
|
||||||
|
].join(" ")}>
|
||||||
Time Selection
|
Time Selection
|
||||||
</button>
|
</button>
|
||||||
</Link>
|
</Link>
|
||||||
<Link href="/dash/chgPassword">
|
<Link href="/dash/chgPassword">
|
||||||
<button className="text-xl bg-sky-600 px-3 py-2 rounded-lg rounded-b-none text-white focus:ring focus:ring-sky-200 focus:ring-opacity-70 disabled:bg-sky-400" disabled={logout.isLoading}>
|
<button className={[
|
||||||
|
"text-xl px-3 py-2 rounded-lg rounded-b-none focus:ring focus:ring-sky-200 focus:ring-opacity-70",
|
||||||
|
url == "/dash/chgPassword" ? "bg-sky-600 text-white" : "bg-sky-300 text-black"
|
||||||
|
].join(" ")}>
|
||||||
Change Password
|
Change Password
|
||||||
</button>
|
</button>
|
||||||
</Link>
|
</Link>
|
||||||
|
@ -41,17 +48,26 @@ export default function DashboardHeader() {
|
||||||
session?.data?.isAdmin && (
|
session?.data?.isAdmin && (
|
||||||
<>
|
<>
|
||||||
<Link href="/dash/admin">
|
<Link href="/dash/admin">
|
||||||
<button className="text-xl bg-emerald-600 px-3 py-2 rounded-lg rounded-b-none text-white focus:ring focus:ring-emerald-200 focus:ring-opacity-70 disabled:bg-emerald-400" disabled={logout.isLoading}>
|
<button className={[
|
||||||
|
"text-xl px-3 py-2 rounded-lg rounded-b-none focus:ring focus:ring-emerald-200 focus:ring-opacity-70",
|
||||||
|
url == "/dash/admin" ? "bg-emerald-600 text-white" : "bg-emerald-200 text-black"
|
||||||
|
].join(" ")}>
|
||||||
Admin
|
Admin
|
||||||
</button>
|
</button>
|
||||||
</Link>
|
</Link>
|
||||||
<Link href="/dash/admin/roster">
|
<Link href="/dash/admin/roster">
|
||||||
<button className="text-xl bg-emerald-600 px-3 py-2 rounded-lg rounded-b-none text-white focus:ring focus:ring-emerald-200 focus:ring-opacity-70 disabled:bg-emerald-400" disabled={logout.isLoading}>
|
<button className={[
|
||||||
|
"text-xl px-3 py-2 rounded-lg rounded-b-none focus:ring focus:ring-emerald-200 focus:ring-opacity-70",
|
||||||
|
url == "/dash/admin/roster" ? "bg-emerald-600 text-white" : "bg-emerald-200 text-black"
|
||||||
|
].join(" ")}>
|
||||||
Print Roster
|
Print Roster
|
||||||
</button>
|
</button>
|
||||||
</Link>
|
</Link>
|
||||||
<Link href="/dash/admin/rfid">
|
<Link href="/dash/admin/rfid">
|
||||||
<button className="text-xl bg-emerald-600 px-3 py-2 rounded-lg rounded-b-none text-white focus:ring focus:ring-emerald-200 focus:ring-opacity-70 disabled:bg-emerald-400" disabled={logout.isLoading}>
|
<button className={[
|
||||||
|
"text-xl px-3 py-2 rounded-lg rounded-b-none focus:ring focus:ring-emerald-200 focus:ring-opacity-70",
|
||||||
|
url == "/dash/admin/rfid" ? "bg-emerald-600 text-white" : "bg-emerald-200 text-black"
|
||||||
|
].join(" ")}>
|
||||||
RFID Log
|
RFID Log
|
||||||
</button>
|
</button>
|
||||||
</Link>
|
</Link>
|
||||||
|
@ -59,5 +75,10 @@ export default function DashboardHeader() {
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
|
<div className={[
|
||||||
|
"w-full h-2",
|
||||||
|
url.startsWith("/dash/admin") ? "bg-emerald-600" : "bg-sky-600"
|
||||||
|
].join(" ")}></div>
|
||||||
</div>)
|
</div>)
|
||||||
}
|
}
|
|
@ -24,7 +24,7 @@ export default function Dash() {
|
||||||
<link rel="icon" href="/favicon.png" />
|
<link rel="icon" href="/favicon.png" />
|
||||||
</Head>
|
</Head>
|
||||||
<main className="">
|
<main className="">
|
||||||
<DashboardHeader />
|
<DashboardHeader url="/dash" />
|
||||||
</main>
|
</main>
|
||||||
</>)
|
</>)
|
||||||
}
|
}
|
|
@ -17,16 +17,7 @@ export const adminRouter = createTRPCRouter({
|
||||||
}).then((user) => {
|
}).then((user) => {
|
||||||
const result = compareSync(input.password, user?.password || "");
|
const result = compareSync(input.password, user?.password || "");
|
||||||
if (result) {
|
if (result) {
|
||||||
console.log(user)
|
|
||||||
console.log(PublicUserType.parse({
|
|
||||||
grade: user?.grade,
|
|
||||||
class: user?.class,
|
|
||||||
name: user?.name,
|
|
||||||
username: user?.username,
|
|
||||||
isAdmin: user?.isAdmin,
|
|
||||||
}))
|
|
||||||
const session = PublicUserType.parse(user)!;
|
const session = PublicUserType.parse(user)!;
|
||||||
console.log(session)
|
|
||||||
const token = jwt.sign(session, process.env.JWT_SECRET || "", { expiresIn: "1d" });
|
const token = jwt.sign(session, process.env.JWT_SECRET || "", { expiresIn: "1d" });
|
||||||
ctx.res.setHeader("Set-Cookie", `token=${token}; Path=/; HttpOnly; SameSite=Strict; Max-Age=${60 * 60 * 24};`);
|
ctx.res.setHeader("Set-Cookie", `token=${token}; Path=/; HttpOnly; SameSite=Strict; Max-Age=${60 * 60 * 24};`);
|
||||||
return {
|
return {
|
||||||
|
|
Loading…
Reference in a new issue