#

luxiaotao1123

2024-09-26 100bf8f14599f7abb08d8723fc90b80b9ef683fb

#

 zy-acs-flow/src/page/segment/SegmentList.jsx

@@ -31,13 +31,12 @@
    AutocompleteInput,
    DeleteButton,
    FunctionField,
    Count,
} from 'react-admin';
import { Box, Typography, Card, Stack } from '@mui/material';
import { Box, Typography, Card, Stack, useMediaQuery, Tabs, Tab, Divider } from '@mui/material';
import { styled } from '@mui/material/styles';
import SegmentCreate from "./SegmentCreate";
import SegmentPanel from "./SegmentPanel";
import EmptyData from "../components/EmptyData";
import MyCreateButton from "../components/MyCreateButton";
import MyExportButton from '../components/MyExportButton';
import PageDrawer from "../components/PageDrawer";
import MyField from "../components/MyField";
@@ -72,16 +71,11 @@
    <ReferenceInput source="agvId" label="table.field.segment.agvId" reference="agv">
        <AutocompleteInput label="table.field.segment.agvId" optionText="uuid" filterToQuery={(val) => ({ uuid: val })} />
    </ReferenceInput>,
    <NumberInput source="serial" label="table.field.segment.serial" />,
    <ReferenceInput source="startNode" label="table.field.segment.startNode" reference="code">
        <AutocompleteInput label="table.field.segment.startNode" optionText="data" filterToQuery={(val) => ({ data: val })} />
    </ReferenceInput>,
    <ReferenceInput source="endNode" label="table.field.segment.endNode" reference="code">
        <AutocompleteInput label="table.field.segment.endNode" optionText="data" filterToQuery={(val) => ({ data: val })} />
    </ReferenceInput>,
    <TextInput source="posType" label="table.field.segment.posType" />,
    <NumberInput source="backpack" label="table.field.segment.backpack" />,
    <TextInput source="state" label="table.field.segment.state" />,

    <TextInput label="common.field.memo" source="memo" />,
    <SelectInput
@@ -97,7 +91,6 @@
const SegmentList = () => {
    const translate = useTranslate();

    const [createDialog, setCreateDialog] = useState(false);
    const [drawerVal, setDrawerVal] = useState(false);

    return (
@@ -112,19 +105,93 @@
                    marginRight: !!drawerVal ? `${PAGE_DRAWER_WIDTH}px` : 0,
                }}
                title={"menu.segment"}
                empty={<EmptyData onClick={() => { setCreateDialog(true) }} />}
                empty={<EmptyData />}
                filters={filters}
                sort={{ field: "create_time", order: "desc" }}
                actions={(
                    <TopToolbar>
                        <FilterButton />
                        {/* <MyCreateButton onClick={() => { setCreateDialog(true) }} /> */}
                        <SelectColumnsButton preferenceKey='segment' />
                        <MyExportButton />
                    </TopToolbar>
                )}
                perPage={DEFAULT_PAGE_SIZE}
                filterDefaultValues={{ state: 'RUNNING' }}
            >
                <TabbedDatagrid />
            </List>
            <PageDrawer
                title='Segment Detail'
                drawerVal={drawerVal}
                setDrawerVal={setDrawerVal}
            >
            </PageDrawer>
        </Box>
    )
}

const tabs = [
    { id: 'INIT', name: 'INIT' },
    { id: 'WAITING', name: 'WAITING' },
    { id: 'RUNNING', name: 'RUNNING' },
    { id: 'FINISH', name: 'FINISH' },
];

const TabbedDatagrid = () => {
    const { filterValues, setFilters, displayedFilters } = useListContext();
    const isXSmall = useMediaQuery(theme =>
        theme.breakpoints.down('sm')
    );

    const handleChange = useCallback((event, value) => {
        setFilters && setFilters(
            { ...filterValues, state: value },
            displayedFilters
        );
    }, [filterValues, setFilters, displayedFilters]);


    return (
        <>
            <Tabs
                variant="fullWidth"
                centered
                value={filterValues.state}
                indicatorColor="primary"
                onChange={handleChange}
            >
                {tabs.map(item => {
                    return <Tab
                        key={item.id}
                        value={item.id}
                        label={
                            <span>
                                {item.name}
                                {/* (
                                <Count
                                    filter={{
                                        ...filterValues,
                                        state: item.name,
                                    }}
                                    sx={{ lineHeight: 'inherit' }}
                                />
                                ) */}
                            </span>
                        }
                    />
                })}
            </Tabs>
            <Divider />
            {(isXSmall || true) && (
                <>
                    {(
                        filterValues.state === 'INIT'
                        || filterValues.state === 'WAITING'
                        || filterValues.state === 'RUNNING'
                        || filterValues.state === 'FINISH'
                    )
                        && (
                            <>
                <StyledDatagrid
                    preferenceKey='segment'
                    bulkActionButtons={() => <BulkDeleteButton mutationMode={OPERATE_MODE} />}
@@ -147,9 +214,6 @@
                        <TextField source="uuid" />
                    </ReferenceField>
                    <NumberField source="serial" label="table.field.segment.serial" />
                    {/* <ReferenceField source="startNode" label="table.field.segment.startNode" reference="code" link={false} sortable={false}>
                        <TextField source="data" />
                    </ReferenceField> */}
                    <ReferenceField source="endNode" label="table.field.segment.endNode" reference="code" link={false} sortable={false}>
                        <TextField source="data" />
                    </ReferenceField>
@@ -172,18 +236,11 @@
                        </>
                    )} /> */}
                </StyledDatagrid>
            </List>
            <SegmentCreate
                open={createDialog}
                setOpen={setCreateDialog}
            />
            <PageDrawer
                title='Segment Detail'
                drawerVal={drawerVal}
                setDrawerVal={setDrawerVal}
            >
            </PageDrawer>
        </Box>
                            </>
                        )}
                </>
            )}
        </>
    )
}