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 346f398ea [INLONG-7016][Dashboard] Approve page supports multiple
columns (#7017)
346f398ea is described below
commit 346f398eaf64a76aaf07f59a4d49e85d8c781b94
Author: Daniel <[email protected]>
AuthorDate: Thu Dec 22 11:43:58 2022 +0800
[INLONG-7016][Dashboard] Approve page supports multiple columns (#7017)
---
inlong-dashboard/src/locales/cn.json | 5 +--
inlong-dashboard/src/locales/en.json | 5 +--
.../src/metas/sources/defaults/File.ts | 30 ---------------
.../src/pages/ProcessDetail/ConsumeConfig.tsx | 6 +--
inlong-dashboard/src/pages/ProcessDetail/Group.tsx | 2 -
.../src/pages/ProcessDetail/GroupConfig.tsx | 13 +++----
inlong-dashboard/src/pages/ProcessDetail/Steps.tsx | 9 ++---
inlong-dashboard/src/pages/ProcessDetail/index.tsx | 43 ++++++++++------------
8 files changed, 33 insertions(+), 80 deletions(-)
diff --git a/inlong-dashboard/src/locales/cn.json
b/inlong-dashboard/src/locales/cn.json
index a540ae490..21adc6fb5 100644
--- a/inlong-dashboard/src/locales/cn.json
+++ b/inlong-dashboard/src/locales/cn.json
@@ -23,7 +23,6 @@
"meta.Sources.File.IpRule": "请输入正确的IP地址",
"meta.Sources.File.TimeOffset": "时间偏移量",
"meta.Sources.File.TimeOffsetHelp":
"从文件的某个时间开始采集，'1m'表示1分钟之后，'-1m'表示1分钟之前，支持m(分钟)，h(小时)，d(天)，空则从当前时间开始采集",
- "meta.Sources.File.Cluster": "集群名称",
"meta.Sources.Db.Server": "服务器地址",
"meta.Sources.Db.Port": "服务器端口",
"meta.Sources.Db.ServerTimezone": "服务器时区",
@@ -518,10 +517,8 @@
"pages.ApprovalDetail.GroupConfig.DataStorages": "数据存储",
"pages.ApprovalDetail.GroupConfig.ApprovalInformation": "审批信息",
"pages.ApprovalDetail.GroupConfig.DataFlowInformation": "数据流信息",
- "pages.ApprovalDetail.GroupConfig.BasicInformation": "基础信息",
"pages.ApprovalDetail.GroupConfig.BindClusterTag": "集群标签",
"pages.ApprovalDetail.ConsumeConfig.ConsumerGroup": "消费组",
- "pages.ApprovalDetail.ConsumeConfig.BasicInfo": "基础信息",
"pages.ApprovalDetail.ConsumeConfig.ApprovalInfo": "审批信息",
"pages.ApprovalDetail.SubmitApplication": "提交申请",
"pages.ApprovalDetail.Process": "流程单",
@@ -554,6 +551,8 @@
"pages.Approvals.GroupId": "数据流组 ID",
"pages.Approvals.MyApplication": "我的申请",
"pages.Approvals.MyApproval": "我的审批",
+ "pages.Approvals.Type.Group": "申请数据流组",
+ "pages.Approvals.Type.Consume": "申请订阅",
"pages.ConsumeCreate.SubscriptionInformation": "订阅信息",
"pages.ConsumeCreate.Prev": "上一步",
"pages.ConsumeCreate.Next": "下一步",
diff --git a/inlong-dashboard/src/locales/en.json
b/inlong-dashboard/src/locales/en.json
index 179cc2d37..4a19aa09a 100644
--- a/inlong-dashboard/src/locales/en.json
+++ b/inlong-dashboard/src/locales/en.json
@@ -23,7 +23,6 @@
"meta.Sources.File.IpRule": "Please enter the IP address correctly",
"meta.Sources.File.TimeOffset": "Time offset",
"meta.Sources.File.TimeOffsetHelp": "The file will be collected from a
certain time,' 1m' means 1 minute later,' -1m' means 1 minute before, and
m(minute), h(hour), d(day) are supported. If it is empty, the file will be
collected from the current time",
- "meta.Sources.File.Cluster": "Cluster Name",
"meta.Sources.Db.Server": "Server",
"meta.Sources.Db.Port": "Port",
"meta.Sources.Db.ServerTimezone": "Timezone",
@@ -515,10 +514,8 @@
"pages.ApprovalDetail.GroupConfig.DataStorages": "DataStorages",
"pages.ApprovalDetail.GroupConfig.ApprovalInformation": "Approval
information",
"pages.ApprovalDetail.GroupConfig.DataFlowInformation": "Data stream
information",
- "pages.ApprovalDetail.GroupConfig.BasicInformation": "Basic information",
"pages.ApprovalDetail.GroupConfig.BindClusterTag": "Cluster tag",
"pages.ApprovalDetail.ConsumeConfig.ConsumerGroup": "Consumer group",
- "pages.ApprovalDetail.ConsumeConfig.BasicInfo": "Basic information",
"pages.ApprovalDetail.ConsumeConfig.ApprovalInfo": "Approval information",
"pages.ApprovalDetail.SubmitApplication": "Submit application",
"pages.ApprovalDetail.Process": "Process",
@@ -551,6 +548,8 @@
"pages.Approvals.GroupId": "Inlong Group ID",
"pages.Approvals.MyApplication": "My Application",
"pages.Approvals.MyApproval": "My Approval",
+ "pages.Approvals.Type.Group": "Apply Group",
+ "pages.Approvals.Type.Consume": "Apply Subscription",
"pages.ConsumeCreate.SubscriptionInformation": "Subscription information",
"pages.ConsumeCreate.Prev": "Prev",
"pages.ConsumeCreate.Next": "Next",
diff --git a/inlong-dashboard/src/metas/sources/defaults/File.ts
b/inlong-dashboard/src/metas/sources/defaults/File.ts
index 68a93b2a3..212e562a4 100644
--- a/inlong-dashboard/src/metas/sources/defaults/File.ts
+++ b/inlong-dashboard/src/metas/sources/defaults/File.ts
@@ -32,36 +32,6 @@ export default class PulsarSource
extends SourceInfo
implements DataWithBackend, RenderRow, RenderList
{
- @FieldDecorator({
- type: 'select',
- rules: [{ required: true }],
- props: values => ({
- showSearch: true,
- disabled: values?.status === 101,
- options: {
- requestTrigger: ['onOpen', 'onSearch'],
- requestService: {
- url: '/cluster/list',
- method: 'POST',
- data: {
- type: 'AGENT',
- pageNum: 1,
- pageSize: 20,
- },
- },
- requestParams: {
- formatResult: result =>
- result?.list?.map(item => ({
- label: item.name,
- value: item.name,
- })),
- },
- },
- }),
- })
- @I18n('meta.Sources.File.Cluster')
- inlongClusterName: string;
-
@FieldDecorator({
type: 'input',
rules: [
diff --git a/inlong-dashboard/src/pages/ProcessDetail/ConsumeConfig.tsx
b/inlong-dashboard/src/pages/ProcessDetail/ConsumeConfig.tsx
index 859c37499..01b410bd5 100644
--- a/inlong-dashboard/src/pages/ProcessDetail/ConsumeConfig.tsx
+++ b/inlong-dashboard/src/pages/ProcessDetail/ConsumeConfig.tsx
@@ -55,11 +55,7 @@ export const getFormContent = (
) => {
const array = [
{
- type: (
- <Divider orientation="left">
- {i18n.t('pages.ApprovalDetail.ConsumeConfig.BasicInfo')}
- </Divider>
- ),
+ type: <Divider
orientation="left">{i18n.t('pages.Approvals.Type.Consume')}</Divider>,
},
...consumeFormContent,
];
diff --git a/inlong-dashboard/src/pages/ProcessDetail/Group.tsx
b/inlong-dashboard/src/pages/ProcessDetail/Group.tsx
index 700702db8..aaeb4ef63 100644
--- a/inlong-dashboard/src/pages/ProcessDetail/Group.tsx
+++ b/inlong-dashboard/src/pages/ProcessDetail/Group.tsx
@@ -72,8 +72,6 @@ const Comp = ({ defaultData, isViwer, suffixContent,
noExtraForm, isFinished }:
dataLoaded && (
<FormGenerator
form={form}
- labelCol={{ span: 4 }}
- wrapperCol={{ span: 20 }}
content={getFormContent({
isViwer,
formData: defaultData?.processInfo?.formData,
diff --git a/inlong-dashboard/src/pages/ProcessDetail/GroupConfig.tsx
b/inlong-dashboard/src/pages/ProcessDetail/GroupConfig.tsx
index c0c81d20a..ae34f5f6f 100644
--- a/inlong-dashboard/src/pages/ProcessDetail/GroupConfig.tsx
+++ b/inlong-dashboard/src/pages/ProcessDetail/GroupConfig.tsx
@@ -30,7 +30,7 @@ export const useGroupFormContent = ({ mqType = '',
isFinished, isViwer }) => {
}, [Entity]);
return entityFields?.map(item => {
- const obj = { ...item };
+ const obj = { ...item, col: 12 };
const canEditSet = new Set([
'dataReportType',
@@ -66,11 +66,7 @@ export const getFormContent = ({
}) => {
const array = [
{
- type: (
- <Divider orientation="left">
- {i18n.t('pages.ApprovalDetail.GroupConfig.BasicInformation')}
- </Divider>
- ),
+ type: <Divider
orientation="left">{i18n.t('pages.Approvals.Type.Group')}</Divider>,
},
...groupFormContent,
{
@@ -86,6 +82,7 @@ export const getFormContent = ({
size="small"
columns={[
{ title: 'ID', dataIndex: 'inlongStreamId' },
+ { title: 'mqResource', dataIndex: 'mqResource' },
{
title: i18n.t('pages.ApprovalDetail.GroupConfig.DataStorages'),
dataIndex: 'sinkList',
@@ -144,7 +141,7 @@ export const getFormContent = ({
</Divider>
),
},
- ...extraForm,
- ...suffixContent,
+ ...extraForm.map(item => ({ ...item, col: 12 })),
+ ...suffixContent.map(item => ({ ...item, col: 12 })),
]);
};
diff --git a/inlong-dashboard/src/pages/ProcessDetail/Steps.tsx
b/inlong-dashboard/src/pages/ProcessDetail/Steps.tsx
index c2cb015b5..5c54149e4 100644
--- a/inlong-dashboard/src/pages/ProcessDetail/Steps.tsx
+++ b/inlong-dashboard/src/pages/ProcessDetail/Steps.tsx
@@ -27,7 +27,7 @@ export interface StepsProps {
title: string;
desc: string;
status: string;
- remark?: string;
+ tooltip?: string;
}[];
}
@@ -50,16 +50,15 @@ const Comp: React.FC<StepsProps> = ({ data }) => {
return (
<Steps
size="small"
- status={canceledIndex !== -1 || rejectIndex !== -1 ? 'error' : 'wait'}
+ status={canceledIndex !== -1 || rejectIndex !== -1 ? 'error' : 'process'}
current={current}
- direction="vertical"
>
{data.map((item, index) => (
<Step
key={index}
title={
- item.remark ? (
- <Tooltip placement="bottom" title={item.remark}>
+ item.tooltip ? (
+ <Tooltip placement="bottom" title={item.tooltip}>
{item.title}
</Tooltip>
) : (
diff --git a/inlong-dashboard/src/pages/ProcessDetail/index.tsx
b/inlong-dashboard/src/pages/ProcessDetail/index.tsx
index be5c5ce28..8a1759182 100644
--- a/inlong-dashboard/src/pages/ProcessDetail/index.tsx
+++ b/inlong-dashboard/src/pages/ProcessDetail/index.tsx
@@ -18,7 +18,7 @@
*/
import React, { useMemo, useRef } from 'react';
-import { Button, Card, Descriptions, Modal, message, Space } from 'antd';
+import { Button, Card, Modal, message, Space } from 'antd';
import { parse } from 'qs';
import { PageContainer, Container, FooterToolbar } from
'@/components/PageContainer';
import { useParams, useRequest, useLocation, useHistory } from '@/hooks';
@@ -29,11 +29,12 @@ import Steps from './Steps';
import Group from './Group';
import Consume from './Consume';
-const workflowFormat = (applicant, startEvent, taskHistory = []) => {
+const workflowFormat = (applicant, startTime, startEvent, taskHistory = []) =>
{
const taskHistoryMap = new Map(taskHistory.map(item => [item.name, item]));
let data = [
{
title: i18n.t('pages.ApprovalDetail.SubmitApplication'),
+ subTitle: startTime ? timestampFormat(startTime) : '',
name: '',
desc: applicant,
status: 'COMPLETED',
@@ -143,7 +144,12 @@ const Comp: React.FC = () => {
const stepsData = useMemo(() => {
if (workflow?.startEvent) {
- return workflowFormat(processInfo?.applicant, workflow.startEvent,
taskHistory);
+ return workflowFormat(
+ processInfo?.applicant,
+ processInfo?.startTime,
+ workflow.startEvent,
+ taskHistory,
+ );
}
return [];
}, [workflow, processInfo, taskHistory]);
@@ -214,27 +220,16 @@ const Comp: React.FC = () => {
]}
useDefaultContainer={false}
>
- <div style={{ display: 'flex' }}>
- <Container style={{ flex: 1, marginRight: 20 }}>
- <Card title={workflow?.displayName}>
- <Descriptions>
- <Descriptions.Item
label={i18n.t('pages.ApprovalDetail.Applicant')}>
- {processInfo?.applicant}
- </Descriptions.Item>
- <Descriptions.Item
label={i18n.t('pages.ApprovalDetail.ApplicationTime')}>
- {processInfo?.startTime ?
timestampFormat(processInfo?.startTime) : ''}
- </Descriptions.Item>
- </Descriptions>
-
- {Form && <Form ref={formRef} {...formProps} />}
- </Card>
- </Container>
- <Container style={{ flex: '0 0 200px' }}>
- <Card title={i18n.t('pages.ApprovalDetail.ApprovalProcess')}
style={{ height: '100%' }}>
- <Steps data={stepsData} />
- </Card>
- </Container>
- </div>
+ <Container>
+ <Card>
+ <Steps data={stepsData} />
+ </Card>
+ </Container>
+
+ <Container>
+ <Card>{Form && <Form ref={formRef} {...formProps} />}</Card>
+ </Container>
+
<FooterToolbar extra={<Footer />} />
</PageContainer>
);
