即时库存功能优化

skyouc

2025-05-19 9d6170903806cb351975c9d68005837aec6a8578

 rsf-admin/src/page/basicInfo/matnr/MatnrList.jsx

@@ -31,8 +31,11 @@
    ReferenceArrayInput,
    AutocompleteInput,
    DeleteButton,
    useRefresh,
    Button

} from 'react-admin';
import { Box, Typography, Card, Stack,LinearProgress } from '@mui/material';
import { Box, Typography, Card, Stack, LinearProgress, Tooltip } from '@mui/material';
import { styled } from '@mui/material/styles';
import MatnrCreate from "./MatnrCreate";
import MatnrPanel from "./MatnrPanel";
@@ -40,33 +43,62 @@
import MyCreateButton from "@/page/components/MyCreateButton";
import MyExportButton from '@/page/components/MyExportButton';
import PageDrawer from "@/page/components/PageDrawer";
import MyField from "@/page/components/MyField";
import TooltipField from "@/page/components/TooltipField";
import { PAGE_DRAWER_WIDTH, OPERATE_MODE, DEFAULT_PAGE_SIZE } from '@/config/setting';
import * as Common from '@/utils/common';
import ImportButton from "@/page/components/ImportButton";
import ImportButton from "../../components/ImportButton";
import MatListAside from './MatnrListAside';
import { display, height, width } from "@mui/system";
import DashboardIcon from '@mui/icons-material/Dashboard';
import EditIcon from '@mui/icons-material/Edit';
import PrintIcon from '@mui/icons-material/Print';
import request from '@/utils/request';
import BatchModal from './BatchModal';
import BatchGropuModal from './BatchGropuModal';
import PrintModal from './PrintModal';
import LinkIcon from '@mui/icons-material/Link';
import BindModal from './BindModal';

const StyledDatagrid = styled(DatagridConfigurable)(({ theme }) => ({
    '& .css-1vooibu-MuiSvgIcon-root': {
        height: '.9em'
    },

    '& .RaDatagrid-row': {
        cursor: 'auto'
    },
    '& .RaList-content': { 
        width: '200px'
    },
    '& .RaList-main': {
        minHeight: '90vh'
    },
    '& .column-name': {
    },
    '& .opt': {
        width: 200
    },
    '& .name': {
        width: '100px',

    },
    '& .name .MuiTypography-root': {
        whiteSpace: 'nowrap',
        overflow: 'hidden',
        textOverflow: 'ellipsis',
        display: 'block',
        width: '200px',
    },
    '& .RaDatagrid-table': {
        width: '100%',
        position: 'relative',
    }
}));

