diff --git a/km-console/packages/layout-clusters-fe/src/pages/TopicList/ExpandPartition.tsx b/km-console/packages/layout-clusters-fe/src/pages/TopicList/ExpandPartition.tsx index b17a41ab..bf87fb59 100644 --- a/km-console/packages/layout-clusters-fe/src/pages/TopicList/ExpandPartition.tsx +++ b/km-console/packages/layout-clusters-fe/src/pages/TopicList/ExpandPartition.tsx @@ -1,9 +1,10 @@ import React, { useEffect, useState } from 'react'; import { useParams } from 'react-router-dom'; -import { AppContainer, Button, Divider, Drawer, Form, InputNumber, notification, SingleChart, Space, Spin, Utils } from 'knowdesign'; +import { AppContainer, Button, Divider, Drawer, Form, InputNumber, SingleChart, Space, Spin, Tooltip, Utils } from 'knowdesign'; +import notification from '@src/components/Notification'; import Api, { MetricType } from '@src/api/index'; -import { getBasicChartConfig, getUnit } from '@src/constants/chartConfig'; -import { formatChartData, MetricDefaultChartDataType } from '@src/constants/chartConfig'; +import { getBasicChartConfig, getDataUnit } from '@src/constants/chartConfig'; +import { formatChartData, OriginMetricData } from '@src/constants/chartConfig'; const ExpandPartition = (props: { record: any; onConfirm: () => void }) => { const [global] = AppContainer.useGlobalValue(); @@ -60,7 +61,7 @@ const ExpandPartition = (props: { record: any; onConfirm: () => void }) => { ); const empiricalMinValue = 10 * 1024 * record.partitionNum; - const lines = data.map((metric: MetricDefaultChartDataType) => { + const lines = data.map((metric: OriginMetricData) => { const child = metric.metricLines[0]; child.name = metric.metricName; return child; @@ -87,7 +88,7 @@ const ExpandPartition = (props: { record: any; onConfirm: () => void }) => { }); }, [expandPartitionsVisible]); const formattedMinBytesInOut = (v: number) => { - const [unit, size] = getUnit(v); + const [unit, size] = getDataUnit['Memory'](v); return `${(v / size).toFixed(2)}${unit}/s`; }; return ( @@ -130,11 +131,15 @@ const ExpandPartition = (props: { record: any; onConfirm: () => void }) => {
Topic名称 : - {record.topicName} + + {record.topicName} +
描述 : - {record.description} + + {record.description || '-'} +
diff --git a/km-console/packages/layout-clusters-fe/src/pages/TopicList/index.less b/km-console/packages/layout-clusters-fe/src/pages/TopicList/index.less index 453363c6..0fa44077 100644 --- a/km-console/packages/layout-clusters-fe/src/pages/TopicList/index.less +++ b/km-console/packages/layout-clusters-fe/src/pages/TopicList/index.less @@ -142,6 +142,7 @@ color: #74788d; } .desc-field { + flex-shrink: 0; width: 34px; } .val, @@ -149,17 +150,28 @@ color: #495057; letter-spacing: 0; font-weight: 400; - } - .val { - width: 105px; margin-left: 12px; } - .desc-val { - width: 809px; - height: 36px; + .val { + max-width: 208px; overflow: hidden; - -webkit-box-orient: vertical; + text-overflow: ellipsis; + white-space: nowrap; + } + .desc-val { + height: 36px; + display: -webkit-box; + overflow: hidden; + text-overflow: ellipsis; -webkit-line-clamp: 2; + -webkit-box-orient: vertical; + word-break: break-all; + } + &:first-child { + margin-right: 40px; + } + &:last-child { + flex: 1; } } }