peng.peng
2 years ago
6 changed files with 213 additions and 14 deletions
@ -1,7 +1,185 @@ |
|||
import React, { useEffect, useState } from 'react' |
|||
import { Spin, Popconfirm, Tree, Row, Col, Button, Input, Table } from 'antd'; |
|||
import { connect } from 'react-redux'; |
|||
import ProTable from '@ant-design/pro-table'; |
|||
import moment from 'moment'; |
|||
|
|||
function AcquisitionLog (props) { |
|||
return <>采集日志</> |
|||
import './style.less'; |
|||
function AcquisitionLog(props) { |
|||
const { loading, clientHeight, actions, dispatch, dataSources, adapters, tasks } = props; |
|||
const [pageSize, setPageSize] = useState(10); |
|||
const [currentPage, setCurrentPage] = useState(1); |
|||
const [searchValue, setSearchValue] = useState('') |
|||
const queryData = (search) => { |
|||
const query = { |
|||
// limit: search ? 10 : pageSize || 10,
|
|||
// page: search ? 1 : currentPage || 1,
|
|||
taskName: searchValue |
|||
} |
|||
dispatch(actions.metadataAcquisition.getTasks(query)); |
|||
} |
|||
|
|||
useEffect(() => { |
|||
dispatch(actions.metadataAcquisition.getDataSources()); |
|||
dispatch(actions.metadataAcquisition.getAdapters()) |
|||
queryData(); |
|||
}, [pageSize, currentPage]); |
|||
|
|||
const columns = [ |
|||
{ |
|||
title: '任务名称', |
|||
dataIndex: 'taskName', |
|||
}, |
|||
{ |
|||
title: '数据源名称', |
|||
dataIndex: 'dataSourceName', |
|||
render: (text, record) => { |
|||
return record?.dataSource?.name |
|||
} |
|||
}, |
|||
{ |
|||
title: '适配器类型', |
|||
dataIndex: 'adapter', |
|||
render: (text, record) => { |
|||
const adapterInfo = record?.dataSource?.adapter |
|||
return adapterInfo?.adapterName |
|||
} |
|||
}, |
|||
{ |
|||
title: '采集方式', |
|||
dataIndex: 'control', |
|||
render: (text, record) => { |
|||
const adapterInfo = record?.dataSource?.adapter |
|||
return adapterInfo?.mode |
|||
} |
|||
}, |
|||
{ |
|||
title: '执行周期', |
|||
dataIndex: 'cron', |
|||
// render: (text, record) => {
|
|||
// return transCron(record?.cron);
|
|||
// }
|
|||
}, |
|||
{ |
|||
title: '重复次数', |
|||
dataIndex: 'retryCount', |
|||
}, |
|||
{ |
|||
title: '时间间隔(分钟)', |
|||
dataIndex: 'retryTime', |
|||
}, |
|||
|
|||
{ |
|||
title: '操作', |
|||
width: 300, |
|||
key: 'option', |
|||
valueType: 'option', |
|||
render: (text, record) => { |
|||
const options = []; |
|||
options.push(<a onClick={() => { |
|||
const param = { id: record.id } |
|||
dispatch(actions.metadataAcquisition.runTask(param)) |
|||
}} style={{ marginRight: 8 }}>立即执行</a>) |
|||
|
|||
const enabledText = record?.enabled ? '禁用' : '启用'; |
|||
options.push(<a onClick={() => { |
|||
dispatch(actions.metadataAcquisition.modifyTask(record?.id, { enabled: !record?.enabled }, '采集任务' + enabledText)).then(res => { |
|||
if (res.success) { |
|||
queryData(); |
|||
} |
|||
}) |
|||
}} style={{ marginRight: 8 }}>{enabledText}</a>) |
|||
|
|||
options.push(<a onClick={() => { |
|||
const adapterInfo = adapters?.find(x => x.id == record?.adapter) |
|||
setVisible(true) |
|||
record.adapterInfo = adapterInfo |
|||
setEditData(record) |
|||
}} style={{ marginRight: 8 }}>编辑</a>) |
|||
//判断数据源下是否有任务 有任务提示需要先删除任务再删除数据源
|
|||
options.push( |
|||
<Popconfirm |
|||
key="del" |
|||
placement="top" |
|||
title={<><div>是否确认删除该采集任务?</div> |
|||
<div>(将同步删除该任务采集日志)</div></>} |
|||
onConfirm={() => handleDelete(record.id)} |
|||
okText="是" |
|||
cancelText="否" |
|||
> |
|||
<a>删除</a> |
|||
</Popconfirm>) |
|||
|
|||
return options; |
|||
|
|||
}, |
|||
}, |
|||
]; |
|||
|
|||
return <Spin spinning={loading}> |
|||
<Row className='protable-title'> |
|||
<Input |
|||
value={searchValue} onChange={e => { setSearchValue(e.target.value) }} |
|||
style={{ width: 220, marginRight: 15 }} placeholder="数据源或任务名称" /> |
|||
<Button onClick={() => { queryData() }} type='primary'>查询</Button> |
|||
</Row> |
|||
|
|||
<ProTable |
|||
columns={columns} |
|||
dateFormatter="string" |
|||
search={false} |
|||
scroll={ |
|||
{ |
|||
scrollToFirstRowOnChange: true, |
|||
y: clientHeight - 260 |
|||
} |
|||
} |
|||
pagination={{ |
|||
size: 'large', |
|||
total: tasks?.count, |
|||
showSizeChanger: true, |
|||
// showQuickJumper: true,
|
|||
// current: currentPage,
|
|||
// pageSize: pageSize || 10,
|
|||
defaultPageSize: 10, |
|||
pageSizeOptions: [10, 20, 50], |
|||
// showTotal: (total) => {
|
|||
// return <span style={{ fontSize: 15 }}>{`共${Math.ceil(total / pageSize)}页,${total}项`}</span>
|
|||
// },
|
|||
// onShowSizeChange: (currentPage, pageSize) => {
|
|||
// setCurrentPage(currentPage);
|
|||
// setPageSize(pageSize);
|
|||
|
|||
// },
|
|||
// onChange: (page, pageSize) => {
|
|||
// setCurrentPage(page);
|
|||
// setPageSize(pageSize);
|
|||
|
|||
// }
|
|||
}} |
|||
dataSource={tasks?.rows || []} |
|||
options={false} |
|||
/> |
|||
</Spin> |
|||
|
|||
} |
|||
|
|||
function mapStateToProps(state) { |
|||
const { |
|||
auth, global, datasources, adapters, tasks |
|||
} = state; |
|||
return { |
|||
loading: datasources.isRequesting || adapters?.isRequesting, |
|||
clientHeight: global.clientHeight, |
|||
actions: global.actions, |
|||
dataSources: datasources?.data || {}, |
|||
adapters: adapters?.data || [], |
|||
tasks: tasks?.data || [], |
|||
}; |
|||
} |
|||
|
|||
export default AcquisitionLog |
|||
export default connect(mapStateToProps)(AcquisitionLog); |
|||
|
|||
|
|||
|
|||
|
|||
|
Loading…
Reference in new issue