RMS/frontend
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

solve filter of datatable bug and some indentation changes

Browse Source
This commit is contained in:
Mohammad Jalali
2024-07-21 09:31:26 +03:30
parent 27472ca404
commit bd6ea0aeae
5 changed files with 34 additions and 124 deletions
Download Patch File Download Diff File Expand all files Collapse all files

103
src/components/dashboard/inquiryPrivacyFencing/index.jsx
View File

@@ -3,7 +3,6 @@
import { useMemo } from "react"; import { useMemo } from "react";
import Toolbar from "@/components/dashboard/inquiryPrivacyFencing/Toolbar"; import Toolbar from "@/components/dashboard/inquiryPrivacyFencing/Toolbar";
import DataTable from "@/core/components/DataTable"; import DataTable from "@/core/components/DataTable";
import { Box } from "@mui/material";
import { GET_INQUIRY_PRIVACY_FENCING_ROUTE } from "@/core/utils/routes"; import { GET_INQUIRY_PRIVACY_FENCING_ROUTE } from "@/core/utils/routes";
const InquiryPrivacyFencingPage = () => { const InquiryPrivacyFencingPage = () => {
@@ -32,259 +31,174 @@ const InquiryPrivacyFencingPage = () => {
header: "متقاضی", header: "متقاضی",
id: "motaghazi_is_legal", id: "motaghazi_is_legal",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "nameh_date", accessorKey: "nameh_date",
header: "تاریخ نامه درخواست", header: "تاریخ نامه درخواست",
id: "nameh_date", id: "nameh_date",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "date",
filterFn: "equals",
}, },
{ {
accessorKey: "motaghazi_type", accessorKey: "motaghazi_type",
header: "نوع متقاضی", header: "نوع متقاضی",
id: "motaghazi_type", id: "motaghazi_type",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "motaghazi_firstname", accessorKey: "motaghazi_firstname",
header: "نام متقاضی", header: "نام متقاضی",
id: "motaghazi_firstname", id: "motaghazi_firstname",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "motaghazi_lastname", accessorKey: "motaghazi_lastname",
header: "نام خانوادگی متقاضی", header: "نام خانوادگی متقاضی",
id: "motaghazi_lastname", id: "motaghazi_lastname",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "national_id", accessorKey: "national_id",
header: "کد ملی/شناسه ملی", header: "کد ملی/شناسه ملی",
id: "national_id", id: "national_id",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "tel_number", accessorKey: "tel_number",
header: "تلفن", header: "تلفن",
id: "tel_number", id: "tel_number",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "mobile_number", accessorKey: "mobile_number",
header: "تلفن همراه", header: "تلفن همراه",
id: "mobile_number", id: "mobile_number",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "address", accessorKey: "address",
header: "آدرس", header: "آدرس",
id: "address", id: "address",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "edare_kol", accessorKey: "edare_kol",
header: "اداره كل راهداری", header: "اداره كل راهداری",
id: "edare_kol", id: "edare_kol",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "edare_shahri", accessorKey: "edare_shahri",
header: "اداره شهرستان", header: "اداره شهرستان",
id: "edare_shahri", id: "edare_shahri",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "rah_type", accessorKey: "rah_type",
header: "نوع راه", header: "نوع راه",
id: "rah_type", id: "rah_type",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "name_mehvar_fa", accessorKey: "name_mehvar_fa",
header: "نام محور", header: "نام محور",
id: "name_mehvar_fa", id: "name_mehvar_fa",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "mizan_harim", accessorKey: "mizan_harim",
header: "میزان حریم", header: "میزان حریم",
id: "mizan_harim", id: "mizan_harim",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "arze_navar", accessorKey: "arze_navar",
header: "عرض نوار تاسیساتی زیربنایی", header: "عرض نوار تاسیساتی زیربنایی",
id: "arze_navar", id: "arze_navar",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "samt", accessorKey: "samt",
header: "سمت", header: "سمت",
id: "samt", id: "samt",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "kilometr", accessorKey: "kilometr",
header: "كيلومتر", header: "كيلومتر",
id: "kilometr", id: "kilometr",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "zone", accessorKey: "zone",
header: "zone", header: "zone",
id: "zone", id: "zone",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "karbari_type", accessorKey: "karbari_type",
header: "نوع کاربری", header: "نوع کاربری",
id: "karbari_type", id: "karbari_type",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "tarh_title", accessorKey: "tarh_title",
header: "عنوان طرح", header: "عنوان طرح",
id: "tarh_title", id: "tarh_title",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "masahat_zirbana", accessorKey: "masahat_zirbana",
header: "مساحت زیربنا", header: "مساحت زیربنا",
id: "masahat_zirbana", id: "masahat_zirbana",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "ehdasat_type", accessorKey: "ehdasat_type",
header: "نوع احداثات", header: "نوع احداثات",
id: "ehdasat_type", id: "ehdasat_type",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "divarkeshi_distance", accessorKey: "divarkeshi_distance",
header: "فاصله دیوارکشی از آکس محور", header: "فاصله دیوارکشی از آکس محور",
id: "divarkeshi_distance", id: "divarkeshi_distance",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "mahale_ejra", accessorKey: "mahale_ejra",
header: "محل اجرا", header: "محل اجرا",
id: "mahale_ejra", id: "mahale_ejra",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "traffic", accessorKey: "traffic",
header: "میزان ترافیک", header: "میزان ترافیک",
id: "traffic", id: "traffic",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "vaziat_eghtesadi", accessorKey: "vaziat_eghtesadi",
header: "وضعیت اقتصادی", header: "وضعیت اقتصادی",
id: "vaziat_eghtesadi", id: "vaziat_eghtesadi",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "has_access", accessorKey: "has_access",
header: "آیا راه دسترسی از قبل وجود دارد؟", header: "آیا راه دسترسی از قبل وجود دارد؟",
id: "has_access", id: "has_access",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "shomare_estelam_harim", accessorKey: "shomare_estelam_harim",
header: "شماره استعلام دفتر ایمنی و حریم", header: "شماره استعلام دفتر ایمنی و حریم",
id: "shomare_estelam_harim", id: "shomare_estelam_harim",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "max_month", accessorKey: "max_month",
header: "ماه", header: "ماه",
id: "max_month", id: "max_month",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"], columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
@@ -292,48 +206,33 @@ const InquiryPrivacyFencingPage = () => {
header: "روز", header: "روز",
id: "max_day", id: "max_day",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "shomare_tahaodname", accessorKey: "shomare_tahaodname",
header: "شماره تعهدنامه", header: "شماره تعهدنامه",
id: "shomare_tahaodname", id: "shomare_tahaodname",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "shomare_daftarkhaneh", accessorKey: "shomare_daftarkhaneh",
header: "شماره دفترخانه", header: "شماره دفترخانه",
id: "shomare_daftarkhaneh", id: "shomare_daftarkhaneh",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "description", accessorKey: "description",
header: "توضیحات", header: "توضیحات",
id: "description", id: "description",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
{ {
accessorKey: "ronevesht", accessorKey: "ronevesht",
header: "رونوشت", header: "رونوشت",
id: "ronevesht", id: "ronevesht",
enableColumnFilter: false, enableColumnFilter: false,
datatype: "text",
filterFn: "contains",
columnFilterModeOptions: ["equals", "notEquals", "contains"],
}, },
], ],
[] [],
); );
return ( return (

12
src/core/components/DataTable/Main.js
View File

@@ -26,10 +26,20 @@ const DataTable_Main = (props) => {
}; };
const fetchUrl = useMemo(() => { const fetchUrl = useMemo(() => {
const isValueEmpty = (value) => {
if (Array.isArray(value)) {
return value.length === 0 || value.every(v => v === "");
}
return value === "" || value === null || value === undefined;
};
const filteredFilterData = Object.values(filterData).filter(
(filter) => !isValueEmpty(filter.value),
);
const params = new URLSearchParams(); const params = new URLSearchParams();
params.set("start", `${pagination.pageIndex * pagination.pageSize}`); params.set("start", `${pagination.pageIndex * pagination.pageSize}`);
params.set("size", pagination.pageSize); params.set("size", pagination.pageSize);
params.set("filters", JSON.stringify(isEmptyObject(filterData) ? [] : [filterData])); params.set("filters", JSON.stringify(filteredFilterData.length === 0 ? [] : filteredFilterData));
params.set("sorting", JSON.stringify(sortData)); params.set("sorting", JSON.stringify(sortData));
return `${table_url}?${params}`; return `${table_url}?${params}`;
}, [table_url, filterData, pagination, columns, sortData]); }, [table_url, filterData, pagination, columns, sortData]);

22
src/core/components/DataTable/filter/FilterBodyField.jsx
View File

@@ -18,15 +18,15 @@ const columnFilterModeOptionFa = {
}; };
function FilterBodyField({ function FilterBodyField({
column, column,
filterParameters, filterParameters,
handleChange, handleChange,
handleBlur, handleBlur,
setFieldValue, setFieldValue,
errors, errors,
touched, touched,
resetForm, resetForm,
}) { }) {
const [anchorEl, setAnchorEl] = useState(null); const [anchorEl, setAnchorEl] = useState(null);
const defaultFilterTranslation = columnFilterModeOptionFa[filterParameters.filterFn] || filterParameters.filterFn; const defaultFilterTranslation = columnFilterModeOptionFa[filterParameters.filterFn] || filterParameters.filterFn;
@@ -48,8 +48,8 @@ function FilterBodyField({
touched={touched} touched={touched}
/> />
) : filterParameters.datatype === "numeric" && ) : filterParameters.datatype === "numeric" &&
filterParameters.filterFn === "equals" && filterParameters.filterFn === "equals" &&
Array.isArray(column.columnSelectOption) ? ( Array.isArray(column.columnSelectOption) ? (
<CustomSelect <CustomSelect
column={column} column={column}
filterParameters={filterParameters} filterParameters={filterParameters}

17
src/core/components/DataTable/filter/FilterOptionList.jsx
View File

@@ -4,14 +4,15 @@ import { ListItem, Menu } from "@mui/material";
import { useState } from "react"; import { useState } from "react";
function FilterOptionList({ function FilterOptionList({
column, column,
filterType, filterType,
filterOption, filterOption,
anchorEl, anchorEl,
columnFilterModeOptionFa, columnFilterModeOptionFa,
setAnchorEl, setAnchorEl,
setFieldValue, setFieldValue,
}) { }) {
const [selectedFilter, setSelectedFilter] = useState(filterType); const [selectedFilter, setSelectedFilter] = useState(filterType);
const handleChangeItem = (event, index) => { const handleChangeItem = (event, index) => {

4
src/lib/contexts/DataTable.js
View File

@@ -22,7 +22,7 @@ const DataTableProvider = ({ children, user_id, page_name, table_name, columns }
const values = flatColumns.reduce((acc, column) => { const values = flatColumns.reduce((acc, column) => {
if (!column.enableColumnFilter) return acc; if (!column.enableColumnFilter) return acc;
const filter = settingStore?.[user_id]?.[page_name]?.[table_name]?.["filters"]?.find( const filter = settingStore?.[user_id]?.[page_name]?.[table_name]?.["filters"]?.find(
(filter) => filter.id === column.id (filter) => filter.id === column.id,
); );
if (column.datatype === "array") { if (column.datatype === "array") {
acc[column.id] = { acc[column.id] = {
@@ -81,7 +81,7 @@ const DataTableProvider = ({ children, user_id, page_name, table_name, columns }
position: "bottom-left", position: "bottom-left",
draggable: true, draggable: true,
autoClose: false, autoClose: false,
} },
); );
} else { } else {
toast.update("keep_data", { toast.update("keep_data", {