index.tsx
2.79 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
import React, { useState } from 'react';
import { Card, Button, Table, Divider, Popconfirm, message } from 'antd';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import AddModal from './components/AddModal';
import ChargeModal from './components/ChargeModal';
import {getList, ListVO, deleteApi} from './api';
import usePagination from '@/hooks/usePagination';
const Column = Table.Column;
export default function Index() {
const {list, loading, paginationConfig, setParams} = usePagination<ListVO>(getList, [], {});
const [current, setCurrent] = useState<{ visible: boolean, item: ListVO }>({visible: false, item: {}});
const [chargeInfo, setChargeInfo] = useState<{ visible: boolean, item: ListVO }>({visible: false, item: {}});
const data = [{id: 1, supplierName: "货拉拉", shopName: "不过承诺书可能单纯迪士尼才", amount: 3000, minAmount: 1500, roleName: "计划制定员", account: "15725173,16638183"}];
return (
<PageHeaderWrapper title="货拉拉账户配置">
<Card
extra={<Button type="primary" onClick={() => setCurrent({visible: true, item: {}})}>新增</Button>}
>
<Table dataSource={data} rowKey="id" loading={loading} pagination={paginationConfig}>
<Column title="往来单位" dataIndex="supplierName" />
<Column title="签约门店" dataIndex="shopName" />
<Column title="当前余额(元)" dataIndex="amount" />
<Column title="低余额推待办(元)" dataIndex="minAmount" />
<Column title="推待办角色" dataIndex="roleName" />
<Column title="发单账号" dataIndex="account" />
<Column
title="操作"
render={r => (
<div style={{display: 'flex', flexWrap: 'wrap', alignItems: 'center'}}>
<a onClick={() => setChargeInfo({visible: true, item: r})}>预付款充值申请</a>
<Divider type="vertical" />
<a onClick={() => setCurrent({visible: true, item: r})}>编辑</a>
<Divider type="vertical" />
<Popconfirm
title="确认删除"
onConfirm={() => {
deleteApi({id: r.id}).then(res => {
message.success('操作成功');
setParams({}, true);
}).catch(e => message.error(e.message));
}}
>
<a>删除</a>
</Popconfirm>
</div>
)}
/>
</Table>
<AddModal visible={current.visible} item={current.item} onCancel={() => setCurrent({ visible: false, item: {} })} />
<ChargeModal visible={chargeInfo.visible} item={chargeInfo.item} onCancel={() => setChargeInfo({ visible: false, item: {} })} />
</Card>
</PageHeaderWrapper>
);
}