diff --git a/src/views/Community/components/DynamicNewsDetail/DynamicNewsDetailPanel.js b/src/views/Community/components/DynamicNewsDetail/DynamicNewsDetailPanel.js
index 84956653..8f7d531a 100644
--- a/src/views/Community/components/DynamicNewsDetail/DynamicNewsDetailPanel.js
+++ b/src/views/Community/components/DynamicNewsDetail/DynamicNewsDetailPanel.js
@@ -31,6 +31,7 @@ import HistoricalEvents from '../../../EventDetail/components/HistoricalEvents';
import TransmissionChainAnalysis from '../../../EventDetail/components/TransmissionChainAnalysis';
import SubscriptionBadge from '../../../../components/SubscriptionBadge';
import SubscriptionUpgradeModal from '../../../../components/SubscriptionUpgradeModal';
+import { PROFESSIONAL_COLORS } from '../../../../constants/professionalTheme';
/**
* 动态新闻详情面板主组件
@@ -41,9 +42,9 @@ import SubscriptionUpgradeModal from '../../../../components/SubscriptionUpgrade
const DynamicNewsDetailPanel = ({ event, showHeader = true }) => {
const dispatch = useDispatch();
const { user } = useAuth();
- const cardBg = useColorModeValue('white', 'gray.800');
- const borderColor = useColorModeValue('gray.200', 'gray.700');
- const textColor = useColorModeValue('gray.600', 'gray.400');
+ const cardBg = PROFESSIONAL_COLORS.background.card;
+ const borderColor = PROFESSIONAL_COLORS.border.default;
+ const textColor = PROFESSIONAL_COLORS.text.secondary;
const toast = useToast();
// 获取用户会员等级(修复:字段名从 subscription_tier 改为 subscription_type)
@@ -204,9 +205,17 @@ const DynamicNewsDetailPanel = ({ event, showHeader = true }) => {
// 🎯 加载事件详情(增加浏览量)
loadEventDetail();
- // 相关股票默认收起
- setIsStocksOpen(false);
- setHasLoadedStocks(false);
+ // 相关股票默认展开(有权限时)
+ if (canAccessStocks) {
+ setIsStocksOpen(true);
+ if (!hasLoadedStocks) {
+ loadStocksData();
+ setHasLoadedStocks(true);
+ }
+ } else {
+ setIsStocksOpen(false);
+ setHasLoadedStocks(false);
+ }
setIsConceptsOpen(false);
setIsHistoricalOpen(false);
diff --git a/src/views/Community/components/EventCard/KeywordsCarousel.js b/src/views/Community/components/EventCard/KeywordsCarousel.js
index 5bb46429..a41e7c6f 100644
--- a/src/views/Community/components/EventCard/KeywordsCarousel.js
+++ b/src/views/Community/components/EventCard/KeywordsCarousel.js
@@ -1,100 +1,83 @@
// src/views/Community/components/EventCard/KeywordsCarousel.js
-// Keywords标签梦幻淡入淡出轮播组件
-import React, { useState, useEffect } from 'react';
-import { Box, Text, useColorModeValue } from '@chakra-ui/react';
-import { motion, AnimatePresence } from 'framer-motion';
-
-const MotionBox = motion(Box);
+// Keywords标签组件(点击切换)
+import React, { useState } from 'react';
+import { Box, Text, Tooltip } from '@chakra-ui/react';
+import { PROFESSIONAL_COLORS } from '../../../../constants/professionalTheme';
/**
- * Keywords标签梦幻轮播组件(单个显示,淡入淡出)
+ * Keywords标签组件(点击切换下一个)
* @param {Array} keywords - 关键词数组
- * @param {number} interval - 轮播间隔(毫秒,默认4000ms)
* @param {Function} onKeywordClick - 关键词点击回调
*/
const KeywordsCarousel = ({
keywords = [],
- interval = 4000,
onKeywordClick
}) => {
const [currentIndex, setCurrentIndex] = useState(0);
- const [isPaused, setIsPaused] = useState(false);
-
- // 颜色配置 - 梦幻渐变效果
- const textColor = useColorModeValue(
- 'linear(to-r, purple.400, pink.400, blue.400)',
- 'linear(to-r, purple.300, pink.300, blue.300)'
- );
- const hoverBg = useColorModeValue('rgba(159, 122, 234, 0.1)', 'rgba(159, 122, 234, 0.15)');
// 如果没有keywords,不渲染
if (!keywords || keywords.length === 0) {
return null;
}
- // 自动轮播
- useEffect(() => {
- if (isPaused || keywords.length <= 1) return;
-
- const timer = setInterval(() => {
- setCurrentIndex((prev) => (prev + 1) % keywords.length);
- }, interval);
-
- return () => clearInterval(timer);
- }, [isPaused, keywords.length, interval]);
-
const currentKeyword = keywords[currentIndex];
+ // 点击切换到下一个关键词
+ const handleClick = (e) => {
+ e.stopPropagation();
+
+ // 切换到下一个
+ const nextIndex = (currentIndex + 1) % keywords.length;
+ setCurrentIndex(nextIndex);
+
+ // 触发回调
+ if (onKeywordClick) {
+ onKeywordClick(keywords[nextIndex]);
+ }
+ };
+
return (
- setIsPaused(true)}
- onMouseLeave={() => setIsPaused(false)}
- pointerEvents="auto"
- zIndex={1}
+ 1
+ ? `点击切换下一个标签 (${currentIndex + 1}/${keywords.length})`
+ : '事件标签'}
+ placement="top"
+ hasArrow
+ bg="rgba(20, 20, 20, 0.95)"
+ color={PROFESSIONAL_COLORS.gold[500]}
+ fontSize="sm"
>
-
- {
- e.stopPropagation();
- onKeywordClick?.(currentKeyword);
- }}
- px={3}
- py={1.5}
- borderRadius="full"
- bg="transparent"
- _hover={{
- bg: hoverBg,
- transform: 'scale(1.05)',
- }}
- transition="background 0.3s, transform 0.2s"
+ 1 ? "pointer" : "default"}
+ onClick={keywords.length > 1 ? handleClick : undefined}
+ px={3}
+ py={1.5}
+ borderRadius="full"
+ bg="transparent"
+ transition="all 0.3s ease"
+ _hover={keywords.length > 1 ? {
+ bg: 'rgba(255, 195, 0, 0.15)',
+ transform: 'translateY(-50%) scale(1.05)',
+ } : {}}
+ >
+
-
- {currentKeyword}
-
-
-
-
+ {currentKeyword}
+
+
+
);
};
diff --git a/src/views/Community/components/HotEventsSection.js b/src/views/Community/components/HotEventsSection.js
index 3ba199b6..38f498d4 100644
--- a/src/views/Community/components/HotEventsSection.js
+++ b/src/views/Community/components/HotEventsSection.js
@@ -12,6 +12,7 @@ import {
useColorModeValue
} from '@chakra-ui/react';
import HotEvents from './HotEvents';
+import { PROFESSIONAL_COLORS } from '../../../constants/professionalTheme';
/**
* 热点事件区域组件
@@ -19,7 +20,8 @@ import HotEvents from './HotEvents';
* @param {Function} onEventClick - 事件点击追踪回调
*/
const HotEventsSection = ({ events, onEventClick }) => {
- const cardBg = useColorModeValue('white', 'gray.800');
+ const cardBg = PROFESSIONAL_COLORS.background.card;
+ const borderColor = PROFESSIONAL_COLORS.border.default;
const [currentPage, setCurrentPage] = useState(1);
const [totalPages, setTotalPages] = useState(1);
@@ -39,9 +41,9 @@ const HotEventsSection = ({ events, onEventClick }) => {
mt={6}
mb={8}
bg={cardBg}
- boxShadow="lg"
+ boxShadow="0 4px 12px rgba(0, 0, 0, 0.3), 0 0 20px rgba(255, 195, 0, 0.1)"
borderWidth="1px"
- borderColor={useColorModeValue('gray.200', 'gray.700')}
+ borderColor={borderColor}
position="relative"
zIndex={1}
animation="fadeInUp 0.8s ease-out 0.4s both"
@@ -56,20 +58,21 @@ const HotEventsSection = ({ events, onEventClick }) => {
🔥 热点事件
-
+
展示最近5天内涨幅最高的事件,助您把握市场热点
{/* 页码指示器 */}
{totalPages > 1 && (