MarketDataView (股票行情): - 初始只加载 summary + tradeData(2个接口) - funding/bigDeal/unusual/pledge 数据在切换 Tab 时按需加载 - 新增 loadDataByType 方法支持懒加载 FinancialPanorama (财务全景): - 初始只加载 stockInfo + metrics + comparison + mainBusiness(4个接口) - 从9个接口优化到4个接口 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
142 lines
3.6 KiB
TypeScript
142 lines
3.6 KiB
TypeScript
/**
|
||
* Company 页面配置
|
||
* - 黑金主题配置
|
||
* - Tab 配置
|
||
*/
|
||
|
||
import { lazy } from 'react';
|
||
import { Building2, Brain, TrendingUp, Wallet, FileBarChart, Newspaper } from 'lucide-react';
|
||
import type { CompanyTheme, TabConfig } from './types';
|
||
|
||
// ============================================
|
||
// 黑金主题配置
|
||
// ============================================
|
||
|
||
export const THEME: CompanyTheme = {
|
||
// 背景色
|
||
bg: '#1A1A2E',
|
||
cardBg: '#16213E',
|
||
|
||
// 金色系
|
||
gold: '#D4AF37',
|
||
goldLight: '#F0D78C',
|
||
goldDark: '#B8960C',
|
||
|
||
// 文字色
|
||
textPrimary: '#FFFFFF',
|
||
textSecondary: 'rgba(255, 255, 255, 0.7)',
|
||
textMuted: 'rgba(255, 255, 255, 0.5)',
|
||
|
||
// 边框色
|
||
border: 'rgba(212, 175, 55, 0.2)',
|
||
borderHover: 'rgba(212, 175, 55, 0.4)',
|
||
|
||
// 涨跌色
|
||
positive: '#EF4444',
|
||
negative: '#22C55E',
|
||
positiveBg: 'rgba(239, 68, 68, 0.2)',
|
||
negativeBg: 'rgba(34, 197, 94, 0.2)',
|
||
};
|
||
|
||
// ============================================
|
||
// Tab 懒加载组件(带 webpack chunk 命名)
|
||
// ============================================
|
||
|
||
const CompanyOverview = lazy(() =>
|
||
import(/* webpackChunkName: "company-overview" */ './components/CompanyOverview')
|
||
);
|
||
const DeepAnalysis = lazy(() =>
|
||
import(/* webpackChunkName: "company-deep-analysis" */ './components/DeepAnalysis')
|
||
);
|
||
const MarketDataView = lazy(() =>
|
||
import(/* webpackChunkName: "company-market-data" */ './components/MarketDataView')
|
||
);
|
||
const FinancialPanorama = lazy(() =>
|
||
import(/* webpackChunkName: "company-financial" */ './components/FinancialPanorama')
|
||
);
|
||
const ForecastReport = lazy(() =>
|
||
import(/* webpackChunkName: "company-forecast" */ './components/ForecastReport')
|
||
);
|
||
const DynamicTracking = lazy(() =>
|
||
import(/* webpackChunkName: "company-tracking" */ './components/DynamicTracking')
|
||
);
|
||
|
||
// ============================================
|
||
// Tab 配置
|
||
// ============================================
|
||
|
||
export const TAB_CONFIG: TabConfig[] = [
|
||
{
|
||
key: 'overview',
|
||
name: '公司概览',
|
||
icon: Building2,
|
||
component: CompanyOverview,
|
||
},
|
||
{
|
||
key: 'analysis',
|
||
name: '深度分析',
|
||
icon: Brain,
|
||
component: DeepAnalysis,
|
||
},
|
||
{
|
||
key: 'market',
|
||
name: '股票行情',
|
||
icon: TrendingUp,
|
||
component: MarketDataView,
|
||
},
|
||
{
|
||
key: 'financial',
|
||
name: '财务全景',
|
||
icon: Wallet,
|
||
component: FinancialPanorama,
|
||
},
|
||
{
|
||
key: 'forecast',
|
||
name: '盈利预测',
|
||
icon: FileBarChart,
|
||
component: ForecastReport,
|
||
},
|
||
{
|
||
key: 'tracking',
|
||
name: '动态跟踪',
|
||
icon: Newspaper,
|
||
component: DynamicTracking,
|
||
},
|
||
];
|
||
|
||
// ============================================
|
||
// 搜索框样式配置(Ant Design AutoComplete)
|
||
// ============================================
|
||
|
||
export const getSearchBoxStyles = (theme: CompanyTheme) => ({
|
||
'.ant-select-selector': {
|
||
backgroundColor: `${theme.bg} !important`,
|
||
borderColor: `${theme.border} !important`,
|
||
borderRadius: '8px !important',
|
||
height: '40px !important',
|
||
'&:hover': {
|
||
borderColor: `${theme.borderHover} !important`,
|
||
},
|
||
},
|
||
'.ant-select-selection-search-input': {
|
||
color: `${theme.textPrimary} !important`,
|
||
height: '38px !important',
|
||
},
|
||
'.ant-select-selection-placeholder': {
|
||
color: `${theme.textMuted} !important`,
|
||
},
|
||
'.ant-select-dropdown': {
|
||
backgroundColor: `${theme.cardBg} !important`,
|
||
borderColor: `${theme.border} !important`,
|
||
},
|
||
'.ant-select-item': {
|
||
color: `${theme.textPrimary} !important`,
|
||
'&:hover': {
|
||
backgroundColor: `${theme.bg} !important`,
|
||
},
|
||
},
|
||
'.ant-select-item-option-selected': {
|
||
backgroundColor: 'rgba(212, 175, 55, 0.2) !important',
|
||
},
|
||
});
|