import { Box, Card, Grid, LinearProgress, Select, MenuItem, ListItemText } from "@mui/material";
|
import React, { useState, useRef, useEffect, useMemo } from "react";
|
import {
|
List,
|
DatagridConfigurable,
|
Button,
|
useTranslate,
|
useNotify,
|
useListContext,
|
TextField,
|
NumberField,
|
ReferenceInput,
|
AutocompleteInput,
|
required,
|
Form,
|
useRefresh,
|
useRedirect,
|
TextInput,
|
} from 'react-admin';
|
import { PAGE_DRAWER_WIDTH, OPERATE_MODE, DEFAULT_PAGE_SIZE, DEFAULT_ITEM_PAGE_SIZE, DEFAULT_TYPE } from '@/config/setting';
|
import { styled } from '@mui/material/styles';
|
import { DataGrid, useGridApiContext, GridActionsCellItem, useGridApiRef } from '@mui/x-data-grid';
|
import request from '@/utils/request';
|
import ConfirmationNumberOutlinedIcon from '@mui/icons-material/ConfirmationNumberOutlined';
|
import CloseSharpIcon from '@mui/icons-material/CloseSharp';
|
import ConfirmButton from '../../components/ConfirmButton';
|
import { Delete, Edit, Add } from '@mui/icons-material';
|
import CheckOrderSiteDialog from "./CheckOrderSiteDialog";
|
import CheckPreviewTable from "./CheckPreviewTable";
|
|
const StyledDatagrid = styled(DatagridConfigurable)(({ theme }) => ({
|
'& .css-1vooibu-MuiSvgIcon-root': {
|
height: '.9em'
|
},
|
'& .RaDatagrid-row': {
|
cursor: 'auto'
|
},
|
'& .column-maktx': {
|
width: 200
|
},
|
mt: '60px'
|
}));
|
|
const CheckOrderPub = (props) => {
|
const { record, open, setOpen, setManualDialog } = props;
|
const notify = useNotify();
|
const gridRef = useGridApiRef();
|
const [rows, setRows] = useState([]);
|
const [fetchRows, setFetchRows] = useState([]);
|
const translate = useTranslate();
|
const [rowSelectedIds, setRowSelectedIds] = useState([]);
|
const [selectedMatnr, setSelectedMatnr] = useState([]);
|
const [selectedIds, setSelectedIds] = useState([]);
|
const [formData, setFormData] = useState({ orderId: record?.id, waveId: DEFAULT_TYPE });
|
const [dialog, setDialog] = useState(false);
|
const [selectedValue, setSelectedValue] = useState({});
|
|
useEffect(() => {
|
if (selectedMatnr.length < 1) {
|
setRows(fetchRows)
|
} else {
|
const mas = fetchRows.filter(item => selectedMatnr.includes(item.matnrCode));
|
let ids = mas.map(item => item.matnrCode);
|
getLocs(ids)
|
}
|
}, [selectedMatnr])
|
|
|
const getLocs = async (ids) => {
|
const { data: { code, data, msg } } = await request.post('/check/locs/' + ids);
|
if (code === 200) {
|
setRows(data)
|
const matnrs = selectedMatnr.filter(item => data.some(bigData => bigData.matnrCode === item));
|
// setSelectedMatnr(matnrs)
|
} else {
|
notify(msg);
|
}
|
}
|
|
const ComfirmButton = () => {
|
const { selectedIds, data, onUnselectItems } = useListContext();
|
const handleRowClick = () => {
|
const ids = data.filter(item => selectedIds.includes(item.id));
|
setRowSelectedIds(ids);
|
const mas = data.filter(item => selectedIds.includes(item.id)).map(item => item.matnrCode);
|
//设置库位信息筛选条件
|
setSelectedMatnr(mas);
|
onUnselectItems()
|
}
|
return (
|
record.exceStatus != 3 ? <><Button label="toolbar.confirm" size="medium" onClick={handleRowClick} /></> : <></>
|
)
|
};
|
|
const handleClickOpen = () => {
|
setDialog(true);
|
};
|
|
const handleClose = (value) => {
|
setDialog(false);
|
setSelectedValue(value);
|
if (selectedIds.length == 0) {
|
const newRows = rows.map(item => {
|
return {
|
...item,
|
siteNo: value?.site
|
}
|
})
|
setRows(newRows);
|
} else {
|
const newRows = rows.map(item => {
|
return selectedIds.includes(item?.id) ? {
|
...item,
|
siteNo: value?.site
|
} : item
|
})
|
setRows(newRows);
|
}
|
};
|
|
useEffect(() => {
|
getWaveRule()
|
}, [open])
|
|
const getWaveRule = async () => {
|
if (formData.waveId == null && formData.waveId == undefined) {
|
return
|
}
|
const { data: { code, data, msg } } = await request.post('/check/order/items', { ...formData });
|
if (code === 200) {
|
setFetchRows(data)
|
} else {
|
notify(msg);
|
}
|
}
|
|
const handleChange = (value, name) => {
|
setFormData((prevData) => ({
|
...prevData,
|
[name]: value
|
}));
|
};
|
|
|
return (
|
<>
|
<Box>
|
<Grid sx={{ display: "flex" }} container rowSpacing={2} columnSpacing={2}>
|
<Grid item xl={5.7} gap={2} >
|
<Card>
|
<Form>
|
<ReferenceInput
|
source="type"
|
reference="waveRule"
|
>
|
<AutocompleteInput
|
label="table.field.waveRule.type"
|
onChange={(e) => handleChange(e, 'waveId')}
|
defaultValue={15}
|
value={formData.type}
|
validate={required()}
|
/>
|
</ReferenceInput>
|
</Form>
|
<List
|
resource="checkItem"
|
storeKey='checkItem'
|
sx={{
|
flexGrow: 1,
|
transition: (theme) =>
|
theme.transitions.create(['all'], {
|
duration: theme.transitions.duration.enteringScreen,
|
}),
|
}}
|
title={"menu.checkItem"}
|
empty={false}
|
filter={{ orderId: record?.id, deleted: 0 }}
|
sort={{ field: "create_time", order: "desc" }}
|
actions={false}
|
pagination={false}
|
perPage={DEFAULT_ITEM_PAGE_SIZE}
|
>
|
<LinearProgress
|
sx={{ height: "2px", position: 'absolute', top: 0, left: 0, right: 0, }}
|
/>
|
<StyledDatagrid
|
storeKey={"outStockPublic"}
|
preferenceKey='checkItem'
|
bulkActionButtons={<>
|
<ComfirmButton />
|
</>}
|
omit={['id', 'splrName', 'qty',]}
|
>
|
<NumberField source="id" />
|
<TextField source="orderCode" label="table.field.checkOrderItem.orderCode" />
|
<TextField source="matnrCode" label="table.field.checkOrderItem.matnrCode" />
|
<TextField source="maktx" label="table.field.checkOrderItem.maktx" />
|
<NumberField source="anfme" label="table.field.checkOrderItem.anfme" />
|
<NumberField source="workQty" label="table.field.checkOrderItem.workQty" />
|
<NumberField source="qty" label="table.field.checkOrderItem.qty" />
|
<TextField source="stockUnit" label="table.field.checkOrderItem.stockUnit" />
|
<TextField source="splrName" label="table.field.checkOrderItem.splrName" />
|
</StyledDatagrid>
|
</List>
|
</Card>
|
</Grid>
|
<Grid item xl={6.3} gap={2}>
|
<Card sx={{ minHeight: 1050, height: 'calc(100% - 10px)', width: '100%' }}>
|
<Box>
|
<CheckPreviewTable
|
rows={rows}
|
gridRef={gridRef}
|
setRows={setRows}
|
record={record}
|
formData={formData}
|
selectedIds={selectedIds}
|
setDialog={setDialog}
|
setSelectedIds={setSelectedIds}
|
/>
|
</Box>
|
<Box sx={{ textAlign: 'center' }}>
|
<CloseButton setOpen={setOpen} />
|
<SubmitButton selectedIds={selectedIds} setOpen={setOpen} setSelectedIds={setSelectedIds} selectedMatnr={selectedMatnr} rowSelectedIds={rowSelectedIds} gridRef={gridRef} record={record} />
|
</Box>
|
</Card>
|
</Grid>
|
</Grid>
|
<Grid>
|
<CheckOrderSiteDialog
|
selectedValue={selectedValue}
|
open={dialog}
|
onClose={handleClose}
|
/>
|
</Grid>
|
</Box>
|
</>
|
);
|
}
|
|
//提交按钮
|
const SubmitButton = ({ selectedIds, setSelectedIds, rowSelectedIds, gridRef, record, setOpen, selectedMatnr }) => {
|
const notify = useNotify();
|
const refresh = useRefresh();
|
const translate = useTranslate();
|
const redirect = useRedirect();
|
const submit = async () => {
|
const items = gridRef.current?.getSortedRows();
|
let selctRecord = items.filter(item => selectedIds.includes(item?.id));
|
if (selctRecord == undefined || selctRecord.length < 1) {
|
notify(translate('common.msg.locEmpty'), { type: 'error' });
|
return
|
}
|
|
//过滤,将库位添加至盘点单明细中
|
const records = rowSelectedIds.map(map => {
|
return {
|
...map,
|
items: selctRecord.filter(item => item.matnrCode == map.matnrCode)
|
}
|
})
|
|
let params = records.filter(record => record?.items.length > 0);
|
|
const { data: { code, data, msg } } = await request.post('/check/generate/tasks', params);
|
if (code == 200) {
|
refresh();
|
setOpen(false)
|
} else {
|
notify(msg);
|
}
|
}
|
return (
|
<ConfirmButton
|
label="toolbar.confirmSelect"
|
variant="contained"
|
size="medium"
|
onConfirm={submit}
|
/>
|
)
|
}
|
|
//关闭按钮
|
const CloseButton = ({ setOpen }) => {
|
const close = () => {
|
setOpen(false)
|
}
|
return (
|
<Button
|
label="toolbar.close"
|
variant="outlined"
|
size="medium"
|
onClick={close}
|
startIcon={<CloseSharpIcon />}
|
sx={{ margin: '3.5em' }} />
|
)
|
}
|
|
export default CheckOrderPub;
|