diff --git a/app/components/GroupSummary.jsx b/app/components/GroupSummary.jsx index 706d91b..3626869 100644 --- a/app/components/GroupSummary.jsx +++ b/app/components/GroupSummary.jsx @@ -8,6 +8,8 @@ function CountUp({ value, prefix = '', suffix = '', decimals = 2, className = '' const [displayValue, setDisplayValue] = useState(value); const previousValue = useRef(value); const isFirstChange = useRef(true); + const rafIdRef = useRef(null); + const displayValueRef = useRef(value); useEffect(() => { if (previousValue.current === value) return; @@ -15,13 +17,14 @@ function CountUp({ value, prefix = '', suffix = '', decimals = 2, className = '' if (isFirstChange.current) { isFirstChange.current = false; previousValue.current = value; + displayValueRef.current = value; setDisplayValue(value); return; } - const start = previousValue.current; + const start = displayValueRef.current; const end = value; - const duration = 400; + const duration = 300; const startTime = performance.now(); const animate = (currentTime) => { @@ -29,16 +32,25 @@ function CountUp({ value, prefix = '', suffix = '', decimals = 2, className = '' const progress = Math.min(elapsed / duration, 1); const ease = 1 - Math.pow(1 - progress, 4); const current = start + (end - start) * ease; + displayValueRef.current = current; setDisplayValue(current); if (progress < 1) { - requestAnimationFrame(animate); + rafIdRef.current = requestAnimationFrame(animate); } else { previousValue.current = value; + rafIdRef.current = null; } }; - requestAnimationFrame(animate); + rafIdRef.current = requestAnimationFrame(animate); + + return () => { + if (rafIdRef.current != null) { + cancelAnimationFrame(rafIdRef.current); + rafIdRef.current = null; + } + }; }, [value]); return ( diff --git a/app/components/TradeModal.jsx b/app/components/TradeModal.jsx index 024d26b..da3105e 100644 --- a/app/components/TradeModal.jsx +++ b/app/components/TradeModal.jsx @@ -202,7 +202,7 @@ export default function TradeModal({ type, fund, holding, onClose, onConfirm, pe }; const isValid = isBuy - ? (!!amount && !!feeRate && !!date && calcShare !== null && !loadingBuyMeta && (parseFloat(amount) || 0) >= (Number(minBuyAmount) || 0)) + ? (!!amount && !!feeRate && !!date && calcShare !== null && !loadingBuyMeta) : (!!share && !!date); const handleSetShareFraction = (fraction) => { @@ -434,9 +434,7 @@ export default function TradeModal({ type, fund, holding, onClose, onConfirm, pe
0 && (parseFloat(amount) || 0) < Number(minBuyAmount))) - ? '1px solid var(--danger)' - : '1px solid var(--border)', + border: !amount ? '1px solid var(--danger)' : '1px solid var(--border)', borderRadius: 12 }} > @@ -444,15 +442,10 @@ export default function TradeModal({ type, fund, holding, onClose, onConfirm, pe value={amount} onChange={setAmount} step={100} - min={Number(minBuyAmount) || 0} - placeholder={(Number(minBuyAmount) || 0) > 0 ? `最少 ¥${Number(minBuyAmount)},请输入加仓金额` : '请输入加仓金额'} + min={0} + placeholder="请输入加仓金额" />
- {(Number(minBuyAmount) || 0) > 0 && ( -
- 最小加仓金额:¥{Number(minBuyAmount)} -
- )}