This is an automated email from the ASF dual-hosted git repository.
healchow pushed a commit to branch master
in repository https://gitbox.apache.org/repos/asf/incubator-inlong.git
The following commit(s) were added to refs/heads/master by this push:
new 7549bed [INLONG-3128][Dashboard] Make binlog as a source type feature
(#3129)
7549bed is described below
commit 7549bed7cbbce93639c310530f144d22ce71e1c2
Author: Daniel <[email protected]>
AuthorDate: Mon Mar 14 19:01:26 2022 +0800
[INLONG-3128][Dashboard] Make binlog as a source type feature (#3129)
---
.../AccessHelper/DataSourcesEditor/CreateModal.tsx | 21 +++++++++------
.../AccessHelper/DataSourcesEditor/index.tsx | 16 ++++++-----
.../AccessHelper/FieldsConfig/dataFields.tsx | 8 +++---
.../{DataSourcesDb.ts => DataSourcesBinLog.ts} | 23 ++--------------
inlong-dashboard/src/locales/cn.json | 1 -
inlong-dashboard/src/locales/en.json | 1 -
.../src/pages/AccessDetail/DataSources/index.tsx | 31 ++++++++++++----------
7 files changed, 46 insertions(+), 55 deletions(-)
diff --git
a/inlong-dashboard/src/components/AccessHelper/DataSourcesEditor/CreateModal.tsx
b/inlong-dashboard/src/components/AccessHelper/DataSourcesEditor/CreateModal.tsx
index ea63687..f1ef400 100644
---
a/inlong-dashboard/src/components/AccessHelper/DataSourcesEditor/CreateModal.tsx
+++
b/inlong-dashboard/src/components/AccessHelper/DataSourcesEditor/CreateModal.tsx
@@ -25,13 +25,13 @@ import { useRequest, useUpdateEffect } from '@/hooks';
import { useTranslation } from 'react-i18next';
import { getDataSourcesFileFields as getFileCreateFormContent } from
'@/components/MetaData/DataSourcesFile';
import {
- getDataSourcesDbFields,
+ getDataSourcesBinLogFields,
toFormValues,
toSubmitValues,
-} from '@/components/MetaData/DataSourcesDb';
+} from '@/components/MetaData/DataSourcesBinLog';
export interface Props extends ModalProps {
- type: 'DB' | 'FILE';
+ type: 'BINLOG' | 'FILE';
// When editing, use the ID to call the interface for obtaining details
id?: string;
// Pass when editing, directly echo the record data
@@ -49,7 +49,7 @@ const Comp: React.FC<Props> = ({ type, id, content = [],
record, ...modalProps }
const toFormVals = useCallback(
v => {
const mapFunc = {
- DB: toFormValues,
+ BINLOG: toFormValues,
}[type];
return mapFunc ? mapFunc(v) : v;
},
@@ -59,7 +59,7 @@ const Comp: React.FC<Props> = ({ type, id, content = [],
record, ...modalProps }
const toSubmitVals = useCallback(
v => {
const mapFunc = {
- DB: toSubmitValues,
+ BINLOG: toSubmitValues,
}[type];
return mapFunc ? mapFunc(v) : v;
},
@@ -86,7 +86,10 @@ const Comp: React.FC<Props> = ({ type, id, content = [],
record, ...modalProps }
const { run: getData } = useRequest(
id => ({
- url: `/datasource/${type.toLowerCase()}/getDetail/${id}`,
+ url: `source/get/${id}`,
+ params: {
+ sourceType: type,
+ },
}),
{
manual: true,
@@ -101,7 +104,7 @@ const Comp: React.FC<Props> = ({ type, id, content = [],
record, ...modalProps }
const getCreateFormContent = useMemo(
() => currentValues => {
return {
- DB: getDataSourcesDbFields,
+ BINLOG: getDataSourcesBinLogFields,
FILE: getFileCreateFormContent,
}[type]('form', { currentValues });
},
@@ -113,7 +116,9 @@ const Comp: React.FC<Props> = ({ type, id, content = [],
record, ...modalProps }
<Modal
{...modalProps}
title={
- type === 'DB' ? 'DB' :
t('components.AccessHelper.DataSourcesEditor.CreateModal.File')
+ type === 'BINLOG'
+ ? 'BINLOG'
+ : t('components.AccessHelper.DataSourcesEditor.CreateModal.File')
}
width={666}
onOk={onOk}
diff --git
a/inlong-dashboard/src/components/AccessHelper/DataSourcesEditor/index.tsx
b/inlong-dashboard/src/components/AccessHelper/DataSourcesEditor/index.tsx
index f8d1e20..42d325a 100644
--- a/inlong-dashboard/src/components/AccessHelper/DataSourcesEditor/index.tsx
+++ b/inlong-dashboard/src/components/AccessHelper/DataSourcesEditor/index.tsx
@@ -22,7 +22,7 @@ import { Button, Table, Modal, message } from 'antd';
import { useTranslation } from 'react-i18next';
import request from '@/utils/request';
import { useUpdateEffect, usePrevious } from '@/hooks';
-import { dataSourcesDbColumns as dbColumns } from
'@/components/MetaData/DataSourcesDb';
+import { dataSourcesBinLogColumns as binLogColumns } from
'@/components/MetaData/DataSourcesBinLog';
import { dataSourcesFileColumns as fileColumns } from
'@/components/MetaData/DataSourcesFile';
import CreateModal from './CreateModal';
@@ -30,7 +30,7 @@ export interface DataSourcesEditorProps {
value?: Record<string, any>[];
onChange?: Function;
readonly?: boolean;
- type?: 'DB' | 'FILE';
+ type?: 'BINLOG' | 'FILE';
// Whether to use real operations (for example, to call the background
interface when deleting/newing, etc.)
useActionRequest?: boolean;
inlongGroupId?: string;
@@ -58,7 +58,7 @@ const Comp = ({
value,
onChange,
readonly = false,
- type = 'DB',
+ type = 'FILE',
useActionRequest,
inlongGroupId,
inlongStreamId,
@@ -94,10 +94,11 @@ const Comp = ({
...values,
inlongGroupId,
inlongStreamId,
+ sourceType: type,
};
if (isUpdate) submitData.id = createModal.id;
const newId = await request({
- url: `/datasource/${type.toLowerCase()}/${isUpdate ? 'updateDetail' :
'saveDetail'}`,
+ url: `/source/${isUpdate ? 'update' : 'save'}`,
method: 'POST',
data: submitData,
});
@@ -116,8 +117,11 @@ const Comp = ({
title: t('basic.DeleteConfirm'),
onOk: async () => {
await request({
- url: `/datasource/${type.toLowerCase()}/deleteDetail/${id}`,
+ url: `/source/delete/${id}`,
method: 'DELETE',
+ params: {
+ sourceType: type,
+ },
});
resolve(true);
message.success(t('DeleteSuccess'));
@@ -158,7 +162,7 @@ const Comp = ({
setData(newData);
};
- const columns = (type === 'DB' ? dbColumns : fileColumns).concat(
+ const columns = (type === 'BINLOG' ? binLogColumns : fileColumns).concat(
readonly
? []
: [
diff --git
a/inlong-dashboard/src/components/AccessHelper/FieldsConfig/dataFields.tsx
b/inlong-dashboard/src/components/AccessHelper/FieldsConfig/dataFields.tsx
index 769dc14..02b2d08 100644
--- a/inlong-dashboard/src/components/AccessHelper/FieldsConfig/dataFields.tsx
+++ b/inlong-dashboard/src/components/AccessHelper/FieldsConfig/dataFields.tsx
@@ -113,8 +113,8 @@ export default (
value: 'FILE',
},
{
- label: 'DB',
- value: 'DB',
+ label: 'BINLOG',
+ value: 'BINLOG',
},
{
label:
i18n.t('components.AccessHelper.FieldsConfig.dataFields.Autonomous'),
@@ -137,7 +137,7 @@ export default (
),
preserve: false,
name: 'dataSourcesConfig',
- visible: values => values.dataSourceType === 'DB' ||
values.dataSourceType === 'FILE',
+ visible: values => values.dataSourceType === 'BINLOG' ||
values.dataSourceType === 'FILE',
},
{
type: 'radio',
@@ -157,7 +157,7 @@ export default (
],
},
rules: [{ required: true }],
- visible: values => currentValues.dataSourceType === 'DB',
+ visible: values => currentValues.dataSourceType === 'BINLOG',
},
{
type: 'radio',
diff --git a/inlong-dashboard/src/components/MetaData/DataSourcesDb.ts
b/inlong-dashboard/src/components/MetaData/DataSourcesBinLog.ts
similarity index 91%
rename from inlong-dashboard/src/components/MetaData/DataSourcesDb.ts
rename to inlong-dashboard/src/components/MetaData/DataSourcesBinLog.ts
index c53d3fd..42878ee 100644
--- a/inlong-dashboard/src/components/MetaData/DataSourcesDb.ts
+++ b/inlong-dashboard/src/components/MetaData/DataSourcesBinLog.ts
@@ -23,31 +23,12 @@ import { ColumnsType } from 'antd/es/table';
import rulesPattern from '@/utils/pattern';
import i18n from '@/i18n';
-export const getDataSourcesDbFields = (
+export const getDataSourcesBinLogFields = (
type: 'form' | 'col' = 'form',
{ currentValues } = {} as any,
) => {
const fileds = [
{
- name: 'accessType',
- type: 'radio',
- label:
i18n.t('components.AccessHelper.DataSourceMetaData.Db.AccessType'),
- initialValue: 'DB_SYNC_AGENT',
- rules: [{ required: true }],
- props: {
- options: [
- // {
- // label: 'SQL',
- // value: 'SQL',
- // },
- {
- label: 'BinLog',
- value: 'DB_SYNC_AGENT',
- },
- ],
- },
- },
- {
name: 'serverName',
type: 'select',
label: i18n.t('components.AccessHelper.DataSourceMetaData.Db.Server'),
@@ -235,4 +216,4 @@ export const toSubmitValues = data => {
};
};
-export const dataSourcesDbColumns = getDataSourcesDbFields('col') as
ColumnsType;
+export const dataSourcesBinLogColumns = getDataSourcesBinLogFields('col') as
ColumnsType;
diff --git a/inlong-dashboard/src/locales/cn.json
b/inlong-dashboard/src/locales/cn.json
index 36a8c30..ebb0f31 100644
--- a/inlong-dashboard/src/locales/cn.json
+++ b/inlong-dashboard/src/locales/cn.json
@@ -20,7 +20,6 @@
"components.AccessHelper.DataSourceMetaData.File.FilePath": "⽂件路径",
"components.AccessHelper.DataSourceMetaData.File.Port": "端口",
"components.AccessHelper.DataSourceMetaData.File.IpRule": "请正确输入Ip地址",
- "components.AccessHelper.DataSourceMetaData.Db.AccessType": "采集类型",
"components.AccessHelper.DataSourceMetaData.Db.Server": "DB服务器",
"components.AccessHelper.DataSourceMetaData.Db.Name": "DB名称",
"components.AccessHelper.DataSourceMetaData.Db.IpRule": "请正确输入Ip地址",
diff --git a/inlong-dashboard/src/locales/en.json
b/inlong-dashboard/src/locales/en.json
index 9e07bff..1df551c 100644
--- a/inlong-dashboard/src/locales/en.json
+++ b/inlong-dashboard/src/locales/en.json
@@ -20,7 +20,6 @@
"components.AccessHelper.DataSourceMetaData.File.FilePath": "File path",
"components.AccessHelper.DataSourceMetaData.File.Port": "Port",
"components.AccessHelper.DataSourceMetaData.File.IpRule": "Please enter the
IP address correctly",
- "components.AccessHelper.DataSourceMetaData.Db.AccessType": "Type",
"components.AccessHelper.DataSourceMetaData.Db.Server": "DB Server",
"components.AccessHelper.DataSourceMetaData.Db.Name": "DB Name",
"components.AccessHelper.DataSourceMetaData.Db.IpRule": "Please enter the IP
address correctly",
diff --git a/inlong-dashboard/src/pages/AccessDetail/DataSources/index.tsx
b/inlong-dashboard/src/pages/AccessDetail/DataSources/index.tsx
index 4e0ca6a..56a5c3c 100644
--- a/inlong-dashboard/src/pages/AccessDetail/DataSources/index.tsx
+++ b/inlong-dashboard/src/pages/AccessDetail/DataSources/index.tsx
@@ -23,7 +23,7 @@ import HighTable from '@/components/HighTable';
import { defaultSize } from '@/configs/pagination';
import { useRequest } from '@/hooks';
import { DataSourcesCreateModal } from '@/components/AccessHelper';
-import { dataSourcesDbColumns } from '@/components/MetaData/DataSourcesDb';
+import { dataSourcesBinLogColumns } from
'@/components/MetaData/DataSourcesBinLog';
import { dataSourcesFileColumns } from '@/components/MetaData/DataSourcesFile';
import i18n from '@/i18n';
import request from '@/utils/request';
@@ -39,19 +39,19 @@ const getFilterFormContent = defaultValues => [
},
{
type: 'radiobutton',
- name: 'type',
+ name: 'sourceType',
label: i18n.t('pages.AccessDetail.DataSources.Type'),
- initialValue: defaultValues.type,
+ initialValue: defaultValues.sourceType,
props: {
buttonStyle: 'solid',
options: [
{
label: i18n.t('pages.AccessDetail.DataSources.File'),
- value: 'file',
+ value: 'FILE',
},
{
- label: 'DB',
- value: 'db',
+ label: 'BinLog',
+ value: 'BINLOG',
},
],
},
@@ -63,7 +63,7 @@ const Comp: React.FC<Props> = ({ inlongGroupId }) => {
// keyWord: '',
pageSize: defaultSize,
pageNum: 1,
- type: 'file',
+ sourceType: 'FILE',
});
const [createModal, setCreateModal] = useState<Record<string, unknown>>({
@@ -72,10 +72,9 @@ const Comp: React.FC<Props> = ({ inlongGroupId }) => {
const { data, loading, run: getList } = useRequest(
{
- url: `/datasource/${options.type}/listDetail/`,
+ url: '/source/list',
params: {
...options,
- type: undefined,
inlongGroupId,
},
},
@@ -89,13 +88,14 @@ const Comp: React.FC<Props> = ({ inlongGroupId }) => {
const submitData = {
...values,
inlongGroupId: inlongGroupId,
+ sourceType: options.sourceType,
};
if (isUpdate) {
submitData.id = createModal.id;
}
await request({
- url: `/datasource/${options.type}/${isUpdate ? 'updateDetail' :
'saveDetail'}`,
+ url: `/source/${isUpdate ? 'update' : 'save'}`,
method: 'POST',
data: submitData,
});
@@ -112,8 +112,11 @@ const Comp: React.FC<Props> = ({ inlongGroupId }) => {
title: i18n.t('pages.AccessDetail.DataSources.DeletConfirm'),
onOk: async () => {
await request({
- url: `/datasource/${options.type}/deleteDetail/${id}`,
+ url: `/source/delete/${id}`,
method: 'DELETE',
+ params: {
+ sourceType: options.sourceType,
+ },
});
await getList();
message.success(i18n.t('pages.AccessDetail.DataSources.DeleteSuccessfully'));
@@ -150,7 +153,7 @@ const Comp: React.FC<Props> = ({ inlongGroupId }) => {
width: 100,
} as any,
]
- .concat(options.type === 'file' ? dataSourcesFileColumns :
dataSourcesDbColumns)
+ .concat(options.sourceType === 'FILE' ? dataSourcesFileColumns :
dataSourcesBinLogColumns)
.concat([
{
title: i18n.t('basic.Status'),
@@ -188,7 +191,7 @@ const Comp: React.FC<Props> = ({ inlongGroupId }) => {
pageNum: 1,
pageSize: 1000,
inlongGroupId,
- dataSourceType: options.type,
+ dataSourceType: options.sourceType,
},
},
requestParams: {
@@ -229,7 +232,7 @@ const Comp: React.FC<Props> = ({ inlongGroupId }) => {
<DataSourcesCreateModal
{...createModal}
- type={options.type.toUpperCase() as any}
+ type={options.sourceType as any}
content={createContent}
visible={createModal.visible as boolean}
onOk={async values => {
