8x48/KnowStreaming
1
0
Fork 0
mirror of https://github.com/didi/KnowStreaming.git synced 2025-12-24 11:52:08 +08:00
Code Issues Actions Packages Projects Releases Wiki Activity

fix: 单集群详情样式优化

Browse Source
This commit is contained in:
GraceWalk
2022-09-13 14:46:29 +08:00
parent 584b626d93
commit 5efb837ee8
4 changed files with 5 additions and 40 deletions
Download Patch File Download Diff File Expand all files Collapse all files

14
km-console/packages/layout-clusters-fe/src/pages/SingleClusterDetail/ChangeLog.tsx
View File

@@ -7,6 +7,7 @@ import moment from 'moment';
import { timeFormat } from '../../constants/common'; import { timeFormat } from '../../constants/common';
import { DownOutlined } from '@ant-design/icons'; import { DownOutlined } from '@ant-design/icons';
import { renderToolTipValue } from './config'; import { renderToolTipValue } from './config';
import RenderEmpty from '@src/components/RenderEmpty';
const { Panel } = Collapse; const { Panel } = Collapse;
@@ -51,17 +52,6 @@ const ChangeLog = () => {
); );
}, []); }, []);
const renderEmpty = () => {
return (
<>
<div className="empty-panel">
<div className="img" />
<div className="text">暂无配置记录</div>
</div>
</>
);
};
const getHref = (item: any) => { const getHref = (item: any) => {
if (item.resTypeName.toLowerCase().includes('topic')) return `/cluster/${clusterId}/topic/list#topicName=${item.resName}`; if (item.resTypeName.toLowerCase().includes('topic')) return `/cluster/${clusterId}/topic/list#topicName=${item.resName}`;
if (item.resTypeName.toLowerCase().includes('broker')) return `/cluster/${clusterId}/broker/list#brokerId=${item.resName}`; if (item.resTypeName.toLowerCase().includes('broker')) return `/cluster/${clusterId}/broker/list#brokerId=${item.resName}`;
@@ -73,7 +63,7 @@ const ChangeLog = () => {
<div className="change-log-panel"> <div className="change-log-panel">
<div className="title">历史变更记录</div> <div className="title">历史变更记录</div>
{!loading && !data.length ? ( {!loading && !data.length ? (
renderEmpty() <RenderEmpty message="暂无配置记录" />
) : ( ) : (
<div id="changelog-scroll-box"> <div id="changelog-scroll-box">
<Spin spinning={loading} style={{ paddingLeft: '42%', marginTop: 100 }} /> <Spin spinning={loading} style={{ paddingLeft: '42%', marginTop: 100 }} />

6
km-console/packages/layout-clusters-fe/src/pages/SingleClusterDetail/CheckDetail.tsx
View File

@@ -1,14 +1,11 @@
/* eslint-disable react/display-name */ /* eslint-disable react/display-name */
import { Drawer, Form, Spin, Table, Utils } from 'knowdesign'; import { Drawer, Spin, Table, Utils } from 'knowdesign';
import React, { useEffect, useState, forwardRef, useImperativeHandle } from 'react'; import React, { useEffect, useState, forwardRef, useImperativeHandle } from 'react';
import { useIntl } from 'react-intl';
import { getDetailColumn } from './config'; import { getDetailColumn } from './config';
import API from '../../api'; import API from '../../api';
import { useParams } from 'react-router-dom'; import { useParams } from 'react-router-dom';
const CheckDetail = forwardRef((props: any, ref): JSX.Element => { const CheckDetail = forwardRef((props: any, ref): JSX.Element => {
const intl = useIntl();
const [form] = Form.useForm();
const [visible, setVisible] = useState(false); const [visible, setVisible] = useState(false);
const [loading, setLoading] = useState(false); const [loading, setLoading] = useState(false);
const [data, setData] = useState([]); const [data, setData] = useState([]);
@@ -28,7 +25,6 @@ const CheckDetail = forwardRef((props: any, ref): JSX.Element => {
}; };
const onCancel = () => { const onCancel = () => {
form.resetFields();
setVisible(false); setVisible(false);
}; };

5
km-console/packages/layout-clusters-fe/src/pages/SingleClusterDetail/LeftSider.tsx
View File

@@ -153,7 +153,7 @@ const LeftSider = () => {
<Divider /> <Divider />
<div className="title"> <div className="title">
<div className="name">{renderToolTipValue(clusterInfo?.name, 35)}</div> <div className="name">{renderToolTipValue(clusterInfo?.name, 35)}</div>
{global.hasPermission && global.hasPermission(ClustersPermissionMap.CLUSTER_CHANGE_INFO) ? ( {!loading && global.hasPermission && global.hasPermission(ClustersPermissionMap.CLUSTER_CHANGE_INFO) ? (
<div className="edit-icon-box" onClick={() => setVisible(true)}> <div className="edit-icon-box" onClick={() => setVisible(true)}>
<IconFont className="edit-icon" type="icon-bianji2" /> <IconFont className="edit-icon" type="icon-bianji2" />
</div> </div>
@@ -239,8 +239,7 @@ const LeftSider = () => {
<AccessClusters <AccessClusters
visible={visible} visible={visible}
setVisible={setVisible} setVisible={setVisible}
title={'edit.cluster'} title="edit.cluster"
infoLoading={loading}
afterSubmitSuccess={getPhyClusterInfo} afterSubmitSuccess={getPhyClusterInfo}
clusterInfo={clusterInfo} clusterInfo={clusterInfo}
kafkaVersion={Object.keys(kafkaVersion)} kafkaVersion={Object.keys(kafkaVersion)}

20
km-console/packages/layout-clusters-fe/src/pages/SingleClusterDetail/index.less
View File

@@ -377,26 +377,6 @@
} }
} }
} }
.empty-panel {
margin-top: 96px;
text-align: center;
.img {
width: 51px;
height: 34px;
margin-left: 80px;
margin-bottom: 7px;
background-size: cover;
background-image: url('../../assets/empty.png');
}
.text {
font-size: 10px;
color: #919aac;
line-height: 20px;
}
}
} }
} }
} }