import { Box, Card, Grid, LinearProgress } from "@mui/material";
|
import React, { useState, useRef, useEffect, useMemo } from "react";
|
import {
|
List,
|
DatagridConfigurable,
|
SearchInput,
|
TopToolbar,
|
Button,
|
SelectColumnsButton,
|
EditButton,
|
FilterButton,
|
CreateButton,
|
ExportButton,
|
BulkDeleteButton,
|
WrapperField,
|
Toolbar,
|
useRecordContext,
|
useTranslate,
|
useNotify,
|
useListContext,
|
FunctionField,
|
TextField,
|
NumberField,
|
DateField,
|
BooleanField,
|
ReferenceField,
|
TextInput,
|
DateTimeInput,
|
DateInput,
|
SelectInput,
|
NumberInput,
|
ReferenceInput,
|
ReferenceArrayInput,
|
AutocompleteInput,
|
DeleteButton,
|
SimpleForm,
|
required,
|
Form,
|
} from 'react-admin';
|
import { PAGE_DRAWER_WIDTH, OPERATE_MODE, DEFAULT_PAGE_SIZE, DEFAULT_ITEM_PAGE_SIZE } from '@/config/setting';
|
import { styled } from '@mui/material/styles';
|
import { DataGrid } from '@mui/x-data-grid';
|
import request from '@/utils/request';
|
import DictSelect from "../../components/DictSelect";
|
import ConfirmationNumberOutlinedIcon from '@mui/icons-material/ConfirmationNumberOutlined';
|
import CloseSharpIcon from '@mui/icons-material/CloseSharp';
|
|
const StyledDatagrid = styled(DatagridConfigurable)(({ theme }) => ({
|
'& .css-1vooibu-MuiSvgIcon-root': {
|
height: '.9em'
|
},
|
'& .RaDatagrid-row': {
|
cursor: 'auto'
|
},
|
'& .column-maktx': {
|
width: 200
|
}
|
}));
|
|
|
const OutStockPublic = (props) => {
|
const { record, open } = props;
|
const notify = useNotify();
|
const translate = useTranslate();
|
const [formData, setFormData] = useState({
|
orderId: record?.id
|
});
|
useEffect(() => {
|
getWaveRule()
|
}, [formData, open])
|
|
const getWaveRule = async () => {
|
if (formData.waveId == null && formData.waveId == undefined) {
|
return
|
}
|
const res = await request.post('/outStock/order/getOutTaskItems', { ...formData });
|
if (res?.data?.code === 200) {
|
setRows(res.data.data.records)
|
} else {
|
notify(res.data.msg);
|
}
|
}
|
|
const handleChange = (value, name) => {
|
setFormData((prevData) => ({
|
...prevData,
|
[name]: value
|
}));
|
};
|
|
return (
|
<>
|
<Box>
|
<Grid sx={{ display: "flex" }} container rowSpacing={2} columnSpacing={2}>
|
<Grid item xl={6} gap={2} >
|
<Card>
|
<Form>
|
<ReferenceInput
|
source="type"
|
reference="waveRule"
|
>
|
<AutocompleteInput
|
label="table.field.waveRule.type"
|
onChange={(e) => handleChange(e, 'waveId')}
|
value={formData.type}
|
validate={required()}
|
/>
|
</ReferenceInput>
|
</Form>
|
{/* <DictSelect
|
label={translate("table.field.waveRule.type")}
|
onChange={(e) => handleChange(e.target.value, 'type')}
|
value={formData.type}
|
dictTypeCode="sys_wave_rule_code"
|
required
|
/> */}
|
<List
|
resource="outStockItem"
|
storeKey='outStockItem'
|
sx={{
|
flexGrow: 1,
|
transition: (theme) =>
|
theme.transitions.create(['all'], {
|
duration: theme.transitions.duration.enteringScreen,
|
}),
|
}}
|
title={"menu.outStockItem"}
|
empty={false}
|
filter={{ asnId: record?.id, deleted: 0 }}
|
sort={{ field: "create_time", order: "desc" }}
|
actions={(
|
<SelectColumnsButton preferenceKey='outStock' />
|
)}
|
perPage={DEFAULT_ITEM_PAGE_SIZE}
|
>
|
<LinearProgress
|
sx={{ height: "2px", position: 'absolute', top: 0, left: 0, right: 0, }}
|
/>
|
<StyledDatagrid
|
preferenceKey='outStockItem'
|
bulkActionButtons={false}
|
rowClick={false}
|
omit={['id', 'splrName', 'qty', 'poCode', 'workQty']}
|
>
|
<NumberField source="id" />
|
<TextField source="asnCode" label="table.field.outStockItem.asnCode" />
|
<TextField source="poCode" label="table.field.outStockItem.poCode" />
|
<TextField source="matnrCode" label="table.field.outStockItem.matnrCode" />
|
<TextField source="maktx" label="table.field.outStockItem.maktx" />
|
<NumberField source="anfme" label="table.field.outStockItem.anfme" />
|
<NumberField source="workQty" label="table.field.outStockItem.workQty" />
|
<NumberField source="qty" label="table.field.outStockItem.qty" />
|
<TextField source="stockUnit" label="table.field.outStockItem.stockUnit" />
|
<TextField source="splrName" label="table.field.outStockItem.splrName" />
|
</StyledDatagrid>
|
</List>
|
</Card>
|
</Grid>
|
<Grid item xl={6} gap={2}>
|
<Card>
|
<Box>
|
<DataGrid
|
rows={rows}
|
columns={columns}
|
initialState={{
|
pagination: {
|
paginationModel: {
|
pageSize: 15,
|
},
|
},
|
}}
|
pageSizeOptions={[15, 25, 35, 45]}
|
disableRowSelectionOnClick
|
/>
|
</Box>
|
<Box sx={{ textAlign: 'center' }}>
|
<Button label="toolbar.close" variant="outlined" size="medium" startIcon={<CloseSharpIcon />} sx={{ margin: '3.5em' }} />
|
<Button label="toolbar.confirm" variant="contained" size="medium" startIcon={<ConfirmationNumberOutlinedIcon />} />
|
</Box>
|
</Card>
|
</Grid>
|
</Grid>
|
</Box>
|
</>
|
);
|
}
|
|
|
|
const rows = [
|
{ id: 1, locCode: '03-02-1-2-1', container: 'Snow', batch: 'Jon', curQty: 14 },
|
{ id: 2, locCode: '03-02-1-2-1', container: 'Lannister', batch: 'Cersei', curQty: 31 },
|
{ id: 3, locCode: '03-02-1-2-1', container: 'Lannister', batch: 'Jaime', curQty: 31 },
|
{ id: 4, locCode: '03-02-1-2-1', container: 'Stark', batch: 'Arya', curQty: 11 },
|
{ id: 5, locCode: '03-02-1-2-1', container: 'Targaryen', batch: 'Daenerys', curQty: null },
|
{ id: 6, locCode: '03-02-1-2-1', container: 'Melisandre', batch: null, curQty: 150 },
|
{ id: 7, locCode: '03-02-1-2-1', container: 'Clifford', batch: 'Ferrara', curQty: 44 },
|
{ id: 8, locCode: '03-02-1-2-1', container: 'Frances', batch: 'Rossini', curQty: 36 },
|
{ id: 9, locCode: '03-02-1-2-1', container: 'Roxie', batch: 'Harvey', curQty: 65 },
|
]
|
|
const columns = [
|
{ field: 'id', headerName: 'ID', width: 40 },
|
{ field: 'locCode', headerName: '库位', width: 110 },
|
{ field: 'container', headerName: '容器', width: 120 },
|
{ field: 'batch', headerName: '批次', width: 90 },
|
{ field: 'unit', headerName: '单位', width: 90 },
|
{ field: 'curQty', headerName: '本次出库数量', width: 110 },
|
{ field: 'siteNo', headerName: '出库口', width: 90 }, ``
|
]
|
|
|
export default OutStockPublic;
|