From d17254e25cfaf8361c08eea6f16d99571a49174f Mon Sep 17 00:00:00 2001 From: skyouc Date: 星期六, 15 三月 2025 17:34:24 +0800 Subject: [PATCH] Merge branch 'front' into devlop --- rsf-admin/src/page/asnOrder/AsnOrderModal.jsx | 389 +++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 389 insertions(+), 0 deletions(-) diff --git a/rsf-admin/src/page/asnOrder/AsnOrderModal.jsx b/rsf-admin/src/page/asnOrder/AsnOrderModal.jsx new file mode 100644 index 0000000..2942d22 --- /dev/null +++ b/rsf-admin/src/page/asnOrder/AsnOrderModal.jsx @@ -0,0 +1,389 @@ +import React, { useState, useRef, useEffect, useMemo } from "react"; +import { + CreateBase, + useTranslate, + TextInput, + NumberInput, + BooleanInput, + DateInput, + SaveButton, + SelectInput, + ReferenceInput, + ReferenceArrayInput, + AutocompleteInput, + Toolbar, + required, + useDataProvider, + useNotify, + Form, + useCreateController, + useListContext, + useRefresh, +} from 'react-admin'; +import { + Dialog, + DialogActions, + DialogContent, + DialogTitle, + Stack, + Grid, + TextField, + Box, + Button, + Paper, + TableContainer, + Table, + TableHead, + TableBody, + TableRow, + TableCell, + Tooltip, + IconButton, + styled + + +} from '@mui/material'; +import DialogCloseButton from "../components/DialogCloseButton"; +import StatusSelectInput from "../components/StatusSelectInput"; +import ConfirmButton from "../components/ConfirmButton"; +import AsnWareModal from "./AsnWareModal"; +import { useForm, Controller, useWatch, FormProvider, useFormContext } from "react-hook-form"; +import SaveIcon from '@mui/icons-material/Save'; +import request from '@/utils/request'; +import { Add, Edit, Delete } from '@mui/icons-material'; +import _ from 'lodash'; +import { DataGrid } from '@mui/x-data-grid'; + +const AsnOrderModal = (props) => { + const { open, setOpen, asnId } = props; + + const translate = useTranslate(); + const notify = useNotify(); + const refresh = useRefresh(); + const [createDialog, setCreateDialog] = useState(false); + + useEffect(() => { + if (open && asnId !== 0) { + requestGetHead() + requestGetBody() + } + }, [open]) + + const handleClose = (event, reason) => { + if (reason !== "backdropClick") { + setOpen(false); + refresh(); + setFormData({ type: '' }) + setTableData([]) + } + }; + + const [formData, setFormData] = useState({ + type: '', + }); + + const [tabelData, setTableData] = useState([]); + + const handleChange = (e) => { + const { name, value } = e.target; + setFormData((prevData) => ({ + ...prevData, + [name]: value + })); + }; + + const handleSubmit = async () => { + if (asnId === 0) { + const parmas = { + "orders": formData, + "items": tabelData, + } + const res = await request.post(`/asnOrder/items/save`, parmas); + if (res?.data?.code === 200) { + setOpen(false); + refresh(); + } else { + notify(res.data.msg); + } + } else { + setOpen(false); + } + + }; + + + const handleDelete = async () => { + const res = await request.post(`/asnOrder/remove/${asnId}`); + if (res?.data?.code === 200) { + setOpen(false); + refresh(); + } else { + notify(res.data.msg); + } + }; + + const requestGetHead = async () => { + const res = await request.get(`/asnOrder/${asnId}`); + if (res?.data?.code === 200) { + setFormData(res.data.data) + } else { + notify(res.data.msg); + } + } + + const requestGetBody = async () => { + const res = await request.post(`/asnOrderItem/page`, { asnId }); + if (res?.data?.code === 200) { + setTableData(res.data.data.records) + } else { + notify(res.data.msg); + } + } + + const requestSetHead = async () => { + if (asnId !== 0) { + const res = await request.post(`/asnOrder/update`, { ...formData }); + refresh() + } + } + + + return ( + <> + <Dialog + open={open} + onClose={handleClose} + aria-labelledby="form-dialog-title" + aria-hidden + fullWidth + disableRestoreFocus + maxWidth="md" // 'xs' | 'sm' | 'md' | 'lg' | 'xl' + > + <DialogTitle id="form-dialog-title" sx={{ + position: 'sticky', + top: 0, + backgroundColor: 'background.paper', + zIndex: 1000 + }}> + {translate('create.title')} + <Box sx={{ position: 'absolute', top: 8, right: 8, zIndex: 1001 }}> + <DialogCloseButton onClose={handleClose} /> + </Box> + </DialogTitle> + <DialogContent sx={{ mt: 2 }}> + <Box component="form" sx={{ display: 'flex', flexDirection: 'column', gap: 3 }}> + <form> + <Grid container spacing={2}> + <Grid item xs={4}> + <TextField + label={translate('table.field.asnOrder.type')} + name="type" + value={formData.type} + onChange={handleChange} + onBlur={requestSetHead} + variant="outlined" + size="small" + validate={required()} + /> + </Grid> + + {/* <Grid item xs={4}> + <TextField + label={translate('table.field.asnOrder.wkType')} + name="wkType" + value={formData.wkType} + onChange={handleChange} + variant="outlined" + size="small" + /> + </Grid> */} + </Grid> + </form> + </Box> + + <Box sx={{ mt: 2 }}> + <Stack direction="row" spacing={2}> + <Button variant="contained" onClick={() => setCreateDialog(true)}>鏂板鐗╂枡</Button> + {asnId !== '' && <ConfirmButton label={'鍒犻櫎'} variant="outlined" color="error" onConfirm={handleDelete} />} + </Stack> + + </Box> + + <Box sx={{ mt: 2 }}> + <AsnOrderModalTable tabelData={tabelData} setTableData={setTableData} asnId={asnId} ></AsnOrderModalTable> + </Box> + </DialogContent> + <DialogActions sx={{ position: 'sticky', bottom: 0, backgroundColor: 'background.paper', zIndex: 1000 }}> + <Toolbar sx={{ width: '100%', justifyContent: 'space-between' }} > + <Button onClick={handleSubmit} variant="contained" startIcon={<SaveIcon />}> + 纭 + </Button> + </Toolbar> + </DialogActions> + + </Dialog> + + <AsnWareModal + open={createDialog} + setOpen={setCreateDialog} + data={tabelData} + setData={setTableData} + /> + </> + ) +} + +export default AsnOrderModal; + +const AsnOrderModalTable = ({ tabelData, setTableData, asnId }) => { + const translate = useTranslate(); + + const columns = [ + { + field: 'action', + headerName: '鎿嶄綔', + minWidth: 100, + sticky: 'right', + flex: 1, + renderCell: (params) => ( + <Tooltip title="Delete"> + <IconButton onClick={() => handleDelete(params.row)}> + <Delete /> + </IconButton> + </Tooltip> + ), + }, + { + field: 'matnrId', + headerName: translate('table.field.asnOrderItem.matnrId'), + minWidth: 100, + flex: 1, + editable: false, + }, + { + field: 'maktx', + headerName: translate('table.field.asnOrderItem.maktx'), + minWidth: 100, + flex: 1, + editable: true, + }, + { + field: 'poDetlId', + headerName: translate('table.field.asnOrderItem.poDetlId'), + minWidth: 100, + flex: 1, + }, + { + field: 'poDetlCode', + headerName: translate('table.field.asnOrderItem.poDetlCode'), + minWidth: 100, + flex: 1, + }, + { + field: 'anfme', + headerName: translate('table.field.asnOrderItem.anfme'), + minWidth: 100, + flex: 1, + editable: true, + }, + { + field: 'stockUnit', + headerName: translate('table.field.asnOrderItem.stockUnit'), + minWidth: 100, + flex: 1, + editable: true, + }, + { + field: 'purQty', + headerName: translate('table.field.asnOrderItem.purQty'), + minWidth: 100, + flex: 1, + editable: true, + }, + { + field: 'purUnit', + headerName: translate('table.field.asnOrderItem.purUnit'), + minWidth: 100, + flex: 1, + editable: true, + }, + { + field: 'splrCode', + headerName: translate('table.field.asnOrderItem.splrCode'), + minWidth: 100, + flex: 1, + editable: true, + }, + { + field: 'splrName', + headerName: translate('table.field.asnOrderItem.splrName'), + minWidth: 100, + flex: 1, + editable: true, + }, + { + field: 'qrcode', + headerName: translate('table.field.asnOrderItem.qrcode'), + minWidth: 100, + flex: 1, + editable: true, + }, + { + field: 'barcode', + headerName: translate('table.field.asnOrderItem.barcode'), + minWidth: 100, + flex: 1, + editable: true, + }, + { + field: 'packName', + headerName: translate('table.field.asnOrderItem.packName'), + minWidth: 100, + flex: 1, + editable: true, + }, + + ]; + + const requestSetBody = async (row) => { + if (asnId !== 0) { + const res = await request.post(`/asnOrderItem/update`, row); + } + + } + + const handleDelete = (row) => { + const newData = _.filter(tabelData, (item) => item.matnrId !== row.matnrId); + setTableData(newData); + }; + + + const processRowUpdate = (newRow, oldRow) => { + setTableData((prevData) => + prevData.map((r) => + r.matnrId === newRow.matnrId ? { ...newRow } : r + ) + ); + + requestSetBody(newRow) + return newRow; + }; + + + return ( + <div style={{ height: 400, width: '100%' }}> + <DataGrid + rows={tabelData} + columns={columns} + disableRowSelectionOnClick + getRowId={(row) => row.matnrId} + disableColumnFilter + disableColumnSelector + disableColumnSorting + disableMultipleColumnsSorting + processRowUpdate={processRowUpdate} + /> + </div> + ); +}; + -- Gitblit v1.9.1