add problems
This commit is contained in:
Виталий Лавшонок
@@ -6,7 +6,7 @@ import { useAppSelector } from "../../../redux/hooks";
|
||||
const Menu = () => {
|
||||
const menuItems = [
|
||||
{text: "Главная", href: "/home", icon: Home, page: "home" },
|
||||
{text: "Задачи", href: "/home", icon: Clipboard, page: "clipboard" },
|
||||
{text: "Задачи", href: "/home/problems", icon: Clipboard, page: "clipboard" },
|
||||
{text: "Статьи", href: "/home", icon: Openbook, page: "openbool" },
|
||||
{text: "Группы", href: "/home", icon: Users, page: "users" },
|
||||
{text: "Контесты", href: "/home", icon: Cup, page: "cup" },
|
||||
@@ -15,8 +15,8 @@ const Menu = () => {
|
||||
const activePage = useAppSelector((state) => state.store.menu.activePage);
|
||||
|
||||
return (
|
||||
<div className="h-full w-full items-center box-border p-[20px] pt-[35px]">
|
||||
<img src={Logo} className="w-full" />
|
||||
<div className="w-[250px] fixed top-0 items-center box-border p-[20px] pt-[35px]">
|
||||
<img src={Logo} className="w-[173px]" />
|
||||
<div className="">
|
||||
{menuItems.map((v, i) => (
|
||||
<MenuItem key={i} icon={v.icon} text={v.text} href={v.href} active={v.page == activePage} page={v.page}/>
|
||||
|
||||
72
src/views/home/problems/ProblemItem.tsx
Normal file
72
src/views/home/problems/ProblemItem.tsx
Normal file
@@ -0,0 +1,72 @@
|
||||
import { Logo } from "../../../assets/logos";
|
||||
import { Account, Clipboard, Cup, Home, Openbook, Users } from "../../../assets/icons/menu";
|
||||
// import MenuItem from "./MenuItem";
|
||||
import { cn } from "../../../lib/cn";
|
||||
import { IconError, IconSuccess } from "../../../assets/icons/problems";
|
||||
|
||||
export interface ProblemItemProps {
|
||||
id: number;
|
||||
authorId: number;
|
||||
name: string;
|
||||
difficulty: "Easy" | "Medium" | "Hard";
|
||||
tags: string[];
|
||||
timeLimit: number;
|
||||
memoryLimit: number;
|
||||
createdAt: string;
|
||||
updatedAt: string;
|
||||
type: "first" | "second";
|
||||
status: "empty" | "success" | "error";
|
||||
}
|
||||
|
||||
export function formatMilliseconds(ms: number): string {
|
||||
const rounded = Math.round(ms) / 1000;
|
||||
const formatted = rounded.toString().replace(/\.?0+$/, '');
|
||||
return `${formatted} c`;
|
||||
}
|
||||
|
||||
export function formatBytesToMB(bytes: number): string {
|
||||
const megabytes = Math.floor(bytes / (1024 * 1024));
|
||||
return `${megabytes} МБ`;
|
||||
}
|
||||
|
||||
const ProblemItem: React.FC<ProblemItemProps> = ({
|
||||
id, authorId, name, difficulty, tags, timeLimit, memoryLimit, createdAt, updatedAt, type, status
|
||||
}) => {
|
||||
console.log(id);
|
||||
return (
|
||||
<div className={cn("h-[44px] w-full relative rounded-[10px] text-liquid-white",
|
||||
type == "first" ? "bg-liquid-lighter" : "bg-liquid-background",
|
||||
"grid grid-cols-[80px,1fr,1fr,60px,24px] grid-flow-col gap-[20px] px-[20px] box-border items-center",
|
||||
status == "error" && "border-l-[11px] border-l-liquid-red pl-[9px]",
|
||||
status == "success" && "border-l-[11px] border-l-liquid-green pl-[9px]",
|
||||
)}>
|
||||
<div className="text-[18px] font-bold">
|
||||
#{id}
|
||||
</div>
|
||||
<div className="text-[18px] font-bold">
|
||||
{name}
|
||||
</div>
|
||||
<div className="text-[12px] text-right">
|
||||
стандартный ввод/вывод {formatMilliseconds(timeLimit)}, {formatBytesToMB(memoryLimit)}
|
||||
</div>
|
||||
<div className={cn(
|
||||
"text-center text-[18px]",
|
||||
difficulty == "Hard" && "text-liquid-red",
|
||||
difficulty == "Medium" && "text-liquid-orange",
|
||||
difficulty == "Easy" && "text-liquid-green",
|
||||
)}>
|
||||
{difficulty}
|
||||
</div>
|
||||
<div className="h-[24px] w-[24px]">
|
||||
{
|
||||
status == "error" && <img src={IconError}/>
|
||||
}
|
||||
{
|
||||
status == "success" && <img src={IconSuccess}/>
|
||||
}
|
||||
</div>
|
||||
</div>
|
||||
);
|
||||
};
|
||||
|
||||
export default ProblemItem;
|
||||
503
src/views/home/problems/Problems.tsx
Normal file
503
src/views/home/problems/Problems.tsx
Normal file
@@ -0,0 +1,503 @@
|
||||
import { Logo } from "../../../assets/logos";
|
||||
import { Account, Clipboard, Cup, Home, Openbook, Users } from "../../../assets/icons/menu";
|
||||
// import MenuItem from "./MenuItem";
|
||||
import { useAppSelector } from "../../../redux/hooks";
|
||||
import ProblemItem from "./ProblemItem";
|
||||
import { SecondaryButton } from "../../../components/button/SecondaryButton";
|
||||
|
||||
|
||||
export interface Problem {
|
||||
id: number;
|
||||
authorId: number;
|
||||
name: string;
|
||||
difficulty: "Easy" | "Medium" | "Hard";
|
||||
tags: string[];
|
||||
timeLimit: number;
|
||||
memoryLimit: number;
|
||||
createdAt: string;
|
||||
updatedAt: string;
|
||||
}
|
||||
|
||||
|
||||
const Problems = () => {
|
||||
|
||||
const problems: Problem[] = [
|
||||
{
|
||||
"id": 1,
|
||||
"authorId": 1,
|
||||
"name": "Todo List App",
|
||||
"difficulty": "Easy",
|
||||
"tags": ["react", "state", "list"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:13.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:13.000Z"
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"authorId": 1,
|
||||
"name": "Search Filter Component",
|
||||
"difficulty": "Medium",
|
||||
"tags": ["filter", "props", "hooks"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:14.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:14.000Z"
|
||||
},
|
||||
{
|
||||
"id": 3,
|
||||
"authorId": 1,
|
||||
"name": "User Card List",
|
||||
"difficulty": "Easy",
|
||||
"tags": ["components", "props", "array"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:15.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:15.000Z"
|
||||
},
|
||||
{
|
||||
"id": 4,
|
||||
"authorId": 1,
|
||||
"name": "Theme Switcher",
|
||||
"difficulty": "Medium",
|
||||
"tags": ["context", "theme", "hooks"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:16.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:16.000Z"
|
||||
},
|
||||
{
|
||||
"id": 5,
|
||||
"authorId": 1,
|
||||
"name": "Debounced Input",
|
||||
"difficulty": "Hard",
|
||||
"tags": ["debounce", "hooks", "events"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:17.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:17.000Z"
|
||||
},
|
||||
{
|
||||
"id": 6,
|
||||
"authorId": 1,
|
||||
"name": "Pagination Component",
|
||||
"difficulty": "Medium",
|
||||
"tags": ["pagination", "array", "state"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:18.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:18.000Z"
|
||||
},
|
||||
{
|
||||
"id": 7,
|
||||
"authorId": 1,
|
||||
"name": "Modal Window",
|
||||
"difficulty": "Easy",
|
||||
"tags": ["ui", "portal", "events"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:19.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:19.000Z"
|
||||
},
|
||||
{
|
||||
"id": 8,
|
||||
"authorId": 1,
|
||||
"name": "Form Validation",
|
||||
"difficulty": "Hard",
|
||||
"tags": ["form", "validation", "hooks"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:20.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:20.000Z"
|
||||
},
|
||||
{
|
||||
"id": 9,
|
||||
"authorId": 1,
|
||||
"name": "Countdown Timer",
|
||||
"difficulty": "Medium",
|
||||
"tags": ["timer", "hooks", "state"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:21.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:21.000Z"
|
||||
},
|
||||
{
|
||||
"id": 10,
|
||||
"authorId": 1,
|
||||
"name": "Drag And Drop List",
|
||||
"difficulty": "Hard",
|
||||
"tags": ["dragdrop", "array", "events"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:22.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:22.000Z"
|
||||
},
|
||||
{
|
||||
"id": 11,
|
||||
"authorId": 1,
|
||||
"name": "Custom Hook Use Fetch",
|
||||
"difficulty": "Medium",
|
||||
"tags": ["hook", "fetch", "async"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:23.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:23.000Z"
|
||||
},
|
||||
{
|
||||
"id": 12,
|
||||
"authorId": 1,
|
||||
"name": "Infinite Scroll",
|
||||
"difficulty": "Hard",
|
||||
"tags": ["scroll", "pagination", "api"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:24.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:24.000Z"
|
||||
},
|
||||
{
|
||||
"id": 13,
|
||||
"authorId": 1,
|
||||
"name": "Responsive Navbar",
|
||||
"difficulty": "Easy",
|
||||
"tags": ["css", "layout", "responsive"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:25.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:25.000Z"
|
||||
},
|
||||
{
|
||||
"id": 14,
|
||||
"authorId": 1,
|
||||
"name": "Accordion Component",
|
||||
"difficulty": "Easy",
|
||||
"tags": ["ui", "state", "events"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:26.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:26.000Z"
|
||||
},
|
||||
{
|
||||
"id": 15,
|
||||
"authorId": 1,
|
||||
"name": "File Upload Preview",
|
||||
"difficulty": "Hard",
|
||||
"tags": ["file", "events", "preview"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:27.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:27.000Z"
|
||||
},
|
||||
{
|
||||
"id": 16,
|
||||
"authorId": 1,
|
||||
"name": "Dark Mode Toggle",
|
||||
"difficulty": "Easy",
|
||||
"tags": ["theme", "context", "localStorage"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:28.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:28.000Z"
|
||||
},
|
||||
{
|
||||
"id": 17,
|
||||
"authorId": 1,
|
||||
"name": "Realtime Clock",
|
||||
"difficulty": "Easy",
|
||||
"tags": ["date", "state", "interval"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:29.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:29.000Z"
|
||||
},
|
||||
{
|
||||
"id": 18,
|
||||
"authorId": 1,
|
||||
"name": "Chart With Recharts",
|
||||
"difficulty": "Medium",
|
||||
"tags": ["chart", "data", "props"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:30.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:30.000Z"
|
||||
},
|
||||
{
|
||||
"id": 19,
|
||||
"authorId": 1,
|
||||
"name": "Router Navigation",
|
||||
"difficulty": "Medium",
|
||||
"tags": ["router", "navigation", "hooks"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:31.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:31.000Z"
|
||||
},
|
||||
{
|
||||
"id": 20,
|
||||
"authorId": 1,
|
||||
"name": "Data Table Sortable",
|
||||
"difficulty": "Hard",
|
||||
"tags": ["table", "sort", "filter"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:32.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:32.000Z"
|
||||
},
|
||||
{
|
||||
"id": 1,
|
||||
"authorId": 1,
|
||||
"name": "Todo List App",
|
||||
"difficulty": "Easy",
|
||||
"tags": ["react", "state", "list"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:13.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:13.000Z"
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"authorId": 1,
|
||||
"name": "Search Filter Component",
|
||||
"difficulty": "Medium",
|
||||
"tags": ["filter", "props", "hooks"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:14.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:14.000Z"
|
||||
},
|
||||
{
|
||||
"id": 3,
|
||||
"authorId": 1,
|
||||
"name": "User Card List",
|
||||
"difficulty": "Easy",
|
||||
"tags": ["components", "props", "array"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:15.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:15.000Z"
|
||||
},
|
||||
{
|
||||
"id": 4,
|
||||
"authorId": 1,
|
||||
"name": "Theme Switcher",
|
||||
"difficulty": "Medium",
|
||||
"tags": ["context", "theme", "hooks"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:16.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:16.000Z"
|
||||
},
|
||||
{
|
||||
"id": 5,
|
||||
"authorId": 1,
|
||||
"name": "Debounced Input",
|
||||
"difficulty": "Hard",
|
||||
"tags": ["debounce", "hooks", "events"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:17.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:17.000Z"
|
||||
},
|
||||
{
|
||||
"id": 6,
|
||||
"authorId": 1,
|
||||
"name": "Pagination Component",
|
||||
"difficulty": "Medium",
|
||||
"tags": ["pagination", "array", "state"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:18.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:18.000Z"
|
||||
},
|
||||
{
|
||||
"id": 7,
|
||||
"authorId": 1,
|
||||
"name": "Modal Window",
|
||||
"difficulty": "Easy",
|
||||
"tags": ["ui", "portal", "events"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:19.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:19.000Z"
|
||||
},
|
||||
{
|
||||
"id": 8,
|
||||
"authorId": 1,
|
||||
"name": "Form Validation",
|
||||
"difficulty": "Hard",
|
||||
"tags": ["form", "validation", "hooks"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:20.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:20.000Z"
|
||||
},
|
||||
{
|
||||
"id": 9,
|
||||
"authorId": 1,
|
||||
"name": "Countdown Timer",
|
||||
"difficulty": "Medium",
|
||||
"tags": ["timer", "hooks", "state"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:21.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:21.000Z"
|
||||
},
|
||||
{
|
||||
"id": 10,
|
||||
"authorId": 1,
|
||||
"name": "Drag And Drop List",
|
||||
"difficulty": "Hard",
|
||||
"tags": ["dragdrop", "array", "events"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:22.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:22.000Z"
|
||||
},
|
||||
{
|
||||
"id": 11,
|
||||
"authorId": 1,
|
||||
"name": "Custom Hook Use Fetch",
|
||||
"difficulty": "Medium",
|
||||
"tags": ["hook", "fetch", "async"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:23.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:23.000Z"
|
||||
},
|
||||
{
|
||||
"id": 12,
|
||||
"authorId": 1,
|
||||
"name": "Infinite Scroll",
|
||||
"difficulty": "Hard",
|
||||
"tags": ["scroll", "pagination", "api"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:24.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:24.000Z"
|
||||
},
|
||||
{
|
||||
"id": 13,
|
||||
"authorId": 1,
|
||||
"name": "Responsive Navbar",
|
||||
"difficulty": "Easy",
|
||||
"tags": ["css", "layout", "responsive"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:25.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:25.000Z"
|
||||
},
|
||||
{
|
||||
"id": 14,
|
||||
"authorId": 1,
|
||||
"name": "Accordion Component",
|
||||
"difficulty": "Easy",
|
||||
"tags": ["ui", "state", "events"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:26.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:26.000Z"
|
||||
},
|
||||
{
|
||||
"id": 15,
|
||||
"authorId": 1,
|
||||
"name": "File Upload Preview",
|
||||
"difficulty": "Hard",
|
||||
"tags": ["file", "events", "preview"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:27.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:27.000Z"
|
||||
},
|
||||
{
|
||||
"id": 16,
|
||||
"authorId": 1,
|
||||
"name": "Dark Mode Toggle",
|
||||
"difficulty": "Easy",
|
||||
"tags": ["theme", "context", "localStorage"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:28.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:28.000Z"
|
||||
},
|
||||
{
|
||||
"id": 17,
|
||||
"authorId": 1,
|
||||
"name": "Realtime Clock",
|
||||
"difficulty": "Easy",
|
||||
"tags": ["date", "state", "interval"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:29.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:29.000Z"
|
||||
},
|
||||
{
|
||||
"id": 18,
|
||||
"authorId": 1,
|
||||
"name": "Chart With Recharts",
|
||||
"difficulty": "Medium",
|
||||
"tags": ["chart", "data", "props"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:30.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:30.000Z"
|
||||
},
|
||||
{
|
||||
"id": 19,
|
||||
"authorId": 1,
|
||||
"name": "Router Navigation",
|
||||
"difficulty": "Medium",
|
||||
"tags": ["router", "navigation", "hooks"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:31.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:31.000Z"
|
||||
},
|
||||
{
|
||||
"id": 20,
|
||||
"authorId": 1,
|
||||
"name": "Data Table Sortable",
|
||||
"difficulty": "Hard",
|
||||
"tags": ["table", "sort", "filter"],
|
||||
"timeLimit": 1000,
|
||||
"memoryLimit": 268435456,
|
||||
"createdAt": "2025-10-28T13:23:32.000Z",
|
||||
"updatedAt": "2025-10-28T13:23:32.000Z"
|
||||
}
|
||||
];
|
||||
|
||||
|
||||
return (
|
||||
<div className=" h-full w-full box-border p-[20px] pt-[35px]">
|
||||
<div className="h-full box-border mr-[250px]">
|
||||
|
||||
<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={() => {}}
|
||||
text="Создать задачу"
|
||||
className="absolute right-0"
|
||||
/>
|
||||
</div>
|
||||
|
||||
<div className="bg-liquid-lighter h-[50px] mb-[20px]">
|
||||
|
||||
</div>
|
||||
|
||||
<div>
|
||||
|
||||
{problems.map((v, i) => (
|
||||
<ProblemItem key={i} {...v} 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 Problems;
|
||||
Reference in New Issue
Block a user