1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
| import React, { useState, useRef, useEffect, useMemo } from "react";
| import { Box, Card, CardContent, Grid, Typography, Button, TextField, Tooltip, Paper, TableContainer, Table, TableBody, TableCell, TableHead, TableRow } from '@mui/material';
| import {
| useTranslate,
| useRecordContext,
| useNotify,
| useRefresh,
| useListContext,
| } from 'react-admin';
| import PanelTypography from "../components/PanelTypography";
| import * as Common from '@/utils/common'
| import { styled } from "@mui/material/styles";
| import request from '@/utils/request';
| import debounce from 'lodash/debounce';
| import { DataGrid } from '@mui/x-data-grid';
|
| const WaitPakinPanel = () => {
| const record = useRecordContext();
| if (!record) return null;
| const translate = useTranslate();
| const notify = useNotify();
| const [rows, setRows] = useState([]);
| const [maktx, setMaktx] = useState('');
| const pakinId = record.id;
|
| useEffect(() => {
| debouncedHttp({ maktx });
| }, [pakinId, maktx]);
|
|
| const http = async (parmas) => {
| const res = await request.post('/waitPakinItem/page', { ...parmas, pakinId });
| if (res?.data?.code === 200) {
| setRows(res.data.data.records)
| } else {
| notify(res.data.msg);
| }
| }
|
| const debouncedHttp = useMemo(() => debounce(http, 300), []);
|
| const columns = [
| {
| field: 'pakinId',
| headerName: translate('table.field.waitPakinItem.pakinId')
| },
| {
| field: 'maktx',
| headerName: translate('table.field.waitPakinItem.maktx'),
| width: 200
| },
| {
| field: 'matnrId',
| headerName: translate('table.field.waitPakinItem.matnrId')
| },
| {
| field: 'matnrCode',
| headerName: translate('table.field.waitPakinItem.matnrCode')
| },
| {
| field: 'asnCode',
| headerName: translate('table.field.waitPakinItem.asnCode')
| },
| {
| field: 'trackCode',
| headerName: translate('table.field.waitPakinItem.trackCode')
| },
| {
| field: 'anfme',
| headerName: translate('table.field.waitPakinItem.anfme')
| },
| {
| field: 'workQty',
| headerName: translate('table.field.waitPakinItem.workQty')
| },
| {
| field: 'unit',
| headerName: translate('table.field.waitPakinItem.unit')
| },
| {
| field: 'fieldsIndex',
| headerName: translate('table.field.waitPakinItem.fieldsIndex')
| },
| {
| field: 'qty',
| headerName: translate('table.field.waitPakinItem.qty')
| },
| {
| field: 'batch',
| headerName: translate('table.field.waitPakinItem.batch')
| },
| ]
|
| const maktxChange = (value) => {
| setMaktx(value)
| }
|
|
| return (
| <Box sx={{
| position: 'relative',
| padding: '5px 10px'
| }}>
|
| <div style={{ display: 'flex', justifyContent: 'space-between', marginBottom: '4px', alignItems: 'center' }}>
| <TextField value={maktx} onChange={(e) => maktxChange(e.target.value)} label="搜索物料" variant="outlined" sx={{ width: '300px' }} size="small" />
|
| <div style={{ display: 'flex', gap: '10px' }}>
| </div>
| </div>
|
|
| <DataGrid
| size="small"
| rows={rows}
| columns={columns}
| disableRowSelectionOnClick
| disableColumnMenu={true}
| disableColumnSorting
| disableMultipleColumnsSorting
| />
| </Box >
| );
| };
|
| export default WaitPakinPanel;
|
|
