summary text

This commit is contained in:
2024-02-19 13:22:03 +03:30
parent e7ad977ede
commit fe8364fbb9
2 changed files with 64 additions and 15 deletions

View File

@@ -57,13 +57,12 @@ const TestDataTable = () => {
const [pageName, setPageName] = useState('loan');
const [tableName, setTableName] = useState('loan_table');
const {settingStore, hideAction, filterAction, sortAction, oldSorting} = useTableSetting();
console.log(settingStore)
const columns = useMemo(
() => [
{
accessorKey: 'name.firstName',
header: 'First Name',
header: 'نام',
size: 150,
id: "firstName",
enableColumnFilter: true,
@@ -77,7 +76,7 @@ const TestDataTable = () => {
},
{
accessorKey: 'name.lastName',
header: 'Last Name',
header: 'نام خانوادگی',
size: 150,
id: "lastName",
enableColumnFilter: true,
@@ -91,7 +90,7 @@ const TestDataTable = () => {
},
{
accessorKey: 'address',
header: 'Address',
header: 'آدرس',
size: 200,
id: "address",
enableColumnFilter: true,
@@ -105,7 +104,7 @@ const TestDataTable = () => {
},
{
accessorKey: 'city',
header: 'City',
header: 'شهر',
size: 150,
id: "city",
enableColumnFilter: true,
@@ -123,9 +122,10 @@ const TestDataTable = () => {
},
{
accessorKey: 'state',
header: 'State',
header: 'وضعیت',
size: 150,
id: "state",
text:'نام',
enableColumnFilter: true,
datatype: "text",
filterFn: "contains",
@@ -140,11 +140,11 @@ const TestDataTable = () => {
);
const onColumnVisibilityChange = (event) => {
const settingValue = event();
hideAction(userId, pageName, tableName, settingValue);
hideAction(userId, pageName, tableName, settingValue, columns);
};
const onSortingChange = (event) => {
const settingValue = event(settingStore?.[userId]?.[pageName]?.[tableName]?.['sorts'] || []);
sortAction(userId, pageName, tableName, settingValue);
sortAction(userId, pageName, tableName, settingValue, columns);
}
return <MaterialReactTable

View File

@@ -1,9 +1,11 @@
'use client'
import {createContext, useCallback, useEffect, useState} from "react";
export const TableSettingContext = createContext();
export const TableSettingProvider = ({children}) => {
const [settingStore, setSettingStore] = useState({});
useEffect(() => {
const _localStorage = localStorage.getItem("_setting-app")
if (_localStorage) {
@@ -11,16 +13,16 @@ export const TableSettingProvider = ({children}) => {
}
}, []);
const hideAction = useCallback((user_id, page_name, table_name, settingValue) => {
updateSettingStorage(user_id, page_name, table_name, "hides", settingValue);
},[])
const sortAction = useCallback((user_id, page_name, table_name, settingValue) => {
updateSettingStorage(user_id, page_name, table_name, "sorts", settingValue);
},[])
const hideAction = useCallback((user_id, page_name, table_name, settingValue, columns) => {
updateSettingStorage(user_id, page_name, table_name, "hides", settingValue, columns);
}, [])
const sortAction = useCallback((user_id, page_name, table_name, settingValue, columns) => {
updateSettingStorage(user_id, page_name, table_name, "sorts", settingValue, columns);
}, [])
const filterAction = (user_id, page_name, table_name, settingValue) => {
updateSettingStorage(user_id, page_name, table_name, "filters", settingValue);
}
const updateSettingStorage = (user_id, page_name, table_name, settingType, settingValue) => {
const updateSettingStorage = (user_id, page_name, table_name, settingType, settingValue, columns) => {
const prevLocalStorage = JSON.parse(localStorage.getItem("_setting-app")) || {};
const userSettings = prevLocalStorage[user_id] || {};
const pageSettings = userSettings[page_name] || {};
@@ -40,6 +42,10 @@ export const TableSettingProvider = ({children}) => {
[table_name]: {
...tableSettings,
[settingType]: Array.isArray(settingValue) ? [...newSettings] : {...newSettings},
summary: SummaryTextMessage({
...tableSettings,
[settingType]: Array.isArray(settingValue) ? [...newSettings] : {...newSettings},
}, columns)
},
},
},
@@ -48,6 +54,49 @@ export const TableSettingProvider = ({children}) => {
setSettingStore(updatedLocalStorage);
}
const SummaryTextMessage = (values, columns) => {
let SummaryText = "";
let HideText = "";
let FilterText;
let SortText = "";
if (values.sorts && values.sorts.length > 0) {
const _list = []
for (const sort of values.sorts) {
const _column = columns.find(column => column.id == sort.id)
_list.push(`${_column.header}` + `(${sort.desc ? "نزولی" : "صعودی"})`)
}
SortText = " مرتب شده بر اساس " + _list.join(", ")
}
if (values.hides) {
const hidesArray = Object.entries(values.hides).map((e) => ({id: e[0], value: e[1]}))
if (hidesArray.length > 0) {
const _list = []
for (const hide of hidesArray) {
if (hide.value) continue
const _column = columns.find(c => c.id == hide.id)
_list.push(_column.header)
}
HideText = "ستون های مخفی شده : " + _list.join(", ");
}
}
if (HideText || SortText) {
if (SortText) {
SummaryText += SortText;
if (HideText) {
SummaryText += " ; ";
}
}
if (HideText) {
SummaryText += HideText;
}
}
return SummaryText;
};
return (
<TableSettingContext.Provider
value={{settingStore, hideAction, sortAction, filterAction}}>