import DataTableWithAuth from "@/core/components/DataTableWithAuth";
import { GET_PROVINCE_DETAILED_LOGS_REPORT } from "@/core/utils/routes";
import { Box } from "@mui/material";
import moment from "jalali-moment";
import { useMemo } from "react";

export default function DataTable() {
    const columns = useMemo(() => [
        {
            header: "تاریخ",
            id: "date",
            enableColumnFilter: true,
            datatype: "text",
            filterMode: "equals",
            sortDescFirst: false,
            columnFilterModeOptions: ["equals", "contains"],
            grow: false,
            size: 100,
            Cell: ({ row }) => {
                const dateTime = row.original.calldate;
                if (!dateTime) return <>-</>;
                const date = dateTime.split(" ")[0];
                const persianDate = moment(date).locale("fa").format("YYYY-MM-DD") || "";
                return <>{persianDate}</>;
            },
        },
        {
            header: "ساعت",
            id: "time",
            enableColumnFilter: true,
            datatype: "text",
            filterMode: "equals",
            sortDescFirst: false,
            columnFilterModeOptions: ["equals", "contains"],
            grow: false,
            size: 100,
            Cell: ({ row }) => {
                const dateTime = row.original.calldate;
                if (!dateTime) return <>-</>;
                const time = dateTime.split(" ")[1] || "";
                return <>{time}</>;
            },
        },
        {
            accessorKey: "src",
            header: "شماره تماس گیرنده",
            id: "src",
            enableColumnFilter: true,
            datatype: "text",
            filterMode: "equals",
            sortDescFirst: false,
            grow: false,
            size: 100,
        },
        {
            accessorKey: "dst",
            header: "مقصد تماس",
            id: "dst",
            enableColumnFilter: true,
            datatype: "text",
            filterMode: "equals",
            sortDescFirst: false,
            grow: false,
            size: 100,
        },
        {
            accessorKey: "disposition",
            header: "وضعیت پاسخگویی",
            id: "disposition",
            enableColumnFilter: true,
            datatype: "text",
            filterMode: "equals",
            sortDescFirst: false,
            grow: false,
            size: 100,
        },
        {
            accessorKey: "duration",
            header: "مدت زمان تماس",
            id: "duration",
            enableColumnFilter: true,
            datatype: "text",
            filterMode: "equals",
            sortDescFirst: false,
            grow: false,
            size: 100,
        },
    ]);
    return (
        <>
            <Box sx={{ p: 1, border: 1, borderColor: "divider", borderRadius: 1 }}>
                <DataTableWithAuth
                    need_filter={true}
                    columns={columns}
                    table_url={GET_PROVINCE_DETAILED_LOGS_REPORT}
                    page_name={"provinceDetailedLogsReportPage"}
                    table_name={"provinceDetailedLogsReportList"}
                    positionActionsColumn={"last"}
                />
            </Box>
        </>
    );
}