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

refactor(Concept): 迁移毛玻璃效果到统一配置 - 批次5

Browse Source 
- index.js: 10+ 处使用 GLASS_BLUR.lg/sm
- ConceptTimelineModal.js: Modal overlay 使用 GLASS_BLUR.sm/lg
- BreadcrumbNav.js: 深色主题样式使用 GLASS_BLUR.lg
- ConceptStatsPanel.js: 玻璃态卡片使用 GLASS_BLUR.lg
- HierarchyView.js: 4处使用 GLASS_BLUR.lg/sm
- ForceGraphView.js: 4处使用 GLASS_BLUR.lg

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
zdl
2025-12-25 16:39:48 +08:00
parent b0e1a4f474
commit 3911095022
6 changed files with 32 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files

11
src/views/Concept/ConceptTimelineModal.js
View File

@@ -80,6 +80,7 @@ const formatUrl = (url) => {
};
import { getApiBase } from '@utils/apiConfig';
import { GLASS_BLUR } from '@/constants/glassConfig';
// API配置 - 生产环境通过 api.valuefrontier.cn 代理
const API_BASE_URL = process.env.NODE_ENV === 'production'
@@ -667,13 +668,13 @@ const ConceptTimelineModal = ({
scrollBehavior="inside"
isCentered
>
<ModalOverlay bg="blackAlpha.800" backdropFilter="blur(8px)" />
<ModalOverlay bg="blackAlpha.800" backdropFilter={GLASS_BLUR.sm} />
<ModalContent
maxW="1400px"
m={{ base: 0, md: 'auto' }}
mx="auto"
bg="rgba(15, 23, 42, 0.95)"
backdropFilter="blur(20px)"
backdropFilter={GLASS_BLUR.lg}
border="1px solid"
borderColor="whiteAlpha.100"
>
@@ -909,7 +910,7 @@ const ConceptTimelineModal = ({
size="4xl"
scrollBehavior="inside"
>
<ModalOverlay bg="blackAlpha.800" backdropFilter="blur(8px)" />
<ModalOverlay bg="blackAlpha.800" backdropFilter={GLASS_BLUR.sm} />
<ModalContent
borderRadius="2xl"
overflow="hidden"
@@ -1228,7 +1229,7 @@ const ConceptTimelineModal = ({
size="4xl"
scrollBehavior="inside"
>
<ModalOverlay bg="blackAlpha.800" backdropFilter="blur(8px)" />
<ModalOverlay bg="blackAlpha.800" backdropFilter={GLASS_BLUR.sm} />
<ModalContent bg="rgba(15, 23, 42, 0.95)" border="1px solid" borderColor="whiteAlpha.100">
<ModalHeader bg="rgba(15, 23, 42, 0.98)" borderBottom="1px solid" borderColor="whiteAlpha.100" color="white">
<VStack align="start" spacing={1}>
@@ -1330,7 +1331,7 @@ const ConceptTimelineModal = ({
size="4xl"
scrollBehavior="inside"
>
<ModalOverlay bg="blackAlpha.800" backdropFilter="blur(8px)" />
<ModalOverlay bg="blackAlpha.800" backdropFilter={GLASS_BLUR.sm} />
<ModalContent bg="rgba(15, 23, 42, 0.95)" border="1px solid" borderColor="whiteAlpha.100">
<ModalHeader bg="rgba(15, 23, 42, 0.98)" borderBottom="1px solid" borderColor="whiteAlpha.100" color="white">
<VStack align="start" spacing={1}>

3
src/views/Concept/components/BreadcrumbNav.js
View File

@@ -17,6 +17,7 @@ import {
Tooltip,
} from '@chakra-ui/react';
import { ChevronRight, Filter, X, Home } from 'lucide-react';
import { GLASS_BLUR } from '@/constants/glassConfig';
const BreadcrumbNav = ({
filter,
@@ -60,7 +61,7 @@ const BreadcrumbNav = ({
const darkStyles = {
container: {
bg: 'rgba(15, 23, 42, 0.8)',
backdropFilter: 'blur(20px)',
backdropFilter: GLASS_BLUR.lg,
borderColor: 'whiteAlpha.100',
},
filterBadge: {

5
src/views/Concept/components/ConceptStatsPanel.js
View File

@@ -47,6 +47,7 @@ import {
TrendingUp,
TrendingDown,
} from 'lucide-react';
import { GLASS_BLUR } from '@/constants/glassConfig';
const ConceptStatsPanel = ({ apiBaseUrl, onConceptClick }) => {
// 获取正确的API基础URL
@@ -585,7 +586,7 @@ const ConceptStatsPanel = ({ apiBaseUrl, onConceptClick }) => {
{/* 顶部标题卡片 - 深色玻璃态 */}
<Box
bg="rgba(15, 23, 42, 0.8)"
backdropFilter="blur(20px)"
backdropFilter={GLASS_BLUR.lg}
p={4}
borderRadius="xl"
mb={4}
@@ -767,7 +768,7 @@ const ConceptStatsPanel = ({ apiBaseUrl, onConceptClick }) => {
</Box>
{/* 主内容卡片 - 深色玻璃态 */}
<Box bg={bg} backdropFilter="blur(20px)" borderRadius="xl" border="1px" borderColor={borderColor} overflow="hidden">
<Box bg={bg} backdropFilter={GLASS_BLUR.lg} borderRadius="xl" border="1px" borderColor={borderColor} overflow="hidden">
<Tabs
index={activeTab}
onChange={(index) => {

9
src/views/Concept/components/ForceGraphView.js
View File

@@ -44,6 +44,7 @@ import {
ArrowLeft,
} from 'lucide-react';
import { logger } from '../../../utils/logger';
import { GLASS_BLUR } from '@/constants/glassConfig';
// 极光动画 - 黑金色主题
const auroraAnimation = keyframes`
@@ -1016,7 +1017,7 @@ const ForceGraphView = ({
h="500px"
bg="rgba(15, 23, 42, 0.6)"
borderRadius="3xl"
backdropFilter="blur(20px)"
backdropFilter={GLASS_BLUR.lg}
border="1px solid"
borderColor="whiteAlpha.100"
>
@@ -1047,7 +1048,7 @@ const ForceGraphView = ({
h="500px"
bg="rgba(15, 23, 42, 0.6)"
borderRadius="3xl"
backdropFilter="blur(20px)"
backdropFilter={GLASS_BLUR.lg}
border="1px solid"
borderColor="whiteAlpha.100"
>
@@ -1289,7 +1290,7 @@ const ForceGraphView = ({
>
<HStack
bg="rgba(255, 255, 255, 0.08)"
backdropFilter="blur(20px)"
backdropFilter={GLASS_BLUR.lg}
px={4}
py={2}
borderRadius="full"
@@ -1332,7 +1333,7 @@ const ForceGraphView = ({
>
<HStack
bg="rgba(255, 255, 255, 0.06)"
backdropFilter="blur(20px)"
backdropFilter={GLASS_BLUR.lg}
px={4}
py={2}
borderRadius="full"

9
src/views/Concept/components/HierarchyView.js
View File

@@ -62,6 +62,7 @@ import {
ExternalLink,
} from 'lucide-react';
import { logger } from '../../../utils/logger';
import { GLASS_BLUR } from '@/constants/glassConfig';
// 一级分类图标映射
const LV1_ICONS = {
@@ -274,7 +275,7 @@ const GlassCard = ({ item, onClick, size = 'normal' }) => {
right={0}
bottom={0}
bg={getChangeGradient(item.avg_change_pct)}
backdropFilter="blur(20px)"
backdropFilter={GLASS_BLUR.lg}
border="1px solid"
borderColor="whiteAlpha.200"
borderRadius="2xl"
@@ -319,7 +320,7 @@ const GlassCard = ({ item, onClick, size = 'normal' }) => {
p={2}
bg="whiteAlpha.150"
borderRadius="xl"
backdropFilter="blur(10px)"
backdropFilter={GLASS_BLUR.sm}
border="1px solid"
borderColor="whiteAlpha.100"
flexShrink={0}
@@ -402,7 +403,7 @@ const GlassCard = ({ item, onClick, size = 'normal' }) => {
borderRadius="full"
px={2}
py={0.5}
backdropFilter="blur(10px)"
backdropFilter={GLASS_BLUR.sm}
border="1px solid"
borderColor="whiteAlpha.100"
>
@@ -821,7 +822,7 @@ const HierarchyView = ({
mb={5}
p={3}
bg="whiteAlpha.50"
backdropFilter="blur(20px)"
backdropFilter={GLASS_BLUR.lg}
borderRadius="2xl"
border="1px solid"
borderColor="whiteAlpha.100"

21
src/views/Concept/index.js
View File

@@ -134,6 +134,7 @@ import { marketService } from '../../services/marketService';
import { useConceptEvents } from './hooks/useConceptEvents';
import { getApiBase } from '@utils/apiConfig';
import { GLASS_BLUR } from '@/constants/glassConfig';
// API配置 - 生产环境通过 api.valuefrontier.cn 代理
const API_BASE_URL = process.env.NODE_ENV === 'production'
@@ -872,7 +873,7 @@ const ConceptCenter = () => {
cursor="pointer"
onClick={() => handleConceptClick(concept.concept_id, concept.concept, concept, position)}
bg="rgba(15, 23, 42, 0.8)"
backdropFilter="blur(20px)"
backdropFilter={GLASS_BLUR.lg}
borderWidth="1px"
borderColor="whiteAlpha.100"
overflow="hidden"
@@ -996,7 +997,7 @@ const ConceptCenter = () => {
top={3}
right={3}
bg="rgba(0, 0, 0, 0.4)"
backdropFilter="blur(10px)"
backdropFilter={GLASS_BLUR.sm}
color="white"
fontSize="xs"
px={3}
@@ -1040,7 +1041,7 @@ const ConceptCenter = () => {
width="100%"
p={{ base: 2, md: 3 }}
bg="whiteAlpha.50"
backdropFilter="blur(10px)"
backdropFilter={GLASS_BLUR.sm}
borderRadius="xl"
cursor="pointer"
onClick={(e) => handleViewStocks(e, concept)}
@@ -1201,7 +1202,7 @@ const ConceptCenter = () => {
cursor="pointer"
onClick={() => handleConceptClick(concept.concept_id, concept.concept, concept, position)}
bg="rgba(15, 23, 42, 0.8)"
backdropFilter="blur(20px)"
backdropFilter={GLASS_BLUR.lg}
borderWidth="1px"
borderColor="whiteAlpha.100"
overflow="hidden"
@@ -1439,7 +1440,7 @@ const ConceptCenter = () => {
<Box
p={4}
bg="rgba(15, 23, 42, 0.8)"
backdropFilter="blur(20px)"
backdropFilter={GLASS_BLUR.lg}
borderRadius="2xl"
border="1px solid"
borderColor="whiteAlpha.100"
@@ -1652,7 +1653,7 @@ const ConceptCenter = () => {
spacing={6}
divider={<Box w="1px" h="30px" bg="whiteAlpha.300" />}
bg="whiteAlpha.100"
backdropFilter="blur(10px)"
backdropFilter={GLASS_BLUR.sm}
px={8}
py={3}
borderRadius="full"
@@ -1690,7 +1691,7 @@ const ConceptCenter = () => {
<Flex
align="center"
bg="rgba(255, 255, 255, 0.95)"
backdropFilter="blur(10px)"
backdropFilter={GLASS_BLUR.sm}
borderRadius="full"
overflow="hidden"
boxShadow="0 8px 32px rgba(0, 0, 0, 0.3), 0 0 0 1px rgba(139, 92, 246, 0.2)"
@@ -1795,7 +1796,7 @@ const ConceptCenter = () => {
<Card
mb={8}
bg="rgba(15, 23, 42, 0.8)"
backdropFilter="blur(20px)"
backdropFilter={GLASS_BLUR.lg}
border="1px solid"
borderColor="whiteAlpha.100"
boxShadow="0 4px 20px rgba(0, 0, 0, 0.3)"
@@ -1981,7 +1982,7 @@ const ConceptCenter = () => {
<HStack
spacing={3}
bg="rgba(15, 23, 42, 0.8)"
backdropFilter="blur(20px)"
backdropFilter={GLASS_BLUR.lg}
px={6}
py={3}
borderRadius="full"
@@ -2102,7 +2103,7 @@ const ConceptCenter = () => {
) : (
<Card
bg="rgba(15, 23, 42, 0.8)"
backdropFilter="blur(20px)"
backdropFilter={GLASS_BLUR.lg}
border="1px solid"
borderColor="whiteAlpha.100"
borderRadius="2xl"