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';
|
import PrintModal from './PrintModal';
|
import PrintIcon from '@mui/icons-material/Print';
|
const AsnOrderPanel = ({ billReload }) => {
|
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('/asnOrderItem/page', { ...parmas, orderId: asnId });
|
if (res?.data?.code === 200) {
|
setRows(res.data.data.records)
|
} else {
|
notify(res.data.msg);
|
}
|
}
|
|
|
useEffect(() => {
|
billReload.current = http
|
}, []);
|
|
|
const debouncedHttp = useMemo(() => debounce(http, 300), []);
|
|
const columns = [
|
{
|
field: 'orderId',
|
headerName: translate('table.field.asnOrderItem.orderId')
|
},
|
{
|
field: 'orderCode',
|
headerName: translate('table.field.asnOrderItem.orderCode'),
|
width: 150,
|
},
|
// {
|
// field: 'poDetlId',
|
// headerName: translate('table.field.asnOrderItem.poDetlId')
|
// },
|
{
|
field: 'poCode',
|
headerName: translate('table.field.asnOrderItem.poDetlCode')
|
},
|
{
|
field: 'matnrCode',
|
headerName: translate('table.field.asnOrderItem.matnrCode'),
|
width: 150,
|
},
|
{
|
field: 'maktx',
|
headerName: translate('table.field.asnOrderItem.maktx'),
|
width: 200,
|
},
|
{
|
field: 'anfme',
|
headerName: translate('table.field.asnOrderItem.purQty')
|
},
|
{
|
field: 'stockUnit',
|
headerName: translate('table.field.asnOrderItem.stockUnit')
|
},
|
// {
|
// field: 'purQty',
|
// headerName: translate('table.field.asnOrderItem.purQty')
|
// },
|
{
|
field: 'purUnit',
|
headerName: translate('table.field.asnOrderItem.purUnit')
|
},
|
{
|
field: 'qty',
|
headerName: translate('table.field.asnOrderItem.qty')
|
},
|
{
|
field: 'splrBatch',
|
headerName: translate('table.field.asnOrderItem.splrBatch')
|
},
|
{
|
field: 'splrCode',
|
headerName: translate('table.field.asnOrderItem.splrCode')
|
},
|
{
|
field: 'splrName',
|
headerName: translate('table.field.asnOrderItem.splrName')
|
},
|
{
|
field: 'trackCode',
|
headerName: translate('table.field.asnOrderItem.barcode'),
|
width: 150
|
},
|
{
|
field: 'prodTime',
|
headerName: translate('table.field.asnOrderItem.prodTime')
|
},
|
{
|
field: 'packName',
|
headerName: translate('table.field.asnOrderItem.packName')
|
},
|
{
|
field: 'action',
|
headerName: '操作',
|
width: 70,
|
lockPosition: 'left',
|
renderCell: (params) => (
|
<PrintButton rows={[params.row.id]} />
|
),
|
|
},]
|
|
const [selectedRows, setSelectedRows] = useState([]);
|
|
const handleSelectionChange = (ids) => {
|
setSelectedRows(ids)
|
|
};
|
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="搜索物料" sx={{ width: '300px' }} size="small" />
|
|
<div style={{ display: 'flex', gap: '10px' }}>
|
<PrintsButton rows={selectedRows} />
|
</div>
|
</div>
|
|
|
<DataGrid
|
sx={{ width: 'calc(100vw - 280px)' }}
|
size="small"
|
rows={rows}
|
columns={columns}
|
disableRowSelectionOnClick
|
checkboxSelection
|
onRowSelectionModelChange={handleSelectionChange}
|
selectionModel={selectedRows}
|
disableColumnMenu={true}
|
disableColumnSorting
|
disableMultipleColumnsSorting
|
columnHeaderHeight={40}
|
rowHeight={42}
|
initialState={{
|
pagination: {
|
paginationModel: {
|
pageSize: 10,
|
},
|
},
|
}}
|
pageSizeOptions={[15, 25, 50]}
|
/>
|
</Box >
|
|
);
|
};
|
|
export default AsnOrderPanel;
|
|
const PrintsButton = ({ rows }) => {
|
const record = useRecordContext();
|
const { resource, selectedIds } = useListContext();
|
const notify = useNotify();
|
const refresh = useRefresh();
|
const translate = useTranslate();
|
|
const [createDialog, setCreateDialog] = useState(false);
|
|
const modalChange = () => {
|
if (rows?.length === 0) {
|
notify('请选择物料');
|
return;
|
} else {
|
setCreateDialog(true)
|
}
|
|
}
|
|
return (
|
<>
|
<Button size="small" color="secondary" onClick={modalChange} startIcon={<PrintIcon />}>{translate("toolbar.batchPrint")}</Button>
|
|
<PrintModal
|
open={createDialog}
|
setOpen={setCreateDialog}
|
rows={rows}
|
/>
|
</>
|
)
|
}
|
|
const PrintButton = ({ rows }) => {
|
const record = useRecordContext();
|
|
const notify = useNotify();
|
const refresh = useRefresh();
|
|
const [createDialog, setCreateDialog] = useState(false);
|
const translate = useTranslate();
|
|
return (
|
<>
|
<Button size="small" color="secondary" onClick={() => setCreateDialog(true)} startIcon={<PrintIcon />}>{translate("toolbar.print")}</Button>
|
|
<PrintModal
|
open={createDialog}
|
setOpen={setCreateDialog}
|
rows={rows}
|
/>
|
</>
|
)
|
}
|
