From d96cb8a176a2cd7406de97b9a6e321f8ecd4c707 Mon Sep 17 00:00:00 2001 From: skyouc Date: 星期一, 31 三月 2025 07:59:54 +0800 Subject: [PATCH] Merge branch 'devlop' of http://47.97.1.152:5880/r/wms-master into devlop --- rsf-admin/src/page/asnOrder/AsnWareModal.jsx | 374 ++++++++++++++++++++-------------------------------- 1 files changed, 145 insertions(+), 229 deletions(-) diff --git a/rsf-admin/src/page/asnOrder/AsnWareModal.jsx b/rsf-admin/src/page/asnOrder/AsnWareModal.jsx index 8bd3975..d4591f8 100644 --- a/rsf-admin/src/page/asnOrder/AsnWareModal.jsx +++ b/rsf-admin/src/page/asnOrder/AsnWareModal.jsx @@ -1,24 +1,4 @@ -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, - useRefresh, -} from 'react-admin'; +import React, { useState, useEffect } from "react"; import { Dialog, DialogActions, @@ -30,32 +10,23 @@ Box, Button, Paper, - TableContainer, - Table, - TableHead, - TableBody, - TableRow, - TableCell, - Checkbox, styled - - } from '@mui/material'; import DialogCloseButton from "../components/DialogCloseButton"; -import StatusSelectInput from "../components/StatusSelectInput"; import ConfirmButton from "../components/ConfirmButton"; -import MemoInput from "../components/MemoInput"; -import { useForm, Controller, useWatch, FormProvider, useFormContext } from "react-hook-form"; -import SaveIcon from '@mui/icons-material/Save'; +import { useTranslate, useNotify, useRefresh } from 'react-admin'; import request from '@/utils/request'; +import { DataGrid } from '@mui/x-data-grid'; +import SaveIcon from '@mui/icons-material/Save'; +import TreeSelectInput from "@/page/components/TreeSelectInput"; const AsnWareModal = (props) => { - const { open, setOpen } = props; + const { open, setOpen, data, setData } = props; const translate = useTranslate(); const notify = useNotify(); const refresh = useRefresh(); - const asnId = '' + const asnId = ''; const handleClose = (event, reason) => { if (reason !== "backdropClick") { @@ -64,11 +35,12 @@ }; const [formData, setFormData] = useState({ - type: '', - wkType: '' + name: '', + code: '' }); - const [tabelData, setTableData] = useState([{ id: 1 }, { id: 2 }]); + const [tableData, setTableData] = useState([]); + const [dyFields, setDyFields] = useState([]); const [selectedRows, setSelectedRows] = useState([]); const handleChange = (e) => { @@ -79,13 +51,55 @@ })); }; + const reset = () => { + setFormData({ + name: '', + code: '' + }) + } + const handleSubmit = () => { - console.log(formData); + const hasarr = data.map(el => +el.matnrId) + const selectedData = selectedRows.filter(item => !hasarr.includes(item)).map(id => (tableData.find(row => row.id === id))); + const value = selectedData.map((el => { + const dynamicFields = dyFields.reduce((acc, item) => { + acc[item.fields] = el['extendFields']?.[item.fields] || ''; + return acc; + }, {}); + return { + matnrId: el.id, + maktx: el.name, + maktxCode: el.code, + stockUnit: el.stockUnit || '', + purUnit: el.purchaseUnit || '', + ...dynamicFields + } + })) + setData([...data, ...value]); + setOpen(false); + reset(); }; + const getData = async () => { + const res = await request.post(`/matnr/page`, { + ...formData, + current: 1, + pageSize: 199, + orderBy: "create_time desc" + }); + if (res?.data?.code === 200) { + setTableData(res.data.data.records); + } else { + notify(res.data.msg); + } + }; + useEffect(() => { + getData(); + }, [open]); const handleSearch = () => { + getData() }; return ( @@ -95,7 +109,7 @@ aria-labelledby="form-dialog-title" fullWidth disableRestoreFocus - maxWidth="lg" // 'xs' | 'sm' | 'md' | 'lg' | 'xl' + maxWidth="lg" > <DialogTitle id="form-dialog-title" sx={{ position: 'sticky', @@ -111,230 +125,132 @@ <DialogContent sx={{ mt: 2 }}> <Box component="form" onSubmit={handleSubmit} sx={{ display: 'flex', flexDirection: 'column', gap: 3 }}> <Grid container spacing={2}> - <Grid item xs={4}> + <Grid item md={4}> <TextField - label={translate('table.field.asnOrder.type')} - name="type" - value={formData.type} + label={translate('table.field.matnr.name')} + name="name" + value={formData.name} onChange={handleChange} - variant="outlined" size="small" /> </Grid> - - <Grid item xs={4}> + <Grid item md={4}> <TextField - label={translate('table.field.asnOrder.wkType')} - name="wkType" - value={formData.wkType} + label={translate('table.field.matnr.code')} + name="code" + value={formData.code} onChange={handleChange} - variant="outlined" size="small" + /> + </Grid> + <Grid item md={4}> + <TreeSelectInput + label="table.field.matnr.groupId" + value={formData.groupId} + resource={'matnrGroup'} + source="groupId" + name="groupId" + onChange={handleChange} /> </Grid> </Grid> </Box> - <Box sx={{ mt: 2 }}> <Stack direction="row" spacing={2}> <Button variant="contained" onClick={handleSearch}>鎼滅储</Button> </Stack> - </Box> - - <Box sx={{ mt: 2 }}> - <AsnWareModalTable tabelData={tabelData} setTableData={setTableData} selectedRows={selectedRows} - setSelectedRows={setSelectedRows}></AsnWareModalTable> + <Box sx={{ mt: 2, height: 400, width: '100%' }}> + <AsnWareModalTable + tableData={tableData} + setTableData={setTableData} + dyFields={dyFields} + setDyFields={setDyFields} + selectedRows={selectedRows} + setSelectedRows={setSelectedRows} + /> </Box> </DialogContent> <DialogActions sx={{ position: 'sticky', bottom: 0, backgroundColor: 'background.paper', zIndex: 1000 }}> - <Toolbar sx={{ width: '100%', justifyContent: 'space-between' }} > + <Box sx={{ width: '100%', display: 'flex', justifyContent: 'space-between' }}> <Button onClick={handleSubmit} variant="contained" startIcon={<SaveIcon />}> - 纭 + {translate('toolbar.confirm')} </Button> - </Toolbar> + </Box> </DialogActions> - - </Dialog> - ) -} + ); +}; export default AsnWareModal; -const AsnWareModalTable = ({ tabelData, setTableData }) => { +const AsnWareModalTable = ({ tableData, setTableData, selectedRows, setSelectedRows, dyFields, setDyFields }) => { const translate = useTranslate(); const notify = useNotify(); - const refresh = useRefresh(); - const [selected, setSelected] = React.useState([]); + const [columns, setColumns] = useState([ + // { field: 'id', headerName: 'ID', width: 100 }, + { field: 'name', headerName: translate('table.field.matnr.name'), width: 300 }, + { field: 'code', headerName: translate('table.field.matnr.code'), width: 100 }, + { field: 'groupId$', headerName: translate('table.field.matnr.groupId'), width: 100 }, + { field: 'spec', headerName: translate('table.field.matnr.spec'), width: 100 }, + { field: 'model', headerName: translate('table.field.matnr.model'), width: 100 }, + { field: 'weight', headerName: translate('table.field.matnr.weight'), width: 100 }, - const columns = [ - { - id: 'id', - label: 'ID', - minWidth: 100 - }, - { - id: 'name', - label: 'table.field.matnr.name', - minWidth: 100 - }, - { - id: 'code', - label: 'table.field.matnr.code', - minWidth: 100 - }, - { - id: 'spec', - label: 'table.field.matnr.spec', - minWidth: 100 - }, - { - id: 'model', - label: 'table.field.matnr.model', - minWidth: 100 - }, - { - id: 'weight', - label: 'table.field.matnr.weight', - minWidth: 100 - }, - { - id: 'color', - label: 'table.field.matnr.color', - minWidth: 100 - }, - { - id: 'size', - label: 'table.field.matnr.size', - minWidth: 100 - }, - { - id: 'describle', - label: 'table.field.matnr.describle', - minWidth: 100 - }, - { - id: 'nromNum', - label: 'table.field.matnr.nromNum', - minWidth: 100 - }, - { - id: 'unit', - label: 'table.field.matnr.unit', - minWidth: 100 - }, - { - id: 'purchaseUnit', - label: 'table.field.matnr.purUnit', - minWidth: 100 - }, - { - id: 'stockUnit', - label: 'table.field.matnr.stockUnit', - minWidth: 100 - }, - { - id: 'stockLeval$', - label: 'table.field.matnr.stockLevel', - minWidth: 100, - sortable: false - }, + { field: 'describle', headerName: translate('table.field.matnr.describle'), width: 100 }, + { field: 'nromNum', headerName: translate('table.field.matnr.nromNum'), width: 100 }, + { field: 'unit', headerName: translate('table.field.matnr.unit'), width: 100 }, + { field: 'purchaseUnit', headerName: translate('table.field.matnr.purUnit'), width: 100 }, + { field: 'stockUnit', headerName: translate('table.field.matnr.stockUnit'), width: 100 }, + { field: 'stockLeval$', headerName: translate('table.field.matnr.stockLevel'), width: 100, sortable: false }, + ]) - ]; - const StyledTableRow = styled(TableRow)(({ theme }) => ({ - "& .MuiButtonBase-root.": { - padding: "0px 0px", - }, - })); + const handleSelectionChange = (ids) => { + setSelectedRows(ids) - const StyledTableCell = styled(TableCell)(({ theme }) => ({ - "& .MuiButtonBase-root": { - padding: "0px 0px", - }, - overflow: "hidden", - textOverflow: "ellipsis", - whiteSpace: "nowrap", - maxWidth: 600, - })); - - const handleClick = (event, id) => { - const selectedIndex = selected.indexOf(id); - let newSelected = []; - - if (selectedIndex === -1) { - newSelected = newSelected.concat(selected, id); - } else if (selectedIndex === 0) { - newSelected = newSelected.concat(selected.slice(1)); - } else if (selectedIndex === selected.length - 1) { - newSelected = newSelected.concat(selected.slice(0, -1)); - } else if (selectedIndex > 0) { - newSelected = newSelected.concat( - selected.slice(0, selectedIndex), - selected.slice(selectedIndex + 1), - ); - } - setSelected(newSelected); }; - // const handleSelectAllClick = (event) => { - // if (event.target.checked) { - // const newSelected = tabelData.map((n) => n.id); - // setSelected(newSelected); - // return; - // } - // setSelected([]); - // }; + useEffect(() => { + getDynamicFields(); + }, []); + + const getDynamicFields = async () => { + const { + data: { code, data, msg }, + } = await request.get("/fields/enable/list"); + if (code === 200) { + const cols = data.map(el => ({ + field: el.fields, + headerName: el.fieldsAlise, + minWidth: 100, + flex: 1, + editable: el.unique, + valueGetter: (value, row) => { + return row.extendFields?.[el.fields] || ''; + }, + })) + setDyFields(data) + setColumns([...columns, ...cols]) + } else { + notify(msg); + } + } return ( - <TableContainer component={Paper} > - <Table size="small" > - <TableHead> - <StyledTableRow key={'head'}> - <TableCell padding="checkbox"> - <Checkbox - color="primary" - /> - </TableCell> - {columns.map((column) => { - const value = column.label; - return ( - <StyledTableCell - key={column.id} - align={column.align || "left"} - > - {column.format ? column.format(value) : translate(value)} - </StyledTableCell> - ); - - })} - </StyledTableRow> - </TableHead> - - <TableBody> - - {tabelData.map((row) => { - const isItemSelected = selected.includes(row.id); - return (<StyledTableRow key={row.id || Math.random()} aria-checked={isItemSelected} selected={isItemSelected} onClick={(event) => handleClick(event, row.id)}> - <TableCell padding="checkbox"> - <Checkbox - color="primary" - checked={isItemSelected} - /> - </TableCell> - {columns.map((column) => ( - <StyledTableCell key={column.id} > - {row[column.id]} - </StyledTableCell> - ))} - </StyledTableRow>) - })} - - </TableBody> - </Table> - </TableContainer> - ) -} + <div style={{ height: 400, width: '100%' }}> + <DataGrid + size="small" + rows={tableData} + columns={columns} + checkboxSelection + onRowSelectionModelChange={handleSelectionChange} + selectionModel={selectedRows} + disableColumnMenu={true} + disableColumnSorting + disableMultipleColumnsSorting + /> + </div> + ); +}; \ No newline at end of file -- Gitblit v1.9.1