fix: progress bar default open
This commit is contained in:
@@ -1,9 +1,9 @@
|
|||||||
import { Progress, Tooltip } from 'antd';
|
import { Progress, Tooltip } from 'antd';
|
||||||
import React, { memo, useMemo } from 'react';
|
import React, { memo, useEffect, useMemo } from 'react';
|
||||||
|
|
||||||
const RenderProgress = memo(
|
const RenderProgress = memo(
|
||||||
(props: {
|
(props: {
|
||||||
open?: boolean;
|
defaultOpen?: boolean;
|
||||||
percent: number;
|
percent: number;
|
||||||
steps?: number;
|
steps?: number;
|
||||||
download?: boolean;
|
download?: boolean;
|
||||||
@@ -11,7 +11,8 @@ const RenderProgress = memo(
|
|||||||
successPercent?: number;
|
successPercent?: number;
|
||||||
successColor?: string;
|
successColor?: string;
|
||||||
}) => {
|
}) => {
|
||||||
const { open, percent, download, label, successPercent } = props;
|
const { defaultOpen, percent, download, label, successPercent } = props;
|
||||||
|
const [open, setOpen] = React.useState(false);
|
||||||
|
|
||||||
const strokeColor = useMemo(() => {
|
const strokeColor = useMemo(() => {
|
||||||
if (download) {
|
if (download) {
|
||||||
@@ -27,6 +28,10 @@ const RenderProgress = memo(
|
|||||||
return 'var(--ant-color-error)';
|
return 'var(--ant-color-error)';
|
||||||
}, [percent]);
|
}, [percent]);
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
setOpen(defaultOpen || false);
|
||||||
|
}, [defaultOpen]);
|
||||||
|
|
||||||
const renderProgress = useMemo(() => {
|
const renderProgress = useMemo(() => {
|
||||||
return (
|
return (
|
||||||
<Progress
|
<Progress
|
||||||
@@ -59,6 +64,7 @@ const RenderProgress = memo(
|
|||||||
<Tooltip
|
<Tooltip
|
||||||
title={label}
|
title={label}
|
||||||
open={open}
|
open={open}
|
||||||
|
onOpenChange={setOpen}
|
||||||
overlayInnerStyle={{ paddingInline: 12 }}
|
overlayInnerStyle={{ paddingInline: 12 }}
|
||||||
>
|
>
|
||||||
{renderProgress}
|
{renderProgress}
|
||||||
|
|||||||
@@ -188,7 +188,7 @@ const GPUList: React.FC = () => {
|
|||||||
render={(text, record: GPUDeviceItem, index: number) => {
|
render={(text, record: GPUDeviceItem, index: number) => {
|
||||||
return (
|
return (
|
||||||
<ProgressBar
|
<ProgressBar
|
||||||
open={
|
defaultOpen={
|
||||||
index === 0 && dataSource.loadend && extraStatus.firstLoad
|
index === 0 && dataSource.loadend && extraStatus.firstLoad
|
||||||
}
|
}
|
||||||
percent={
|
percent={
|
||||||
|
|||||||
@@ -400,7 +400,7 @@ const Workers: React.FC = () => {
|
|||||||
[{item.index}]
|
[{item.index}]
|
||||||
</span>
|
</span>
|
||||||
<ProgressBar
|
<ProgressBar
|
||||||
open={
|
defaultOpen={
|
||||||
rIndex === 0 &&
|
rIndex === 0 &&
|
||||||
index === 0 &&
|
index === 0 &&
|
||||||
dataSource.loadend &&
|
dataSource.loadend &&
|
||||||
|
|||||||
Reference in New Issue
Block a user