+
+ {this.renderSearch('', '请输入Consumer ID')}
@@ -187,7 +188,7 @@ export class GroupID extends SearchAndFilterContainer {
@@ -214,7 +215,12 @@ export class GroupID extends SearchAndFilterContainer {
dataIndex: 'location',
key: 'location',
width: '34%',
- },
+ }, {
+ title: '状态',
+ dataIndex: 'state',
+ key: 'state',
+ width: '34%',
+ }
];
return (
<>
@@ -236,7 +242,17 @@ export class GroupID extends SearchAndFilterContainer {
data = searchKey ? origin.filter((item: IConsumerGroups) =>
(item.consumerGroup !== undefined && item.consumerGroup !== null) && item.consumerGroup.toLowerCase().includes(searchKey as string),
- ) : origin ;
+ ) : origin;
+ return data;
+ }
+
+ public getDetailData
(origin: T[]) {
+ let data: T[] = origin;
+ let { searchKey } = this.state;
+ searchKey = (searchKey + '').trim().toLowerCase();
+ data = searchKey ? origin.filter((item: IConsumeDetails) =>
+ (item.clientId !== undefined && item.clientId !== null) && item.clientId.toLowerCase().includes(searchKey as string),
+ ) : origin;
return data;
}
diff --git a/kafka-manager-console/src/container/topic/topic-detail/index.tsx b/kafka-manager-console/src/container/topic/topic-detail/index.tsx
index 451e5382..0220341b 100644
--- a/kafka-manager-console/src/container/topic/topic-detail/index.tsx
+++ b/kafka-manager-console/src/container/topic/topic-detail/index.tsx
@@ -1,7 +1,7 @@
import * as React from 'react';
import './index.less';
import { wrapper, region } from 'store';
-import { Tabs, PageHeader, Button, notification, Drawer, message, Icon } from 'antd';
+import { Tabs, PageHeader, Button, notification, Drawer, message, Icon, Spin } from 'antd';
import { observer } from 'mobx-react';
import { BaseInformation } from './base-information';
import { StatusChart } from './status-chart';
@@ -44,6 +44,7 @@ export class TopicDetail extends React.Component {
drawerVisible: false,
infoVisible: false,
infoTopicList: [] as IInfoData[],
+ isExecutionBtn: false
};
private $formRef: any;
@@ -54,7 +55,7 @@ export class TopicDetail extends React.Component {
const url = Url();
this.clusterId = Number(url.search.clusterId);
this.needAuth = url.search.needAuth;
- this.clusterName = url.search.clusterName;
+ this.clusterName = decodeURI(decodeURI(url.search.clusterName));
this.topicName = url.search.topic;
const isPhysical = Url().search.hasOwnProperty('isPhysicalClusterId');
this.isPhysicalTrue = isPhysical ? '&isPhysicalClusterId=true' : '';
@@ -197,7 +198,9 @@ export class TopicDetail extends React.Component {
formData={formData}
formMap={formMap}
/>
-
+
{infoVisible ? this.renderInfo() : null}
>
@@ -243,7 +246,11 @@ export class TopicDetail extends React.Component {
);
}
+ // 执行加载图标
+ public antIcon =
+
public drawerSubmit = (value: any) => {
+ this.setState({ isExecutionBtn: true })
this.$formRef.validateFields((error: Error, result: any) => {
if (error) {
return;
@@ -253,9 +260,12 @@ export class TopicDetail extends React.Component {
this.setState({
infoTopicList: data,
infoVisible: true,
+ isExecutionBtn: false
});
message.success('采样成功');
- });
+ }).catch(err => {
+ this.setState({ isExecutionBtn: false })
+ })
});
}
@@ -315,6 +325,7 @@ export class TopicDetail extends React.Component {
public componentDidMount() {
topic.getTopicBasicInfo(this.clusterId, this.topicName);
topic.getTopicBusiness(this.clusterId, this.topicName);
+ app.getAppList();
}
public render() {
@@ -326,7 +337,6 @@ export class TopicDetail extends React.Component {
topicName: this.topicName,
clusterName: this.clusterName
} as ITopic;
- app.getAppList();
return (
<>
@@ -342,9 +352,9 @@ export class TopicDetail extends React.Component {
{this.needAuth == "true" && }
-
-
- {showEditBtn && }
+
+
+ {/* {showEditBtn && } */}
>
}
/>
diff --git a/kafka-manager-console/src/container/topic/topic-detail/reset-offset.tsx b/kafka-manager-console/src/container/topic/topic-detail/reset-offset.tsx
index be0767e8..531f69c6 100644
--- a/kafka-manager-console/src/container/topic/topic-detail/reset-offset.tsx
+++ b/kafka-manager-console/src/container/topic/topic-detail/reset-offset.tsx
@@ -71,32 +71,32 @@ class ResetOffset extends React.Component {
const { getFieldDecorator } = this.props.form;
const { typeValue, offsetValue } = this.state;
return (
- <>
-
-
-
+ <>
+
+
+ {/* */}