This is an automated email from the ASF dual-hosted git repository.
vernedeng pushed a commit to branch branch-1.10
in repository https://gitbox.apache.org/repos/asf/inlong.git
commit e992981736ade4e501aa624a163a9ec0d4006a1a
Author: Lizhen <88174078+bluew...@users.noreply.github.com>
AuthorDate: Wed Dec 6 16:38:18 2023 +0800
[INLONG-9427][Dashboard] Data access supports viewing operation logs (#9428)
(cherry picked from commit ae897ea10bc35d2435a9da84473077b11327b3fc)
---
inlong-dashboard/src/ui/locales/cn.json | 10 ++
inlong-dashboard/src/ui/locales/en.json | 10 ++
.../ui/pages/GroupDetail/OperationLog/config.tsx | 144 +++++++++++++++++++++
.../ui/pages/GroupDetail/OperationLog/index.tsx | 93 +++++++++++++
.../src/ui/pages/GroupDetail/index.tsx | 7 +
5 files changed, 264 insertions(+)
diff --git a/inlong-dashboard/src/ui/locales/cn.json
b/inlong-dashboard/src/ui/locales/cn.json
index 4d88c28216..c35005a163 100644
--- a/inlong-dashboard/src/ui/locales/cn.json
+++ b/inlong-dashboard/src/ui/locales/cn.json
@@ -603,6 +603,7 @@
"pages.GroupDetail.Audit": "审计对账",
"pages.GroupDetail.Resource": "资源详情",
"pages.GroupDetail.Delay": "传输时延",
+ "pages.GroupDetail.OperationLog": "操作日志",
"pages.GroupDetail.Resource.Info": " 信息",
"pages.GroupDetail.Audit.DataStream": "数据流",
"pages.GroupDetail.Audit.StartDate": "开始日期",
@@ -624,6 +625,15 @@
"pages.GroupDetail.Stream.Dt": "数据时间 (dt)",
"pages.GroupDetail.Stream.Content": "数据内容",
"pages.GroupDetail.Stream.Number": "数据条数",
+ "pages.GroupDetail.OperationLog.Stream": "数据流 ID",
+ "pages.GroupDetail.OperationLog.OperationTarget": "操作目标",
+ "pages.GroupDetail.OperationLog.OperationType": "操作类型",
+ "pages.GroupDetail.OperationLog.Table.GroupId": "数据流组 ID",
+ "pages.GroupDetail.OperationLog.Table.StreamId": "数据流 ID",
+ "pages.GroupDetail.OperationLog.Table.Operator": "操作人",
+ "pages.GroupDetail.OperationLog.Table.OperationType": "操作类型",
+ "pages.GroupDetail.OperationLog.Table.OperationTarget": "操作目标",
+ "pages.GroupDetail.OperationLog.Table.Log": "日志",
"pages.ApprovalDetail.GroupConfig.DataStorages": "数据存储",
"pages.ApprovalDetail.GroupConfig.ApprovalInformation": "审批信息",
"pages.ApprovalDetail.GroupConfig.DataFlowInformation": "数据流信息",
diff --git a/inlong-dashboard/src/ui/locales/en.json
b/inlong-dashboard/src/ui/locales/en.json
index 00fbe020d0..9853526fe1 100644
--- a/inlong-dashboard/src/ui/locales/en.json
+++ b/inlong-dashboard/src/ui/locales/en.json
@@ -601,6 +601,7 @@
"pages.GroupDetail.Sinks": "Sinks",
"pages.GroupDetail.Audit": "Audit",
"pages.GroupDetail.Delay": "Transmission delay",
+ "pages.GroupDetail.OperationLog": "Operation log",
"pages.GroupDetail.Resource": "Resource detail",
"pages.GroupDetail.Resource.Info": " Info",
"pages.GroupDetail.Audit.DataStream": "Data stream",
@@ -623,6 +624,15 @@
"pages.GroupDetail.Stream.Dt": "Data time(dt)",
"pages.GroupDetail.Stream.Content": "Data content",
"pages.GroupDetail.Stream.Number": "Records number",
+ "pages.GroupDetail.OperationLog.Stream": "Stream",
+ "pages.GroupDetail.OperationLog.OperationTarget": "Operation target",
+ "pages.GroupDetail.OperationLog.OperationType": "Operation type",
+ "pages.GroupDetail.OperationLog.Table.GroupId": "Group id",
+ "pages.GroupDetail.OperationLog.Table.StreamId": "Stream id",
+ "pages.GroupDetail.OperationLog.Table.Operator": "Operator",
+ "pages.GroupDetail.OperationLog.Table.OperationType": "Operation type",
+ "pages.GroupDetail.OperationLog.Table.OperationTarget": "Operation target",
+ "pages.GroupDetail.OperationLog.Table.Log": "Log",
"pages.ApprovalDetail.GroupConfig.DataStorages": "Data storages",
"pages.ApprovalDetail.GroupConfig.ApprovalInformation": "Approval
information",
"pages.ApprovalDetail.GroupConfig.DataFlowInformation": "Data stream
information",
diff --git a/inlong-dashboard/src/ui/pages/GroupDetail/OperationLog/config.tsx
b/inlong-dashboard/src/ui/pages/GroupDetail/OperationLog/config.tsx
new file mode 100644
index 0000000000..6816e2cf46
--- /dev/null
+++ b/inlong-dashboard/src/ui/pages/GroupDetail/OperationLog/config.tsx
@@ -0,0 +1,144 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import i18n from '@/i18n';
+import { Tooltip } from 'antd';
+import React from 'react';
+
+const targetList = [
+ {
+ label: 'Group',
+ value: 'GROUP',
+ },
+ {
+ label: 'Stream',
+ value: 'STREAM',
+ },
+ {
+ label: 'Source',
+ value: 'SOURCE',
+ },
+ {
+ label: 'Sink',
+ value: 'SINK',
+ },
+];
+
+const typeList = [
+ {
+ label: 'Create',
+ value: 'CREATE',
+ },
+ {
+ label: 'Update',
+ value: 'UPDATE',
+ },
+ {
+ label: 'Delete',
+ value: 'DELETE',
+ },
+ {
+ label: 'Get',
+ value: 'GET',
+ },
+];
+
+export const getFormContent = inlongGroupId => [
+ {
+ type: 'select',
+ label: i18n.t('pages.GroupDetail.OperationLog.Stream'),
+ name: 'inlongStreamId',
+ props: {
+ options: {
+ requestAuto: true,
+ requestTrigger: ['onOpen', 'onSearch'],
+ requestService: keyword => ({
+ url: '/stream/list',
+ method: 'POST',
+ data: {
+ keyword,
+ pageNum: 1,
+ pageSize: 20,
+ inlongGroupId,
+ },
+ }),
+ requestParams: {
+ formatResult: result =>
+ result?.list?.map(item => ({
+ label: item.inlongStreamId,
+ value: item.inlongStreamId,
+ })),
+ },
+ },
+ },
+ },
+ {
+ type: 'select',
+ label: i18n.t('pages.GroupDetail.OperationLog.OperationTarget'),
+ name: 'operationTarget',
+ props: {
+ dropdownMatchSelectWidth: false,
+ options: targetList,
+ },
+ },
+ {
+ type: 'select',
+ label: i18n.t('pages.GroupDetail.OperationLog.OperationType'),
+ name: 'operationType',
+ props: {
+ dropdownMatchSelectWidth: false,
+ options: typeList,
+ },
+ },
+];
+
+export const getTableColumns = [
+ {
+ title: i18n.t('pages.GroupDetail.OperationLog.Table.GroupId'),
+ dataIndex: 'inlongGroupId',
+ },
+ {
+ title: i18n.t('pages.GroupDetail.OperationLog.Table.StreamId'),
+ dataIndex: 'inlongStreamId',
+ },
+ {
+ title: i18n.t('pages.GroupDetail.OperationLog.Table.Operator'),
+ dataIndex: 'operator',
+ },
+ {
+ title: i18n.t('pages.GroupDetail.OperationLog.Table.OperationType'),
+ dataIndex: 'operationType',
+ render: text => typeList.find(c => c.value === text)?.label || text,
+ },
+ {
+ title: i18n.t('pages.GroupDetail.OperationLog.Table.OperationTarget'),
+ dataIndex: 'operationTarget',
+ render: text => targetList.find(c => c.value === text)?.label || text,
+ },
+ {
+ title: i18n.t('pages.GroupDetail.OperationLog.Table.Log'),
+ dataIndex: 'body',
+ ellipsis: true,
+ render: body => (
+ <Tooltip placement="topLeft" title={body}>
+ {body}
+ </Tooltip>
+ ),
+ },
+];
diff --git a/inlong-dashboard/src/ui/pages/GroupDetail/OperationLog/index.tsx
b/inlong-dashboard/src/ui/pages/GroupDetail/OperationLog/index.tsx
new file mode 100644
index 0000000000..d00138ceb3
--- /dev/null
+++ b/inlong-dashboard/src/ui/pages/GroupDetail/OperationLog/index.tsx
@@ -0,0 +1,93 @@
+/*
+ * Licensed to the Apache Software Foundation (ASF) under one
+ * or more contributor license agreements. See the NOTICE file
+ * distributed with this work for additional information
+ * regarding copyright ownership. The ASF licenses this file
+ * to you under the Apache License, Version 2.0 (the
+ * "License"); you may not use this file except in compliance
+ * with the License. You may obtain a copy of the License at
+ *
+ * http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing,
+ * software distributed under the License is distributed on an
+ * "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
+ * KIND, either express or implied. See the License for the
+ * specific language governing permissions and limitations
+ * under the License.
+ */
+
+import React, { useEffect, useState } from 'react';
+import HighTable from '@/ui/components/HighTable';
+import { useRequest } from '@/ui/hooks';
+import { CommonInterface } from '../common';
+import { getFormContent, getTableColumns } from './config';
+import { defaultSize } from '@/configs/pagination';
+
+type Props = CommonInterface;
+
+const Comp: React.FC<Props> = ({ inlongGroupId }) => {
+ const [options, setOptions] = useState({
+ pageSize: defaultSize,
+ pageNum: 1,
+ });
+
+ const { data: sourceData, run } = useRequest(
+ {
+ url: '/operationLog/list',
+ method: 'POST',
+ data: {
+ ...options,
+ inlongGroupId,
+ },
+ },
+ {
+ refreshDeps: [options],
+ },
+ );
+
+ const pagination = {
+ pageSize: options.pageSize,
+ current: options.pageNum,
+ total: sourceData?.total,
+ };
+ const onChange = ({ current: pageNum, pageSize }) => {
+ setOptions(prev => ({
+ ...prev,
+ pageNum,
+ pageSize,
+ }));
+ };
+
+ const onFilter = allValues => {
+ setOptions(prev => ({
+ ...prev,
+ ...allValues,
+ pageNum: 1,
+ }));
+ };
+
+ useEffect(() => {
+ run();
+ }, []);
+
+ return (
+ <>
+ <HighTable
+ filterForm={{
+ content: getFormContent(inlongGroupId),
+ onFilter,
+ }}
+ table={{
+ columns: getTableColumns,
+ dataSource: sourceData?.list,
+ pagination: pagination,
+ rowKey: 'inlongGroupId',
+ onChange,
+ }}
+ />
+ </>
+ );
+};
+
+export default Comp;
diff --git a/inlong-dashboard/src/ui/pages/GroupDetail/index.tsx
b/inlong-dashboard/src/ui/pages/GroupDetail/index.tsx
index 685fa025d7..ec025a322b 100644
--- a/inlong-dashboard/src/ui/pages/GroupDetail/index.tsx
+++ b/inlong-dashboard/src/ui/pages/GroupDetail/index.tsx
@@ -29,6 +29,7 @@ import DataStream from './DataStream';
import Audit from './Audit';
import ResourceInfo from './ResourceInfo';
import Delay from './Delay';
+import OperationLog from './OperationLog';
const Comp: React.FC = () => {
const { t } = useTranslation();
@@ -90,6 +91,12 @@ const Comp: React.FC = () => {
content: Delay,
hidden: isReadonly || isCreate,
},
+ {
+ label: t('pages.GroupDetail.OperationLog'),
+ value: 'OperationLog',
+ content: OperationLog,
+ hidden: isReadonly || isCreate,
+ },
].filter(item => !item.hidden),
[isReadonly, isCreate, t],
);
