OutFlowDetailModal.tsx
1.61 KB
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
import React, { useEffect, useState } from 'react';
import { Button, Modal, Table } from 'antd';
import { outFlowDetailApi, OutItem } from '../api';
import useInitial from '@/hooks/useInitail';
import moment from 'moment';
const { Column } = Table;
interface Props {
visible?:boolean
setVisible:Function
item?:any
}
export default function Index(props:Props) {
const { visible, setVisible, item } = props;
const [delay, setDelay] = useState(true);
const { data, setParams, loading } = useInitial(outFlowDetailApi, [], {}, delay);
useEffect(() => {
if (visible && item?.poolIds) {
setParams({ min: undefined, max: undefined, date: undefined, outCnt: undefined, ...item }, true);
setDelay(false);
} else {
setVisible();
}
}, [visible]);
return (
<Modal
title="出库详情"
width={1000}
visible={visible}
maskClosable={false}
onCancel={() => setVisible()}
footer={[
<Button onClick={() => setVisible()}>取消</Button>
]}
>
<Table
dataSource={data}
loading={loading}
rowKey={(v: OutItem) => `${v.partId}`}
pagination={false}
scroll={{ y: 400 }}
>
<Column title="配件名称" dataIndex="partName" />
<Column title="配件编码" dataIndex="partCode" />
<Column title="出库数量" dataIndex="partCnt" />
<Column title="出库类型" dataIndex="typeName" />
<Column title="服务站名称" dataIndex="shopName" />
<Column title="出库时间" render={r => moment(r.outTime).format('YYYY-MM-DD HH:mm:ss')} />
</Table>
</Modal>
);
}