#优化asn单编辑页面

zjj

7 天以前 4e598442cb2935463762ee143e103c02d14f55d9

 rsf-admin/src/page/orders/asnOrder/AsnOrderModal.jsx

@@ -39,7 +39,9 @@
    TableCell,
    Tooltip,
    IconButton,
    styled
    styled,
    Select,
    MenuItem


} from '@mui/material';
@@ -55,6 +57,7 @@
import { DataGrid, useGridApiRef } from '@mui/x-data-grid';
import DictionarySelect from "../../components/DictionarySelect";
import DictSelect from "../../components/DictSelect";
import "./asnOrder.css";

const AsnOrderModal = (props) => {
    const { open, setOpen, asnId, billReload } = props;
@@ -101,6 +104,7 @@
            ...prevData,
            [name]: value
        }));
        console.log(formData);
    };

    const resetData = () => {
@@ -178,7 +182,7 @@
            setFormData(res.data.data)
        } else {
            notify(res.data.msg);
        }
        }       
    }

    const requestGetBody = async () => {
@@ -200,7 +204,7 @@
    }

    return (
        <>
        <>       
            <Dialog
                open={open}
                onClose={handleClose}
@@ -209,7 +213,7 @@
                fullWidth
                disableRestoreFocus
                maxWidth="lg"   // 'xs' | 'sm' | 'md' | 'lg' | 'xl'
            >
            >                
                <DialogTitle id="form-dialog-title" sx={{
                    position: 'sticky',
                    top: 0,
@@ -223,7 +227,7 @@
                </DialogTitle>
                <DialogContent sx={{ mt: 2 }}>
                    <Box sx={{ display: 'flex', flexDirection: 'column', gap: 3 }}>
                        <Form>
                        <Form defaultValues={formData}>
                            <Grid container spacing={2}>
                                <Grid item md={3}>
                                    <DictSelect
@@ -309,6 +313,123 @@

export default AsnOrderModal;

const SelectInputSplrNameEditCell = (params) => {
    const [formData, setFormData] = useState([{}])
    useEffect(() => {
        getOptions();
    }, []);
    const getOptions = async () => {        
        const parmas = {    
            "type": "supplier"       
        }
        const {
            data: { code, data, msg },
        } = await request.post("companys/page",parmas);
        if (code === 200) {
            setFormData(data.records)
            console.log(data.records)           
        } else {
            notify(msg);
        }
    }  
  
    return (
        <Select
        value={params.value}
        onChange={(e) =>{
            params.api.setEditCellValue({
                id: params.id,
                field: params.field,
                value: e.target.value,
              })
              // 找到选中的供应商记录
          const selectedSupplier = formData.find(supplier => supplier.name === e.target.value);
          
          // 如果找到对应的供应商记录，同时更新splrCode字段
          if (selectedSupplier) {
            params.api.setEditCellValue({
              id: params.id,
              field: 'splrCode',
              value: selectedSupplier.id,
            });
          }

        }
          
        }
        fullWidth
       
      >        
          {formData.map(e => {
            return(
                <MenuItem value={e.name} children={e.name} key={e.id} />
            );
              
          })}
        
      </Select>
    );
  };

  const SelectInputSplrCodeEditCell = (params) => {
    const [formData, setFormData] = useState([{}])
    useEffect(() => {
        getOptions();
    }, []);
    const getOptions = async () => {        
        const parmas = {    
            "type": "supplier"       
        }
        const {
            data: { code, data, msg },
        } = await request.post("companys/page",parmas);
        if (code === 200) {
            setFormData(data.records)
            console.log(data.records)           
        } else {
            notify(msg);
        }
    }  
  
    return (
        <Select
        value={params.value}
        onChange={(e) =>{
            params.api.setEditCellValue({
                id: params.id,
                field: params.field,
                value: e.target.value,
              })
              const selectedSupplier = formData.find(supplier => supplier.id === e.target.value);
              
              // 如果找到对应的供应商记录，同时更新splrCode字段
              if (selectedSupplier) {
                params.api.setEditCellValue({
                  id: params.id,
                  field: 'splrName',
                  value: selectedSupplier.name,
                });
              }
        }
          
        }
        fullWidth
        
      >        
          {formData.map(e => {
            return(
                <MenuItem value={e.id} children={e.name} key={e.id} />
            );
              
          })}
        
      </Select>
    );
  };




const AsnOrderModalTable = ({ tabelData, setTableData, asnId, selectedRows, setSelectedRows, tableRef }) => {
    const translate = useTranslate();
    const notify = useNotify();
@@ -329,26 +450,35 @@
        },
        {
            field: 'anfme',
            headerName: translate('table.field.asnOrderItem.anfme'),
            headerName: translate('table.field.asnOrderItem.anfme')+"*",
            type: 'number',
            minWidth: 100,
            flex: 1,
            editable: true,
            valueFormatter: (val) => val < 0 ? 0 : val
            valueFormatter: (val) => val < 0 ? 0 : val,
            headerClassName: "custom",
        },
        {
            field: 'splrCode',
            headerName: translate('table.field.asnOrderItem.splrCode'),
            headerName: translate('table.field.asnOrderItem.splrCode')+"*",
            minWidth: 100,
            flex: 1,
            editable: true,
            renderEditCell: (params) => (
                <SelectInputSplrCodeEditCell {...params} />
            ),
            headerClassName: "custom",         
        },
        {
            field: 'splrName',
            headerName: translate('table.field.asnOrderItem.splrName'),
            headerName: translate('table.field.asnOrderItem.splrName')+"*",
            minWidth: 100,
            flex: 1,
            editable: true,
            renderEditCell: (params) => (
                <SelectInputSplrNameEditCell {...params} />
            ),
            headerClassName: "custom",
        },
        // {
        //     field: 'packName',
@@ -365,10 +495,11 @@
        // },
        {
            field: 'poCode',
            headerName: translate('table.field.asnOrderItem.poDetlCode'),
            headerName: translate('table.field.asnOrderItem.poDetlCode')+"*",
            minWidth: 100,
            flex: 1,
            editable: true,
            headerClassName: "custom",
        },

        {