83 lines
2.5 KiB
TypeScript
83 lines
2.5 KiB
TypeScript
import MissionItem from "./MissionItem";
|
||
import { SecondaryButton } from "../../../components/button/SecondaryButton";
|
||
import { useAppDispatch, useAppSelector } from "../../../redux/hooks";
|
||
import { useEffect } from "react";
|
||
import { setMenuActivePage } from "../../../redux/slices/store";
|
||
import { useNavigate } from "react-router-dom";
|
||
import { fetchMissions } from "../../../redux/slices/missions";
|
||
|
||
|
||
export interface Mission {
|
||
id: number;
|
||
authorId: number;
|
||
name: string;
|
||
difficulty: "Easy" | "Medium" | "Hard";
|
||
tags: string[];
|
||
timeLimit: number;
|
||
memoryLimit: number;
|
||
createdAt: string;
|
||
updatedAt: string;
|
||
}
|
||
|
||
const Missions = () => {
|
||
|
||
const dispatch = useAppDispatch();
|
||
const naivgate = useNavigate();
|
||
|
||
const missions = useAppSelector((state) => state.missions.missions);
|
||
|
||
useEffect(() => {
|
||
dispatch(setMenuActivePage("missions"))
|
||
dispatch(fetchMissions({}))
|
||
}, []);
|
||
|
||
|
||
return (
|
||
<div className=" h-full w-full box-border p-[20px] pt-[20px]">
|
||
<div className="h-full box-border">
|
||
|
||
<div className="relative flex items-center mb-[20px]">
|
||
<div className="h-[50px] text-[40px] font-bold text-liquid-white flex items-center">
|
||
Задачи
|
||
</div>
|
||
<SecondaryButton
|
||
onClick={() => {naivgate("/upload")}}
|
||
text="Создать задачу"
|
||
className="absolute right-0"
|
||
/>
|
||
</div>
|
||
|
||
<div className="bg-liquid-lighter h-[50px] mb-[20px]">
|
||
|
||
</div>
|
||
|
||
<div>
|
||
|
||
{missions.map((v, i) => (
|
||
<MissionItem
|
||
key={i}
|
||
id={v.id}
|
||
authorId={v.authorId}
|
||
name={v.name}
|
||
difficulty={"Easy"}
|
||
tags={v.tags}
|
||
timeLimit={1000}
|
||
memoryLimit={256 * 1024 * 1024}
|
||
createdAt={v.createdAt}
|
||
updatedAt={v.updatedAt}
|
||
type={i % 2 == 0 ? "first" : "second"}
|
||
status={i == 0 || i == 3 || i == 7 ? "success" : (i == 2 || i == 4 || i == 9 ? "error" : "empty")}/>
|
||
))}
|
||
</div>
|
||
|
||
|
||
<div>
|
||
pages
|
||
</div>
|
||
</div>
|
||
</div>
|
||
);
|
||
};
|
||
|
||
export default Missions;
|