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

formatted

Browse Source
This commit is contained in:
Amirhossein Mahmoodi
2024-07-09 13:58:13 +03:30
parent 863bdaca95
commit bc73725138
82 changed files with 2206 additions and 3082 deletions
Download Patch File Download Diff File Expand all files Collapse all files

83
src/core/components/DataTable/toolbar/TopToolbar.js
View File

@@ -1,12 +1,12 @@
import {getCommonToolbarStyles, parseFromValuesOrFunc} from "@/core/utils/utils";
import {Box, useMediaQuery} from "@mui/material";
import { getCommonToolbarStyles, parseFromValuesOrFunc } from "@/core/utils/utils";
import { Box, useMediaQuery } from "@mui/material";
import DataTable_LinearProgressBar from "./LinearProgressBar";
import DataTable_TablePagination from "./TablePagination";
import DataTable_ToolbarInternalButtons from "./ToolbarInternalButtons";
import FilterColumn from "@/core/components/DataTable/filter";
import RefactorTable from "@/core/components/DataTable/refactor/RefactorTable";
const DataTable_TopToolbar = ({table, columns, table_url, user_id, page_name, table_name}) => {
const DataTable_TopToolbar = ({ table, columns, table_url, user_id, page_name, table_name }) => {
const {
getState,
options: {
@@ -16,19 +16,16 @@ const DataTable_TopToolbar = ({table, columns, table_url, user_id, page_name, ta
positionPagination,
renderTopToolbarCustomActions,
},
refs: {topToolbarRef},
refs: { topToolbarRef },
} = table;
const {isFullScreen, showGlobalFilter} = getState();
const { isFullScreen, showGlobalFilter } = getState();
const isMobile = useMediaQuery('(max-width:720px)');
const isTablet = useMediaQuery('(max-width:1024px)');
const isMobile = useMediaQuery("(max-width:720px)");
const isTablet = useMediaQuery("(max-width:1024px)");
const toolbarProps = parseFromValuesOrFunc(muiTopToolbarProps, {table});
const toolbarProps = parseFromValuesOrFunc(muiTopToolbarProps, { table });
const stackAlertBanner =
isMobile ||
!!renderTopToolbarCustomActions ||
(showGlobalFilter && isTablet);
const stackAlertBanner = isMobile || !!renderTopToolbarCustomActions || (showGlobalFilter && isTablet);
return (
<Box
@@ -41,51 +38,55 @@ const DataTable_TopToolbar = ({table, columns, table_url, user_id, page_name, ta
}
}}
sx={(theme) => ({
...getCommonToolbarStyles({table, theme}),
position: isFullScreen ? 'sticky' : 'relative',
top: isFullScreen ? '0' : undefined,
...(parseFromValuesOrFunc(toolbarProps?.sx, theme)),
...getCommonToolbarStyles({ table, theme }),
position: isFullScreen ? "sticky" : "relative",
top: isFullScreen ? "0" : undefined,
...parseFromValuesOrFunc(toolbarProps?.sx, theme),
})}
>
<Box
sx={{
alignItems: 'flex-start',
boxSizing: 'border-box',
display: 'flex',
gap: '0.5rem',
justifyContent: 'space-between',
p: '0.5rem',
position: stackAlertBanner ? 'relative' : 'absolute',
alignItems: "flex-start",
boxSizing: "border-box",
display: "flex",
gap: "0.5rem",
justifyContent: "space-between",
p: "0.5rem",
position: stackAlertBanner ? "relative" : "absolute",
right: 0,
top: 0,
width: '100%',
width: "100%",
}}
>
{renderTopToolbarCustomActions?.({table}) ?? <span/>}
{renderTopToolbarCustomActions?.({ table }) ?? <span />}
{enableToolbarInternalActions && (
<Box
sx={{
alignItems: 'center',
display: 'flex',
flexWrap: 'wrap-reverse',
gap: '0.5rem',
justifyContent: 'flex-end',
alignItems: "center",
display: "flex",
flexWrap: "wrap-reverse",
gap: "0.5rem",
justifyContent: "flex-end",
}}
>
<RefactorTable/>
<FilterColumn columns={columns} table_url={table_url} user_id={user_id} page_name={page_name}
table_name={table_name}/>
<DataTable_ToolbarInternalButtons table={table}/>
<RefactorTable />
<FilterColumn
columns={columns}
table_url={table_url}
user_id={user_id}
page_name={page_name}
table_name={table_name}
/>
<DataTable_ToolbarInternalButtons table={table} />
</Box>
)}
</Box>
{enablePagination &&
['both', 'top'].includes(positionPagination ?? '') && (
<DataTable_TablePagination position="top" table={table}/>
)}
<DataTable_LinearProgressBar isTopToolbar table={table}/>
{enablePagination && ["both", "top"].includes(positionPagination ?? "") && (
<DataTable_TablePagination position="top" table={table} />
)}
<DataTable_LinearProgressBar isTopToolbar table={table} />
</Box>
);
}
};
export default DataTable_TopToolbar
export default DataTable_TopToolbar;