chore: Optimize ui of allocation in activities (#55)

Co-authored-by: yaojiping <yaojiping@infini.ltd>
This commit is contained in:
yaojp123 2024-12-23 14:58:51 +08:00 committed by GitHub
parent 0926005632
commit 370c83b2fe
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
1 changed files with 9 additions and 6 deletions

View File

@ -1,7 +1,8 @@
import moment from "moment"; import moment from "moment";
import { Link } from "umi"; import { Link } from "umi";
import { Icon } from "antd"; import { Button, Icon, Tag } from "antd";
import { useMemo, useState } from "react"; import { useMemo, useState } from "react";
import { formatMessage } from "umi/locale";
export default (props) => { export default (props) => {
const { hit, opers } = props; const { hit, opers } = props;
@ -238,15 +239,17 @@ const ClusterHealthChange = (props) => {
</Link>{" "} </Link>{" "}
<b>{type}</b> from <b>{hit._source.metadata.labels.from}</b> to{" "} <b>{type}</b> from <b>{hit._source.metadata.labels.from}</b> to{" "}
<b>{status}</b>{hasAllocationExplain ? ( <b>{status}</b>{hasAllocationExplain ? (
<Icon <a
style={{ marginLeft: 6, fontSize: 12 }} size="small"
type={active ? "up" : "down"} style={{ marginLeft: 12, cursor: 'pointer' }}
onClick={() => { onClick={() => {
if (hasAllocationExplain) { if (hasAllocationExplain) {
setActive(!active) setActive(!active)
} }
}} }}
/> >
<Icon type={active ? "up-square" : "down-square"}/> {formatMessage({ id: "form.button.detail" })}
</a>
) : null} ) : null}
</span> </span>
) )
@ -264,7 +267,7 @@ const ClusterHealthChange = (props) => {
return active ? ( return active ? (
<div> <div>
<div>{content}</div> <div>{content}</div>
<pre style={{ margin: 0 }}> <pre style={{ margin: 0, fontFamily: `-apple-system, BlinkMacSystemFont, 'Segoe UI', 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Helvetica Neue', Helvetica, Arial, sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol'` }}>
{JSON.stringify(allocationExplain, null, 4)} {JSON.stringify(allocationExplain, null, 4)}
</pre> </pre>
</div> </div>