From 81fa2ee00313e7f786be6f5c109b92ed612f61c1 Mon Sep 17 00:00:00 2001 From: skyouc Date: 星期二, 05 八月 2025 13:00:05 +0800 Subject: [PATCH] Merge branch 'devlop' of http://47.97.1.152:5880/r/wms-master into devlop --- rsf-admin/src/page/stockManage/locRevise/LocReviseCreate.jsx | 504 ++++++++++++++++++++++++++++++++++++++++++++++++++++++++ 1 files changed, 504 insertions(+), 0 deletions(-) diff --git a/rsf-admin/src/page/stockManage/locRevise/LocReviseCreate.jsx b/rsf-admin/src/page/stockManage/locRevise/LocReviseCreate.jsx new file mode 100644 index 0000000..d8b8919 --- /dev/null +++ b/rsf-admin/src/page/stockManage/locRevise/LocReviseCreate.jsx @@ -0,0 +1,504 @@ +import React, { useState, useRef, useEffect, useMemo } from "react"; +import { + useTranslate, + TextInput, + DateInput, + ReferenceInput, + AutocompleteInput, + SelectColumnsButton, + DatagridConfigurable, + Toolbar, + required, + useNotify, + DeleteButton, + BooleanField, + EditButton, + WrapperField, + SaveButton, + SimpleForm, + NumberField, + useRefresh, + TextField, + DateField, + CreateBase, + TopToolbar, + FilterButton, + SearchInput, + List, + Create, +} from 'react-admin'; +import { + Dialog, + DialogActions, + DialogContent, + DialogTitle, + IconButton, + MenuItem, + Tooltip, + Select, + Button, + Stack, + Grid, + Card, + Box, + CardContent, +} from '@mui/material'; +import { PAGE_DRAWER_WIDTH, OPERATE_MODE, DEFAULT_PAGE_SIZE } from '@/config/setting'; +import ConfirmationNumberIcon from '@mui/icons-material/ConfirmationNumber'; +import DialogCloseButton from "../../components/DialogCloseButton.jsx"; +import WarehouseSelect from "../../components/WarehouseSelect.jsx"; +import { useWatch, useFormContext } from "react-hook-form"; +import { DataGrid, useGridApiRef } from '@mui/x-data-grid'; +import ConfirmButton from "../../components/ConfirmButton"; +import { Add, Edit, Delete } from '@mui/icons-material'; +import SelectLocsRevise from "./SelectLocsRevise.jsx"; +import DictSelect from "../../components/DictSelect"; +import SaveIcon from '@mui/icons-material/Save'; +import { styled } from '@mui/material/styles'; +import { redirect } from "react-router"; +import request from '@/utils/request'; +import _, { set } from 'lodash'; + +const LocReviseCreate = (props) => { + const { open, setOpen, orderId } = props; + const tableRef = useRef(); + const notify = useNotify(); + const refresh = useRefresh(); + const translate = useTranslate(); + const [tabelData, setTableData] = useState([]); + const [disabled, setDisabled] = useState(false); + const [isVisible, setIsVisible] = useState("block"); + const [selectedRows, setSelectedRows] = useState([]); + const [createDialog, setCreateDialog] = useState(false); + const [formData, setFormData] = useState({ type: '0', orgAreaId: null, tarAreaId: null, exceTime: null, code: null }); + const dicts = JSON.parse(localStorage.getItem('sys_dicts'))?.filter(dict => (dict.dictTypeCode == 'sys_stock_revise_type')) || []; + + const setFinally = () => { + const rows = tableRef.current.state.editRows; + for (const key in rows) { + const find = tabelData.find(item => item.matnrId === +key); + find.anfme = rows[key].anfme.value; + } + setTableData([...tabelData]); + } + + const FormToolbar = () => { + return ( + <Toolbar sx={{ justifyContent: 'flex-end' }}> + <SaveButton disabled={disabled} /> + <DeleteButton mutationMode="optimistic" /> + </Toolbar> + ) + } + // const handleSubmit = async () => { + // setFinally() + // setDisabled(true) + + // if (orderId == null || orderId == undefined) { + // const parmas = { + // "revise": formData, + // "items": tabelData, + // } + + // const res = await request.post(`/transfer/items/save`, parmas); + // if (res?.data?.code === 200) { + // setOpen(false); + // } else { + // notify(res.data.msg); + // } + // } else { + // const parmas = { + // "transfer": formData, + // "items": tabelData, + // } + // const res = await request.post(`/transfer/items/update`, parmas); + // if (res?.data?.code === 200) { + // setOpen(false); + // } else { + // notify(res.data.msg); + // } + // } + // setDisabled(false) + // refresh(); + + // }; + + const handleDeleteItem = () => { + const newTableData = _.filter(tabelData, (item) => !selectedRows.includes(item.matnrId)); + setTableData(newTableData); + } + + const newAddClick = () => { + setCreateDialog(true) + } + + const mutationOptions = { + onSuccess: (data) => { + setIsVisible("block") + setDisabled(true) + refresh() + }, + }; + + const handleChange = (value, name) => { + setFormData((prevData) => ({ + ...prevData, + [name]: value + })); + }; + + return ( + <> + <Box sx={{ padding: 1 }}> + <Create resource="locRevise" + title={false} + mutationOptions={mutationOptions} > + <SimpleForm toolbar={<FormToolbar />}> + <Grid container spacing={2} sx={{ + '& .MuiToolbar-root-RaToolbar-root.RaToolbar-defaultToolbar': { + justifyContent: 'flex-end', + } + }}> + <Grid item md={2}> + <AutocompleteInput + choices={dicts} + optionText='label' + optionValue="value" + defaultValue="1" + source="type" + parse={v => v} + label={translate("table.field.transfer.type")} + /> + </Grid> + <Grid item md={2}> + <ReferenceInput source="areaId" reference="warehouseAreas"> + <AutocompleteInput + optionText='name' + optionValue="id" + parse={v => v} + label={translate("table.field.locRevise.areaName")} + /> + </ReferenceInput> + </Grid> + <Grid item md={2}> + <DateInput + source="exceTime" + parse={v => v} + label="table.field.locRevise.exceTime" + /> + </Grid> + </Grid> + </SimpleForm> + </Create> + <Box sx={{ display: isVisible }}> + <Card sx={{ height: 630 }}> + <Box> + <Box sx={{ mt: 2 }}> + <Stack direction="row" spacing={2} sx={{ justifyContent: "flex-start" }}> + <Button variant="contained" onClick={newAddClick} > + {translate('common.action.newAddMats')} + </Button> + <ConfirmButton label={"toolbar.delete"} variant="outlined" color="error" onConfirm={handleDeleteItem} /> + </Stack> + </Box> + <Box sx={{ mt: 2 }}> + <TransferTableView + tabelData={tabelData} + setTableData={setTableData} + orderId={orderId} + selectedRows={selectedRows} + setSelectedRows={setSelectedRows} + tableRef={tableRef}> + </TransferTableView> + </Box> + </Box> + </Card> + </Box> + <SelectLocsRevise + data={tabelData} + queryForm={formData} + open={createDialog} + setOpen={setCreateDialog} + selectedRows={selectedRows} + setSelectedRows={setSelectedRows} + setData={setTableData} + /> + </Box> + </> + ) +} + +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) + } 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); + + // 濡傛灉鎵惧埌瀵瑰簲鐨勪緵搴斿晢璁板綍锛屽悓鏃舵洿鏂皊plrCode瀛楁 + 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) + } 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); + + // 濡傛灉鎵惧埌瀵瑰簲鐨勪緵搴斿晢璁板綍锛屽悓鏃舵洿鏂皊plrCode瀛楁 + 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 TransferTableView = ({ tabelData, setTableData, orderId, selectedRows, setSelectedRows, tableRef }) => { + const [extendColumns, setExtendColumns] = useState([]); + const translate = useTranslate(); + const notify = useNotify(); + const [columns, setColumns] = useState([ + { + field: 'maktx', + headerName: translate('table.field.outStockItem.maktx'), + width: 250, + editable: false, + }, + { + field: 'matnrCode', + headerName: translate('table.field.outStockItem.matnrCode'), + width: 130, + editable: false, + }, + { + field: 'anfme', + headerName: translate('table.field.outStockItem.anfme'), + type: 'number', + minWidth: 100, + flex: 1, + editable: true, + valueFormatter: (val) => val < 0 ? 0 : val, + }, + { + field: 'splrCode', + headerName: translate('table.field.outStockItem.splrCode'), + minWidth: 100, + flex: 1, + editable: true, + renderEditCell: (params) => ( + <SelectInputSplrCodeEditCell {...params} /> + ), + }, + { + field: 'splrName', + headerName: translate('table.field.outStockItem.splrName') + "*", + minWidth: 100, + flex: 1, + editable: true, + renderEditCell: (params) => ( + <SelectInputSplrNameEditCell {...params} /> + ), + }, + { + field: 'batch', + headerName: translate('table.field.outStockItem.splrBatch'), + minWidth: 100, + flex: 1, + editable: true, + }, + { + field: 'stockUnit', + headerName: translate('table.field.outStockItem.stockUnit'), + minWidth: 100, + flex: 1, + editable: true, + }, + ]) + + const action = { + field: 'action', + headerName: '鎿嶄綔', + width: 70, + lockPosition: 'left', + renderCell: (params) => ( + <Tooltip title="Delete"> + <IconButton onClick={() => handleDelete(params.row)}> + <Delete /> + </IconButton> + </Tooltip> + ), + } + + let cdata = useRef([]); + + useEffect(() => { + if (extendColumns == undefined || extendColumns.length < 1) { + getDynamicFields(); + } + }, []); + + useEffect(() => { + cdata.current = tabelData + }, [tabelData]); + + + 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: false + })) + setColumns([...columns, ...cols, action]) + setExtendColumns(cols); + } else { + notify(msg); + } + } + + + const handleDelete = (row) => { + const newData = _.filter(cdata.current, (item) => item.matnrId !== row.matnrId); + setTableData(newData); + }; + + + const processRowUpdate = (newRow, oldRow) => { + const rows = tabelData.map((r) => + r.matnrId === newRow.matnrId ? { ...newRow } : r + ) + setTableData(rows) + return newRow; + }; + + const handleSelectionChange = (ids) => { + setSelectedRows(ids) + }; + + tableRef.current = useGridApiRef(); + + const tableIds = tabelData.map(map => map.id); + // setSelectedRows(tableIds); + // // console.log(selectedRows); + + + return ( + <Box> + <DataGrid + apiRef={tableRef} + rows={tabelData} + columns={columns} + disableRowSelectionOnClick + initialState={{ + pagination: { + paginationModel: { + pageSize: 25, + }, + }, + }} + pageSizeOptions={[15, 25, 50, 100]} + editMode="row" + checkboxSelection + rowSelectionModel={tableIds} + onRowSelectionModelChange={handleSelectionChange} + sx={{ + height: 500, + '& .MuiDataGrid-cell input': { + border: '1px solid #ccc' + }, + }} + /> + </Box> + ); +}; + + +export default LocReviseCreate; -- Gitblit v1.9.1