#

luxiaotao1123

2024-11-04 7f70cb15d035f0c233b9e62b9e43aa985317c908

 zy-acs-flow/src/page/agv/AgvList.jsx

@@ -8,7 +8,7 @@
    SelectColumnsButton,
    EditButton,
    FilterButton,
    CreateButton,
    useRefresh,
    ExportButton,
    BulkDeleteButton,
    WrapperField,
@@ -30,8 +30,13 @@
    ReferenceArrayInput,
    AutocompleteInput,
    DeleteButton,
    useGetIdentity,
    ListBase,
    Title,
    Pagination,
    ListToolbar,
} from 'react-admin';
import { Box, Typography, Card, Stack } from '@mui/material';
import { Box, Typography, LinearProgress, Stack } from '@mui/material';
import { styled } from '@mui/material/styles';
import AgvCreate from "./AgvCreate";
import AgvPanel from "./AgvPanel";
@@ -40,8 +45,64 @@
import MyExportButton from '../components/MyExportButton';
import PageDrawer from "../components/PageDrawer";
import MyField from "../components/MyField";
import { PAGE_DRAWER_WIDTH, OPERATE_MODE } from '@/config/setting';
import { PAGE_DRAWER_WIDTH, OPERATE_MODE, DEFAULT_PAGE_SIZE, CUSTOM_PAGES_DATA_INTERVAL } from '@/config/setting';
import * as Common from '@/utils/common';
import { ImageList } from "./GridList";
import { AgvListFilter } from "./AgvListFilter";

export const AgvGrid = () => {
    const [createDialog, setCreateDialog] = useState(false);

    return (
        <>
            <ListBase perPage={50} sort={{ field: "create_time", order: "asc" }}>
                <AgvGridLayout
                    setCreateDialog={setCreateDialog}
                />
            </ListBase>
            <AgvCreate
                open={createDialog}
                setOpen={setCreateDialog}
            />
        </>
    )
}

const AgvGridLayout = ({ setCreateDialog }) => {
    const { data, isPending, filterValues, refetch } = useListContext();
    const hasFilters = filterValues && Object.keys(filterValues).length > 0;

    React.useEffect(() => {
        const intervalId = setInterval(() => {
            refetch();
        }, CUSTOM_PAGES_DATA_INTERVAL);

        return () => clearInterval(intervalId);
    }, [refetch]);

    if (isPending) return <LinearProgress />;
    if (!data?.length && !hasFilters) return <EmptyData onClick={() => { setCreateDialog(true) }} />;

    return (
        <Stack direction="row" component="div">
            <AgvListFilter />
            <Stack sx={{ width: '100%' }}>
                <Title title={"menu.agv"} />
                <ListToolbar actions={(
                    <TopToolbar>
                        <MyCreateButton onClick={() => { setCreateDialog(true) }} variant="contained" />
                        <MyExportButton />
                    </TopToolbar>
                )} />
                <ImageList />
                <Pagination rowsPerPageOptions={[10, 25, 50, 100]} />
            </Stack>
        </Stack>
    );
}




const StyledDatagrid = styled(DatagridConfigurable)(({ theme }) => ({
    '& .css-1vooibu-MuiSvgIcon-root': {
@@ -92,7 +153,7 @@
    />,
]

const AgvList = () => {
export const AgvList = () => {
    const translate = useTranslate();

    const [createDialog, setCreateDialog] = useState(false);
@@ -121,7 +182,7 @@
                        <MyExportButton />
                    </TopToolbar>
                )}
                perPage={25}
                perPage={DEFAULT_PAGE_SIZE}
            >
                <StyledDatagrid
                    preferenceKey='agv'
@@ -174,5 +235,3 @@
        </Box>
    )
}

export default AgvList;