You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
334 lines
14 KiB
334 lines
14 KiB
import React, { useEffect, useState } from 'react';
|
|
import { connect } from 'react-redux';
|
|
import { Spin, Table, Popconfirm, Button, Input } from 'antd';
|
|
import moment from 'moment';
|
|
import FileSaver from 'file-saver';
|
|
import BusinessDatabaseModal from '../components/businessDatabaseModal';
|
|
const BusinessFilesTable = (props) => {
|
|
const { user, dispatch, actions, clientHeight, resourceCatalogId,
|
|
resourceCatalogPath, isRequesting, metadataModels } = props;
|
|
const { metadataManagement } = actions;
|
|
const SortValues = { 'ascend': 'asc', 'descend': 'desc' };
|
|
const [tableData, setTableData] = useState([]);
|
|
const [tableDataCount, setTableDataCount] = useState(0);//Table数据
|
|
const [updateAtSort, setUpdateAtSort] = useState('descend');
|
|
const [keywords, setKeywords] = useState('');
|
|
const [limit, setLimit] = useState(10);
|
|
const [currentPage, setCurrentPage] = useState(1);
|
|
const [selectedRowKeys, setSelectedRowKeys] = useState([]);
|
|
const [selectedRows, setSelectedRows] = useState([]);
|
|
const [modalVisible, setModalVisible] = useState(false);
|
|
const [editData, setEditData] = useState({});
|
|
|
|
useEffect(() => {
|
|
setUpdateAtSort('descend');
|
|
onSearch('descend');
|
|
}, []);
|
|
|
|
const initData = (query = {}) => {
|
|
dispatch(metadataManagement.getBusinessMetadataRestapis({ catalog: resourceCatalogId, keywords, orderBy: 'updateAt', ...query })).then(res => {
|
|
if (res.success) {
|
|
setTableData(res.payload.data.rows);
|
|
setTableDataCount(res.payload.data.count);
|
|
}
|
|
})
|
|
}
|
|
const onAdd = (record, add) => {
|
|
dispatch(metadataManagement.getMetadataModels({ modelTypes: '接口' })).then(res => {
|
|
if (res.success) {
|
|
if (!add)
|
|
setEditData({ title: '查看业务元数据', record: { path: '/' + resourceCatalogPath.join('/'), businessMetadata: record.businessMetadataRestapis, ...record, ...record.attributesParam } });
|
|
else
|
|
setEditData({ add: true, title: '新建业务元数据', record: { businessMetadata: record.businessMetadataRestapis, ...record } });
|
|
setModalVisible(true);
|
|
}
|
|
})
|
|
}
|
|
const confirmDelete = (id) => {
|
|
dispatch(metadataManagement.delBusinessMetadataRestapis(id)).then(res => {
|
|
if (res.success) {
|
|
onSearch(); setModalVisible(false);
|
|
}
|
|
});
|
|
}
|
|
const onTableChange = (pagination, filters, sorter) => {
|
|
let limit = Number.parseInt(pagination.pageSize);
|
|
let offset = Number.parseInt(pagination.current) - 1;
|
|
setCurrentPage(pagination.current);
|
|
setLimit(limit);
|
|
let query = { offset, limit, orderDirection: SortValues[updateAtSort] };
|
|
if (sorter.columnKey === 'updateAt') {
|
|
query.orderDirection = SortValues[sorter.order];
|
|
setUpdateAtSort(sorter.order);
|
|
}
|
|
setSelectedRowKeys([]);
|
|
setSelectedRows([]);
|
|
initData(query);
|
|
}
|
|
const columns = [
|
|
{
|
|
title: '元数据名称',
|
|
dataIndex: 'name',
|
|
key: 'name',
|
|
ellipsis: true,
|
|
fixed: 'left',
|
|
width: '7%',
|
|
}, {
|
|
title: '元数据类型',
|
|
dataIndex: 'type',
|
|
key: 'type',
|
|
fixed: 'left',
|
|
width: '6%',
|
|
render: (text, record, index) => {
|
|
return '接口'
|
|
}
|
|
}, {
|
|
title: '信息资源名称',
|
|
dataIndex: 'resourceName',
|
|
key: 'resourceName',
|
|
ellipsis: true,
|
|
render: (text, record, index) => {
|
|
let data = record.businessMetadataRestapis;
|
|
if (data && data.length)
|
|
return data[0].resourceName;
|
|
else
|
|
return ''
|
|
}
|
|
}, {
|
|
title: '信息资源摘要',
|
|
dataIndex: 'resourceAbstract',
|
|
key: 'resourceAbstract',
|
|
ellipsis: true,
|
|
render: (text, record, index) => {
|
|
let data = record.businessMetadataRestapis;
|
|
if (data && data.length)
|
|
return data[0].resourceAbstract;
|
|
else
|
|
return ''
|
|
}
|
|
}, {
|
|
title: '信息资源提供方',
|
|
dataIndex: 'resourceProvider',
|
|
key: 'resourceProvider',
|
|
ellipsis: true,
|
|
render: (text, record, index) => {
|
|
let data = record.businessMetadataRestapis;
|
|
if (data && data.length)
|
|
return data[0].resourceProvider;
|
|
else
|
|
return ''
|
|
}
|
|
}, {
|
|
title: '信息资源分类',
|
|
dataIndex: 'resourceCategory',
|
|
key: 'resourceCategory',
|
|
ellipsis: true,
|
|
render: (text, record, index) => {
|
|
let data = record.businessMetadataRestapis;
|
|
if (data && data.length)
|
|
return data[0].resourceCategory;
|
|
else
|
|
return ''
|
|
}
|
|
}, {
|
|
title: '信息资源标识符',
|
|
dataIndex: 'resourceId',
|
|
key: 'resourceId',
|
|
ellipsis: true,
|
|
render: (text, record, index) => {
|
|
let data = record.businessMetadataRestapis;
|
|
if (data && data.length)
|
|
return data[0].resourceId;
|
|
else
|
|
return ''
|
|
}
|
|
}, {
|
|
title: '元数据标识符',
|
|
dataIndex: 'metadataId',
|
|
key: 'metadataId',
|
|
ellipsis: true,
|
|
render: (text, record, index) => {
|
|
let data = record.businessMetadataRestapis;
|
|
if (data && data.length)
|
|
return data[0].metadataId;
|
|
else
|
|
return ''
|
|
}
|
|
}, {
|
|
title: '创建者',
|
|
dataIndex: 'createBy',
|
|
key: 'createBy',
|
|
ellipsis: true,
|
|
render: (text, record, index) => {
|
|
let data = record.businessMetadataRestapis;
|
|
if (data && data.length)
|
|
return data[0].user.username;
|
|
else
|
|
return ''
|
|
}
|
|
}, {
|
|
title: '最后执行时间',
|
|
dataIndex: 'updateAt',
|
|
key: 'updateAt',
|
|
width: '8%',
|
|
sortOrder: updateAtSort,
|
|
sorter: (a, b) => moment(a.updateAt).valueOf() - moment(b.updateAt).valueOf(),
|
|
sortDirections: ['descend', 'ascend', 'descend'],
|
|
render: (text, record, index) => {
|
|
let data = record.businessMetadataRestapis;
|
|
if (data && data.length)
|
|
return data[0].updateAt && moment(data[0].updateAt).format('YYYY-MM-DD HH:mm:ss')
|
|
else
|
|
return ''
|
|
}
|
|
}, {
|
|
title: '操作',
|
|
dataIndex: 'action',
|
|
width: '5%',
|
|
fixed: 'right',
|
|
render: (text, record) => {
|
|
if (record.businessMetadataRestapis.length) {
|
|
return <div>
|
|
<a style={{ marginLeft: 10 }} onClick={() => onAdd(record, false)}>查看</a>
|
|
<Popconfirm
|
|
title="是否确认删除该业务元数据？"
|
|
onConfirm={() => confirmDelete(record.businessMetadataRestapis[0].id)}
|
|
> <a style={{ marginLeft: 10 }}>删除</a></Popconfirm>
|
|
</div>
|
|
} else
|
|
return <a style={{ marginLeft: 10 }} onClick={() => onAdd(record, true)}>新建</a>
|
|
}
|
|
}];
|
|
|
|
const onSearch = (sort) => {
|
|
setSelectedRowKeys([]);
|
|
setSelectedRows([]);
|
|
setCurrentPage(1);
|
|
initData({ limit, offset: 0, orderDirection: SortValues[sort || updateAtSort] });
|
|
}
|
|
const handleExport = (isAll = false) => {
|
|
let tableHeader = `<tr>`;
|
|
columns.filter(c => c.dataIndex != 'action').map(c => { tableHeader += `<th><div>${c.title}</div></th>`; });
|
|
tableHeader += '</tr>';
|
|
if (isAll) {
|
|
dispatch(metadataManagement.getBusinessMetadataRestapis({ catalog: resourceCatalogId })).then(res => {
|
|
if (res.success) {
|
|
handleExportTable(tableHeader, res.payload.data.rows);
|
|
}
|
|
})
|
|
} else {
|
|
let data = []
|
|
if (updateAtSort === 'descend') {
|
|
data = selectedRows.sort((a, b) => moment(b.updateAt).valueOf() - moment(a.updateAt).valueOf());
|
|
} else {
|
|
data = selectedRows.sort((a, b) => moment(a.updateAt).valueOf() - moment(b.updateAt).valueOf());
|
|
}
|
|
handleExportTable(tableHeader, data);
|
|
}
|
|
}
|
|
const handleExportTable = (tableHeader, contentData) => {
|
|
let tableContent = '';
|
|
contentData.map(cd => {
|
|
tableContent += `<tr>`;
|
|
tableContent += `<th style="font-weight:600"><div>${cd.name}</div></th>`;
|
|
tableContent += `<th style="font-weight:600"><div>接口</div></th>`;
|
|
let data = cd.businessMetadataRestapis;
|
|
tableContent += `<th style="font-weight:600"><div>${data && data.length && data[0].resourceName || ''}</div></th>`;
|
|
tableContent += `<th style="font-weight:600"><div>${data && data.length && data[0].resourceAbstract || ''}</div></th>`;
|
|
tableContent += `<th style="font-weight:600"><div>${data && data.length && data[0].resourceProvider || ''}</div></th>`;
|
|
tableContent += `<th style="font-weight:600"><div>${data && data.length && data[0].resourceCategory || ''}</div></th>`;
|
|
tableContent += `<th style="font-weight:600"><div>${data && data.length && data[0].resourceId || ''}</div></th>`;
|
|
tableContent += `<th style="font-weight:600"><div>${data && data.length && data[0].metadataId || ''}</div></th>`;
|
|
tableContent += `<th style="font-weight:600"><div>${data && data.length && data[0].user.username || ''}</div></th>`;
|
|
tableContent += `<th style="font-weight:600"><div>${data && data.length && data[0].updateAt &&
|
|
moment(data[0].updateAt).format('YYYY-MM-DD HH:mm:ss') || ''}</div></th>`;
|
|
|
|
tableContent += `</tr>`;
|
|
})
|
|
let exportTable = `\uFEFF<table border="1">
|
|
${tableHeader}
|
|
${tableContent}
|
|
</table>`;
|
|
let tempStr = new Blob([exportTable], { type: 'text/plain;charset=utf-8' });
|
|
FileSaver.saveAs(tempStr, `接口业务元数据导出.xls`);
|
|
}
|
|
//新建、修改
|
|
const onConfirm = (values) => {
|
|
let obj = {}
|
|
if (editData.add) {
|
|
obj = { createBy: user.id, metadataRestapiId: editData.record.id, ...values }
|
|
dispatch(metadataManagement.postBusinessMetadataRestapis(obj)).then(res => {
|
|
if (res.success) {
|
|
onSearch(); setModalVisible(false);
|
|
}
|
|
});
|
|
} else {
|
|
obj = { ...values }
|
|
dispatch(metadataManagement.putBusinessMetadataRestapis(editData.record.businessMetadataRestapis[0].id, obj)).then(res => {
|
|
if (res.success) {
|
|
onSearch(); setModalVisible(false);
|
|
}
|
|
});
|
|
}
|
|
}
|
|
return <Spin spinning={isRequesting}>
|
|
<div style={{ marginBottom: 16 }}>
|
|
{
|
|
tableDataCount == 0 ? <Button disabled={tableDataCount == 0} onClick={() => handleExport()}>导出</Button> :
|
|
selectedRowKeys && selectedRowKeys.length ?
|
|
<Button disabled={tableDataCount == 0} onClick={() => handleExport()}>导出</Button>
|
|
: <Popconfirm title={'是否导出全部？'} onConfirm={() => handleExport(true)} okText="确定" cancelText="取消">
|
|
<Button disabled={tableDataCount == 0} > 导出</Button>
|
|
</Popconfirm>
|
|
}
|
|
<Button type='primary' style={{ marginLeft: 16, float: 'right' }} onClick={onSearch}>查询</Button>
|
|
<Input style={{ width: 220, float: 'right' }} placeholder="元数据名称"
|
|
allowClear onPressEnter={onSearch} onChange={e => setKeywords(e.target.value || '')} />
|
|
</div >
|
|
<Table
|
|
scroll={{ y: clientHeight - 320, x: 1700 }}
|
|
rowKey='id'
|
|
columns={columns}
|
|
dataSource={tableData}
|
|
onChange={onTableChange}
|
|
pagination={{
|
|
current: currentPage,
|
|
pageSize: limit,
|
|
total: tableDataCount,
|
|
showSizeChanger: true,
|
|
// showQuickJumper: true,
|
|
showTotal: (total) => { return <span style={{ fontSize: 15 }}>{`共${Math.ceil(total / limit)}页，${total}项`}</span> },
|
|
|
|
}}
|
|
rowSelection={{
|
|
onChange: (selectedRowKeys, selectedRows) => {
|
|
setSelectedRowKeys(selectedRowKeys)
|
|
setSelectedRows(selectedRows);
|
|
},
|
|
selectedRowKeys: selectedRowKeys
|
|
}}
|
|
>
|
|
</Table>
|
|
{
|
|
modalVisible ?
|
|
<BusinessDatabaseModal
|
|
metadataModels={metadataModels.filter(m => '接口' === m.modelType)}
|
|
editData={editData}
|
|
onCancel={() => setModalVisible(false)}
|
|
onConfirm={onConfirm}
|
|
resourceCatalogPath={resourceCatalogPath}
|
|
businessType='接口' /> : ''
|
|
}
|
|
</Spin >
|
|
}
|
|
function mapStateToProps(state) {
|
|
const { global, auth, businessMetadataRestapis, metadataModels } = state;
|
|
return {
|
|
user: auth.user,
|
|
actions: global.actions,
|
|
clientHeight: global.clientHeight,
|
|
isRequesting: businessMetadataRestapis.isRequesting || metadataModels.isRequesting,
|
|
metadataModels: metadataModels.data
|
|
};
|
|
}
|
|
export default connect(mapStateToProps)(BusinessFilesTable)
|