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, 
 | 
    useRecordSelection, 
 | 
    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 { DataGrid, useGridApiContext, GridActionsCellItem, useGridApiRef } from '@mui/x-data-grid'; 
 | 
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"; 
 | 
import { styled } from '@mui/material/styles'; 
 | 
import request from '@/utils/request'; 
 | 
  
 | 
  
 | 
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 translate = useTranslate(); 
 | 
    const gridRef = useGridApiRef(); 
 | 
    const [rows, setRows] = useState([]); 
 | 
    const [fetchRows, setFetchRows] = useState([]); 
 | 
    const [selectItem, setSelectItem] = useState({}); 
 | 
    const [rowSelectedIds, setRowSelectedIds] = useState([]); 
 | 
    const [selectedMatnr, setSelectedMatnr] = useState([]); 
 | 
    const [leftSelectedIds, setLeftSelectedIds] = 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) => { 
 | 
        let params = { matnrCode: ids } 
 | 
        const { data: { code, data, msg } } = await request.post('/check/locs/', params); 
 | 
        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) => { 
 | 
        console.log(value); 
 | 
        setDialog(false); 
 | 
        setSelectedValue(value); 
 | 
        if (leftSelectedIds.length == 0) { 
 | 
            const newRows = rows.map(item => { 
 | 
                return { 
 | 
                    ...item, 
 | 
                    siteNo: value?.site 
 | 
                } 
 | 
            }) 
 | 
            setRows(newRows); 
 | 
        } else { 
 | 
            const newRows = rows.map(item => { 
 | 
                return leftSelectedIds.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} 
 | 
                                    selectedMatnr={selectedMatnr} 
 | 
                                    leftSelectedIds={leftSelectedIds} 
 | 
                                    setDialog={setDialog} 
 | 
                                    setLeftSelectedIds={setLeftSelectedIds} 
 | 
                                /> 
 | 
                            </Box> 
 | 
                            <Box sx={{ textAlign: 'center' }}> 
 | 
                                <CloseButton setOpen={setOpen} /> 
 | 
                                <SubmitButton 
 | 
                                    leftSelectedIds={leftSelectedIds} 
 | 
                                    setOpen={setOpen} 
 | 
                                    setLeftSelectedIds={setLeftSelectedIds} 
 | 
                                    selectItem={selectItem} 
 | 
                                    selectedMatnr={selectedMatnr} 
 | 
                                    rowSelectedIds={rowSelectedIds} 
 | 
                                    gridRef={gridRef} 
 | 
                                    record={record} /> 
 | 
                            </Box> 
 | 
                        </Card> 
 | 
                    </Grid> 
 | 
                </Grid> 
 | 
                <Grid> 
 | 
                    <CheckOrderSiteDialog 
 | 
                        selectedValue={selectedValue} 
 | 
                        open={dialog} 
 | 
                        onClose={handleClose} 
 | 
                    /> 
 | 
                </Grid> 
 | 
            </Box> 
 | 
        </> 
 | 
    ); 
 | 
} 
 | 
  
 | 
//提交按钮 
 | 
const SubmitButton = ({ leftSelectedIds, setLeftSelectedIds, rowSelectedIds, selectItem, 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 => leftSelectedIds.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(); 
 | 
            redirect("/task") 
 | 
            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; 
 |