refactor(Company): 统一所有 Tab 的 loading 状态组件
- 创建共享的 LoadingState 组件(黑金主题) - DeepAnalysisTab: 使用统一 LoadingState 替换蓝色 Spinner - FinancialPanorama: 使用 LoadingState 替换 Skeleton - MarketDataView: 使用 LoadingState 替换自定义 Spinner - ForecastReport: 使用 LoadingState 替换 Skeleton 骨架屏 所有一级 Tab 现在使用一致的金色 Spinner + 加载提示文案 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
44
src/views/Company/components/LoadingState.tsx
Normal file
44
src/views/Company/components/LoadingState.tsx
Normal file
@@ -0,0 +1,44 @@
|
||||
// src/views/Company/components/LoadingState.tsx
|
||||
// 统一的加载状态组件 - 黑金主题
|
||||
|
||||
import React from "react";
|
||||
import { Center, VStack, Spinner, Text } from "@chakra-ui/react";
|
||||
|
||||
// 黑金主题配置
|
||||
const THEME = {
|
||||
gold: "#D4AF37",
|
||||
textSecondary: "gray.400",
|
||||
};
|
||||
|
||||
interface LoadingStateProps {
|
||||
message?: string;
|
||||
height?: string;
|
||||
}
|
||||
|
||||
/**
|
||||
* 统一的加载状态组件(黑金主题)
|
||||
*
|
||||
* 用于所有一级 Tab 的 loading 状态展示
|
||||
*/
|
||||
const LoadingState: React.FC<LoadingStateProps> = ({
|
||||
message = "加载中...",
|
||||
height = "300px",
|
||||
}) => {
|
||||
return (
|
||||
<Center h={height}>
|
||||
<VStack spacing={4}>
|
||||
<Spinner
|
||||
size="xl"
|
||||
color={THEME.gold}
|
||||
thickness="4px"
|
||||
speed="0.65s"
|
||||
/>
|
||||
<Text fontSize="sm" color={THEME.textSecondary}>
|
||||
{message}
|
||||
</Text>
|
||||
</VStack>
|
||||
</Center>
|
||||
);
|
||||
};
|
||||
|
||||
export default LoadingState;
|
||||
Reference in New Issue
Block a user