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 3cb3b37b9 [INLONG-6900][Dashboard] Support pulling up the field list
of Source in Sink (#6901)
3cb3b37b9 is described below
commit 3cb3b37b94697678fd92dafe7b8a5cafc2c91add
Author: Daniel <[email protected]>
AuthorDate: Thu Dec 15 18:44:46 2022 +0800
[INLONG-6900][Dashboard] Support pulling up the field list of Source in
Sink (#6901)
---
.../pages/GroupDetail/DataStorage/DetailModal.tsx | 47 +++++++++++++++++++++-
1 file changed, 45 insertions(+), 2 deletions(-)
diff --git a/inlong-dashboard/src/pages/GroupDetail/DataStorage/DetailModal.tsx
b/inlong-dashboard/src/pages/GroupDetail/DataStorage/DetailModal.tsx
index 5d47c9934..4da3893a9 100644
--- a/inlong-dashboard/src/pages/GroupDetail/DataStorage/DetailModal.tsx
+++ b/inlong-dashboard/src/pages/GroupDetail/DataStorage/DetailModal.tsx
@@ -17,7 +17,7 @@
* under the License.
*/
-import React, { useMemo, useState } from 'react';
+import React, { useEffect, useMemo, useState } from 'react';
import { Button, Skeleton, Modal, message } from 'antd';
import { ModalProps } from 'antd/es/modal';
import { useRequest, useUpdateEffect } from '@/hooks';
@@ -44,6 +44,8 @@ const Comp: React.FC<DetailModalProps> = ({ inlongGroupId,
defaultType, id, ...m
// A: Avoid the table of the fields triggering the monitoring of the column
change.
const [sinkType, setSinkType] = useState('');
+ const [changedValues, setChangedValues] = useState<Record<string, any>>({});
+
const { Entity } = useLoadMeta<SinkMetaType>('sink', sinkType);
const { data: groupData, run: getGroupData } =
useRequest(`/group/get/${inlongGroupId}`, {
@@ -70,10 +72,48 @@ const Comp: React.FC<DetailModalProps> = ({ inlongGroupId,
defaultType, id, ...m
},
);
+ const { data: streamDetail, run: getStreamDetail } = useRequest(
+ streamId => ({
+ url: `/stream/get`,
+ params: {
+ groupId: inlongGroupId,
+ streamId,
+ },
+ }),
+ {
+ manual: true,
+ },
+ );
+
+ useEffect(() => {
+ if (changedValues.inlongStreamId) {
+ getStreamDetail(changedValues.inlongStreamId);
+ }
+ }, [getStreamDetail, changedValues.inlongStreamId]);
+
+ useEffect(() => {
+ if (
+ Entity &&
+ streamDetail &&
+ streamDetail.fieldList?.length &&
+ Entity.FieldList?.some(item => item.name === 'sinkFieldList')
+ ) {
+ form.setFieldsValue({
+ sinkFieldList: streamDetail.fieldList.map(item => ({
+ sourceFieldName: item.fieldName,
+ sourceFieldType: item.fieldType,
+ fieldName: item.fieldName,
+ fieldType: '',
+ })),
+ });
+ }
+ }, [Entity, streamDetail, form]);
+
useUpdateEffect(() => {
if (modalProps.visible) {
// open
getGroupData();
+ setChangedValues({});
if (id) {
getData(id);
} else {
@@ -141,7 +181,10 @@ const Comp: React.FC<DetailModalProps> = ({ inlongGroupId,
defaultType, id, ...m
content={formContent}
form={form}
initialValues={id ? data : { inlongGroupId }}
- onValuesChange={(c, values) => setSinkType(values.sinkType)}
+ onValuesChange={(c, values) => {
+ setChangedValues(c);
+ setSinkType(values.sinkType);
+ }}
/>
)}
</Modal>
