skyouc
2025-03-29 f25d75ffb9b015e88e5eb816d397e0fbae10bff8
rsf-admin/src/page/asnOrderLog/AsnOrderLogPanel.jsx
New file
@@ -0,0 +1,143 @@
import React, { useState, useRef, useEffect, useMemo } from "react";
import { Box, Card, CardContent, Grid, Typography, Button, TextField, Tooltip, Paper, TableContainer, Table, TableBody, TableCell, TableHead, TableRow } from '@mui/material';
import {
    useTranslate,
    useRecordContext,
    useNotify,
    useRefresh,
    useListContext,
} from 'react-admin';
import PanelTypography from "../components/PanelTypography";
import * as Common from '@/utils/common'
import { styled } from "@mui/material/styles";
import request from '@/utils/request';
import debounce from 'lodash/debounce';
import { DataGrid } from '@mui/x-data-grid';
const AsnOrderLogPanel = () => {
    const record = useRecordContext();
    if (!record) return null;
    const translate = useTranslate();
    const notify = useNotify();
    const [rows, setRows] = useState([]);
    const [maktx, setMaktx] = useState('');
    const asnId = record.id;
    useEffect(() => {
        debouncedHttp({ maktx });
    }, [asnId, maktx]);
    const http = async (parmas) => {
        const res = await request.post('/asnOrderItemLog/page', { ...parmas, asnId });
        if (res?.data?.code === 200) {
            setRows(res.data.data.records)
        } else {
            notify(res.data.msg);
        }
    }
    const debouncedHttp = useMemo(() => debounce(http, 300), []);
    const columns = [
        {
            field: 'asnId',
            headerName: translate('table.field.asnOrderItemLog.asnId')
        },
        {
            field: 'asnCode',
            headerName: translate('table.field.asnOrderItemLog.asnCode')
        },
        {
            field: 'poDetlId',
            headerName: translate('table.field.asnOrderItemLog.poDetlId')
        },
        {
            field: 'poCode',
            headerName: translate('table.field.asnOrderItemLog.poDetlCode')
        },
        {
            field: 'matnrId',
            headerName: translate('table.field.asnOrderItemLog.matnrId')
        },
        {
            field: 'matnrCode',
            headerName: translate('table.field.asnOrderItemLog.matnrCode')
        },
        {
            field: 'maktx',
            headerName: translate('table.field.asnOrderItemLog.maktx')
        },
        {
            field: 'anfme',
            headerName: translate('table.field.asnOrderItemLog.purQty')
        },
        {
            field: 'purUnit',
            headerName: translate('table.field.asnOrderItemLog.purUnit')
        },
        {
            field: 'qty',
            headerName: translate('table.field.asnOrderItemLog.qty')
        },
        {
            field: 'splrBatch',
            headerName: translate('table.field.asnOrderItem.splrBatch')
        },
        {
            field: 'splrCode',
            headerName: translate('table.field.asnOrderItemLog.splrCode')
        },
        {
            field: 'splrName',
            headerName: translate('table.field.asnOrderItemLog.splrName')
        },
        {
            field: 'trackCode',
            headerName: translate('table.field.asnOrderItemLog.barcode')
        },
        {
            field: 'prodTime',
            headerName: translate('table.field.asnOrderItem.prodTime')
        },
        {
            field: 'packName',
            headerName: translate('table.field.asnOrderItemLog.packName')
        },
        {
            field: 'ntyStatus$',
            headerName: translate('table.field.asnOrderItemLog.ntyStatus')
        }]
    const maktxChange = (value) => {
        setMaktx(value)
    }
    return (
        <Box sx={{
            position: 'relative',
            padding: '5px 10px'
        }}>
            <div style={{ display: 'flex', justifyContent: 'space-between', marginBottom: '4px', alignItems: 'center' }}>
                <TextField value={maktx} onChange={(e) => maktxChange(e.target.value)} label="搜索物料" variant="outlined" sx={{ width: '300px' }} />
                <div style={{ display: 'flex', gap: '10px' }}>
                </div>
            </div>
            <DataGrid
                size="small"
                rows={rows}
                columns={columns}
                disableRowSelectionOnClick
                disableColumnMenu={true}
                disableColumnSorting
                disableMultipleColumnsSorting
            />
        </Box >
    );
};
export default AsnOrderLogPanel;