|
|
|
@ -1,11 +1,22 @@ |
|
|
|
import React, { useEffect, useState } from 'react'; |
|
|
|
import { connect } from 'react-redux'; |
|
|
|
import { Select, Input, Button, RadioGroup, Radio, Table } from '@douyinfe/semi-ui'; |
|
|
|
import { IconSearch } from '@douyinfe/semi-icons'; |
|
|
|
import { Select, Input, Spin, Button, Table } from '@douyinfe/semi-ui'; |
|
|
|
import { RESERVEITEM_TYPE } from '../constants'; |
|
|
|
import '../style.less' |
|
|
|
import moment from 'moment' |
|
|
|
|
|
|
|
const ReserveItemsPeriodicStatistics = (props) => { |
|
|
|
const { dispatch, actions, isRequesting, reserveItemReport } = props; |
|
|
|
const [downloadUrl, setDownloadUrl] = useState(null); |
|
|
|
const [downloadKey, setDownloadKey] = useState(null); |
|
|
|
useEffect(() => { |
|
|
|
dispatch(actions.businessManagement.getReserveItemReport(RESERVEITEM_TYPE.periodicStatistics)); |
|
|
|
}, []); |
|
|
|
|
|
|
|
const exportReport = (url) => { |
|
|
|
setDownloadUrl(`/_file-server${url}`); |
|
|
|
setDownloadKey(Math.random()); |
|
|
|
} |
|
|
|
|
|
|
|
const columns = [ |
|
|
|
{ |
|
|
|
title: '序号', |
|
|
|
@ -14,34 +25,16 @@ const ReserveItemsPeriodicStatistics = (props) => { |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '时间', |
|
|
|
dataIndex: 'updateTime', |
|
|
|
dataIndex: 'date', |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '名称', |
|
|
|
dataIndex: 'name', |
|
|
|
dataIndex: 'path', |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '操作', |
|
|
|
dataIndex: 'action', |
|
|
|
render: (text, record, indexe) => (<Button theme='solid' type='secondary'>导出</Button>) |
|
|
|
}, |
|
|
|
]; |
|
|
|
const data = [ |
|
|
|
{ |
|
|
|
key: '1', |
|
|
|
name: 'Semi Design 设计稿.fig', |
|
|
|
updateTime: '2020-02-02 05:13', |
|
|
|
avatarBg: 'grey', |
|
|
|
}, |
|
|
|
{ |
|
|
|
key: '2', |
|
|
|
name: 'Semi Design 分享演示文稿', |
|
|
|
updateTime: '2020-01-17 05:31', |
|
|
|
}, |
|
|
|
{ |
|
|
|
key: '3', |
|
|
|
name: '设计文档', |
|
|
|
updateTime: '2020-01-26 11:01', |
|
|
|
render: (text, record, indexe) => (<Button theme='solid' type='secondary' onClick={() => exportReport(record.path)} > 导出</Button >) |
|
|
|
}, |
|
|
|
]; |
|
|
|
|
|
|
|
@ -64,9 +57,17 @@ const ReserveItemsPeriodicStatistics = (props) => { |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
<div style={{ borderBottom: '1px solid #F2F3F5', marginLeft: '-20px', marginBottom: 16 }}></div> |
|
|
|
|
|
|
|
<div style={{ display: 'flex', justifyContent: 'space-between', marginBottom: 22 }}> |
|
|
|
<Table columns={columns} dataSource={data} pagination={false} /> |
|
|
|
{ |
|
|
|
downloadUrl ? <iframe key={downloadKey} src={downloadUrl} style={{ display: 'none' }} /> : '' |
|
|
|
} |
|
|
|
<div style={{ marginBottom: 22 }}> |
|
|
|
<Spin spinning={isRequesting}> |
|
|
|
<Table |
|
|
|
rowKey={"id"} |
|
|
|
columns={columns} |
|
|
|
dataSource={reserveItemReport} |
|
|
|
/> |
|
|
|
</Spin> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
@ -76,10 +77,12 @@ const ReserveItemsPeriodicStatistics = (props) => { |
|
|
|
|
|
|
|
|
|
|
|
function mapStateToProps(state) { |
|
|
|
const { auth, global } = state; |
|
|
|
const { auth, global, reserveItemReport } = state; |
|
|
|
return { |
|
|
|
user: auth.user, |
|
|
|
actions: global.actions, |
|
|
|
reserveItemReport: reserveItemReport.data || [], |
|
|
|
isRequesting: reserveItemReport.isRequesting |
|
|
|
}; |
|
|
|
} |
|
|
|
|
|
|
|
|