const filters = [
    <SearchInput source="condition" alwaysOn />,
    <DateInput label='common.time.after' source="timeStart" alwaysOn />,
    <DateInput label='common.time.before' source="timeEnd" alwaysOn />,

    <TextInput source="name" label="table.field.matnr.name" />,
    <TextInput source="code" label="table.field.matnr.code" />,
    <TextInput source="name" label="table.field.matnr.name" alwaysOn />,
    <TextInput source="code" label="table.field.matnr.code" alwaysOn />,
    <ReferenceInput source="shipperId$" label="table.field.matnr.shipperId" reference="shipper">
        <AutocompleteInput label="table.field.matnr.shipperId" optionText="name" filterToQuery={(val) => ({ name: val })} />
    </ReferenceInput>,
@@ -76,7 +108,7 @@
    <ReferenceInput source="rglarId" label="table.field.matnr.rglarId" reference="rglarId">
        <AutocompleteInput label="table.field.matnr.rglarId" optionText="code" filterToQuery={(val) => ({ code: val })} />
    </ReferenceInput>,
    <TextInput source="erpCode" label="table.field.matnr.erpCode" />,
    <TextInput source="platCode" label="table.field.matnr.platCode" />,
    <TextInput source="spec" label="table.field.matnr.spec" />,
    <TextInput source="model" label="table.field.matnr.model" />,
    <NumberInput source="weight" label="table.field.matnr.weight" />,
@@ -90,14 +122,14 @@
    <SelectInput source="stockLeval" label="table.field.matnr.stockLevel"
        choices={[
            { id: 0, name: ' A' },
            { id:   1, name: ' B' },
            { id:   2, name: 'C' },
            { id: 1, name: ' B' },
            { id: 2, name: 'C' },
        ]}
    />,
    <SelectInput source="isLabelMange" label="table.field.matnr.isLabelMange"
        choices={[
            { id: 0, name: ' 否' },
            { id:  1, name: ' 是' },
            { id: 1, name: ' 是' },
        ]}
    />,
    <NumberInput source="safeQty" label="table.field.matnr.safeQty" />,
@@ -107,7 +139,6 @@
    <NumberInput source="valid" label="table.field.matnr.valid" />,
    <NumberInput source="validWarn" label="table.field.matnr.validWarn" />,
    <NumberInput source="flagCheck" label="table.field.matnr.flagCheck" />,

    <TextInput label="common.field.memo" source="memo" />,
    <SelectInput
        label="common.field.status"
@@ -122,91 +153,126 @@

const MatnrListContent = (props) => {
    const translate = useTranslate();
    const notify = useNotify();
    const { isLoading } = useListContext();
    const [columns, setColumns] = useState([]);
    const refresh = useRefresh();
    useEffect(() => {
        getDynamicFields();
    }, []);

    const getDynamicFields = async () => {
        try {
            const {
                data: { code, data, msg },
            } = await request.get("/fields/enable/list");
            if (code === 200) {
                const arr = [
                    <NumberField key="id" source="id" />,
                    <TooltipField key="name" source="name" label="table.field.matnr.name" cellClassName="name" />,
                    <TextField key="code" source="code" label="table.field.matnr.code" />,
                    <TextField key="shipperId$" source="shipperId$" label="table.field.matnr.shipperId" />,
                    <ReferenceField key="groupId" source="groupId" label="table.field.matnr.groupId" reference="matnrGroup" link={false} sortable={false}>
                        <TextField source="name" />
                    </ReferenceField>,
                    <TextField key="platCode" source="platCode" label="table.field.matnr.platCode" />,
                    <TextField key="spec" source="spec" label="table.field.matnr.spec" />,
                    <TextField key="model" source="model" label="table.field.matnr.model" />,
                    <NumberField key="weight" source="weight" label="table.field.matnr.weight" />,
                    <TextField key="describle" source="describle" label="table.field.matnr.describle" />,
                    <NumberField key="nromNum" source="nromNum" label="table.field.matnr.nromNum" />,
                    <TextField key="unit" source="unit" label="table.field.matnr.unit" />,
                    <TextField key="purchaseUnit" source="purchaseUnit" label="table.field.matnr.purUnit" />,
                    <TextField key="stockUnit" source="stockUnit" label="table.field.matnr.stockUnit" />,
                    <TextField key="stockLeval$" source="stockLeval$" label="table.field.matnr.stockLevel" sortable={false} />,
                    <TextField key="flagLabelMange$" source="flagLabelMange$" label="table.field.matnr.isLabelMange" sortable={false} />,
                    <NumberField key="safeQty" source="safeQty" label="table.field.matnr.safeQty" />,
                    <NumberField key="minQty" source="minQty" label="table.field.matnr.minQty" />,
                    <NumberField key="maxQty" source="maxQty" label="table.field.matnr.maxQty" />,
                    <NumberField key="stagn" source="stagn" label="table.field.matnr.stagn" />,
                    <NumberField key="valid" source="valid" label="table.field.matnr.valid" />,
                    <NumberField key="validWarn" source="validWarn" label="table.field.matnr.validWarn" />,
                    <BooleanField key="flagCheck" source="flagCheck" label="table.field.matnr.flagCheck" sortable={false} />,
                    <ReferenceField key="updateBy" source="updateBy" label="common.field.updateBy" reference="user" link={false} sortable={false}>
                        <TextField source="nickname" />
                    </ReferenceField>,
                    <DateField key="updateTime" source="updateTime" label="common.field.updateTime" showTime />,
                    <ReferenceField key="createBy" source="createBy" label="common.field.createBy" reference="user" link={false} sortable={false}>
                        <TextField source="nickname" />
                    </ReferenceField>,
                    <DateField key="createTime" source="createTime" label="common.field.createTime" showTime />,
                    <BooleanField key="statusBool" source="statusBool" label="common.field.status" sortable={false} />,
                    <TextField key="memo" source="memo" label="common.field.memo" sortable={false} />,
                ]
                const fields = data.map(el => <TextField key={el.fields} source={`extendFields.[${el.fields}]`} label={el.fieldsAlise} />)
                const opt = <WrapperField key="opt" cellClassName="fixed" className="fixed" label="common.field.opt">
                    <EditButton sx={{ padding: '1px', fontSize: '.75rem' }} />
                    <PrintButton />
                </WrapperField>
                setColumns([...arr, ...fields, opt]);
                //filters添加过滤字段
                data.map(el => {
                    var i =0;
                    filters.map((item) =>{
                        if(item.key === el.fields){
                          i = 1;
                        }
                    })
                    i===0 && filters.push(<TextInput key={el.fields} source={el.fields} label={el.fieldsAlise} />)
                })
            } else {
                notify(msg);
            }
        } catch (error) {
            notify('请求出错');
        }
    };

    return (
        <Box sx={{ position: 'relative' }}>
                {isLoading && (
                    <LinearProgress
                        sx={{
                            height: "2px",
                            position: 'absolute',
                            top: 0,
                            left: 0,
                            right: 0,
                        }}
                    />
                )}
            <StyledDatagrid 
                preferenceKey='matnr'
                bulkActionButtons={() => <BulkDeleteButton mutationMode={OPERATE_MODE} />}
                rowClick={(id, resource, record) => false}
                expand={() => <MatnrPanel />}
                expandSingle={true}
                omit={['id','shipperId','erpCode','spec','model','weight','color','size','describle'
                    ,'nromNum','unit','purchaseUnit','stockUnit','stockLeval','isLabelMange','safeQty'
                    ,'minQty','maxQty','stagn','valid','validWarn','flagCheck','updateTime', 'updateBy'
                    , 'createTime', 'createBy', 'memo']}
            >
                <NumberField source="id" />
                <TextField source="name" label="table.field.matnr.name" />
                <TextField source="code" label="table.field.matnr.code" />
                <ReferenceField source="shipperId" label="table.field.matnr.shipperId" reference="shipper" link={false} sortable={false}>
                    <TextField source="name" />
                </ReferenceField>
                <ReferenceField source="groupId" label="table.field.matnr.groupId" reference="matnrGroup" link={false} sortable={false}>
                    <TextField source="name" />
                </ReferenceField>
                <ReferenceField source="rglarId" label="table.field.matnr.rglarId" reference="batchRegular" link={false} sortable={false}>
                    <TextField source="code" />
                </ReferenceField>
                <TextField source="erpCode" label="table.field.matnr.erpCode" />
                <TextField source="spec" label="table.field.matnr.spec" />
                <TextField source="model" label="table.field.matnr.model" />
                <NumberField source="weight" label="table.field.matnr.weight" />
                <TextField source="color" label="table.field.matnr.color" />
                <TextField source="size" label="table.field.matnr.size" />
                <TextField source="describle" label="table.field.matnr.describle" />
                <NumberField source="nromNum" label="table.field.matnr.nromNum" />
                <TextField source="unit" label="table.field.matnr.unit" />
                <TextField source="purchaseUnit" label="table.field.matnr.purUnit" />
                <TextField source="stockUnit" label="table.field.matnr.stockUnit" />
                <TextField source="stockLeval$" label="table.field.matnr.stockLevel" sortable={false} />
                <TextField source="isLabelMange$" label="table.field.matnr.isLabelMange" sortable={false} />
                <NumberField source="safeQty" label="table.field.matnr.safeQty" />
                <NumberField source="minQty" label="table.field.matnr.minQty" />
                <NumberField source="maxQty" label="table.field.matnr.maxQty" />
                <NumberField source="stagn" label="table.field.matnr.stagn" />
                <NumberField source="valid" label="table.field.matnr.valid" />
                <NumberField source="validWarn" label="table.field.matnr.validWarn" />
                <NumberField source="flagCheck" label="table.field.matnr.flagCheck" />
        <Box sx={{ position: 'relative', minHeight: "60vh", }}>
            {isLoading && (
                <LinearProgress
                    sx={{
                        height: "2px",
                        position: 'absolute',
                        top: 0,
                        left: 0,
                        right: 0,
                    }}
                />
            )}

                <ReferenceField source="updateBy" label="common.field.updateBy" reference="user" link={false} sortable={false}>
                    <TextField source="nickname" />
                </ReferenceField>
                <DateField source="updateTime" label="common.field.updateTime" showTime />
                <ReferenceField source="createBy" label="common.field.createBy" reference="user" link={false} sortable={false}>
                    <TextField source="nickname" />
                </ReferenceField>
                <DateField source="createTime" label="common.field.createTime" showTime />
                <BooleanField source="statusBool" label="common.field.status" sortable={false} />
                <TextField source="memo" label="common.field.memo" sortable={false} />
                <WrapperField cellClassName="opt" label="common.field.opt">
                    <EditButton sx={{ padding: '1px', fontSize: '.75rem' }} />
                    <DeleteButton sx={{ padding: '1px', fontSize: '.75rem' }} mutationMode={OPERATE_MODE} />
                </WrapperField>
            </StyledDatagrid>
            {columns.length > 0 &&
                <StyledDatagrid
                    preferenceKey='matnr'
                    bulkActionButtons={<>
                        <BatchGroupButton />
                        <BatchWarnButton />
                        <BatchFlagButton />
                        <BatchStatusButton />
                        <BatchLevelButton />
                        <BindButton />
                        <BatchPrintButton />
                        <BulkDeleteButton mutationMode={OPERATE_MODE} />
                    </>}
                    rowClick={(id, resource, record) => false}
                    omit={['id', 'shipperId', 'platCode', 'spec', 'model', 'weight', 'color', 'describle'
                        , 'nromNum', 'unit', 'purchaseUnit', 'stockUnit', 'stockLeval', 'isLabelMange', 'safeQty'
                        , 'minQty', 'maxQty', 'stagn', 'valid', 'validWarn', 'flagCheck', 'updateTime', 'updateBy'
                        , 'createTime', 'createBy', 'memo', 'rglarId', 'groupId', 'stockLevel']}
                >
                    {columns.map((column) => column)}
                </StyledDatagrid>}
        </Box>
    );
    
}


const MatnrList = () => {
    const translate = useTranslate();

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

    const notify = useNotify();

    return (
        <Box display="flex">
@@ -217,7 +283,7 @@
                        theme.transitions.create(['all'], {
                            duration: theme.transitions.duration.enteringScreen,
                        }),
                    marginRight: !!drawerVal ? `${PAGE_DRAWER_WIDTH}px` : 0,
                    marginRight: drawerVal ? `${PAGE_DRAWER_WIDTH}px` : 0,
                }}
                title={"menu.matnr"}
                empty={<EmptyData onClick={() => { setCreateDialog(true) }} />}
@@ -228,12 +294,12 @@
                        <FilterButton />
                        <MyCreateButton onClick={() => { setCreateDialog(true) }} />
                        <SelectColumnsButton preferenceKey='matnr' />
                        <ImportButton />
                        <ImportButton value={'matnr'} parmas={{}} />
                        <MyExportButton />
                    </TopToolbar>
                )}
                perPage={DEFAULT_PAGE_SIZE}
                aside={ <MatListAside /> }
                aside={<MatListAside />}
            >
                <MatnrListContent />
            </List>
