index.tsx
5.91 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
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
127
128
129
130
131
132
133
134
135
import React, { useState } from "react";
import { Card, ConfigProvider, DatePicker, Divider, Table, Dropdown, Menu } from 'antd';
import { DownOutlined } from '@ant-design/icons';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import usePagination from "@/hooks/usePagination";
import DetailModal from './components/ConfirmDetailModal';
import { getList, Item } from './api';
import st from './style.less';
import zhCN from "antd/lib/locale-provider/zh_CN";
import moment from 'moment';
import useInitial from '@/hooks/useInitail';
import * as API from '@/common/api';
import UploadExcel from './components/UploadExcel';
import PmsSelect from '@/pages/pms/comonents/PmsSelect';
import * as api from "@/pages/pms/storage/partShop/api";
const { Column } = Table;
export default function PartPriceCoefficient() {
const { list, paginationConfig, loading, setParams, innerParams } = usePagination<Item>(getList, {});
const { data: brands } = useInitial(API.getBrandFilterApi, [], {});
const [importVisible, setImportVisible] = useState(false);
const [visibleConfirm, setVisibleConfirm] = useState(false);
const [confirm, setConfirm] = useState(false);
const [item, setItem] = useState<Item>({});
const { data: shops } = useInitial<PmsStoragePartShop.Option[], {}>(api.getShopApi, [], {});
const menu = (
<Menu
items={
[
{
label: <a href="/api/pms/erp/part/template/shipping">通用模板</a>,
key: '0',
},
{
label: <a href="/api/pms/erp/part/template/shipping/ca">长安模板</a>,
key: '1',
},
]
}
/>
);
return (
<PageHeaderWrapper title="发运单">
<ConfigProvider locale={zhCN}>
<Card className={st.page}>
<div style={{ display: 'flex', flexDirection: 'row', justifyContent: 'space-between', alignItems: 'center', marginBottom: 20 }}>
<div style={{ display: 'flex', flexDirection: 'row'}}>
<DatePicker
value={innerParams.month == undefined ? moment(new Date().toLocaleDateString(), 'YYYY-MM') : moment(innerParams.month)}
picker="month"
allowClear={false}
style={{ marginRight: 20 }}
onChange={(v) => setParams({...innerParams, month: v && v.valueOf(), current: 1}, true)}
/>
<PmsSelect
placeholder="请选择品牌"
showSearch
style={{ width: 200, marginRight: 20 }}
value={innerParams.brandId}
onChange={brandId => setParams({ ...innerParams, brandId, current: 1 }, true)}
options={brands.map((i: any) => ({value: i.id, label: i.name}))}
/>
<PmsSelect
style={{ width: 200}}
allowClear
value={innerParams.shopId}
onChange={value => {
setParams({ ...innerParams, current: 1, shopId: value}, true);
}}
placeholder="请选择服务站"
options={shops.map((item: PmsStoragePartShop.Option) => ({value: item.id, label: item.name}))}
/>
</div>
<div style={{ display: 'flex', flexDirection: 'row'}}>
<Dropdown overlay={menu} trigger={['click']} placement="bottomLeft" arrow overlayStyle={{width: 120}}>
<a style={{display: 'flex', alignItems: 'center'}}>导入模板<DownOutlined style={{fontSize: 14, marginLeft: 3}} /></a>
</Dropdown>
<div style={{marginLeft: 20}}><a onClick={() => { setImportVisible(true); }}>导入数据</a></div>
</div>
</div>
<Table
size="small"
loading={loading}
pagination={paginationConfig}
dataSource={list}
rowKey={(item: Item) => `${item.shippingNo}`}
onChange={(_pagination) => setParams({ ..._pagination }, true)}
>
<Column title="发运单号" dataIndex="shippingNo" />
<Column title="品牌" dataIndex="brandName" />
<Column title="供应商" dataIndex="supplierName" />
<Column title="库房" dataIndex="storageName" />
<Column title="门店" dataIndex="shopName" />
<Column title="结算商家" dataIndex="settleDealerName" />
<Column title="总金额(元)" dataIndex="totalAmount" render={(t: number) => t.toFixed(2) || 0} />
<Column title="导入时间" dataIndex="shippingDate" render={(t: number) => t && moment(t).format('YYYY-MM-DD HH:mm')} />
<Column title="导入人员" dataIndex="importUserName" />
<Column title="入库人员" dataIndex="inStorageUserName" render={t => t || '--'} />
<Column title="状态" dataIndex="status" render={(t: number) => ['待确认', '待入库', '已完成'][t]} />
<Column
title="操作"
className={st.edit}
render={(text, _item: Item) => (
<>
<a onClick={() => { setVisibleConfirm(true); setConfirm(false); setItem(_item); }}>查看</a>
{_item.status == 0 && (
<>
<Divider type="vertical" />
<a onClick={() => { setVisibleConfirm(true); setConfirm(true); setItem(_item); }}>导入确认</a>
</>
)}
</>
)}
/>
</Table>
</Card>
<DetailModal
visible={visibleConfirm}
item={item}
confirm={confirm}
onCancel={() => setVisibleConfirm(false)}
fetchList={() => setParams({ current: 1 }, true)}
/>
<UploadExcel
importVisible={importVisible}
setImportVisible={setImportVisible}
brands={brands}
getList={() => setParams({ current: 1 }, true)}
/>
</ConfigProvider>
</PageHeaderWrapper>
);
}