TurTaskProject/TurTaskWeb
1
0
Fork 0
mirror of https://github.com/TurTaskProject/TurTaskWeb.git synced 2025-12-19 22:14:07 +01:00
Code Issues Actions Packages Projects Releases Wiki Activity

Update Eisenhower Matrix

Browse Source
This commit is contained in:
sosokker 2023-11-16 23:27:02 +07:00
parent 02c51a7def
commit 92bc65ce2f
2 changed files with 52 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

62
frontend/src/components/EisenhowerMatrix/Eisenhower.jsx
View File

@ -1,25 +1,65 @@
import React from "react";
import { FiAlertCircle, FiClock, FiXCircle, FiCheckCircle } from "react-icons/fi";
function EachBlog({ name, colorCode }) {
function EachBlog({ name, colorCode, contentList, icon }) {
return (
<div className={`grid grid-rows-2 gap-4 text-left p-4 rounded-lg bg-white border border-gray-300 shadow-md`}>
<div className={`text-xl font-bold`} style={{ color: colorCode }}>
{name}
<div
className={`h-full text-left p-4 rounded-lg bg-white border border-gray-300 overflow-y-auto`}>
<div className="flex" style={{ color: colorCode }}>
<span className="mx-2 mt-1">{icon}</span>
<span>{name}</span>
</div>
<hr className="my-3 h-0.5 border-t-0 bg-gray-300 opacity-100 dark:opacity-50" />
<div className="space-y-2">
{contentList.length === 0 ? (
<p className="text-gray-500 text-center">No tasks</p>
) : (
contentList.map((item, index) => (
<div key={index} className="flex items-start">
<input type="checkbox" checked={item.checked} className="checkbox mt-1 mr-2" />
<label className="cursor-pointer">{item.text}</label>
</div>
))
)}
</div>
<div className="h-36">Content goes here</div>
</div>
);
}
function Eisenhower() {
const contentList_ui = [
{ text: "Complete report for the meeting", checked: true },
{ text: "Review project proposal", checked: false },
{ text: "Submit expense report", checked: false },
{ text: "Complete report for the meeting", checked: true },
{ text: "Review project proposal", checked: false },
{ text: "Submit expense report", checked: false },
{ text: "Complete report for the meeting", checked: true },
{ text: "Review project proposal", checked: false },
{ text: "Submit expense report", checked: false },
];
const contentList_uni = [];
const contentList_nui = [];
const contentList_nuni = [];
return (
<div className="bg-slate-100 text-left p-4 m-auto">
<h1 className="text-3xl font-bold mb-4">The Eisenhower Matrix</h1>
<div className="bg-slate-100 text-left p-4 w-full">
<div className="grid grid-rows-2 grid-cols-2 gap-2">
<EachBlog name="Urgent & Important" colorCode="#FF5733" />
<EachBlog name="Urgent & Not important" colorCode="#FDDD5C" />
<EachBlog name="Not urgent & Important" colorCode="#189AB4" />
<EachBlog name="Not urgent & Not important" colorCode="#94FA92" />
<EachBlog name="Urgent & Important" colorCode="#ff5f68" icon={<FiAlertCircle />} contentList={contentList_ui} />
<EachBlog name="Urgent & Not important" colorCode="#ffb000" icon={<FiClock />} contentList={contentList_uni} />
<EachBlog
name="Not urgent & Important"
colorCode="#4772fa"
icon={<FiCheckCircle />}
contentList={contentList_nui}
/>
<EachBlog
name="Not urgent & Not important"
colorCode="#0cce9c"
icon={<FiXCircle />}
contentList={contentList_nuni}
/>
</div>
</div>
);

2
frontend/src/components/profilePage.jsx
View File

@ -4,7 +4,7 @@ import ProfileUpdateComponent from "./ProfileUpdateComponent";
function ProfileUpdatePage() {
return (
<div>
<div className="stats shadow">
<div className="stats shadow mt-3">
<div className="stat">
<div className="stat-title truncate">Username</div>
<div className="stat-value truncate">Sirin</div>