feat: 涨停分析/股票详情弹窗 添加风险提示

This commit is contained in:
zdl
2025-10-29 19:08:51 +08:00
parent ac7a6991bc
commit ce1bf29270
3 changed files with 31 additions and 1 deletions

View File

@@ -38,6 +38,7 @@ import {
} from '@chakra-ui/react'; } from '@chakra-ui/react';
import { getFormattedTextProps } from '../../../utils/textUtils'; import { getFormattedTextProps } from '../../../utils/textUtils';
import { ExternalLinkIcon } from '@chakra-ui/icons'; import { ExternalLinkIcon } from '@chakra-ui/icons';
import RiskDisclaimer from '../../../components/RiskDisclaimer';
import './WordCloud.css'; import './WordCloud.css';
import { import {
BarChart, Bar, BarChart, Bar,
@@ -598,6 +599,9 @@ export const StockDetailModal = ({ isOpen, onClose, selectedStock }) => {
))} ))}
</Wrap> </Wrap>
</Box> </Box>
{/* 风险提示 */}
<RiskDisclaimer variant="default" />
</VStack> </VStack>
</ModalBody> </ModalBody>
<ModalFooter> <ModalFooter>

View File

@@ -29,7 +29,7 @@ import {
import { StarIcon, ViewIcon, TimeIcon, ChevronDownIcon, ChevronUpIcon } from '@chakra-ui/icons'; import { StarIcon, ViewIcon, TimeIcon, ChevronDownIcon, ChevronUpIcon } from '@chakra-ui/icons';
import { getFormattedTextProps } from '../../../utils/textUtils'; import { getFormattedTextProps } from '../../../utils/textUtils';
const SectorDetails = ({ sortedSectors, totalStocks }) => { const SectorDetails = ({ sortedSectors, totalStocks, onStockClick }) => {
// 使用 useRef 来维持展开状态,避免重新渲染时重置 // 使用 useRef 来维持展开状态,避免重新渲染时重置
const expandedSectorsRef = useRef([]); const expandedSectorsRef = useRef([]);
const [expandedSectors, setExpandedSectors] = useState([]); const [expandedSectors, setExpandedSectors] = useState([]);
@@ -194,6 +194,8 @@ const SectorDetails = ({ sortedSectors, totalStocks }) => {
bg: 'gray.50' bg: 'gray.50'
}} }}
transition="all 0.2s" transition="all 0.2s"
cursor="pointer"
onClick={() => onStockClick && onStockClick(stock)}
> >
<Flex justify="space-between" align="start"> <Flex justify="space-between" align="start">
<VStack align="start" spacing={2} flex={1}> <VStack align="start" spacing={2} flex={1}>

View File

@@ -60,6 +60,8 @@ export default function LimitAnalyse() {
const [wordCloudData, setWordCloudData] = useState([]); const [wordCloudData, setWordCloudData] = useState([]);
const [searchResults, setSearchResults] = useState(null); const [searchResults, setSearchResults] = useState(null);
const [isSearchOpen, setIsSearchOpen] = useState(false); const [isSearchOpen, setIsSearchOpen] = useState(false);
const [selectedStock, setSelectedStock] = useState(null);
const [isStockDetailOpen, setIsStockDetailOpen] = useState(false);
const toast = useToast(); const toast = useToast();
@@ -243,6 +245,20 @@ export default function LimitAnalyse() {
} }
}; };
// 处理股票点击
const handleStockClick = (stock) => {
setSelectedStock(stock);
setIsStockDetailOpen(true);
// 🎯 追踪股票详情查看
trackStockDetailViewed(stock.scode, stock.sname, 'sector_details');
};
// 关闭股票详情弹窗
const handleCloseStockDetail = () => {
setIsStockDetailOpen(false);
setSelectedStock(null);
};
// 处理板块数据排序 // 处理板块数据排序
const getSortedSectorData = () => { const getSortedSectorData = () => {
if (!dailyData?.sector_data) return []; if (!dailyData?.sector_data) return [];
@@ -470,6 +486,7 @@ export default function LimitAnalyse() {
<SectorDetails <SectorDetails
sortedSectors={getSortedSectorData()} sortedSectors={getSortedSectorData()}
totalStocks={dailyData?.total_stocks || 0} totalStocks={dailyData?.total_stocks || 0}
onStockClick={handleStockClick}
/> />
</Box> </Box>
)} )}
@@ -496,6 +513,13 @@ export default function LimitAnalyse() {
onStockClick={() => {}} onStockClick={() => {}}
/> />
{/* 股票详情弹窗 */}
<StockDetailModal
isOpen={isStockDetailOpen}
onClose={handleCloseStockDetail}
selectedStock={selectedStock}
/>
{/* 浮动按钮 */} {/* 浮动按钮 */}
<Box position="fixed" bottom={8} right={8} zIndex={1000}> <Box position="fixed" bottom={8} right={8} zIndex={1000}>
<VStack spacing={3}> <VStack spacing={3}>