From bfc43ca0e4683c1c0322a6cad5d5be2bc07decc3 Mon Sep 17 00:00:00 2001 From: skyouc Date: 星期四, 24 七月 2025 15:00:44 +0800 Subject: [PATCH] 新增调拔单功能 盘点功能优化 --- rsf-admin/src/page/orders/outStock/OutStockPublic.jsx | 244 +++++++++++++++++++++++++++++++++++++----------- 1 files changed, 188 insertions(+), 56 deletions(-) diff --git a/rsf-admin/src/page/orders/outStock/OutStockPublic.jsx b/rsf-admin/src/page/orders/outStock/OutStockPublic.jsx index b3570fe..0dc8ff5 100644 --- a/rsf-admin/src/page/orders/outStock/OutStockPublic.jsx +++ b/rsf-admin/src/page/orders/outStock/OutStockPublic.jsx @@ -1,4 +1,4 @@ -import { Box, Card, Grid, LinearProgress, Select, MenuItem, ListItemText, Tooltip, IconButton } from "@mui/material"; +import { Box, Card, Grid, LinearProgress, Select, MenuItem, ListItemText } from "@mui/material"; import React, { useState, useRef, useEffect, useMemo } from "react"; import { List, @@ -37,8 +37,9 @@ Form, useRefresh, useRedirect, + useRecordSelection, } from 'react-admin'; -import { PAGE_DRAWER_WIDTH, OPERATE_MODE, DEFAULT_PAGE_SIZE, DEFAULT_ITEM_PAGE_SIZE } from '@/config/setting'; +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'; @@ -46,6 +47,7 @@ import CloseSharpIcon from '@mui/icons-material/CloseSharp'; import ConfirmButton from '../../components/ConfirmButton'; import { Delete, Edit, Add } from '@mui/icons-material'; +import OutStockSiteDialog from "./OutStockSiteDialog"; const StyledDatagrid = styled(DatagridConfigurable)(({ theme }) => ({ '& .css-1vooibu-MuiSvgIcon-root': { @@ -56,32 +58,96 @@ }, '& .column-maktx': { width: 200 - } + }, + + mt: '60px' + // '& .RaBulkActionsToolbar-toolbar': { + // display: 'none' + // } + })); - const OutStockPublic = (props) => { - const { record, open, setOpen } = props; + const { record, open, setOpen, setManualDialog } = props; const notify = useNotify(); const gridRef = useGridApiRef(); - const [rows, setRows] = useState({}); + const [rows, setRows] = useState([]); + const [fetchRows, setFetchRows] = useState([]); const translate = useTranslate(); - const [selectedIds, setSelectedIds] = React.useState([]); - const [formData, setFormData] = useState({ - orderId: record?.id - }); + 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)); + setRows(mas) + } + }, [selectedMatnr]) + + + const ComfirmButton = () => { + const { data } = useListContext(); + const [selectedIds, selectionModifiers] = useRecordSelection(); + + const handleRowClick = () => { + console.log(selectedIds); + + const ids = data.filter(item => selectedIds.includes(item.id)).map(item => item.id); + setRowSelectedIds(ids); + const mas = data.filter(item => selectedIds.includes(item.id)).map(item => item.matnrCode); + //璁剧疆搴撲綅淇℃伅绛涢�夋潯浠� + setSelectedMatnr(mas); + } + + return ( + <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() - }, [formData, open]) + }, [open]) const getWaveRule = async () => { if (formData.waveId == null && formData.waveId == undefined) { return } const { data: { code, data, msg } } = await request.post('/outStock/order/getOutTaskItems', { ...formData }); - if (code === 200) { - setRows(data) + // setRows(data) + setFetchRows(data) } else { notify(msg); } @@ -109,6 +175,7 @@ <AutocompleteInput label="table.field.waveRule.type" onChange={(e) => handleChange(e, 'waveId')} + defaultValue={15} value={formData.type} validate={required()} /> @@ -126,22 +193,25 @@ }} title={"menu.outStockItem"} empty={false} - filter={{ asnId: record?.id, deleted: 0 }} + 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='outStockItem' - bulkActionButtons={false} - rowClick={false} - omit={['id', 'splrName', 'qty', 'poCode', 'workQty']} + bulkActionButtons={<> + <ComfirmButton /> + </>} + omit={['id', 'splrName', 'qty', 'poCode',]} > <NumberField source="id" /> - <TextField source="asnCode" label="table.field.outStockItem.asnCode" /> + <TextField source="asnCode" label="table.field.outStockItem.orderCode" /> <TextField source="poCode" label="table.field.outStockItem.poCode" /> <TextField source="matnrCode" label="table.field.outStockItem.matnrCode" /> <TextField source="maktx" label="table.field.outStockItem.maktx" /> @@ -155,32 +225,62 @@ </Card> </Grid> <Grid item xl={6.3} gap={2}> - <Card> - <Box sx={{ height: 500, width: '100%' }}> - <PreviewTable rows={rows} gridRef={gridRef} setRows={setRows} record={record}/> + <Card sx={{ minHeight: 1050, height: 'calc(100% - 10px)', width: '100%' }}> + <Box> + <PreviewTable + 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} setSelectedIds={setSelectedIds} gridRef={gridRef} record={record}/> + <SubmitButton selectedIds={selectedIds} setSelectedIds={setSelectedIds} gridRef={gridRef} record={record} /> </Box> </Card> </Grid> + </Grid> + <Grid> + <OutStockSiteDialog + selectedValue={selectedValue} + open={dialog} + onClose={handleClose} + /> </Grid> </Box> </> ); } -const PreviewTable = ({ rows, gridRef, setRows, record }) => { +const PreviewTable = ({ rows, gridRef, setRows, record, selectedIds, setSelectedIds, setDialog, formData }) => { gridRef.current = useGridApiRef(); + const translate = useTranslate(); - const columns = [ - { field: 'id', headerName: 'ID', width: 40 }, + useEffect(() => { + if (selectedIds.length > 0) { + console.log(selectedIds); + } + }, [selectedIds]) + + const baseColumns = [ + // { field: 'id', headerName: 'ID', width: 40 }, { field: 'locCode', headerName: '搴撲綅', width: 110 }, { field: 'barcode', headerName: '瀹瑰櫒', width: 120 }, + { field: 'matnrCode', headerName: '鐗╂枡缂栫爜', width: 120 }, { field: 'batch', headerName: '鎵规', width: 90 }, - { field: 'unit', headerName: '鍗曚綅', width: 90 }, - { field: 'outQty', headerName: '鏈鍑哄簱鏁伴噺', width: 110 }, + { field: 'unit', headerName: '鍗曚綅', width: 60 }, + { field: 'outQty', headerName: '鍑哄簱鏁伴噺', width: 110, }, + { + field: 'anfme', headerName: '搴撳瓨鏁伴噺', width: 110, + renderCell: (params) => ( + <OutStockAnfme value={params.value} /> + ) + }, { field: 'siteNo', headerName: '鍑哄簱鍙�', @@ -194,31 +294,48 @@ <OutStockSite {...params} /> ), }, - { - field: 'actions', - type: 'actions', - headerName: '鎿嶄綔', - with: 120, - getActions: (params) => [ - <GridActionsCellItem - icon={<Delete />} - label="Delete" - onClick={() => handleDelete(params.row, rows, setRows)} - />, - ] - }, ] + + const optAction = { + field: 'actions', + type: 'actions', + headerName: translate('common.field.opt'), + with: 120, + getActions: (params) => [ + <GridActionsCellItem + icon={<Delete />} + label="Delete" + onClick={() => handleDelete(params.row, rows, setRows)} + />, + ] + } + + const columns = (formData.waveId == 15 || formData.waveId == 16) ? [...baseColumns] : [...baseColumns, optAction]; /** * 鍒犻櫎浜嬩欢 * @param {*} params */ const handleDelete = (params, rows, setRows) => { - const outRows = rows.filter(row => { - return row.id !== params.id + const outRows = rows.filter(row => { + return row.id !== params.id }) setRows(outRows) } + + const OutStockAnfme = React.memo(function OutStockAnfme(props) { + const { value } = props; + return ( + value > 0 ? + <Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}> + <span>{value}</span> + </Box> + : + <Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}> + <span style={{ color: 'red' }}>{translate('common.edit.title.insuffInventory')}</span> + </Box> + ); + }); const OutStockSiteNo = React.memo(function OutStockSiteNo(props) { const { value } = props; @@ -226,13 +343,32 @@ return null; } return ( - <Box - sx={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }} - > + <Box sx={{ display: 'flex', alignItems: 'center', justifyContent: 'space-between' }}> <span>{value}</span> </Box> ); }); + + const CustomToolBar = () => { + const selectSiteNo = () => { + setDialog(true) + } + return ( + <Box sx={{ + p: 1, + display: 'flex', + justifyContent: 'flex-end', + borderTop: '1px solid rgba(224, 224, 224, 1)' + }}> + <Button + onClick={selectSiteNo} + variant="outlined" + label="toolbar.modiftySite" + size="medium" + sx={{ mr: 1 }} /> + </Box> + ); + } const OutStockSite = (params) => { const { id, field, siteNo, row: { staNos } } = params; @@ -286,18 +422,15 @@ return ( <DataGrid + storeKey={"locItemPreview"} rows={rows} columns={columns} + slots={{ toolbar: CustomToolBar }} apiRef={gridRef} - initialState={{ - pagination: { - paginationModel: { - pageSize: 15, - }, - }, - }} checkboxSelection - pageSizeOptions={[15, 25, 35, 45]} + disableRowSelectionOnClick + hideFooterPagination={true} // 闅愯棌鍒嗛〉鎺т欢 + hideFooter={false} onRowSelectionModelChange={(ids) => { setSelectedIds(ids) }} @@ -305,13 +438,13 @@ ) } + //鎻愪氦鎸夐挳 const SubmitButton = ({ selectedIds, setSelectedIds, gridRef, record }) => { const notify = useNotify(); const refresh = useRefresh(); const redirect = useRedirect(); const submit = async () => { - console.log(record); const items = gridRef.current?.getSortedRows(); const { data: { code, data, msg } } = await request.post('/outStock/generate/tasks', { items, outId: record?.id }); if (code == 200) { @@ -323,11 +456,10 @@ } return ( <ConfirmButton - label="toolbar.confirm" + label="toolbar.allComfirm" variant="contained" size="medium" onConfirm={submit} - startIcon={<ConfirmationNumberOutlinedIcon />} /> ) } -- Gitblit v1.9.1