You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 

143 lines
4.7 KiB

import { useState } from "react";
import { Link } from "react-router-dom";
import titleIcon from "../../assets/img/Group 1480.svg";
const LastActivity = () => {
const [data, setData] = useState([
{
id: 1,
date: "1400/11/11",
name: "آزمون آنلاین درس علوم تجربی",
nationalId: "0013578098",
activity: "شارژ حساب",
amount: 100000,
situation: true,
},
{
id: 2,
date: "1400/11/11",
name: "آزمون آنلاین درس علوم اجتماعی",
nationalId: "0016577044",
activity: "شارژ حساب",
amount: 90000,
situation: true,
},
{
id: 3,
date: "1400/11/11",
name: "آزمون آنلاین خیاطی (ریز دوزی)",
nationalId: "0093578123",
activity: "شارژ حساب",
amount: 80000,
situation: true,
},
{
id: 4,
date: "1400/11/11",
name: "آزمون حضوری آداب معاشرت",
nationalId: "0061234098",
activity: "شارژ حساب",
amount: 100000,
situation: true,
},
{
id: 5,
date: "1400/11/10",
name: "آزمون آنلاین انضباط دوم دبیرستان",
nationalId: "0213577799",
activity: "شارژ حساب",
amount: 70000,
situation: true,
},
{
id: 6,
date: "1400/11/10",
name: "آزمون حضوری دوره ی چگونه یوتیوبر شویم",
nationalId: "0350077708",
activity: "شارژ حساب",
amount: 70000,
situation: false,
},
{
id: 7,
date: "1400/11/10",
name: "آزمون آنلاین fl studio",
nationalId: "0350089964",
activity: "استرداد وجه",
amount: 70000,
situation: true,
},
]);
return (
<div className="LastActivity w-full h-[55%] max-h-[55%] rounded-lg bg-white p-4">
<div className="LastActivity-row1 w-full flex items-center justify-between flex-row-reverse mb-2">
<div className="LastActivity-title-box flex flex-row-reverse items-center">
<div className="LastActivity-title-box-text mr-2 p-2 font-bold text-color2">
لیست آزمون های من
</div>
</div>
{/* <Link
to="/accounting"
className="LastActivity-more-btn p-2 border border-color7 rounded w-fit text-sm text-color2 cursor-pointer hover:bg-color2 hover:text-white"
>
مشاهده بیشتر
</Link> */}
</div>
<div className="LastActivity-row2 w-full py-2 border-color1 flex items-center text-right font-bold justify-between flex-row-reverse">
<div className="LastActivity-row2-item text-color2 text-sm w-3/12">
عنوان
</div>
<div className="LastActivity-row2-item text-color2 text-center text-sm w-2/12">
تاریخ ثبت نام
</div>
<div className="LastActivity-row2-item text-color2 text-center text-sm w-2/12">
مبلغ پرداختی
</div>
<div className="LastActivity-row2-item text-color2 text-center text-sm w-2/12">
دریافت قرارداد
</div>
</div>
{data.map((item, index) => (
<div
key={item.id}
className="LastActivity-item w-full py-2 border-t border-color1 text-red26 flex items-center cursor-pointer justify-between flex-row-reverse hover:bg-red82OP"
>
<div
className="LastActivity-item-name text-sm text-right text-ellipsis whitespace-nowrap overflow-hidden rtl w-3/12"
style={{ fontFamily: "IRANSansXFaNum-Regular" }}
>
{item.name}
</div>
<div
className="LastActivity-item-name text-sm w-2/12 text-ellipsis whitespace-nowrap overflow-hidden"
style={{ direction: "rtl", fontFamily: "IRANSansXFaNum-Regular" }}
>
{item.date}
</div>
<div
className="LastActivity-item-name text-sm w-2/12 text-ellipsis whitespace-nowrap overflow-hidden"
style={{ direction: "rtl", fontFamily: "IRANSansXFaNum-Regular" }}
>
{item.amount} ریال
</div>
<div
className="LastActivity-item-name text-sm text-center w-2/12 text-ellipsis whitespace-nowrap overflow-hidden"
style={{ direction: "rtl", fontFamily: "IRANSansXFaNum-Regular" }}
>
{
item.situation ? <p className="text-red26 ">آماده قابل دریافت</p> : <p className="text-red52 ">غیر قابل دریافت</p>
}
</div>
</div>
))}
</div>
);
};
export default LastActivity;