Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[INLONG-9495][Dashboard] Data synchronization basic information page optimization #9496

Merged
merged 3 commits into from
Dec 20, 2023
Merged

[INLONG-9495][Dashboard] Data synchronization basic information page optimization #9496

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
e23772d
[INLONG-9495][Dashboard] Data synchronization basic information page …
bluewang Dec 19, 2023
a0d0839
make some changes
bluewang Dec 19, 2023
f8b9814
make some changes
bluewang Dec 19, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions inlong-dashboard/src/plugins/sinks/defaults/Iceberg.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -150,6 +150,7 @@ export default class IcebergSink
@FieldDecorator({
type: 'radiobutton',
initialValue: '${database}',
tooltip: i18n.t('meta.Sinks.Iceberg.PatternHelp'),
rules: [{ required: true }],
props: values => ({
size: 'middle',
Expand Down Expand Up @@ -187,6 +188,7 @@ export default class IcebergSink
type: 'radiobutton',
initialValue: '${table}',
rules: [{ required: true }],
tooltip: i18n.t('meta.Sinks.Iceberg.PatternHelp'),
props: values => ({
size: 'middle',
options: [
Expand Down
44 changes: 5 additions & 39 deletions inlong-dashboard/src/plugins/sync/common/SyncDefaultInfo.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -42,6 +42,7 @@ export class SyncDefaultInfo implements DataWithBackend, RenderRow, RenderList {
maxLength: 100,
disable: Boolean(values?.id),
}),
tooltip: i18n.t('meta.Synchronize.GroupIdHelp'),
rules: [
{ required: true },
{
Expand All @@ -51,55 +52,20 @@ export class SyncDefaultInfo implements DataWithBackend, RenderRow, RenderList {
],
})
@ColumnDecorator()
@I18n('meta.Group.InlongGroupId')
@I18n('meta.Synchronize.GroupId')
inlongGroupId: string;

@FieldDecorator({
type: 'input',
props: values => ({
maxLength: 100,
disable: Boolean(values?.id),
}),
rules: [
{ required: true },
{
pattern: /^[a-z_0-9]+$/,
message: i18n.t('meta.Group.InlongGroupIdRules'),
},
],
})
@I18n('StreamID')
inlongStreamId: string;

@FieldDecorator({
type: 'input',
props: {
maxLength: 32,
},
})
@I18n('meta.Group.InlongGroupName')
name: string;

@FieldDecorator({
type: 'input',
props: {
maxLength: 32,
},
})
@I18n('meta.Stream.StreamName')
streamName: string;

@FieldDecorator({
type: UserSelect,
extra: i18n.t('meta.Group.InlongGroupOwnersExtra'),
extra: i18n.t('meta.Synchronize.InlongGroupOwnersExtra'),
rules: [{ required: true }],
props: {
mode: 'multiple',
currentUserClosable: false,
},
})
@ColumnDecorator()
@I18n('meta.Group.InlongGroupOwners')
@I18n('meta.Synchronize.GroupOwners')
inCharges: string;

@FieldDecorator({
Expand All @@ -119,7 +85,7 @@ export class SyncDefaultInfo implements DataWithBackend, RenderRow, RenderList {
],
},
})
@I18n('components.Synchronize.SinkMultipleEnable')
@I18n('meta.Synchronize.SinkMultipleEnable')
sinkMultipleEnable: boolean;

@FieldDecorator({
Expand Down
5 changes: 3 additions & 2 deletions inlong-dashboard/src/ui/components/FormGenerator/FormItemContent.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -73,9 +73,9 @@ const FormItem = ({ type: T, formItemProps, useSpace, props }) => {
);
};

const Content = ({ useSpace, suffix, extra, children, label, required, style }) => {
const Content = ({ useSpace, suffix, extra, children, label, required, style, formItemProps }) => {
return useSpace ? (
<Form.Item label={label} required={required} style={style} extra={extra}>
<Form.Item label={label} required={required} style={style} extra={extra} {...formItemProps}>
<Space>
{children}
{suffix}
Expand Down Expand Up @@ -129,6 +129,7 @@ const FormItemContent: React.FC<FormItemContentProps> = ({
key={key.toString()}
label={formItemProps.label}
extra={formItemProps.extra}
formItemProps={formItemProps}
required={formItemProps.rules?.some(item => (item as any).required)}
suffix={(() => {
if ((suffix as SuffixDefineType)?.type) {
Expand Down
17 changes: 7 additions & 10 deletions inlong-dashboard/src/ui/locales/cn.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -205,8 +205,10 @@
"meta.Sinks.Iceberg.Description": "表描述",
"meta.Sinks.Iceberg.ExtList": "属性",
"meta.Sinks.Iceberg.DataConsistency": "数据一致性",
"meta.Sinks.Iceberg.PartitionStrategy": "分区策略",
"meta.Sinks.Iceberg.DatabasePattern": "库匹配策略",
"meta.Sinks.Iceberg.TablePattern": "表匹配策略",
"meta.Sinks.Iceberg.PatternHelp": "自定义配置说明：内置参数包括：1、来源库名：${database} 2、来源表名：${table} 【使用说明】：支持使用内置参数和字符串组合生成目标库表名称【示例】：如来源表名称为 table1，映射规则为 ${table}_inlong，则table1的数据将被最终映射写入至 table1_inlong 中。",
"meta.Sinks.Iceberg.Options.DBSameName": "与来源库同名",
"meta.Sinks.Iceberg.Options.TableSameName": "与来源表同名",
"meta.Sinks.Iceberg.Options.Customize": "自定义",
Expand Down Expand Up @@ -283,11 +285,8 @@
"meta.Sinks.StarRocks.TablePattern": "多表模式",
"meta.Sinks.StarRocks.IsMetaField": "是否为元字段",
"meta.Sinks.StarRocks.FieldFormat": "字段格式",
"meta.Sinks.Redis.ttlUnit": "秒",
"meta.Sinks.Redis.IsMetaField": "是否为元字段",
"meta.Sinks.Redis.FieldFormat": "字段格式",
"meta.Sinks.Redis.Database": "DatabaseID",
"meta.Sinks.Redis.Password": "密码",
"meta.Sinks.Redis.Ttl": "TTL",
"meta.Sinks.Redis.TtlUnit": "秒",
"meta.Sinks.Redis.ExtList": "高级参数",
Expand Down Expand Up @@ -331,7 +330,6 @@
"meta.Sinks.Cls.Tag": "标签",
"meta.Sinks.Cls.Tokenizer": "分词规则",
"meta.Sinks.Cls.IsMetaField": "是否为元字段",
"meta.Sinks.Cls.FieldFormat": "字段格式",
"meta.Group.InlongGroupId": "数据流组 ID",
"meta.Group.InlongGroupIdRules": "只能包含小写字母、数字、点号(.)、中划线(-)、下划线(_)",
"meta.Group.InlongGroupName": "数据流组名称",
Expand Down Expand Up @@ -379,6 +377,11 @@
"meta.Group.Status.Suspended": "已停止",
"meta.Group.Status.Restarting": "重启中",
"meta.Group.Status.Restarted": "已重启",
"meta.Synchronize.SinkMultipleEnable": "整库迁移",
"meta.Synchronize.GroupId": "数据流组 ID",
"meta.Synchronize.GroupIdHelp": "数据流组 ID 与数据流 ID 默认相同",
"meta.Synchronize.InlongGroupOwnersExtra": "责任人，可查看、修改数据同步信息",
"meta.Synchronize.GroupOwners": "责任人",
"meta.Stream.StreamId": "数据流 ID",
"meta.Stream.StreamIdRules": "只能包含英文字母、数字、点号(.)、中划线(-)、下划线(_)",
"meta.Stream.DataSeparator": "源数据字段分割符",
Expand Down Expand Up @@ -409,8 +412,6 @@
"meta.Stream.WrapTypeHelp": "消息体打包类型，默认 InLongMsg V0。Raw：不对消息体进行任何协议打包，InLongMsg V0：六段式打包协议，InLongMsg V1：PB 打包协议",
"meta.Stream.PredefinedFields": "预定义字段",
"meta.Transform.Name": "转换名称",
"meta.Transform.NameRule": "只能包含英文字母、数字、点号(.)、中划线(-)、下划线(_)",
"meta.Transform.Type": "转换类型",
"meta.Consume.ConsumerGroupName": "消费组名称",
"meta.Consume.ConsumerGroupNameRules": "只能包含小写字母、数字、中划线、下划线",
"meta.Consume.TopicName": "Topic 名称",
Expand Down Expand Up @@ -479,8 +480,6 @@
"meta.Nodes.Redis.Database": "Database",
"meta.Nodes.Redis.ClusterMode": "集群模式",
"meta.Nodes.Redis.clusterModeHelp": "Redis 集群模式, 可为 [cluster|sentinel|standalone]",
"meta.Nodes.Redis.Password": "密码",
"meta.Nodes.Redis.Url": "地址",
"meta.Nodes.Kudu.masters": "主节点",
"meta.Nodes.Kudu.DefaultAdminOperationTimeoutMs": "管理操作默认超时(ms)",
"meta.Nodes.Kudu.DefaultOperationTimeoutMs": "用户操作默认超时(ms)",
Expand Down Expand Up @@ -793,7 +792,6 @@
"pages.SynchronizeDashboard.config.Reject": "已驳回",
"pages.SynchronizeDetail.Info.Back": "返回",
"pages.SynchronizeDetail.Info.NextStep": "下一步",
"pages.SynchronizeDetail.Info.DataStreams": "数据流",
"pages.SynchronizeDetail.Info.Submit": "提交审批",
"pages.SynchronizeDetail.Info.SubmittedSuccessfully": "提交成功",
"pages.SynchronizeDetail.Info.SubmittedWarn": "请先创建数据源和数据目标",
Expand All @@ -820,7 +818,6 @@
"pages.SynchronizeDetail.Transform.Type.Field": "字段",
"pages.SynchronizeDetail.Transform.Type.CustomValue": "自定义值",
"pages.SynchronizeDetail.Transform.ComparisonValue": "比较值",
"components.Synchronize.SinkMultipleEnable": "整库迁移",
"components.FieldList.Source": "源字段",
"components.FieldList.Sink": "目标字段",
"components.FieldList.CreateSource": "新建源字段",
Expand Down
37 changes: 17 additions & 20 deletions inlong-dashboard/src/ui/locales/en.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -208,6 +208,7 @@
"meta.Sinks.Iceberg.PartitionStrategy": "Partition strategy",
"meta.Sinks.Iceberg.DatabasePattern": "Database name pattern",
"meta.Sinks.Iceberg.TablePattern": "Table name pattern",
"meta.Sinks.Iceberg.PatternHelp": "Custom configuration instructions: Built-in parameters include: 1. Source database name: ${database} 2. Source table name: ${table} [Usage Instructions]: Supports the use of built-in parameters and string combinations to generate target database table names [Example] : If the source table name is table1 and the mapping rule is ${table}_inlong, the data of table1 will be finally mapped and written to table1_inlong.",
"meta.Sinks.Iceberg.Options.DBSameName": "Same as source database",
"meta.Sinks.Iceberg.Options.TableSameName": "Same as source table",
"meta.Sinks.Iceberg.Options.Customize": "Customize",
Expand Down Expand Up @@ -284,23 +285,19 @@
"meta.Sinks.StarRocks.TablePattern": "Table pattern",
"meta.Sinks.StarRocks.IsMetaField": "Is meta field",
"meta.Sinks.StarRocks.FieldFormat": "Field format",
"meta.Sinks.Redis.clusterModeHelp": "Redis cluster mode, contains [cluster|sentinel|standalone]",
"meta.Sinks.Redis.ttlUnit": "s",
"meta.Sinks.Redis.IsMetaField": "Is meta field",
"meta.Sinks.Redis.FieldFormat": "Field format",
"meta.Sinks.Redis.database": "Database id",
"meta.Sinks.Redis.password": "Password",
"meta.Sinks.Redis.ttl": "TTL",
"meta.Sinks.Redis.Database": "Database id",
"meta.Sinks.Redis.Ttl": "TTL",
"meta.Sinks.Redis.TtlUnit": "s",
"meta.Sinks.Redis.ExtList": "Ext list",
"meta.Sinks.Redis.Timeout": "Time out",
"meta.Sinks.Redis.SoTimeout": "So timeout",
"meta.Sinks.Redis.MaxTotal": "Max total",
"meta.Sinks.Redis.MaxIdle": "Max idle",
"meta.Sinks.Redis.MinIdle": "Min idle",
"meta.Sinks.Redis.maxRetries": "Max retries",
"meta.Sinks.Redis.dataType": "Data type",
"meta.Sinks.Redis.schemaMapMode": "Schema map mode",
"meta.Sinks.Redis.MaxRetries": "Max retries",
"meta.Sinks.Redis.DataType": "Data type",
"meta.Sinks.Redis.SchemaMapMode": "Schema map mode",
"meta.Sinks.Redis.TimeoutUnit": "s",
"meta.Sinks.Redis.SoTimeoutUnit": "s",
"meta.Sinks.Redis.FormatDataType": "Format data type",
Expand Down Expand Up @@ -333,7 +330,6 @@
"meta.Sinks.Cls.Tag": "Tag",
"meta.Sinks.Cls.Tokenizer": "Tokenizer rule",
"meta.Sinks.Cls.IsMetaField": "Is meta field",
"meta.Sinks.Cls.FieldFormat": "Field format",
"meta.Group.InlongGroupId": "Inlong group id",
"meta.Group.InlongGroupIdRules": "Only English letters, numbers, dots(.), minus(-), and underscores(_)",
"meta.Group.InlongGroupName": "Inlong group name",
Expand Down Expand Up @@ -381,6 +377,11 @@
"meta.Group.Status.Suspended": "Suspended",
"meta.Group.Status.Restarting": "Restarting",
"meta.Group.Status.Restarted": "Restarted",
"meta.Synchronize.SinkMultipleEnable": "Full database migration",
"meta.Synchronize.GroupId": "Group ID",
"meta.Synchronize.GroupIdHelp": "Group ID and stream ID are the same by default",
"meta.Synchronize.InlongGroupOwnersExtra": "Can view, modify data synchronization info",
"meta.Synchronize.GroupOwners": "Group owners",
"meta.Stream.StreamId": "Stream id",
"meta.Stream.StreamIdRules": "Only English letters, numbers, dots(.), minus(-), and underscores(_)",
"meta.Stream.DataSeparator": "Source data separator",
Expand Down Expand Up @@ -411,8 +412,6 @@
"meta.Stream.WrapTypeHelp": "Message body packaging type, default InLongMsg V0. Raw: No protocol packaging of the message body, InLongMsg V0: Six-stage packaging protocol, InLongMsg V1: PB packaging protocol",
"meta.Stream.PredefinedFields": "Predefined fields",
"meta.Transform.Name": "Transform name",
"meta.Transform.NameRule": "Only supports letters, numbers, dots(.), minus(-), and underscores(_)",
"meta.Transform.Type": "Transform type",
"meta.Consume.ConsumerGroupName": "Consumer group name",
"meta.Consume.TopicName": "Topic name",
"meta.Consume.MQType": "MQ type",
Expand Down Expand Up @@ -476,8 +475,6 @@
"meta.Nodes.Redis.ClusterMode": "Cluster mode",
"meta.Nodes.Redis.ClusterModeHelper": "Please select custer mode",
"meta.Nodes.Redis.PortHelper": "Please select Redis server port, default: 6379",
"meta.Nodes.Redis.Password": "Password",
"meta.Nodes.Redis.Url": "URL",
"meta.Nodes.Hudi.Username": "Username",
"meta.Nodes.Hudi.Password": "Password",
"meta.Nodes.Hudi.Url": "URL",
Expand Down Expand Up @@ -529,6 +526,8 @@
"components.FieldList.SinkFieldName": "Sink field name",
"components.FieldList.SinkFieldType": "Sink field type",
"components.FieldList.FieldComment": "Field comment",
"components.CreateTable.Table": "Create table",
"components.CreateTable.TableType": "Table type",
"configs.pagination.Total": "Total {{total}} items",
"pages.GroupDashboard.ExecutionLogModal.Re-executingSuccess": "Re-executing success",
"pages.GroupDashboard.ExecutionLogModal.TaskType": "Task type",
Expand Down Expand Up @@ -791,7 +790,6 @@
"pages.SynchronizeDashboard.config.ExecuteLog": "Execute log",
"pages.SynchronizeDashboard.config.Restart": "Restart",
"pages.SynchronizeDashboard.config.Stop": "Stop",
"pages.SynchronizeDashboard.Info.NextStep": "Next",
"pages.SynchronizeDetail.Info.Back": "Back",
"pages.SynchronizeDetail.Info.NextStep": "Next",
"pages.SynchronizeDetail.Info.Submit": "Submit",
Expand All @@ -806,10 +804,6 @@
"pages.SynchronizeDetail.Transform.Create": "Create",
"pages.SynchronizeDetail.Audit.Read": "Read",
"pages.SynchronizeDetail.Audit.Receive": "Receive",
"components.FieldList.Source": "Source fields",
"components.FieldList.Sink": "Sink fields",
"components.FieldList.CreateSource": "Create source fields",
"components.FieldList.CreateSink": "Create sink fields",
"pages.SynchronizeDetail.Transform.FilterAction": "filter Strategy",
"pages.SynchronizeDetail.Transform.FilterAction.Tooltip": "Retain: Write the data that matches the filtering rule to the target table. Remove: Do not write the data of the hit rule into the target table.",
"pages.SynchronizeDetail.Transform.FilterAction.RemoveData": "Remove matching data",
Expand All @@ -824,7 +818,10 @@
"pages.SynchronizeDetail.Transform.Type.Field": "Field",
"pages.SynchronizeDetail.Transform.Type.CustomValue": "Custom value",
"pages.SynchronizeDetail.Transform.ComparisonValue": "Comparison value",
"components.Synchronize.SinkMultipleEnable": "Full database migration",
"components.FieldList.Source": "Source fields",
"components.FieldList.Sink": "Sink fields",
"components.FieldList.CreateSource": "Create source fields",
"components.FieldList.CreateSink": "Create sink fields",
"components.FieldList.AddField": "Add field",
"pages.Tenant.config.Description": "Description",
"pages.Tenant.config.Name": "Tenant name",
Expand Down
6 changes: 2 additions & 4 deletions inlong-dashboard/src/ui/pages/SynchronizeDetail/Info/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -108,8 +108,7 @@ const Comp = ({ inlongGroupId, inlongStreamId, readonly, isCreate }: Props, ref)

const submitDataStream = {
inlongGroupId: values.inlongGroupId,
inlongStreamId: values.inlongStreamId,
name: values.streamName,
inlongStreamId: values.inlongGroupId,
fieldList: streamDetail?.fieldList,
sinkMultipleEnable: values.sinkMultipleEnable,
};
Expand Down Expand Up @@ -163,7 +162,6 @@ const Comp = ({ inlongGroupId, inlongStreamId, readonly, isCreate }: Props, ref)

const onCancel = () => {
form.setFieldsValue(data);
// form.setFieldsValue(dataStream);
setFalse();
};

Expand All @@ -182,7 +180,7 @@ const Comp = ({ inlongGroupId, inlongStreamId, readonly, isCreate }: Props, ref)
initialValues={data}
onValuesChange={(c, values) => setMqType(values.mqType)}
useMaxWidth={1400}
col={12}
col={14}
/>

{!isCreate && !readonly && (
Expand Down
4 changes: 2 additions & 2 deletions inlong-dashboard/src/ui/pages/SynchronizeDetail/SyncSink/DetailModal.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -153,7 +153,7 @@ const Comp: React.FC<DetailModalProps> = ({
return (
<Modal
title={id ? t('pages.GroupDetail.Sink.Edit') : t('pages.GroupDetail.Sink.New')}
width={1200}
width={1260}
{...modalProps}
footer={[
<Button key="cancel" onClick={e => modalProps.onCancel(e)}>
Expand All @@ -171,7 +171,7 @@ const Comp: React.FC<DetailModalProps> = ({
>
<Spin spinning={loading || pluginLoading}>
<FormGenerator
labelCol={{ flex: '0 0 170px' }}
labelCol={{ flex: '0 0 180px' }}
wrapperCol={{ flex: '1' }}
col={12}
content={formContent}
Expand Down