vf/vf_react
4
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

update pay ui

Browse Source
This commit is contained in:
zzlgreat
2025-12-10 12:22:40 +08:00
parent 92458a8705
commit 1adbeda168
4 changed files with 197 additions and 120 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
src/views/StockOverview/components/FlexScreen/index.tsx
View File

@@ -209,11 +209,14 @@ const FlexScreen: React.FC = () => {
(security: SearchResultItem | WatchlistItem): void => {
const code = 'stock_code' in security ? security.stock_code : security.code;
const name = 'stock_name' in security ? security.stock_name : security.name;
const isIndex =
security.isIndex || code.startsWith('000') || code.startsWith('399');
// 优先使用 API 返回的 isIndex 字段
const isIndex = security.isIndex === true;
// 检查是否已存在
if (watchlist.some(item => item.code === code)) {
// 生成唯一标识（带后缀的完整代码）
const fullCode = getFullCode(code, isIndex);
// 检查是否已存在（使用带后缀的代码比较，避免上证指数和平安银行冲突）
if (watchlist.some(item => getFullCode(item.code, item.isIndex) === fullCode)) {
toast({
title: '已在自选列表中',
status: 'info',
@@ -227,7 +230,7 @@ const FlexScreen: React.FC = () => {
setWatchlist(prev => [...prev, { code, name, isIndex }]);
toast({
title: `已添加 ${name}`,
title: `已添加 ${name}${isIndex ? '（指数）' : ''}`,
status: 'success',
duration: 2000,
isClosable: true,
@@ -397,7 +400,7 @@ const FlexScreen: React.FC = () => {
<List spacing={0}>
{searchResults.map((stock, index) => (
<ListItem
key={stock.stock_code}
key={`${stock.stock_code}-${stock.isIndex ? 'index' : 'stock'}`}
px={4}
py={2}
cursor="pointer"
@@ -408,9 +411,18 @@ const FlexScreen: React.FC = () => {
>
<HStack justify="space-between">
<VStack align="start" spacing={0}>
<Text fontWeight="medium" color={textColor}>
{stock.stock_name}
</Text>
<HStack spacing={2}>
<Text fontWeight="medium" color={textColor}>
{stock.stock_name}
</Text>
<Badge
colorScheme={stock.isIndex ? 'purple' : 'blue'}
fontSize="xs"
variant="subtle"
>
{stock.isIndex ? '指数' : '股票'}
</Badge>
</HStack>
<Text fontSize="xs" color={subTextColor}>
{stock.stock_code}
</Text>

106
src/views/StockOverview/components/HotspotOverview/components/ConceptAlertList.js
View File

@@ -112,29 +112,29 @@ const AlertCard = ({ alert, isExpanded, onToggle, stocks, loadingStocks }) => {
{getAlertTypeLabel(alert.alert_type)}
</Badge>
{/* 确认率 */}
{isV2 && alert.confirm_ratio !== undefined && (
{isV2 && alert.confirm_ratio != null && (
<HStack spacing={1}>
<Box w="30px" h="4px" bg="gray.200" borderRadius="full" overflow="hidden">
<Box
w={`${alert.confirm_ratio * 100}%`}
w={`${(alert.confirm_ratio || 0) * 100}%`}
h="100%"
bg={alert.confirm_ratio >= 0.8 ? 'green.500' : 'orange.500'}
bg={(alert.confirm_ratio || 0) >= 0.8 ? 'green.500' : 'orange.500'}
/>
</Box>
<Text>{Math.round(alert.confirm_ratio * 100)}%</Text>
<Text>{Math.round((alert.confirm_ratio || 0) * 100)}%</Text>
</HStack>
)}
</HStack>
{/* Alpha + Z-Score 简化显示 */}
<HStack spacing={3}>
{alert.alpha !== undefined && (
<Text color={alert.alpha >= 0 ? 'red.500' : 'green.500'} fontWeight="medium">
α {alert.alpha >= 0 ? '+' : ''}{alert.alpha.toFixed(2)}%
{alert.alpha != null && (
<Text color={(alert.alpha || 0) >= 0 ? 'red.500' : 'green.500'} fontWeight="medium">
α {(alert.alpha || 0) >= 0 ? '+' : ''}{(alert.alpha || 0).toFixed(2)}%
</Text>
)}
{isV2 && alert.alpha_zscore !== undefined && (
<Tooltip label={`Alpha Z-Score: ${alert.alpha_zscore.toFixed(2)}σ`}>
{isV2 && alert.alpha_zscore != null && (
<Tooltip label={`Alpha Z-Score: ${(alert.alpha_zscore || 0).toFixed(2)}σ`}>
<HStack spacing={0.5}>
<Box
w="24px"
@@ -146,23 +146,23 @@ const AlertCard = ({ alert, isExpanded, onToggle, stocks, loadingStocks }) => {
>
<Box
position="absolute"
left={alert.alpha_zscore >= 0 ? '50%' : undefined}
right={alert.alpha_zscore < 0 ? '50%' : undefined}
w={`${Math.min(Math.abs(alert.alpha_zscore) / 5 * 50, 50)}%`}
left={(alert.alpha_zscore || 0) >= 0 ? '50%' : undefined}
right={(alert.alpha_zscore || 0) < 0 ? '50%' : undefined}
w={`${Math.min(Math.abs(alert.alpha_zscore || 0) / 5 * 50, 50)}%`}
h="100%"
bg={alert.alpha_zscore >= 0 ? 'red.500' : 'green.500'}
bg={(alert.alpha_zscore || 0) >= 0 ? 'red.500' : 'green.500'}
/>
</Box>
<Text color={alert.alpha_zscore >= 0 ? 'red.400' : 'green.400'}>
{alert.alpha_zscore >= 0 ? '+' : ''}{alert.alpha_zscore.toFixed(1)}σ
<Text color={(alert.alpha_zscore || 0) >= 0 ? 'red.400' : 'green.400'}>
{(alert.alpha_zscore || 0) >= 0 ? '+' : ''}{(alert.alpha_zscore || 0).toFixed(1)}σ
</Text>
</HStack>
</Tooltip>
)}
{alert.limit_up_ratio > 0.05 && (
{(alert.limit_up_ratio || 0) > 0.05 && (
<HStack spacing={0.5} color="orange.500">
<Icon as={FaFire} boxSize={3} />
<Text>{Math.round(alert.limit_up_ratio * 100)}%</Text>
<Text>{Math.round((alert.limit_up_ratio || 0) * 100)}%</Text>
</HStack>
)}
</HStack>
@@ -193,40 +193,44 @@ const AlertCard = ({ alert, isExpanded, onToggle, stocks, loadingStocks }) => {
</Tr>
</Thead>
<Tbody>
{stocks.slice(0, 10).map((stock, idx) => (
<Tr
key={idx}
cursor="pointer"
_hover={{ bg: hoverBg }}
onClick={(e) => handleStockClick(e, stock.code || stock.stock_code)}
>
<Td px={2} py={1.5}>
<Text fontSize="xs" color="cyan.400" fontWeight="medium">
{stock.name || stock.stock_name}
</Text>
</Td>
<Td px={2} py={1.5} isNumeric>
<Text
fontSize="xs"
fontWeight="bold"
color={
stock.change_pct > 0 ? 'red.400' :
stock.change_pct < 0 ? 'green.400' : 'gray.400'
}
>
{stock.change_pct !== undefined
? `${stock.change_pct > 0 ? '+' : ''}${stock.change_pct.toFixed(2)}%`
: '-'
}
</Text>
</Td>
<Td px={2} py={1.5} maxW="120px">
<Text fontSize="xs" color="gray.500" noOfLines={1}>
{stock.reason || '-'}
</Text>
</Td>
</Tr>
))}
{stocks.slice(0, 10).map((stock, idx) => {
const changePct = stock.change_pct;
const hasChange = changePct != null && !isNaN(changePct);
return (
<Tr
key={idx}
cursor="pointer"
_hover={{ bg: hoverBg }}
onClick={(e) => handleStockClick(e, stock.code || stock.stock_code)}
>
<Td px={2} py={1.5}>
<Text fontSize="xs" color="cyan.400" fontWeight="medium">
{stock.name || stock.stock_name || '-'}
</Text>
</Td>
<Td px={2} py={1.5} isNumeric>
<Text
fontSize="xs"
fontWeight="bold"
color={
hasChange && changePct > 0 ? 'red.400' :
hasChange && changePct < 0 ? 'green.400' : 'gray.400'
}
>
{hasChange
? `${changePct > 0 ? '+' : ''}${changePct.toFixed(2)}%`
: '-'
}
</Text>
</Td>
<Td px={2} py={1.5} maxW="120px">
<Text fontSize="xs" color="gray.500" noOfLines={1}>
{stock.reason || '-'}
</Text>
</Td>
</Tr>
);
})}
</Tbody>
</Table>
{stocks.length > 10 && (

7
src/views/StockOverview/components/HotspotOverview/utils/chartHelpers.js
View File

@@ -152,8 +152,9 @@ export const formatScore = (score) => {
* @returns {string} 颜色代码
*/
export const getScoreColor = (score) => {
if (score >= 80) return '#ff4757';
if (score >= 60) return '#ff6348';
if (score >= 40) return '#ffa502';
const s = score || 0;
if (s >= 80) return '#ff4757';
if (s >= 60) return '#ff6348';
if (s >= 40) return '#ffa502';
return '#747d8c';
};