fix(cardpro): Keep actions & search areas mounted on mobile to auto-load RPM/TPM

This commit addresses an issue where RPM and TPM statistics did not load automatically on mobile devices.

Key changes
• Replaced conditional rendering with persistent rendering of `actionsArea` and `searchArea` in `CardPro` and applied the `hidden` CSS class when the sections should be concealed.
• Ensures internal hooks (e.g. `useUsageLogsData`) always run, allowing stats to be fetched without requiring the user to tap “Show Actions”.
• Maintains existing desktop behaviour; only mobile handling is affected.

Files updated
• `web/src/components/common/ui/CardPro.js`

Result
Mobile users now see up-to-date RPM/TPM (and other statistics) immediately after page load, improving usability and consistency with the desktop experience.
This commit is contained in:
t0ng7u
2025-07-19 03:43:35 +08:00
parent 38e72e1af7
commit 635bfd4aba

View File

@@ -122,9 +122,9 @@ const CardPro = ({
)} )}
{/* 操作按钮和搜索表单的容器 */} {/* 操作按钮和搜索表单的容器 */}
{/* 在移动端时根据showMobileActions状态控制显示在桌面端时始终显示 */} <div
{(!isMobile || showMobileActions) && ( className={`flex flex-col gap-2 ${isMobile && !showMobileActions ? 'hidden' : ''}`}
<div className="flex flex-col gap-2"> >
{/* 操作按钮区域 - 用于type1和type3 */} {/* 操作按钮区域 - 用于type1和type3 */}
{(type === 'type1' || type === 'type3') && actionsArea && ( {(type === 'type1' || type === 'type3') && actionsArea && (
<div className="w-full"> <div className="w-full">
@@ -139,7 +139,7 @@ const CardPro = ({
</div> </div>
)} )}
</div> </div>
)}
</div> </div>
); );
}; };