Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

chore: optimize UI for copying metric requests #155

Merged
merged 2 commits into from
Feb 20, 2025
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions docs/content.en/docs/release-notes/_index.md
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ Information about release notes of INFINI Console is provided here.
- Update agent config with cluster name (#148)
- Optimize UI of histogram and datepicker in discover (#151)
- Support viewing logs for cluster, node, index health change events (#150)
- Optimize UI for copying metric requests (#155)

## 1.28.2 (2025-02-15)

Expand Down
1 change: 1 addition & 0 deletions docs/content.zh/docs/release-notes/_index.md
Original file line number Diff line number Diff line change
Expand Up @@ -24,6 +24,7 @@ title: "版本历史"
- 优化下发给 Agent 的配置,增加集群名称 (#148)
- 优化柱状图和时间选择器的 UI (#151)
- 集群,节点,索引健康状态变更支持查看日志 (#150)
- 优化监控报表里拷贝指标请求的 UI (#155)

## 1.28.2 (2025-02-15)

Expand Down
27 changes: 13 additions & 14 deletions web/src/pages/Platform/Overview/components/MetricChart.jsx
Original file line number Diff line number Diff line change
Expand Up @@ -324,6 +324,19 @@ export default (props) => {

return (
<div key={metricKey} ref={containerRef} className={className} style={style}>
{
metric?.request && (
<CopyToClipboard text={`GET .infini_metrics/_search\n${metric.request}`}>
<Tooltip title={formatMessage({id: "cluster.metrics.request.copy"})}>
<Icon
className="copyReq"
type="copy"
onClick={() => message.success(formatMessage({id: "cluster.metrics.request.copy.success"}))}
/>
</Tooltip>
</CopyToClipboard>
)
}
<Spin spinning={loading}>
<div className={styles.vizChartItemTitle}>
<span>
Expand All @@ -339,20 +352,6 @@ export default (props) => {
</Tooltip>
)
}
{
metric?.request && (
<CopyToClipboard text={`GET .infini_metrics/_search\n${metric.request}`}>
<Tooltip title={formatMessage({id: "cluster.metrics.request.copy"})}>
<Icon
className={styles.copy}
style={{ marginRight: 12 }}
type="copy"
onClick={() => message.success(formatMessage({id: "cluster.metrics.request.copy.success"}))}
/>
</Tooltip>
</CopyToClipboard>
)
}
<Tooltip title={formatMessage({id: "form.button.refresh"})}>
<Icon className={styles.copy} type="sync" onClick={() => fetchData(...observerRef.current.deps, true)}/>
</Tooltip>
Expand Down
22 changes: 22 additions & 0 deletions web/src/pages/Platform/Overview/components/Metrics.scss
Original file line number Diff line number Diff line change
Expand Up @@ -25,6 +25,28 @@
}
}

.vizChartContainer{
position: relative;
.copyReq {
cursor: pointer;
position: absolute;
display: none;
right: 3px;
bottom: 0px;
width: 24px;
height: 24px;
z-index: 11;
&:hover {
color: #1890ff;
}
}
&:hover {
.copyReq {
display: block;
}
}
}

.vizChartItem {
background: white !important;

Expand Down
Loading