#

whycq

2025-02-20 95fd5b01ceb0db9cb5065701efb9789d5500b922

#

 rsf-admin/src/i18n/en.js

@@ -108,6 +108,7 @@
        dashboard: 'Dashboard',
        basicInfo: 'BasicInfo',
        settings: 'Settings',
        basicInfo: 'BasicInfo',
        system: 'System',
        user: 'User',
        role: 'Role',

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

@@ -32,7 +32,7 @@
    AutocompleteInput,
    DeleteButton,
} from 'react-admin';
import { Box, Typography, Card, Stack } from '@mui/material';
import { Box, Typography, Card, Stack,LinearProgress } from '@mui/material';
import { styled } from '@mui/material/styles';
import MatnrCreate from "./MatnrCreate";
import MatnrPanel from "./MatnrPanel";
@@ -43,6 +43,7 @@
import MyField from "../components/MyField";
import { PAGE_DRAWER_WIDTH, OPERATE_MODE, DEFAULT_PAGE_SIZE } from '@/config/setting';
import * as Common from '@/utils/common';
import MatListAside from './MatnrListAside';

const StyledDatagrid = styled(DatagridConfigurable)(({ theme }) => ({
    '& .css-1vooibu-MuiSvgIcon-root': {
@@ -71,8 +72,8 @@
    <ReferenceInput source="groupId" label="table.field.matnr.groupId" reference="matnrGroup">
        <AutocompleteInput label="table.field.matnr.groupId" optionText="code" filterToQuery={(val) => ({ code: val })} />
    </ReferenceInput>,
    <ReferenceInput source="rglarId" label="table.field.matnr.rglarId" reference="rglarId">
        <AutocompleteInput label="table.field.matnr.rglarId" optionText="code" filterToQuery={(val) => ({ code: val })} />
    <ReferenceInput source="batchRegularId" label="table.field.matnr.batchRegularId" reference="batchRegular">
        <AutocompleteInput label="table.field.matnr.batchRegularId" optionText="code" filterToQuery={(val) => ({ code: val })} />
    </ReferenceInput>,
    <TextInput source="erpCode" label="table.field.matnr.erpCode" />,
    <TextInput source="spec" label="table.field.matnr.spec" />,
@@ -83,9 +84,9 @@
    <TextInput source="describle" label="table.field.matnr.describle" />,
    <NumberInput source="nromNum" label="table.field.matnr.nromNum" />,
    <TextInput source="unit" label="table.field.matnr.unit" />,
    <TextInput source="purUnit" label="table.field.matnr.purUnit" />,
    <TextInput source="purchaseUnit" label="table.field.matnr.purchaseUnit" />,
    <TextInput source="stockUnit" label="table.field.matnr.stockUnit" />,
    <SelectInput source="stockLevel" label="table.field.matnr.stockLevel"
    <SelectInput source="stockLeval" label="table.field.matnr.stockLeval"
        choices={[
            { id: 0, name: ' A' },
            { id:   1, name: ' B' },
@@ -98,12 +99,12 @@
            { id:  1, name: ' 是' },
        ]}
    />,
    <NumberInput source="safeQty" label="table.field.matnr.safeQty" />,
    <NumberInput source="safetyQty" label="table.field.matnr.safetyQty" />,
    <NumberInput source="minQty" label="table.field.matnr.minQty" />,
    <NumberInput source="maxQty" label="table.field.matnr.maxQty" />,
    <NumberInput source="stagn" label="table.field.matnr.stagn" />,
    <NumberInput source="valid" label="table.field.matnr.valid" />,
    <NumberInput source="validWarn" label="table.field.matnr.validWarn" />,
    <NumberInput source="stagnate" label="table.field.matnr.stagnate" />,
    <NumberInput source="validity" label="table.field.matnr.validity" />,
    <NumberInput source="validityWarr" label="table.field.matnr.validityWarr" />,
    <NumberInput source="flagCheck" label="table.field.matnr.flagCheck" />,

    <TextInput label="common.field.memo" source="memo" />,
@@ -118,11 +119,91 @@
    />,
]

const MatnrListContent = (props) => {
    const translate = useTranslate();
    const { isLoading } = useListContext();

    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', '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} alwaysOn>
                    <TextField source="code" />
                </ReferenceField>
                <ReferenceField source="batchRegularId" label="table.field.matnr.batchRegularId" 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.purchaseUnit" />
                <TextField source="stockUnit" label="table.field.matnr.stockUnit" />
                <TextField source="stockLeval$" label="table.field.matnr.stockLeval" sortable={false} />
                <TextField source="isLabelMange$" label="table.field.matnr.isLabelMange" sortable={false} />
                <NumberField source="safetyQty" label="table.field.matnr.safetyQty" />
                <NumberField source="minQty" label="table.field.matnr.minQty" />
                <NumberField source="maxQty" label="table.field.matnr.maxQty" />
                <NumberField source="stagnate" label="table.field.matnr.stagnate" />
                <NumberField source="validity" label="table.field.matnr.validity" />
                <NumberField source="validityWarr" label="table.field.matnr.validityWarr" />
                <NumberField source="flagCheck" label="table.field.matnr.flagCheck" />

                <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>
        </Box>
    );
    
}

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

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


    return (
        <Box display="flex">
@@ -148,63 +229,9 @@
                    </TopToolbar>
                )}
                perPage={DEFAULT_PAGE_SIZE}
                aside={ <MatListAside /> }
            >
                <StyledDatagrid
                    preferenceKey='matnr'
                    bulkActionButtons={() => <BulkDeleteButton mutationMode={OPERATE_MODE} />}
                    rowClick={(id, resource, record) => false}
                    expand={() => <MatnrPanel />}
                    expandSingle={true}
                    omit={['id', '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="code" />
                    </ReferenceField>
                    <ReferenceField source="rglarId" label="table.field.matnr.rglarId" reference="rglarId" 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="purUnit" 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" />

                    <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>
                <MatnrListContent />
            </List>
            <MatnrCreate
                open={createDialog}

 rsf-admin/src/page/matnr/MatnrListAside.jsx

New file
@@ -0,0 +1,112 @@
import React, { useState, useRef, useEffect, useMemo, useCallback } from "react";
import request from '@/utils/request';
import {
    SavedQueriesList,
    FilterLiveSearch,
    FilterList,
    FilterListItem,
    useStore,
    FilterFormInput,
    FilterLiveForm,
    TextInput,
    useGetList
} from 'react-admin';
import BookmarkIcon from '@mui/icons-material/BookmarkBorder';
import { Box, Typography, Card, CardContent, useTheme, TextField } from '@mui/material';
import { RichTreeView } from "@mui/x-tree-view/RichTreeView";
import { TreeItem2 } from "@mui/x-tree-view/TreeItem2";
import WcIcon from '@mui/icons-material/Wc';
import AccessTimeIcon from '@mui/icons-material/AccessTime';
import { useForm, Controller } from "react-hook-form";

const MatListAside = () => {
    const theme = useTheme();
    const treeData = [
        {
            id: '0655',
            label: '0655',
            editable: true,
            children: [
                {
                    id: 'grid-community', label: '@mui/x-data-grid', editable: true, children: [
                        { id: 'grid-community22', label: '@mui/x-data-grid', editable: true },]
                },
                { id: 'grid-pro', label: '@mui/x-data-grid-pro', editable: true },
                { id: 'grid-premium', label: '@mui/x-data-grid-premium', editable: true },
            ],
        },
        {
            id: 'pickers',
            label: 'Date and Time pickers',
            children: [
                {
                    id: 'pickers-community',
                    label: '@mui/x-date-pickers',
                    disabled: true,
                },
                { id: 'pickers-pro', label: '@mui/x-date-pickers-pro', editable: true },
            ],
        },
        {
            id: 'charts',
            label: 'Charts',
            children: [{ id: 'charts-community', label: '@mui/x-charts' }],
        },
        {
            id: 'tree-view',
            label: 'Tree View',
            children: [{ id: 'tree-view-community', label: '@mui/x-tree-view' }],
        },
        {
            id: 'tree-view2',
            label: 'Tree View3',
            children: [{ id: 'tree-view-community1', label: '@mui/x-tree-view' }],
        },
    ];



    const CustomCheckbox = React.forwardRef(function CustomCheckbox(props, ref) {
        return <input type="checkbox" ref={ref} {...props} />;
    });

    const CustomTreeItem = React.forwardRef(function CustomTreeItem(props, ref) {
        return (
            <TreeItem2
                {...props}
                ref={ref}
                slots={{
                    checkbox: CustomCheckbox,
                }}
            />
        );
    });


    return (
        <Card
            sx={{
                display: { xs: 'none', md: 'block', },
                order: -1,
                mr: 2,
                mt: 8,
                alignSelf: 'flex-start',
                border: theme.palette.mode === 'light' && '1px solid #e0e0e3',
                width: 250
            }}
        >
            <CardContent>
                <SavedQueriesList icon={<BookmarkIcon />} />
                <FilterLiveSearch source='groupId' hiddenLabel  />
                <RichTreeView
                    defaultExpandedItems={['grid', 'pickers']}
                    expansionTrigger="iconContainer"
                    items={ treeData }
                    slots={ CustomTreeItem }
                />
            </CardContent>
        </Card>
    )
}

export default MatListAside;