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 48bb6c3e66 [INLONG-11183][Dashboard] Module audit page indicator items
are merged with other items (#11185)
48bb6c3e66 is described below
commit 48bb6c3e66f358726f97f7fd722101d46b5ca2b1
Author: kamianlaida <[email protected]>
AuthorDate: Tue Sep 24 15:48:16 2024 +0800
[INLONG-11183][Dashboard] Module audit page indicator items are merged with
other items (#11185)
---
.../ui/pages/ModuleAudit/AuditModule/config.tsx | 38 ++++--------
.../src/ui/pages/ModuleAudit/AuditModule/index.tsx | 5 +-
.../src/ui/pages/ModuleAudit/IdModule/config.tsx | 68 +++++++---------------
.../src/ui/pages/ModuleAudit/IdModule/index.tsx | 6 +-
.../src/ui/pages/ModuleAudit/IpModule/config.tsx | 68 +++++++---------------
.../src/ui/pages/ModuleAudit/IpModule/index.tsx | 6 +-
.../src/ui/pages/ModuleAudit/index.tsx | 24 ++++++--
7 files changed, 81 insertions(+), 134 deletions(-)
diff --git a/inlong-dashboard/src/ui/pages/ModuleAudit/AuditModule/config.tsx
b/inlong-dashboard/src/ui/pages/ModuleAudit/AuditModule/config.tsx
index 2ef04c5bd5..e3821a15ec 100644
--- a/inlong-dashboard/src/ui/pages/ModuleAudit/AuditModule/config.tsx
+++ b/inlong-dashboard/src/ui/pages/ModuleAudit/AuditModule/config.tsx
@@ -158,7 +158,7 @@ export const getSourceDataWithCommas = sourceData => {
let endTimeVisible = true;
-export const getFormContent = (initialValues, onSearch, onDataStreamSuccess)
=> [
+export const getFormContent = (initialValues, onSearch, onDataStreamSuccess,
auditData) => [
{
type: 'select',
label: i18n.t('pages.ModuleAudit.config.InlongGroupId'),
@@ -303,34 +303,16 @@ export const getFormContent = (initialValues, onSearch,
onDataStreamSuccess) =>
allowClear: true,
showSearch: true,
dropdownMatchSelectWidth: false,
- options: {
- requestAuto: true,
- requestTrigger: ['onOpen'],
- requestService: () => {
- return request({
- url: '/audit/getAuditBases',
- params: {
- isMetric: true,
- },
+ options: auditData?.reduce((accumulator, item) => {
+ const existingItem = accumulator.find((i: { value: any }) => i.value
=== item.auditId);
+ if (!existingItem) {
+ accumulator.push({
+ label: i18n?.language === 'cn' ? item.nameInChinese :
item.nameInEnglish,
+ value: item.auditId,
});
- },
- requestParams: {
- formatResult: result => {
- return result?.reduce((accumulator, item) => {
- const existingItem = accumulator.find(
- (i: { value: any }) => i.value === item.auditId,
- );
- if (!existingItem) {
- accumulator.push({
- label: i18n?.language === 'cn' ? item.nameInChinese :
item.nameInEnglish,
- value: item.auditId,
- });
- }
- return accumulator;
- }, []);
- },
- },
- },
+ }
+ return accumulator;
+ }, []),
filterOption: (keyword: string, option: { label: any }) => {
return (option?.label ??
'').toLowerCase().includes(keyword.toLowerCase());
},
diff --git a/inlong-dashboard/src/ui/pages/ModuleAudit/AuditModule/index.tsx
b/inlong-dashboard/src/ui/pages/ModuleAudit/AuditModule/index.tsx
index 5dbed68dd7..8a4491b5e2 100644
--- a/inlong-dashboard/src/ui/pages/ModuleAudit/AuditModule/index.tsx
+++ b/inlong-dashboard/src/ui/pages/ModuleAudit/AuditModule/index.tsx
@@ -32,9 +32,10 @@ import {
} from './config';
import { Table } from 'antd';
import i18n from '@/i18n';
+import { AuditProps } from '@/ui/pages/ModuleAudit';
export const auditModule = 'audit';
-const Comp: React.FC = () => {
+const Comp: React.FC<AuditProps> = ({ auditData }) => {
const [form] = useForm();
const [query, setQuery] = useState({
@@ -114,7 +115,7 @@ const Comp: React.FC = () => {
<FormGenerator
form={form}
layout="inline"
- content={getFormContent(query, onSearch, onDataStreamSuccess)}
+ content={getFormContent(query, onSearch, onDataStreamSuccess,
auditData)}
style={{ marginBottom: 30 }}
onFilter={allValues =>
setQuery({
diff --git a/inlong-dashboard/src/ui/pages/ModuleAudit/IdModule/config.tsx
b/inlong-dashboard/src/ui/pages/ModuleAudit/IdModule/config.tsx
index c65e0ecdff..cd868b6797 100644
--- a/inlong-dashboard/src/ui/pages/ModuleAudit/IdModule/config.tsx
+++ b/inlong-dashboard/src/ui/pages/ModuleAudit/IdModule/config.tsx
@@ -47,7 +47,7 @@ export const toTableData = (source, sourceDataMap) => {
}));
};
-export const getFormContent = (initialValues, onSearch) => [
+export const getFormContent = (initialValues, onSearch, auditData) => [
{
type: 'select',
label: i18n.t('pages.ModuleAudit.config.InlongGroupId'),
@@ -138,29 +138,16 @@ export const getFormContent = (initialValues, onSearch)
=> [
allowClear: true,
showSearch: true,
dropdownMatchSelectWidth: false,
- options: {
- requestAuto: true,
- requestTrigger: ['onOpen'],
- requestService: () => {
- return request('/audit/getAuditBases');
- },
- requestParams: {
- formatResult: (result: any[]) => {
- return result?.reduce((accumulator, item) => {
- const existingItem = accumulator.find(
- (i: { value: any }) => i.value === item.auditId,
- );
- if (!existingItem) {
- accumulator.push({
- label: i18n?.language === 'cn' ? item.nameInChinese :
item.nameInEnglish,
- value: item.auditId,
- });
- }
- return accumulator;
- }, []);
- },
- },
- },
+ options: auditData?.reduce((accumulator, item) => {
+ const existingItem = accumulator.find((i: { value: any }) => i.value
=== item.auditId);
+ if (!existingItem) {
+ accumulator.push({
+ label: i18n?.language === 'cn' ? item.nameInChinese :
item.nameInEnglish,
+ value: item.auditId,
+ });
+ }
+ return accumulator;
+ }, []),
filterOption: (keyword: string, option: { label: any }) =>
(option?.label ?? '').toLowerCase().includes(keyword.toLowerCase()),
},
@@ -173,29 +160,16 @@ export const getFormContent = (initialValues, onSearch)
=> [
allowClear: true,
showSearch: true,
dropdownMatchSelectWidth: false,
- options: {
- requestAuto: true,
- requestTrigger: ['onOpen'],
- requestService: () => {
- return request('/audit/getAuditBases');
- },
- requestParams: {
- formatResult: (result: any[]) => {
- return result?.reduce((accumulator, item) => {
- const existingItem = accumulator.find(
- (i: { value: any }) => i.value === item.auditId,
- );
- if (!existingItem) {
- accumulator.push({
- label: i18n?.language === 'cn' ? item.nameInChinese :
item.nameInEnglish,
- value: item.auditId,
- });
- }
- return accumulator;
- }, []);
- },
- },
- },
+ options: auditData?.reduce((accumulator, item) => {
+ const existingItem = accumulator.find((i: { value: any }) => i.value
=== item.auditId);
+ if (!existingItem) {
+ accumulator.push({
+ label: i18n?.language === 'cn' ? item.nameInChinese :
item.nameInEnglish,
+ value: item.auditId,
+ });
+ }
+ return accumulator;
+ }, []),
filterOption: (keyword: string, option: { label: any }) =>
(option?.label ?? '').toLowerCase().includes(keyword.toLowerCase()),
},
diff --git a/inlong-dashboard/src/ui/pages/ModuleAudit/IdModule/index.tsx
b/inlong-dashboard/src/ui/pages/ModuleAudit/IdModule/index.tsx
index b6fa51a9b6..65fb7bd053 100644
--- a/inlong-dashboard/src/ui/pages/ModuleAudit/IdModule/index.tsx
+++ b/inlong-dashboard/src/ui/pages/ModuleAudit/IdModule/index.tsx
@@ -22,10 +22,10 @@ import HighTable, { useForm } from
'@/ui/components/HighTable';
import { useRequest } from '@/ui/hooks';
import { timestampFormat } from '@/core/utils';
import { getFormContent, toTableData, getTableColumns } from './config';
+import { AuditProps } from '@/ui/pages/ModuleAudit';
export const idModule = 'id';
-
-const Comp: React.FC = () => {
+const Comp: React.FC<AuditProps> = ({ auditData }) => {
const [form] = useForm();
const [query, setQuery] = useState({
@@ -101,7 +101,7 @@ const Comp: React.FC = () => {
<>
<HighTable
filterForm={{
- content: getFormContent(query, onSearch),
+ content: getFormContent(query, onSearch, auditData),
onFilter,
}}
table={{
diff --git a/inlong-dashboard/src/ui/pages/ModuleAudit/IpModule/config.tsx
b/inlong-dashboard/src/ui/pages/ModuleAudit/IpModule/config.tsx
index 21eccefa95..1b6dc36e88 100644
--- a/inlong-dashboard/src/ui/pages/ModuleAudit/IpModule/config.tsx
+++ b/inlong-dashboard/src/ui/pages/ModuleAudit/IpModule/config.tsx
@@ -56,7 +56,7 @@ export const toTableData = (source, sourceDataMap) => {
}));
};
-export const getFormContent = (initialValues, onSearch) => [
+export const getFormContent = (initialValues, onSearch, auditData) => [
{
type: 'input',
label: i18n.t('pages.ModuleAudit.config.Ip'),
@@ -92,29 +92,16 @@ export const getFormContent = (initialValues, onSearch) => [
allowClear: true,
showSearch: true,
dropdownMatchSelectWidth: false,
- options: {
- requestAuto: true,
- requestTrigger: ['onOpen'],
- requestService: () => {
- return request('/audit/getAuditBases');
- },
- requestParams: {
- formatResult: (result: any[]) => {
- return result?.reduce((accumulator, item) => {
- const existingItem = accumulator.find(
- (i: { value: any }) => i.value === item.auditId,
- );
- if (!existingItem) {
- accumulator.push({
- label: i18n?.language === 'cn' ? item.nameInChinese :
item.nameInEnglish,
- value: item.auditId,
- });
- }
- return accumulator;
- }, []);
- },
- },
- },
+ options: auditData?.reduce((accumulator, item) => {
+ const existingItem = accumulator.find((i: { value: any }) => i.value
=== item.auditId);
+ if (!existingItem) {
+ accumulator.push({
+ label: i18n?.language === 'cn' ? item.nameInChinese :
item.nameInEnglish,
+ value: item.auditId,
+ });
+ }
+ return accumulator;
+ }, []),
filterOption: (keyword: any, option: { label: any }) =>
(option?.label ?? '').toLowerCase().includes(keyword.toLowerCase()),
},
@@ -127,29 +114,16 @@ export const getFormContent = (initialValues, onSearch)
=> [
allowClear: true,
showSearch: true,
dropdownMatchSelectWidth: false,
- options: {
- requestAuto: true,
- requestTrigger: ['onOpen'],
- requestService: () => {
- return request('/audit/getAuditBases');
- },
- requestParams: {
- formatResult: (result: any[]) => {
- return result?.reduce((accumulator, item) => {
- const existingItem = accumulator.find(
- (i: { value: any }) => i.value === item.auditId,
- );
- if (!existingItem) {
- accumulator.push({
- label: i18n?.language === 'cn' ? item.nameInChinese :
item.nameInEnglish,
- value: item.auditId,
- });
- }
- return accumulator;
- }, []);
- },
- },
- },
+ options: auditData?.reduce((accumulator, item) => {
+ const existingItem = accumulator.find((i: { value: any }) => i.value
=== item.auditId);
+ if (!existingItem) {
+ accumulator.push({
+ label: i18n?.language === 'cn' ? item.nameInChinese :
item.nameInEnglish,
+ value: item.auditId,
+ });
+ }
+ return accumulator;
+ }, []),
filterOption: (keyword: string, option: { label: any }) =>
(option?.label ?? '').toLowerCase().includes(keyword.toLowerCase()),
},
diff --git a/inlong-dashboard/src/ui/pages/ModuleAudit/IpModule/index.tsx
b/inlong-dashboard/src/ui/pages/ModuleAudit/IpModule/index.tsx
index 7e97bad15b..ef24a3e7dd 100644
--- a/inlong-dashboard/src/ui/pages/ModuleAudit/IpModule/index.tsx
+++ b/inlong-dashboard/src/ui/pages/ModuleAudit/IpModule/index.tsx
@@ -23,10 +23,10 @@ import HighTable from '@/ui/components/HighTable';
import { useRequest } from '@/ui/hooks';
import { timestampFormat } from '@/core/utils';
import { getFormContent, toTableData, getTableColumns } from './config';
+import { AuditProps } from '@/ui/pages/ModuleAudit';
export const ipModule = 'ip';
-
-const Comp: React.FC = () => {
+const Comp: React.FC<AuditProps> = ({ auditData }) => {
const [form] = useForm();
const [query, setQuery] = useState({
@@ -100,7 +100,7 @@ const Comp: React.FC = () => {
<>
<HighTable
filterForm={{
- content: getFormContent(query, onSearch),
+ content: getFormContent(query, onSearch, auditData),
onFilter,
}}
table={{
diff --git a/inlong-dashboard/src/ui/pages/ModuleAudit/index.tsx
b/inlong-dashboard/src/ui/pages/ModuleAudit/index.tsx
index f0fc7b826e..85eeb2dfab 100644
--- a/inlong-dashboard/src/ui/pages/ModuleAudit/index.tsx
+++ b/inlong-dashboard/src/ui/pages/ModuleAudit/index.tsx
@@ -17,7 +17,7 @@
* under the License.
*/
-import React, { useState } from 'react';
+import React, { useEffect, useState } from 'react';
import { Card } from 'antd';
import { PageContainer, Container } from '@/ui/components/PageContainer';
import { useHistory, useParams } from '@/ui/hooks';
@@ -25,6 +25,7 @@ import i18n from '@/i18n';
import IpModule, { ipModule as ipModuleName } from './IpModule';
import IdModule, { idModule as idModuleName } from './IdModule';
import AuditModule, { auditModule as auditModuleName } from
'@/ui/pages/ModuleAudit/AuditModule';
+import request from '@/core/utils/request';
const tabList = [
{
tab: i18n.t('pages.ModuleAudit.Id'),
@@ -50,7 +51,9 @@ const tabListMap = tabList.reduce(
}),
{},
);
-
+export interface AuditProps {
+ auditData?: any[];
+}
const Comp: React.FC = () => {
const history = useHistory();
const { type } = useParams<Record<string, string>>();
@@ -63,7 +66,20 @@ const Comp: React.FC = () => {
pathname: `/system/${value}`,
});
};
-
+ const [auditData, setAuditData] = useState([]);
+ useEffect(() => {
+ request('/audit/getAuditBases').then(res1 => {
+ request({
+ url: '/audit/getAuditBases',
+ params: {
+ isMetric: true,
+ },
+ }).then(res2 => {
+ res1.push(...res2);
+ setAuditData(res1);
+ });
+ });
+ }, []);
return (
<PageContainer useDefaultBreadcrumb={false} useDefaultContainer={false}>
<Container>
@@ -76,7 +92,7 @@ const Comp: React.FC = () => {
headStyle={{ border: 'none' }}
tabProps={{ size: 'middle' }}
>
- {tabListMap[module]}
+ {React.cloneElement(tabListMap[module], { auditData: auditData })}
</Card>
</Container>
</PageContainer>
