school-dashboard-exercise/src/Pages/question/useTableColumns.tsx
2024-06-27 12:47:33 +03:00

148 lines
4.2 KiB
TypeScript

import { Space, TableColumnsType, Tooltip } from "antd";
import { Question } from "../../types/Item";
import { FaPlus } from "react-icons/fa";
import useModalHandler from "../../utils/useModalHandler";
import { ModalEnum } from "../../enums/Model";
import { useObjectToEdit } from "../../zustand/ObjectToEditState";
import { RiDeleteBin6Fill } from "react-icons/ri";
import { MdOutlineEdit } from "react-icons/md";
import { findLabelByValue } from "../../utils/findLabelByValue";
import { useTranslation } from "react-i18next";
import { hasAbility } from "../../utils/hasAbility";
import { ABILITIES_ENUM, ABILITIES_VALUES_ENUM } from "../../enums/abilities";
import { formatNumber } from "../../utils/formatNumber";
import { BsEyeFill } from "react-icons/bs";
import { useNavigate } from "react-router-dom";
import { useModalState } from "../../zustand/Modal";
export const useColumns = () => {
const { handel_open_model } = useModalHandler();
const { set_object_to_edit } = useObjectToEdit((state) => state);
const navigate = useNavigate()
const { setIsOpen } = useModalState((state) => state);
const handelAdd = () => {
set_object_to_edit({})
navigate(`${ABILITIES_ENUM?.QUESTION}/add`)
};
const can_edit_Question = hasAbility(
ABILITIES_ENUM.QUESTION,
ABILITIES_VALUES_ENUM.UPDATE,
);
const can_delete_Question = hasAbility(
ABILITIES_ENUM.QUESTION,
ABILITIES_VALUES_ENUM.DELETE,
);
const can_add_Question = hasAbility(
ABILITIES_ENUM.QUESTION,
ABILITIES_VALUES_ENUM.STORE,
);
const can_show_Question = hasAbility(
ABILITIES_ENUM.QUESTION,
ABILITIES_VALUES_ENUM.SHOW,
);
const handelDelete = (data: any) => {
set_object_to_edit(data);
setIsOpen(ModalEnum?.QUESTION_DELETE);
};
const handleEdit = (record: any) => {
set_object_to_edit(record);
navigate(`${ABILITIES_ENUM?.QUESTION}/${record?.id}`)
};
const [t] = useTranslation();
const columns: TableColumnsType<Question> = [
{
title: t("columns.id"),
dataIndex: "id",
key: "id",
align: "center",
render: (text, record) => record?.id,
},
{
title: `${t("columns.content")}`,
dataIndex: "name",
key: "name",
align: "center",
render: (text, record) => record?.content,
},
{
title: t("columns.isBase"),
dataIndex: "isBase",
key: "isBase",
align: "center",
render: (text, record) => record?.isBase === 1 ? t("practical.yes") : t ("practical.no"),
},
{
title: `${t("columns.question_options_count")}`,
dataIndex: "name",
key: "name",
align: "center",
render: (text, record) => record?.question_options_count,
},
{
title: can_add_Question ? (
<button
onClick={() => handelAdd() }
className="add_button"
>
{t("practical.add")} {t("models.Question")} <FaPlus />
</button>
) : (
""
),
key: "actions",
align: "end",
className: "custom_add_button_column",
render: (text, record, index) => {
const className =
index % 2 === 0 ? "even-row buttonAction" : "odd-row buttonAction";
return (
<Space size="middle" className={className}>
{can_edit_Question && (
<Tooltip
placement="top"
title={t("practical.edit")}
color="#E0E0E0"
>
<span onClick={() => handleEdit(record)}>
<MdOutlineEdit
size={22}
style={{ color: "#A098AE" }}
/>
</span>
</Tooltip>
)}
{can_delete_Question && (
<RiDeleteBin6Fill
onClick={() => handelDelete(record)}
size={22}
style={{ color: "#C11313" }}
/>
)}
{/* {can_show_Question && (
<BsEyeFill
onClick={() => handelShow(record)}
size={22}
style={{ color: "green" }}
/>
)} */}
</Space>
);
},
},
];
return columns;
};