complete datatable getting data with swr
This commit is contained in:
20
src/components/dashboard/inquiryPrivacyFencing/Toolbar.jsx
Normal file
20
src/components/dashboard/inquiryPrivacyFencing/Toolbar.jsx
Normal file
@@ -0,0 +1,20 @@
|
||||
import { Button } from "@mui/material";
|
||||
import AddCircleIcon from "@mui/icons-material/AddCircle";
|
||||
import { useState } from "react";
|
||||
|
||||
const Toolbar = ({ mutate }) => {
|
||||
const [open, setOpen] = useState(false);
|
||||
|
||||
const handleOpen = () => {
|
||||
setOpen(true);
|
||||
};
|
||||
|
||||
return (
|
||||
<>
|
||||
<Button variant="contained" color="primary2" startIcon={<AddCircleIcon />} onClick={handleOpen}>
|
||||
ایجاد پاسخ به استعلام
|
||||
</Button>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default Toolbar;
|
||||
@@ -1,4 +1,363 @@
|
||||
"use client";
|
||||
|
||||
import { useMemo } from "react";
|
||||
import Toolbar from "@/components/dashboard/inquiryPrivacyFencing/Toolbar";
|
||||
import DataTable from "@/core/components/DataTable";
|
||||
import { Box } from "@mui/material";
|
||||
import { GET_INQUIRY_PRIVACY_FENCING_ROUTE } from "@/core/utils/routes";
|
||||
|
||||
const InquiryPrivacyFencingPage = () => {
|
||||
return <></>
|
||||
}
|
||||
export default InquiryPrivacyFencingPage
|
||||
const columns = useMemo(
|
||||
() => [
|
||||
{
|
||||
accessorKey: "dabirkhaneh_number",
|
||||
header: "dabirkhaneh_number",
|
||||
id: "dabirkhaneh_number",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "notEquals",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "marjae_pasokh",
|
||||
header: "marjae_pasokh",
|
||||
id: "marjae_pasokh",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "equals",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains", "lessThan", "greaterThan", "fuzzy"],
|
||||
},
|
||||
{
|
||||
accessorKey: "motaghazi_is_legal",
|
||||
header: "motaghazi_is_legal",
|
||||
id: "motaghazi_is_legal",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "nameh_date",
|
||||
header: "nameh_date",
|
||||
id: "nameh_date",
|
||||
enableColumnFilter: false,
|
||||
datatype: "date",
|
||||
filterFn: "equals",
|
||||
},
|
||||
{
|
||||
accessorKey: "motaghazi_type",
|
||||
header: "motaghazi_type",
|
||||
id: "motaghazi_type",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "motaghazi_firstname",
|
||||
header: "motaghazi_firstname",
|
||||
id: "motaghazi_firstname",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "motaghazi_lastname",
|
||||
header: "motaghazi_lastname",
|
||||
id: "motaghazi_lastname",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "national_id",
|
||||
header: "national_id",
|
||||
id: "national_id",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "shenase_melli",
|
||||
header: "shenase_melli",
|
||||
id: "shenase_melli",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "tel_number",
|
||||
header: "tel_number",
|
||||
id: "tel_number",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "mobile_number",
|
||||
header: "mobile_number",
|
||||
id: "mobile_number",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "address",
|
||||
header: "address",
|
||||
id: "address",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "edare_kol",
|
||||
header: "edare_kol",
|
||||
id: "edare_kol",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "edare_shahri",
|
||||
header: "edare_shahri",
|
||||
id: "edare_shahri",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "rah_type",
|
||||
header: "rah_type",
|
||||
id: "rah_type",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "name_mehvar_fa",
|
||||
header: "name_mehvar_fa",
|
||||
id: "name_mehvar_fa",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "mizan_harim",
|
||||
header: "mizan_harim",
|
||||
id: "mizan_harim",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "arze_navar",
|
||||
header: "arze_navar",
|
||||
id: "arze_navar",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "samt",
|
||||
header: "samt",
|
||||
id: "samt",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "kilometr",
|
||||
header: "kilometr",
|
||||
id: "kilometr",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "zone",
|
||||
header: "zone",
|
||||
id: "zone",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "karbari_type",
|
||||
header: "karbari_type",
|
||||
id: "karbari_type",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "tarh_title",
|
||||
header: "tarh_title",
|
||||
id: "tarh_title",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "masahat_zirbana",
|
||||
header: "masahat_zirbana",
|
||||
id: "masahat_zirbana",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "ehdasat_type",
|
||||
header: "ehdasat_type",
|
||||
id: "ehdasat_type",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "divarkeshi_distance",
|
||||
header: "divarkeshi_distance",
|
||||
id: "divarkeshi_distance",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "mahale_ejra",
|
||||
header: "mahale_ejra",
|
||||
id: "mahale_ejra",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "traffic",
|
||||
header: "traffic",
|
||||
id: "traffic",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "vaziat_eghtesadi",
|
||||
header: "vaziat_eghtesadi",
|
||||
id: "vaziat_eghtesadi",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "has_access",
|
||||
header: "has_access",
|
||||
id: "has_access",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "shomare_estelam_harim",
|
||||
header: "shomare_estelam_harim",
|
||||
id: "shomare_estelam_harim",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "max_month",
|
||||
header: "max_month",
|
||||
id: "max_month",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "max_day",
|
||||
header: "max_day",
|
||||
id: "max_day",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "shomare_tahaodname",
|
||||
header: "shomare_tahaodname",
|
||||
id: "shomare_tahaodname",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "shomare_daftarkhaneh",
|
||||
header: "shomare_daftarkhaneh",
|
||||
id: "shomare_daftarkhaneh",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "description",
|
||||
header: "description",
|
||||
id: "description",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "ronevesht",
|
||||
header: "ronevesht",
|
||||
id: "ronevesht",
|
||||
enableColumnFilter: false,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
],
|
||||
[]
|
||||
);
|
||||
|
||||
return (
|
||||
<Box sx={{ mx: 2 }}>
|
||||
<DataTable
|
||||
need_filter={"false"}
|
||||
columns={columns}
|
||||
table_url={GET_INQUIRY_PRIVACY_FENCING_ROUTE}
|
||||
user_id={0}
|
||||
page_name={"testPage"}
|
||||
table_name={"testTable"}
|
||||
TableToolbar={Toolbar}
|
||||
/>
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
export default InquiryPrivacyFencingPage;
|
||||
|
||||
|
||||
@@ -1,10 +0,0 @@
|
||||
import { Button } from "@mui/material";
|
||||
|
||||
const Toolbar = ({ columns }) => {
|
||||
return (
|
||||
<>
|
||||
<Button>add something</Button>
|
||||
</>
|
||||
);
|
||||
};
|
||||
export default Toolbar;
|
||||
@@ -1,129 +0,0 @@
|
||||
"use client";
|
||||
import DataTable from "@/core/components/DataTable";
|
||||
import { useMemo } from "react";
|
||||
|
||||
function HomeComponent() {
|
||||
const columns = useMemo(
|
||||
() => [
|
||||
{
|
||||
accessorKey: "fullname",
|
||||
header: "نام کامل",
|
||||
id: "fullname",
|
||||
columns: [
|
||||
{
|
||||
accessorKey: "name.firstName",
|
||||
header: "نام",
|
||||
id: "firstName",
|
||||
enableColumnFilter: true,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
enableClickToCopy: true,
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "name.lastName",
|
||||
header: "نام خانوادگی",
|
||||
id: "lastName",
|
||||
enableColumnFilter: true,
|
||||
datatype: "text",
|
||||
filterFn: "equals",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
accessorKey: "address",
|
||||
header: "آدرس",
|
||||
id: "address",
|
||||
enableColumnFilter: true,
|
||||
datatype: "text",
|
||||
filterFn: "notEquals",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "city",
|
||||
header: "شهر",
|
||||
id: "city",
|
||||
enableColumnFilter: true,
|
||||
datatype: "text",
|
||||
filterFn: "equals",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains", "lessThan", "greaterThan", "fuzzy"],
|
||||
},
|
||||
{
|
||||
accessorKey: "state",
|
||||
header: "وضعیت",
|
||||
id: "state",
|
||||
enableColumnFilter: true,
|
||||
datatype: "text",
|
||||
filterFn: "contains",
|
||||
columnFilterModeOptions: ["equals", "notEquals", "contains"],
|
||||
},
|
||||
{
|
||||
accessorKey: "price",
|
||||
header: "محدوده",
|
||||
id: "price",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterFn: "equals",
|
||||
columnFilterModeOptions: ["equals", "notEquals"],
|
||||
},
|
||||
{
|
||||
accessorKey: "created_at",
|
||||
header: "تاریخ ساخت",
|
||||
id: "created_at",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterFn: "between",
|
||||
},
|
||||
{
|
||||
accessorKey: "updated_at",
|
||||
header: "تاریخ بروزرسانی",
|
||||
id: "updated_at",
|
||||
enableColumnFilter: true,
|
||||
datatype: "date",
|
||||
filterFn: "equals",
|
||||
},
|
||||
{
|
||||
accessorKey: "company",
|
||||
header: "نام شرکت",
|
||||
id: "company",
|
||||
enableColumnFilter: true,
|
||||
datatype: "numeric",
|
||||
filterFn: "equals",
|
||||
columnSelectOption: [
|
||||
{ value: 1, label: "وایتل" },
|
||||
{ value: 2, label: "اسنپ" },
|
||||
{ value: 3, label: "تپسی" },
|
||||
],
|
||||
},
|
||||
{
|
||||
accessorKey: "area",
|
||||
header: "منطقه",
|
||||
id: "area",
|
||||
enableColumnFilter: true,
|
||||
datatype: "array",
|
||||
filterFn: "equals",
|
||||
columnSelectOption: [
|
||||
{ value: 1, label: "وایتل" },
|
||||
{ value: 2, label: "اسنپ" },
|
||||
{ value: 3, label: "تپسی" },
|
||||
],
|
||||
},
|
||||
],
|
||||
[]
|
||||
);
|
||||
|
||||
return (
|
||||
<>
|
||||
<DataTable
|
||||
columns={columns}
|
||||
table_url={"api"}
|
||||
user_id={0}
|
||||
page_name={"testPage"}
|
||||
table_name={"testTable"}
|
||||
/>
|
||||
</>
|
||||
);
|
||||
}
|
||||
|
||||
export default HomeComponent;
|
||||
@@ -9,6 +9,23 @@ import HeaderMenu from "./HeaderMenu";
|
||||
|
||||
const drawerWidth = 300;
|
||||
|
||||
const ScrollBox = styled(Box)({
|
||||
flexGrow: 1,
|
||||
overflowY: "scroll",
|
||||
width: "calc(100% - ${drawerWidth}px)",
|
||||
"&::-webkit-scrollbar": {
|
||||
width: "5px",
|
||||
},
|
||||
"&::-webkit-scrollbar-track": {
|
||||
boxShadow: "inset 0 0 5px #fff",
|
||||
borderRadius: "5px",
|
||||
},
|
||||
"&::-webkit-scrollbar-thumb": {
|
||||
background: "#155175",
|
||||
borderRadius: "5px",
|
||||
},
|
||||
});
|
||||
|
||||
const Main = styled(Paper, { shouldForwardProp: (prop) => prop !== "open" })(({ theme, open }) => ({
|
||||
flexGrow: 1,
|
||||
transition: theme.transitions.create("margin", {
|
||||
@@ -102,9 +119,9 @@ const HeaderWithSidebar = ({ children }) => {
|
||||
</Drawer>
|
||||
<Main elevation={0} open={open}>
|
||||
<DrawerHeader />
|
||||
{children}
|
||||
<ScrollBox>{children}</ScrollBox>
|
||||
</Main>
|
||||
</Box>
|
||||
);
|
||||
};
|
||||
export default HeaderWithSidebar;
|
||||
export default HeaderWithSidebar;
|
||||
Reference in New Issue
Block a user