@@ -251,4 +317,219 @@
    )
}

export default MatnrList;
MatnrList.Context = React.createContext()

export default MatnrList;

const EnableButton = () => {
    const record = useRecordContext();
    const notify = useNotify();
    const refresh = useRefresh();
    const enable = async () => {
        const res = await request.post('/loc/update', {
            ...record,
            status: +!record.status
        });
        if (res?.data?.code === 200) {
            refresh()
        } else {
            notify(res.data.msg);
        }
    }
    return (
        record.status === 1 ?
            (<Button onClick={enable} label={"toolbar.unenable"}>
                <DashboardIcon />
            </Button>) : (<Button onClick={enable} label={"toolbar.enable"}>
                <DashboardIcon />
            </Button>)

    )
}

const BatchStatusButton = () => {
    const record = useRecordContext();
    const notify = useNotify();
    const refresh = useRefresh();


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

    return (
        <>
            <Button onClick={() => setCreateDialog(true)} label={"toolbar.batchStatus"}>
                <EditIcon />
            </Button>

            <BatchModal
                open={createDialog}
                setOpen={setCreateDialog}
                fieldType={'status'}
            />
        </>

    )
}
const BatchLevelButton = () => {
    const record = useRecordContext();
    const notify = useNotify();
    const refresh = useRefresh();


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

    return (
        <>
            <Button onClick={() => setCreateDialog(true)} label={"toolbar.batchStockLevel"}>
                <EditIcon />
            </Button>

            <BatchModal
                open={createDialog}
                setOpen={setCreateDialog}
                fieldType={'stockLevel'}
            />
        </>

    )
}

