index.tsx
2.07 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
55
56
57
58
import React, { useState } from 'react';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { Table, Button, Card, Popconfirm, Divider, message } from 'antd';
import AddModal from './components/AddModal';
import {Item, getDetail, DeleteApi} from './api';
import useInitial from '@/hooks/useInitail';
const {Column} = Table;
const Index = () => {
const [current, setCurrent] = useState<{visible:boolean, item?:any}>({visible: false, item: {}});
const { data, loading, setParams } = useInitial<Item[], object>(getDetail, [], {});
const dele = (id?: number) => {
DeleteApi({id}).then(res => {
message.success('操作成功');
setParams({}, true);
}).catch(e => message.error(e.message));
};
return (
<PageHeaderWrapper title="绩效目标设置">
<Card>
<div style={{display: 'flex', justifyContent: 'flex-end', marginBottom: 20}}>
<Button type="primary" onClick={() => setCurrent({visible: true, item: {}})}>新增</Button>
</div>
<Table
dataSource={data}
loading={loading}
rowKey={r => `${r.id}`}
pagination={false}
>
<Column title="库房" dataIndex="storageName" />
<Column title="门店" dataIndex="shopName" />
<Column title="订件时长目标(天)" dataIndex="days" />
<Column title="运费目标(元)" dataIndex="amount" />
<Column
title="操作"
render={(r:Item) => (
<>
<a onClick={() => setCurrent({visible: true, item: r})}>编辑</a>
<Divider type="vertical" />
<Popconfirm
title="确认删除"
onConfirm={() => dele(r.id)}
>
<a>删除</a>
</Popconfirm>
</>
)}
/>
</Table>
<AddModal item={current.item} visible={current.visible} onCancel={() => setCurrent({visible: false, item: {}})} refesh={() => setParams({}, true)} />
</Card>
</PageHeaderWrapper>
);
};
export default Index;