导入导出前端部分
This commit is contained in:
parent
bf554055d6
commit
6c56240bb9
@ -75,7 +75,6 @@
|
||||
"react-router-dom": "^4.3.1",
|
||||
"react-router-redux": "^4.0.8",
|
||||
"redux": "^4.0.1",
|
||||
"redux-thunk": "^2.3.0",
|
||||
"rc-upload": "2.6.6"
|
||||
"redux-thunk": "^2.3.0"
|
||||
}
|
||||
}
|
||||
|
@ -225,8 +225,26 @@ const I18N_CONF = {
|
||||
operation: 'Operation',
|
||||
export: 'Export query results',
|
||||
import: 'Import',
|
||||
importSucc: 'Import success',
|
||||
uploadBtn: 'Upload File',
|
||||
importSucc: 'The import was successful',
|
||||
importAbort: 'Import abort',
|
||||
importSuccBegin: 'The import was successful,with ',
|
||||
importSuccEnd: 'configuration items imported',
|
||||
importFail: 'Import failed',
|
||||
importDataValidationError: 'No legitimate data was read, please check the imported data file.',
|
||||
metadataIllegal: 'The imported metadata file is illegal',
|
||||
namespaceNotExist: 'namespace does not exist',
|
||||
abortImport: 'Abort import',
|
||||
skipImport: 'Skip',
|
||||
overwriteImport: 'Overwrite',
|
||||
importRemind:
|
||||
'File upload will be imported directly into the configuration, please be careful!',
|
||||
samePreparation: 'Same preparation',
|
||||
targetNamespace: 'Target namespace',
|
||||
conflictConfig: 'Conflict-detected configuration items',
|
||||
failureEntries: 'Failure entries',
|
||||
unprocessedEntries: 'Unprocessed entries',
|
||||
skippedEntries: 'skipped entries',
|
||||
},
|
||||
NewConfig: {
|
||||
newListingMain: 'Create Configuration',
|
||||
|
@ -224,8 +224,25 @@ const I18N_CONF = {
|
||||
operation: '操作',
|
||||
export: '导出查询结果',
|
||||
import: '导入配置',
|
||||
importSucc: '导入成功',
|
||||
uploadBtn: '上传文件',
|
||||
importSucc: '导入成功',
|
||||
importAbort: '导入终止',
|
||||
importSuccBegin: '导入成功,导入了',
|
||||
importSuccEnd: '项配制',
|
||||
importFail: '导入失败',
|
||||
importDataValidationError: '未读取到合法数据,请检查导入的数据文件。',
|
||||
metadataIllegal: '导入的元数据文件非法',
|
||||
namespaceNotExist: 'namespace 不存在',
|
||||
abortImport: '终止导入',
|
||||
skipImport: '跳过',
|
||||
overwriteImport: '覆盖',
|
||||
importRemind: '文件上传后将直接导入配置,请务必谨慎操作!',
|
||||
samePreparation: '相同配制',
|
||||
targetNamespace: '目标空间',
|
||||
conflictConfig: '检测到冲突的配置项',
|
||||
failureEntries: '失败的条目',
|
||||
unprocessedEntries: '未处理的条目',
|
||||
skippedEntries: '跳过的条目',
|
||||
},
|
||||
NewConfig: {
|
||||
newListingMain: '新建配置',
|
||||
|
@ -29,19 +29,22 @@ import {
|
||||
Pagination,
|
||||
Select,
|
||||
Table,
|
||||
Grid,
|
||||
Upload,
|
||||
Message,
|
||||
} from '@alifd/next';
|
||||
import BatchHandle from 'components/BatchHandle';
|
||||
import RegionGroup from 'components/RegionGroup';
|
||||
import ShowCodeing from 'components/ShowCodeing';
|
||||
import DeleteDialog from 'components/DeleteDialog';
|
||||
import DashboardCard from './DashboardCard';
|
||||
import Upload from 'rc-upload';
|
||||
import { getParams, setParams, request, aliwareIntl } from '@/globalLib';
|
||||
|
||||
import './index.scss';
|
||||
import { LANGUAGE_KEY } from '../../../constants';
|
||||
|
||||
const { Panel } = Collapse;
|
||||
const { Row, Col } = Grid;
|
||||
|
||||
@ConfigProvider.config
|
||||
class ConfigurationManagement extends React.Component {
|
||||
@ -683,37 +686,153 @@ class ConfigurationManagement extends React.Component {
|
||||
importData() {
|
||||
const { locale = {} } = this.props;
|
||||
const self = this;
|
||||
self.field.setValue('sameConfigPolicy', 'ABORT');
|
||||
const uploadProps = {
|
||||
accept: 'application/zip',
|
||||
action: 'v1/cs/configs?import=true&namespace=' + getParams('namespace'),
|
||||
data: {
|
||||
policy: self.field.getValue('sameConfigPolicy'),
|
||||
},
|
||||
beforeUpload(file, options) {
|
||||
options.data = {
|
||||
policy: self.field.getValue('sameConfigPolicy'),
|
||||
};
|
||||
return options;
|
||||
},
|
||||
onSuccess(ret) {
|
||||
Dialog.show({
|
||||
title: locale.importSucc,
|
||||
content: <div>{locale.importSucc}</div>,
|
||||
const resultCode = ret.response.code;
|
||||
if (resultCode === 200) {
|
||||
importConfirm.hide();
|
||||
if (ret.response.data.failData && ret.response.data.failData.length > 0) {
|
||||
Dialog.alert({
|
||||
title: locale.importAbort,
|
||||
content: (
|
||||
<div style={{ width: '500px' }}>
|
||||
<h4>
|
||||
{locale.conflictConfig}:{ret.response.data.failData[0].group}/
|
||||
{ret.response.data.failData[0].dataId}
|
||||
</h4>
|
||||
<div style={{ marginTop: 20 }}>
|
||||
<h5>
|
||||
{locale.failureEntries}: {ret.response.data.failData.length}
|
||||
</h5>
|
||||
<Table dataSource={ret.response.data.failData}>
|
||||
<Table.Column title="Data Id" dataIndex="dataId" />
|
||||
<Table.Column title="Group" dataIndex="group" />
|
||||
</Table>
|
||||
</div>
|
||||
<div>
|
||||
<h5>
|
||||
{locale.unprocessedEntries}: {ret.response.data.skipData.length}
|
||||
</h5>
|
||||
<Table dataSource={ret.response.data.skipData}>
|
||||
<Table.Column title="Data Id" dataIndex="dataId" />
|
||||
<Table.Column title="Group" dataIndex="group" />
|
||||
</Table>
|
||||
</div>
|
||||
</div>
|
||||
),
|
||||
});
|
||||
} else if (ret.response.data.skipCount && ret.response.data.skipCount > 0) {
|
||||
Dialog.alert({
|
||||
title: locale.importSucc,
|
||||
content: (
|
||||
<div style={{ width: '500px' }}>
|
||||
<div>
|
||||
<h5>
|
||||
{locale.skippedEntries}: {ret.response.data.skipData.length}
|
||||
</h5>
|
||||
<Table dataSource={ret.response.data.skipData}>
|
||||
<Table.Column title="Data Id" dataIndex="dataId" />
|
||||
<Table.Column title="Group" dataIndex="group" />
|
||||
</Table>
|
||||
</div>
|
||||
</div>
|
||||
),
|
||||
});
|
||||
} else {
|
||||
let message =
|
||||
locale.importSuccBegin + ret.response.data.succCount + locale.importSuccEnd;
|
||||
Message.success(message);
|
||||
}
|
||||
self.getData();
|
||||
} else {
|
||||
let alertContent = locale.importFailMsg;
|
||||
if (resultCode === 5001) {
|
||||
alertContent = locale.namespaceNotExist;
|
||||
}
|
||||
if (resultCode === 5002) {
|
||||
alertContent = locale.metadataIllegal;
|
||||
}
|
||||
if (resultCode === 5003 || resultCode === 5004 || resultCode === 5005) {
|
||||
alert(123);
|
||||
alertContent = locale.importDataValidationError;
|
||||
}
|
||||
Dialog.alert({
|
||||
title: locale.importFail,
|
||||
content: alertContent,
|
||||
});
|
||||
}
|
||||
},
|
||||
onError(err) {
|
||||
console.log('onError', err);
|
||||
Dialog.alert({
|
||||
title: locale.importFail,
|
||||
content: locale.importDataValidationError,
|
||||
});
|
||||
},
|
||||
};
|
||||
Dialog.confirm({
|
||||
const importConfirm = Dialog.confirm({
|
||||
title: locale.import,
|
||||
footer: false,
|
||||
content: (
|
||||
<div>
|
||||
<div>目标空间:</div>
|
||||
<div>相同配制:</div>
|
||||
<h3>{this.state.isok ? locale.deletedSuccessfully : locale.deleteFailed}</h3>
|
||||
<div style={{ marginBottom: 10 }}>
|
||||
<span style={{ color: '#999', marginRight: 5 }}>{locale.targetNamespace}:</span>
|
||||
<span style={{ color: '#49D2E7' }}>{this.state.nownamespace_name} </span>|{' '}
|
||||
{this.state.nownamespace_id}
|
||||
</div>
|
||||
<div style={{ marginBottom: 10 }}>
|
||||
<span style={{ color: '#999', marginRight: 5 }}>{locale.samePreparation}:</span>
|
||||
<Select
|
||||
style={{ width: 130 }}
|
||||
size={'medium'}
|
||||
hasArrow
|
||||
mode="single"
|
||||
filterLocal={false}
|
||||
defaultValue={'ABORT'}
|
||||
dataSource={[
|
||||
{
|
||||
label: locale.abortImport,
|
||||
value: 'ABORT',
|
||||
},
|
||||
{
|
||||
label: locale.skipImport,
|
||||
value: 'SKIP',
|
||||
},
|
||||
{
|
||||
label: locale.overwriteImport,
|
||||
value: 'OVERWRITE',
|
||||
},
|
||||
]}
|
||||
hasClear={false}
|
||||
onChange={function(value, actionType, item) {
|
||||
self.field.setValue('sameConfigPolicy', value);
|
||||
}}
|
||||
/>
|
||||
</div>
|
||||
<div style={{ marginBottom: 10 }}>
|
||||
<Icon type="prompt" style={{ color: '#FFA003', marginRight: '10px' }} />
|
||||
{locale.importRemind}
|
||||
</div>
|
||||
<div>
|
||||
<Upload
|
||||
name={'file'}
|
||||
component={'button'}
|
||||
className={'next-btn next-medium next-btn-primary'}
|
||||
style={{ marginRight: 10 }}
|
||||
listType="text"
|
||||
data-spm-click={'gostr=/aliyun;locaid=configsImport'}
|
||||
{...uploadProps}
|
||||
>
|
||||
{locale.uploadBtn}
|
||||
<Button type="primary">{locale.uploadBtn}</Button>
|
||||
</Upload>
|
||||
</div>
|
||||
</div>
|
||||
|
Loading…
Reference in New Issue
Block a user