202 lines
9.1 KiB
JavaScript
202 lines
9.1 KiB
JavaScript
import { useTranslations } from "next-intl";
|
|
import { useMemo } from "react";
|
|
import { Box, Typography } from "@mui/material";
|
|
import moment from "jalali-moment";
|
|
import MuiDatePicker from "@/core/components/MuiDatePicker";
|
|
import DataTable from "@/core/components/DataTable";
|
|
import { GET_LOAN_FOLLOWUP } from "@/core/data/apiRoutes";
|
|
import TableToolbar from "./TableToolbar";
|
|
import TableRowActions from "./TableRowActions";
|
|
|
|
function DashboardLoanFollowUpComponent() {
|
|
const t = useTranslations();
|
|
const columns = useMemo(
|
|
() => [
|
|
{
|
|
accessorFn: (row) => row.id,
|
|
id: "id",
|
|
header: t("LoanFollowUp.id"),
|
|
enableColumnFilter: true,
|
|
datatype: "numeric",
|
|
filterFn: "equals",
|
|
columnFilterModeOptions: ["equals", "notEquals", "contains", "lessThan", "greaterThan", "between"],
|
|
Cell: ({ renderedCellValue }) => <Typography variant="body2">{renderedCellValue}</Typography>,
|
|
},
|
|
{
|
|
accessorFn: (row) => row.navgan_id,
|
|
id: "navgan_id",
|
|
header: t("LoanFollowUp.navgan_id"),
|
|
enableColumnFilter: true,
|
|
datatype: "numeric",
|
|
filterFn: "equals",
|
|
columnFilterModeOptions: ["equals", "notEquals", "contains", "lessThan", "greaterThan", "between"],
|
|
Cell: ({ renderedCellValue }) => <Typography variant="body2">{renderedCellValue}</Typography>,
|
|
},
|
|
{
|
|
accessorFn: (row) => row.name,
|
|
id: "name",
|
|
header: t("LoanFollowUp.name"),
|
|
enableColumnFilter: true,
|
|
datatype: "text",
|
|
filterFn: "contains",
|
|
columnFilterModeOptions: ["contains", "equals", "notEquals"],
|
|
Cell: ({ renderedCellValue }) => <Typography variant="body2">{renderedCellValue}</Typography>,
|
|
},
|
|
{
|
|
accessorFn: (row) => row.national_id,
|
|
id: "national_id",
|
|
header: t("LoanFollowUp.national_id"),
|
|
enableColumnFilter: true,
|
|
datatype: "numeric",
|
|
filterFn: "equals",
|
|
columnFilterModeOptions: ["equals", "notEquals", "contains", "lessThan", "greaterThan", "between"],
|
|
Cell: ({ renderedCellValue }) => <Typography variant="body2">{renderedCellValue}</Typography>,
|
|
},
|
|
{
|
|
accessorFn: (row) => row.shenase_meli,
|
|
id: "shenase_meli",
|
|
header: t("LoanFollowUp.shenase_meli"),
|
|
enableColumnFilter: true,
|
|
datatype: "numeric",
|
|
filterFn: "equals",
|
|
columnFilterModeOptions: ["equals", "notEquals", "contains", "lessThan", "greaterThan", "between"],
|
|
Cell: ({ renderedCellValue }) => <Typography variant="body2">{renderedCellValue}</Typography>,
|
|
},
|
|
{
|
|
accessorFn: (row) => row.national_serial_number,
|
|
id: "national_serial_number",
|
|
header: t("LoanFollowUp.national_serial_number"),
|
|
enableColumnFilter: true,
|
|
datatype: "numeric",
|
|
filterFn: "equals",
|
|
columnFilterModeOptions: ["equals", "notEquals", "contains", "lessThan", "greaterThan", "between"],
|
|
Cell: ({ renderedCellValue }) => <Typography variant="body2">{renderedCellValue}</Typography>,
|
|
},
|
|
{
|
|
accessorFn: (row) => row.national_tracking_code,
|
|
id: "national_tracking_code",
|
|
header: t("LoanFollowUp.national_tracking_code"),
|
|
enableColumnFilter: true,
|
|
datatype: "text",
|
|
filterFn: "equals",
|
|
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
|
Cell: ({ renderedCellValue }) => <Typography variant="body2">{renderedCellValue}</Typography>,
|
|
},
|
|
{
|
|
accessorFn: (row) => row.birthday,
|
|
id: "birthday",
|
|
header: t("LoanFollowUp.birthday"),
|
|
enableColumnFilter: true,
|
|
datatype: "text",
|
|
filterFn: "contains",
|
|
columnFilterModeOptions: ["contains", "equals", "notEquals"],
|
|
Cell: ({ renderedCellValue }) => (
|
|
<Typography variant="body2">
|
|
{moment(renderedCellValue).locale("fa").format("yyyy/MM/DD")}
|
|
</Typography>
|
|
),
|
|
},
|
|
{
|
|
accessorFn: (row) => row.approved_amount,
|
|
id: "approved_amount",
|
|
header: t("LoanFollowUp.approved_amount"),
|
|
enableColumnFilter: true,
|
|
datatype: "text",
|
|
filterFn: "equals",
|
|
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
|
Cell: ({ renderedCellValue }) => (
|
|
<Typography variant="body2">{Number(renderedCellValue).toLocaleString()}</Typography>
|
|
),
|
|
},
|
|
{
|
|
accessorFn: (row) => row.branch_name,
|
|
id: "branch_name",
|
|
header: t("LoanFollowUp.branch_name"),
|
|
enableColumnFilter: true,
|
|
datatype: "text",
|
|
filterFn: "contains",
|
|
columnFilterModeOptions: ["contains", "equals", "notEquals"],
|
|
Cell: ({ renderedCellValue }) => <Typography variant="body2">{renderedCellValue}</Typography>,
|
|
},
|
|
{
|
|
accessorFn: (row) => row.province_name,
|
|
id: "province_name",
|
|
header: t("LoanFollowUp.province_name"),
|
|
enableColumnFilter: true,
|
|
datatype: "text",
|
|
filterFn: "contains",
|
|
columnFilterModeOptions: ["contains", "equals", "notEquals"],
|
|
Cell: ({ renderedCellValue }) => <Typography variant="body2">{renderedCellValue}</Typography>,
|
|
},
|
|
{
|
|
accessorFn: (row) => row.city_name,
|
|
id: "city_name",
|
|
header: t("LoanFollowUp.city_name"),
|
|
enableColumnFilter: true,
|
|
datatype: "text",
|
|
filterFn: "contains",
|
|
columnFilterModeOptions: ["contains", "equals", "notEquals"],
|
|
Cell: ({ renderedCellValue }) => <Typography variant="body2">{renderedCellValue}</Typography>,
|
|
},
|
|
{
|
|
accessorFn: (row) => moment(row.created_at).locale("fa").format("HH:mm | yyyy/MM/DD"),
|
|
id: "created_at",
|
|
header: t("LoanFollowUp.created_at"),
|
|
enableColumnFilter: true,
|
|
datatype: "date",
|
|
filterFn: "lessThan",
|
|
columnFilterModeOptions: ["lessThan", "greaterThan"],
|
|
Cell: ({ renderedCellValue }) => {
|
|
return <Typography variant="body2">{renderedCellValue}</Typography>;
|
|
},
|
|
Header: ({ column }) => <>{column.columnDef.header}</>,
|
|
Filter: ({ column }) => {
|
|
return <MuiDatePicker column={column} />;
|
|
},
|
|
},
|
|
{
|
|
accessorFn: (row) => row.phone_number,
|
|
id: "phone_number",
|
|
header: t("LoanFollowUp.phone_number"),
|
|
enableColumnFilter: true,
|
|
datatype: "numeric",
|
|
filterFn: "equals",
|
|
columnFilterModeOptions: ["equals", "notEquals", "contains", "lessThan", "greaterThan", "between"],
|
|
Cell: ({ renderedCellValue }) => <Typography variant="body2">{renderedCellValue}</Typography>,
|
|
},
|
|
{
|
|
accessorFn: (row) => row.state_name,
|
|
id: "state_id",
|
|
header: t("LoanFollowUp.state_name"),
|
|
enableColumnFilter: false,
|
|
datatype: "numeric",
|
|
Cell: ({ renderedCellValue }) => <Typography variant="body2">{renderedCellValue}</Typography>,
|
|
},
|
|
],
|
|
[]
|
|
);
|
|
return (
|
|
<Box sx={{ px: 3 }}>
|
|
<DataTable
|
|
tableUrl={GET_LOAN_FOLLOWUP}
|
|
columns={columns}
|
|
selectableRow={false}
|
|
enableCustomToolbar={true}
|
|
CustomToolbar={TableToolbar}
|
|
enableLastUpdate={true}
|
|
enablePinning={true}
|
|
enableDensityToggle={false}
|
|
initialState={{ density: "compact" }} //compact (small) //comfortable (medium) //spacious (large)
|
|
enableColumnFilters={true}
|
|
enableHiding={true}
|
|
enableFullScreenToggle={false}
|
|
enableGlobalFilter={false}
|
|
enableColumnResizing={false} // if you want true this you shold change renderRowActions props ** see https://www.material-react-table.com/docs/guides/row-actions
|
|
enableRowActions={true}
|
|
TableRowAction={TableRowActions}
|
|
/>
|
|
</Box>
|
|
);
|
|
}
|
|
export default DashboardLoanFollowUpComponent;
|