const BatchWarnButton = () => {
    const record = useRecordContext();
    const notify = useNotify();
    const refresh = useRefresh();


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

    return (
        <>
            <Button onClick={() => setCreateDialog(true)} label={"toolbar.batchValidWarn"}>
                <EditIcon />
            </Button>

            <BatchModal
                open={createDialog}
                setOpen={setCreateDialog}
                fieldType={'validWarn'}
            />
        </>

    )
}

const BatchFlagButton = () => {
    const record = useRecordContext();
    const notify = useNotify();
    const refresh = useRefresh();


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

    return (
        <>
            <Button onClick={() => setCreateDialog(true)} label={"toolbar.batchFlagCheck"}>
                <EditIcon />
            </Button>

            <BatchModal
                open={createDialog}
                setOpen={setCreateDialog}
                fieldType={'flagCheck'}
            />
        </>

    )
}

const BatchGroupButton = () => {
    const record = useRecordContext();
    const notify = useNotify();
    const refresh = useRefresh();


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

    return (
        <>
            <Button onClick={() => setCreateDialog(true)} label={"toolbar.batchMatnrGropu"}>
                <EditIcon />
            </Button>

            <BatchGropuModal
                open={createDialog}
                setOpen={setCreateDialog}
            />
        </>

    )
}

const BatchPrintButton = () => {
    const record = useRecordContext();
    const { resource, selectedIds } = useListContext();
    const notify = useNotify();
    const refresh = useRefresh();

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

    return (
        <>
            <Button color="secondary" onClick={() => setCreateDialog(true)} label={"toolbar.print"}>
                <PrintIcon />
            </Button>

            <PrintModal
                open={createDialog}
                setOpen={setCreateDialog}
                rows={selectedIds}
            />
        </>
    )
}

const PrintButton = () => {
    const record = useRecordContext();

    const notify = useNotify();
    const refresh = useRefresh();

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

    return (
        <>
            <Button color="secondary" onClick={() => setCreateDialog(true)} label={"toolbar.print"}>
                <PrintIcon />
            </Button>

            <PrintModal
                open={createDialog}
                setOpen={setCreateDialog}
                rows={[record.id]}
            />
        </>
    )
}

const BindButton = () => {
    const record = useRecordContext();
    const notify = useNotify();
    const refresh = useRefresh();


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

    return (
        <>
            <Button onClick={() => setCreateDialog(true)} label={"toolbar.bindloc"}>
                <LinkIcon />
            </Button>

            <BindModal
                open={createDialog}
                setOpen={setCreateDialog}
            />
        </>

    )
}