diff --git a/web/src/components/AutoTextEllipsis/index.js b/web/src/components/AutoTextEllipsis/index.js new file mode 100644 index 00000000..63f240a5 --- /dev/null +++ b/web/src/components/AutoTextEllipsis/index.js @@ -0,0 +1,54 @@ +import { Tooltip } from "antd"; +import { useEffect, useRef, useState } from "react"; + +export default (props) => { + const { height = 21, width = '100%', children, showTooltip = true } = props; + const [textHeight, setTextHeight] = useState(height); + const textRef = useRef(null); + + const handleResize = () => { + if (textRef.current) { + setTextHeight(textRef.current.offsetHeight); + } + }; + + useEffect(() => { + const resizeObserver = new ResizeObserver(entries => { + entries.forEach(entry => { + const { width, height } = entry.contentRect; + setTextHeight(height); + }); + }); + + if (textRef.current && showTooltip) { + resizeObserver.observe(textRef.current); + } + + return () => { + if (textRef.current && showTooltip) { + resizeObserver.unobserve(textRef.current); + } + }; + }, [showTooltip]); + + return ( +
e.stopPropagation()}> +
+ {children} +
+ { + showTooltip && textHeight > height ? ( + +
+ {children} +
+ + ) : ( +
+ {children} +
+ ) + } +
+ ) +} \ No newline at end of file diff --git a/web/src/components/infini/IconText.jsx b/web/src/components/infini/IconText.jsx index c5fd13d2..c641027c 100644 --- a/web/src/components/infini/IconText.jsx +++ b/web/src/components/infini/IconText.jsx @@ -8,7 +8,7 @@ export default ({ icon, text }) => { }} > {icon} - {text} + {text} ); }; diff --git a/web/src/models/global.js b/web/src/models/global.js index 0f9fbb12..6a20e040 100644 --- a/web/src/models/global.js +++ b/web/src/models/global.js @@ -256,7 +256,6 @@ export default { *fetchConsoleInfo(_, { call, put }) { const data = yield call(queryConsoleInfo); - console.log(data?.application); if (data && data.hasOwnProperty("application")&& data?.application.hasOwnProperty("version")) { const localVersionInfoVal = localStorage.getItem(COUSOLE_VERSION_KEY); localStorage.setItem(COUSOLE_VERSION_KEY, JSON.stringify(data?.application?.version)); diff --git a/web/src/pages/DataManagement/Index.js b/web/src/pages/DataManagement/Index.js index 0c9b7074..9df70041 100644 --- a/web/src/pages/DataManagement/Index.js +++ b/web/src/pages/DataManagement/Index.js @@ -34,6 +34,7 @@ import { isMatch, sorter } from "@/utils/utils"; import { hasAuthority } from "@/utils/authority"; import DeleteIndexModal from "./components/DeleteIndexModal"; import IconText from "@/components/infini/IconText"; +import AutoTextEllipsis from "@/components/AutoTextEllipsis"; const { Search } = Input; @@ -185,7 +186,9 @@ class Index extends PureComponent { render: (text, record) => ( } - text={{text}} + text={ + {text} + } /> ), sorter: (a, b) => sorter.string(a, b, "index"), @@ -227,6 +230,7 @@ class Index extends PureComponent { }, { title: formatMessage({ id: "table.field.actions" }), + width: 116, render: (text, record) => ( - {text} + {text} } /> diff --git a/web/src/pages/Platform/Overview/Cluster/Monitor/nodes.jsx b/web/src/pages/Platform/Overview/Cluster/Monitor/nodes.jsx index d633c2c8..555dfc52 100644 --- a/web/src/pages/Platform/Overview/Cluster/Monitor/nodes.jsx +++ b/web/src/pages/Platform/Overview/Cluster/Monitor/nodes.jsx @@ -12,6 +12,7 @@ import { formatter } from "@/utils/format"; import { formatTimeRange } from "@/lib/elasticsearch/util"; import moment from "moment"; import IconText from "@/components/infini/IconText"; +import AutoTextEllipsis from "@/components/AutoTextEllipsis"; const { Search } = Input; const InputGroup = Input.Group; @@ -117,7 +118,7 @@ export default ({ record?.name }"}`} > - {text} + {text} } /> diff --git a/web/src/pages/Platform/Overview/Indices/Monitor/shards.jsx b/web/src/pages/Platform/Overview/Indices/Monitor/shards.jsx index 274ae187..55f65e00 100644 --- a/web/src/pages/Platform/Overview/Indices/Monitor/shards.jsx +++ b/web/src/pages/Platform/Overview/Indices/Monitor/shards.jsx @@ -147,7 +147,7 @@ export default ({ record?.node }"}`} > - {text} + {text} } /> diff --git a/web/src/pages/Platform/Overview/Node/Monitor/shards.jsx b/web/src/pages/Platform/Overview/Node/Monitor/shards.jsx index 5b0beb4b..98e25ca1 100644 --- a/web/src/pages/Platform/Overview/Node/Monitor/shards.jsx +++ b/web/src/pages/Platform/Overview/Node/Monitor/shards.jsx @@ -97,7 +97,7 @@ export default ({ clusterID, clusterName, nodeID, timeRange, bucketSize }) => { timeRange ))},"timeInterval":"${bucketSize}","cluster_name":"${clusterName}"}`} > - {text} + {text} } />