This is an automated email from the ASF dual-hosted git repository.
dockerzhang pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/inlong.git
The following commit(s) were added to refs/heads/master by this push:
new 092920e0c8 [INLONG-8788][Dashboard] Data synchronization page
optimization (#8792)
092920e0c8 is described below
commit 092920e0c83bb78bc79fec75ed827fe9f62b7788
Author: Lizhen <[email protected]>
AuthorDate: Thu Aug 24 18:50:23 2023 +0800
[INLONG-8788][Dashboard] Data synchronization page optimization (#8792)
---
.../src/plugins/sources/defaults/MySQLBinlog.ts | 16 ++++++-------
.../src/ui/components/FieldList/DetailModal.tsx | 8 +++++++
.../src/ui/components/GroupLogs/GroupLogs.tsx | 1 +
.../src/ui/pages/SynchronizeDetail/Info/index.tsx | 15 ++++++++++--
.../SynchronizeDetail/SyncT/SourceSinkCard.tsx | 28 ++++++++++++++--------
5 files changed, 48 insertions(+), 20 deletions(-)
diff --git a/inlong-dashboard/src/plugins/sources/defaults/MySQLBinlog.ts
b/inlong-dashboard/src/plugins/sources/defaults/MySQLBinlog.ts
index c379fb74c4..7544f3da61 100644
--- a/inlong-dashboard/src/plugins/sources/defaults/MySQLBinlog.ts
+++ b/inlong-dashboard/src/plugins/sources/defaults/MySQLBinlog.ts
@@ -141,26 +141,26 @@ export default class TubeMqSource
@FieldDecorator({
type: 'input',
- tooltip: i18n.t('meta.Sources.Db.TableWhiteListHelp'),
rules: [{ required: true }],
+ tooltip: i18n.t('meta.Sources.Db.DatabaseWhiteListHelp'),
props: values => ({
disabled: values?.status === 101,
}),
- visible: values => !values?.allMigration,
})
@SyncField()
- @I18n('meta.Sources.Db.TableWhiteList')
- tableWhiteList: boolean;
+ @I18n('meta.Sources.Db.DatabaseWhiteList')
+ databaseWhiteList: string;
@FieldDecorator({
type: 'input',
- rules: [{ required: false }],
- tooltip: i18n.t('meta.Sources.Db.DatabaseWhiteListHelp'),
+ tooltip: i18n.t('meta.Sources.Db.TableWhiteListHelp'),
+ rules: [{ required: true }],
props: values => ({
disabled: values?.status === 101,
}),
+ visible: values => !values?.allMigration,
})
@SyncField()
- @I18n('meta.Sources.Db.DatabaseWhiteList')
- databaseWhiteList: string;
+ @I18n('meta.Sources.Db.TableWhiteList')
+ tableWhiteList: boolean;
}
diff --git a/inlong-dashboard/src/ui/components/FieldList/DetailModal.tsx
b/inlong-dashboard/src/ui/components/FieldList/DetailModal.tsx
index b8975eb109..fb186dd3e9 100644
--- a/inlong-dashboard/src/ui/components/FieldList/DetailModal.tsx
+++ b/inlong-dashboard/src/ui/components/FieldList/DetailModal.tsx
@@ -211,6 +211,12 @@ const Comp: React.FC<Props> = ({ inlongGroupId,
inlongStreamId, isSource, ...mod
}
}, [getData, getSinkData, inlongStreamId, modalProps.open]);
+ useEffect(() => {
+ if (inlongStreamId && modalProps.open && isSource) {
+ form.setFieldValue('fieldList', data?.fieldList);
+ }
+ }, [data?.fieldList, form, inlongStreamId, isSource, modalProps.open]);
+
useEffect(() => {
if (inlongStreamId && isSource === false && modalProps.open) {
if (sinkData?.list[0]?.sinkFieldList?.length === 0) {
@@ -222,6 +228,8 @@ const Comp: React.FC<Props> = ({ inlongGroupId,
inlongStreamId, isSource, ...mod
fieldType: '',
})),
});
+ } else {
+ form.setFieldValue('sinkFieldList', sinkData?.list[0]?.sinkFieldList);
}
}
}, [data, form, inlongStreamId, isSource, modalProps.open, sinkData?.list]);
diff --git a/inlong-dashboard/src/ui/components/GroupLogs/GroupLogs.tsx
b/inlong-dashboard/src/ui/components/GroupLogs/GroupLogs.tsx
index ed170223ef..9cac940be8 100644
--- a/inlong-dashboard/src/ui/components/GroupLogs/GroupLogs.tsx
+++ b/inlong-dashboard/src/ui/components/GroupLogs/GroupLogs.tsx
@@ -83,6 +83,7 @@ const Comp: React.FC<Props> = ({
data: {
remark: '',
},
+ timeout: 30000,
});
await getData(inlongGroupId);
message.success(t('pages.GroupDashboard.ExecutionLogModal.Re-executingSuccess'));
diff --git a/inlong-dashboard/src/ui/pages/SynchronizeDetail/Info/index.tsx
b/inlong-dashboard/src/ui/pages/SynchronizeDetail/Info/index.tsx
index ee4c5b0e0d..2bceedd3cc 100644
--- a/inlong-dashboard/src/ui/pages/SynchronizeDetail/Info/index.tsx
+++ b/inlong-dashboard/src/ui/pages/SynchronizeDetail/Info/index.tsx
@@ -17,15 +17,16 @@
* under the License.
*/
-import React, { useMemo, useImperativeHandle, forwardRef, useState } from
'react';
+import React, { useMemo, useImperativeHandle, forwardRef, useState, useEffect
} from 'react';
import { Button, Space, message } from 'antd';
import FormGenerator, { useForm } from '@/ui/components/FormGenerator';
-import { useRequest, useBoolean } from '@/ui/hooks';
+import { useRequest, useBoolean, useSelector } from '@/ui/hooks';
import { useTranslation } from 'react-i18next';
import { useDefaultMeta } from '@/plugins';
import request from '@/core/utils/request';
import { useFormContent } from './config';
import { CommonInterface } from '../common';
+import { State } from '@/core/stores';
type Props = CommonInterface;
@@ -35,6 +36,8 @@ const Comp = ({ inlongGroupId, inlongStreamId, readonly,
isCreate }: Props, ref)
const { defaultValue } = useDefaultMeta('sync');
+ const { userName } = useSelector<State, State>(state => state);
+
const [mqType, setMqType] = useState(defaultValue);
const [form] = useForm();
@@ -138,6 +141,14 @@ const Comp = ({ inlongGroupId, inlongStreamId, readonly,
isCreate }: Props, ref)
onOk,
}));
+ useEffect(() => {
+ const values = {} as Record<string, unknown>;
+ if (!isUpdate) {
+ if (userName) values.inCharges = [userName];
+ form.setFieldsValue(values);
+ }
+ }, [isUpdate, form, userName]);
+
const onSave = async () => {
await onOk();
await getData();
diff --git
a/inlong-dashboard/src/ui/pages/SynchronizeDetail/SyncT/SourceSinkCard.tsx
b/inlong-dashboard/src/ui/pages/SynchronizeDetail/SyncT/SourceSinkCard.tsx
index 2bbf7b0d52..9099979ea5 100644
--- a/inlong-dashboard/src/ui/pages/SynchronizeDetail/SyncT/SourceSinkCard.tsx
+++ b/inlong-dashboard/src/ui/pages/SynchronizeDetail/SyncT/SourceSinkCard.tsx
@@ -41,28 +41,36 @@ const Comp: React.FC<Props> = ({ inlongGroupId,
inlongStreamId }) => {
const sinkColumns: ColumnsType = [
{
- title: 'fieldName',
- // dataIndex: 'sourceFieldName',
+ title: i18n.t('meta.Sinks.SourceFieldName'),
+ dataIndex: 'sourceFieldName',
+ },
+ {
+ title: i18n.t('meta.Sinks.SourceFieldType'),
+ dataIndex: 'sourceFieldType',
+ },
+ {
+ title: i18n.t('meta.Stream.FieldName'),
dataIndex: 'fieldName',
- // render: (text: string) => <a>{text}</a>,
},
{
- title: 'fieldType',
+ title: i18n.t('meta.Stream.FieldType'),
dataIndex: 'fieldType',
},
];
const sourceColumns: ColumnsType = [
{
- title: 'fieldName',
- // dataIndex: 'sourceFieldName',
+ title: i18n.t('meta.Stream.FieldName'),
dataIndex: 'fieldName',
- render: (text: string) => <a>{text}</a>,
},
{
- title: 'fieldType',
+ title: i18n.t('meta.Stream.FieldType'),
dataIndex: 'fieldType',
},
+ {
+ title: i18n.t('meta.Stream.FieldComment'),
+ dataIndex: 'fieldComment',
+ },
];
return (
@@ -118,7 +126,7 @@ const Comp: React.FC<Props> = ({ inlongGroupId,
inlongStreamId }) => {
</Row>
)}
<Row style={{ marginTop: 50 }} gutter={[40, 48]}>
- <Col span={8}>
+ <Col span={11}>
<FieldList
inlongGroupId={inlongGroupId}
inlongStreamId={inlongStreamId}
@@ -126,7 +134,7 @@ const Comp: React.FC<Props> = ({ inlongGroupId,
inlongStreamId }) => {
columns={sourceColumns}
></FieldList>
</Col>
- <Col span={8} offset={8}>
+ <Col span={11} offset={2}>
<FieldList
inlongGroupId={inlongGroupId}
inlongStreamId={inlongStreamId}
