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

complete sorting and filtering datatable and working with local storage for caching data

Browse Source
This commit is contained in:
Mohammad Jalali
2024-07-11 10:32:22 +03:30
parent 37dccc5ec3
commit 4faa45d105
69 changed files with 1800 additions and 2647 deletions
Download Patch File Download Diff File Expand all files Collapse all files

98
src/core/components/NotificationDesign/AskForKeepData.jsx
View File

@@ -1,59 +1,75 @@
'use client'
"use client";
import SaveIcon from '@mui/icons-material/Save';
import {Box, Button, Typography} from "@mui/material";
import DownloadIcon from '@mui/icons-material/Download';
import {toast} from "react-toastify";
import SaveIcon from "@mui/icons-material/Save";
import { Box, Button, Typography } from "@mui/material";
import DownloadIcon from "@mui/icons-material/Download";
import { toast } from "react-toastify";
import useTableSetting from "@/lib/hooks/useTableSetting";
function AskForKeepData({filterData, sortData, user_id, page_name, table_name, columns}) {
const {filterAction} = useTableSetting();
function AskForKeepData({ filterData, sortData, user_id, page_name, table_name, columns }) {
const { filterAction, sortAction } = useTableSetting();
const onSaveFilter = () => {
const filteredItems = Object.keys(filterData).map(key => {
const value = filterData[key].value;
if (value !== "" &&
!(Array.isArray(value) && (value.length === 0 || (value.length === 2 && value[0] === "" && value[1] === "")))) {
return filterData[key];
}
}).filter(Boolean);
const filteredItems = Object.keys(filterData)
.map((key) => {
const value = filterData[key].value;
if (
value !== "" &&
!(
Array.isArray(value) &&
(value.length === 0 || (value.length === 2 && value[0] === "" && value[1] === ""))
)
) {
return filterData[key];
}
})
.filter(Boolean);
filterAction(user_id, page_name, table_name, filteredItems, columns);
const settingValue = sortData(settingStore?.[user_id]?.[page_name]?.[table_name]?.['sorts'] || []);
sortAction(user_id, page_name, table_name, settingValue, flatColumns);
toast.dismiss({containerId: "datatable"});
sortAction(user_id, page_name, table_name, sortData, columns);
toast.dismiss({ containerId: "datatable" });
};
const handleDismiss = () => {
toast.dismiss({containerId: "datatable"});
toast.dismiss({ containerId: "datatable" });
};
return (
<Box sx={{width: "100%"}}>
<Box sx={{display: "flex", alignItems: "center", justifyContent: "space-between", mb: 1}}>
<Typography color="#155175" variant="subtitle1" sx={{fontWeight: "500"}}>
<Box sx={{ width: "100%" }}>
<Box sx={{ display: "flex", alignItems: "center", justifyContent: "space-between", mb: 1 }}>
<Typography color="#155175" variant="subtitle1" sx={{ fontWeight: "500" }}>
ذخیره سازی تغییرات
</Typography>
<SaveIcon sx={{color: "#155175"}}/>
<SaveIcon sx={{ color: "#155175" }} />
</Box>
<Box sx={{display: "flex", flexDirection: "column"}}>
<Typography variant="caption">
آیا مایل به ذخیره تغییر های اعمال شده برای دفعات بعد هستید؟
</Typography>
<Box sx={{ display: "flex", flexDirection: "column" }}>
<Typography variant="caption">آیا مایل به ذخیره تغییر های اعمال شده برای دفعات بعد هستید؟</Typography>
</Box>
<Box sx={{display: "flex", gap: 1, mt: 1}}>
<Button variant="contained" onClick={handleDismiss} sx={{
backgroundColor: "#792626",
':hover': {backgroundColor: "#792626"},
boxShadow: "rgba(0, 0, 0, 0.23) 0px 6px 6px, rgba(0, 0, 0, 0.19) 10px 0px 20px",
}}>رد
کردن</Button>
<Button variant="contained" component="label" endIcon={<DownloadIcon/>}
onClick={onSaveFilter}
sx={{
backgroundColor: "#155175",
':hover': {backgroundColor: "#155175"},
boxShadow: "rgba(0, 0, 0, 0.23) 0px 6px 6px, rgba(0, 0, 0, 0.19) 10px 0px 20px",
}}>ذخیره
فیلتر</Button>
<Box sx={{ display: "flex", gap: 1, mt: 1 }}>
<Button
variant="contained"
onClick={handleDismiss}
sx={{
backgroundColor: "#792626",
":hover": { backgroundColor: "#792626" },
boxShadow: "rgba(0, 0, 0, 0.23) 0px 6px 6px, rgba(0, 0, 0, 0.19) 10px 0px 20px",
}}
>
رد کردن
</Button>
<Button
variant="contained"
component="label"
endIcon={<DownloadIcon />}
onClick={onSaveFilter}
sx={{
backgroundColor: "#155175",
":hover": { backgroundColor: "#155175" },
boxShadow: "rgba(0, 0, 0, 0.23) 0px 6px 6px, rgba(0, 0, 0, 0.19) 10px 0px 20px",
}}
>
ذخیره
</Button>
</Box>
</Box>
);

60
src/core/components/NotificationDesign/AskForKeepFilter.jsx
View File

@@ -1,60 +0,0 @@
'use client'
import SaveIcon from '@mui/icons-material/Save';
import {Box, Button, Typography} from "@mui/material";
import DownloadIcon from '@mui/icons-material/Download';
import {toast} from "react-toastify";
import useTableSetting from "@/lib/hooks/useTableSetting";
function AskForKeepFilter({values, user_id, page_name, table_name, columns}) {
const {filterAction} = useTableSetting();
const onSaveFilter = () => {
const filteredItems = Object.keys(values).map(key => {
const value = values[key].value;
if (value !== "" &&
!(Array.isArray(value) && (value.length === 0 || (value.length === 2 && value[0] === "" && value[1] === "")))) {
return values[key];
}
}).filter(Boolean);
filterAction(user_id, page_name, table_name, filteredItems, columns)
toast.dismiss({containerId: "datatable", id: "filter"});
};
const handleDismiss = () => {
toast.dismiss({containerId: "datatable", id: "filter"});
};
return (
<Box sx={{width: "100%"}}>
<Box sx={{display: "flex", alignItems: "center", justifyContent: "space-between", mb: 1}}>
<Typography color="#155175" variant="subtitle1" sx={{fontWeight: "500"}}>
ذخیره سازی فیلتر
</Typography>
<SaveIcon sx={{color: "#155175"}}/>
</Box>
<Box sx={{display: "flex", flexDirection: "column"}}>
<Typography variant="caption">
آیا مایل به ذخیره فیلتر های اعمال شده برای دفعات بعد هستید؟
</Typography>
</Box>
<Box sx={{display: "flex", gap: 1, mt: 1}}>
<Button variant="contained" onClick={handleDismiss} sx={{
backgroundColor: "#792626",
':hover': {backgroundColor: "#792626"},
boxShadow: "rgba(0, 0, 0, 0.23) 0px 6px 6px, rgba(0, 0, 0, 0.19) 10px 0px 20px",
}}>رد
کردن</Button>
<Button variant="contained" component="label" endIcon={<DownloadIcon/>}
onClick={onSaveFilter}
sx={{
backgroundColor: "#155175",
':hover': {backgroundColor: "#155175"},
boxShadow: "rgba(0, 0, 0, 0.23) 0px 6px 6px, rgba(0, 0, 0, 0.19) 10px 0px 20px",
}}>ذخیره
فیلتر</Button>
</Box>
</Box>
);
}
export default AskForKeepFilter;

54
src/core/components/NotificationDesign/AskForKeepSort.jsx
View File

@@ -1,54 +0,0 @@
'use client'
import SaveIcon from '@mui/icons-material/Save';
import {Box, Button, Typography} from "@mui/material";
import DownloadIcon from '@mui/icons-material/Download';
import {toast} from "react-toastify";
import useTableSetting from "@/lib/hooks/useTableSetting";
function AskForKeepSort({event, user_id, page_name, table_name, flatColumns}) {
const {settingStore, sortAction} = useTableSetting();
const onSaveFilter = () => {
const settingValue = event(settingStore?.[user_id]?.[page_name]?.[table_name]?.['sorts'] || []);
sortAction(user_id, page_name, table_name, settingValue, flatColumns);
toast.dismiss({containerId: "filtering", id: "sort"});
};
const handleDismiss = () => {
toast.dismiss({containerId: "filtering", id: "sort"});
};
return (
<Box sx={{width: "100%"}}>
<Box sx={{display: "flex", alignItems: "center", justifyContent: "space-between", mb: 1}}>
<Typography color="#155175" variant="subtitle1" sx={{fontWeight: "500"}}>
ذخیره سازی ترتیب
</Typography>
<SaveIcon sx={{color: "#155175"}}/>
</Box>
<Box sx={{display: "flex", flexDirection: "column"}}>
<Typography variant="caption">
آیا مایل به ذخیره ترتیب های اعمال شده برای دفعات بعد هستید؟
</Typography>
</Box>
<Box sx={{display: "flex", gap: 1, mt: 1}}>
<Button variant="contained" onClick={handleDismiss} sx={{
backgroundColor: "#792626",
':hover': {backgroundColor: "#792626"},
boxShadow: "rgba(0, 0, 0, 0.23) 0px 6px 6px, rgba(0, 0, 0, 0.19) 10px 0px 20px",
}}>رد
کردن</Button>
<Button variant="contained" component="label" endIcon={<DownloadIcon/>}
onClick={onSaveFilter}
sx={{
backgroundColor: "#155175",
':hover': {backgroundColor: "#155175"},
boxShadow: "rgba(0, 0, 0, 0.23) 0px 6px 6px, rgba(0, 0, 0, 0.19) 10px 0px 20px",
}}>ذخیره
ترتیب</Button>
</Box>
</Box>
);
}
export default AskForKeepSort;