index.tsx
3.46 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
import React, { useEffect, useState } from 'react';
import { Input, Card, Row, Table, Select, Tag, message } from 'antd';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { getActivityChangeLog, getEvaluateWinListApi, ListVO, PrizeItemList } from './api';
import moment from 'moment';
import { debounce } from 'lodash';
import * as common from '@/typing/common';
import ChangesDetail from './components/ChangesDetail';
import useInitial from '@/hooks/useInitail';
interface Props extends common.ConnectProps { }
const Search = Input.Search;
const Column = Table.Column;
interface ModalParams {
visible: boolean;
id?: number;
}
const AssistManage = (props: any) => {
const { match } = props;
const { activityNo } = match.params;
const [delay, setDelay] = useState(true);
const { loading, data, params, setData, setParams } = useInitial(getActivityChangeLog, [], {}, delay);
const [modalValue, setModaValue] = useState<ModalParams>({ visible: false });
const _onSearch = debounce((pa: any) => {
if (!pa.activityNo && !params.activityNo) {
message.info("请先输入活动编码查询");
setData([]);
return;
}
setParams({ ...pa }, true);
setDelay(false);
}, 500);
useEffect(() => {
if (activityNo) {
setParams({ activityNo }, true);
setDelay(false);
}
}, [activityNo]);
return (
<PageHeaderWrapper title="活动变更记录">
<Card>
<Row style={{ justifyContent: "start", marginBottom: 20 }}>
<Search
allowClear
value={params.activityNo}
onChange={e => (e.target.value ? _onSearch({ activityNo: e.target.value }) : setParams({ ...params, activityNo: undefined }))}
onSearch={v => v && _onSearch({ activityNo: v })}
style={{ maxWidth: 230, marginRight: 30 }}
placeholder="搜索活动编号"
/>
</Row>
<Table
loading={loading && !delay}
dataSource={data}
rowKey={(_record) => `${_record.id}`}
>
<Column
title="活动名称"
dataIndex="activityName"
/>
<Column
title="变更项目统计"
dataIndex="changeTotal"
/>
<Column
title="申请人名称"
dataIndex="applyUserName"
/>
<Column
title="申请原因"
dataIndex="reason"
/>
<Column
title="申请时间"
dataIndex="applyTime"
render={(t) => t && moment(t).format("YYYY-MM-DD HH:mm")}
/>
<Column
title="审批时间"
dataIndex="approvalTime"
render={(t) => t && moment(t).format("YYYY-MM-DD HH:mm")}
/>
<Column
title="审批结果"
dataIndex="approvalResult"
render={t => (t ? "通过" : "拒绝")}
/>
<Column
title="变更详情"
align="left"
render={(text, record: ListVO) => (
<>
<a href="#" onClick={(e) => { e.preventDefault(); setModaValue({ visible: true, id: record.id }); }}>
查看
</a>
</>
)}
/>
</Table>
</Card>
<ChangesDetail visible={modalValue.visible} id={modalValue.id} onCancel={() => setModaValue({ visible: false, id: undefined })} />
</PageHeaderWrapper>
);
};
export default AssistManage;