61 lines
1.6 KiB
TypeScript
61 lines
1.6 KiB
TypeScript
import Image from "../Ui/Image";
|
|
import { Student } from "../../types/Item";
|
|
import { useNavigate, useParams } from "react-router-dom";
|
|
import { useGetStudent } from "../../api/student";
|
|
import { useTranslation } from "react-i18next";
|
|
|
|
const StudentBehavior = () => {
|
|
const { student_id } = useParams();
|
|
const { data: studentData } = useGetStudent({
|
|
show: student_id,
|
|
});
|
|
|
|
const userData: Student | {} = studentData?.data ?? {};
|
|
|
|
const { positiveNote, warningNote, alertNote } = userData as Student;
|
|
const [t] = useTranslation();
|
|
const navigate = useNavigate();
|
|
const handelnavigate = () => {
|
|
navigate(`note`);
|
|
};
|
|
const Data = [
|
|
{
|
|
icon: "/Icon/medal.png",
|
|
title: t("array.UserInfo.appreciation"),
|
|
value: positiveNote,
|
|
buttonText: t("practical.show"),
|
|
},
|
|
{
|
|
icon: "/Icon/warning.png",
|
|
title: t("array.UserInfo.warning"),
|
|
value: warningNote,
|
|
buttonText: t("practical.show"),
|
|
},
|
|
{
|
|
icon: "/Icon/Error.png",
|
|
title: t("array.UserInfo.alert"),
|
|
value: alertNote,
|
|
buttonText: t("practical.show"),
|
|
},
|
|
];
|
|
return (
|
|
<div className="StudentBehavior">
|
|
<header>{t("header.Student_classroom_behavior")}</header>
|
|
<main>
|
|
{Data.map((item, index) => (
|
|
<article key={index} onClick={handelnavigate}>
|
|
<Image src={item.icon} />
|
|
<div>
|
|
<h6>{item.title}</h6>
|
|
<p>{item.value}</p>
|
|
</div>
|
|
<button>{item.buttonText}</button>
|
|
</article>
|
|
))}
|
|
</main>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
export default StudentBehavior;
|