From 877926aa4fbbae99d112d6f7b8a77c7e2ce1eac4 Mon Sep 17 00:00:00 2001 From: zdl <3489966805@qq.com> Date: Wed, 10 Dec 2025 11:30:18 +0800 Subject: [PATCH] =?UTF-8?q?feat:=20StockQuoteCard=20=E9=A1=B6=E9=83=A8?= =?UTF-8?q?=E5=AF=BC=E8=88=AA=E5=8C=BA=E8=A7=86=E8=A7=89=E4=BC=98=E5=8C=96?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit - 股票名称字号放大至 26px，字重 800，突出显示 - 添加行业标签（金融 · 银行），Badge 边框样式 - 保留指数标签（沪深300、上证180） - Mock 数据补充 industry、industry_l1、index_tags 字段 - 类型定义新增 industry、industryL1 可选字段 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude --- src/mocks/handlers/stock.js | 30 ++++++++++++- .../components/StockQuoteCard/index.tsx | 42 ++++++++++++++----- .../components/StockQuoteCard/types.ts | 2 + src/views/Company/hooks/useStockQuote.js | 2 + 4 files changed, 65 insertions(+), 11 deletions(-) diff --git a/src/mocks/handlers/stock.js b/src/mocks/handlers/stock.js index c8219b70..aef78954 100644 --- a/src/mocks/handlers/stock.js +++ b/src/mocks/handlers/stock.js @@ -368,6 +368,25 @@ export const stockHandlers = [ stockMap[s.code] = s.name; }); + // 行业和指数映射表 + const stockIndustryMap = { + '000001': { industry_l1: '金融', industry: '银行', index_tags: ['沪深300', '上证180'] }, + '600519': { industry_l1: '消费', industry: '白酒', index_tags: ['沪深300', '上证50'] }, + '300750': { industry_l1: '工业', industry: '电池', index_tags: ['创业板50'] }, + '601318': { industry_l1: '金融', industry: '保险', index_tags: ['沪深300', '上证50'] }, + '600036': { industry_l1: '金融', industry: '银行', index_tags: ['沪深300', '上证50'] }, + '000858': { industry_l1: '消费', industry: '白酒', index_tags: ['沪深300'] }, + '002594': { industry_l1: '汽车', industry: '乘用车', index_tags: ['沪深300', '创业板指'] }, + }; + + const defaultIndustries = [ + { industry_l1: '科技', industry: '软件' }, + { industry_l1: '医药', industry: '化学制药' }, + { industry_l1: '消费', industry: '食品' }, + { industry_l1: '金融', industry: '证券' }, + { industry_l1: '工业', industry: '机械' }, + ]; + // 为每只股票生成报价数据 const quotesData = {}; codes.forEach(stockCode => { @@ -380,6 +399,11 @@ export const stockHandlers = [ // 昨收 const prevClose = parseFloat((basePrice - change).toFixed(2)); + // 获取行业和指数信息 + const codeWithoutSuffix = stockCode.replace(/\.(SH|SZ)$/i, ''); + const industryInfo = stockIndustryMap[codeWithoutSuffix] || + defaultIndustries[Math.floor(Math.random() * defaultIndustries.length)]; + quotesData[stockCode] = { code: stockCode, name: stockMap[stockCode] || `股票${stockCode}`, @@ -393,7 +417,11 @@ export const stockHandlers = [ volume: Math.floor(Math.random() * 100000000), amount: parseFloat((Math.random() * 10000000000).toFixed(2)), market: stockCode.startsWith('6') ? 'SH' : 'SZ', - update_time: new Date().toISOString() + update_time: new Date().toISOString(), + // 行业和指数标签 + industry_l1: industryInfo.industry_l1, + industry: industryInfo.industry, + index_tags: industryInfo.index_tags || [] }; }); diff --git a/src/views/Company/components/StockQuoteCard/index.tsx b/src/views/Company/components/StockQuoteCard/index.tsx index 61881dda..635d90ec 100644 --- a/src/views/Company/components/StockQuoteCard/index.tsx +++ b/src/views/Company/components/StockQuoteCard/index.tsx @@ -97,18 +97,40 @@ const StockQuoteCard: React.FC = ({ {/* 顶部：股票名称 + 关注/分享按钮 + 更新时间 */} - {/* 左侧：名称（代码） | 指数标签 */} - - - {data.name}（{data.code}） + {/* 左侧：股票名称 + 行业标签 + 指数标签 */} + + {/* 股票名称 - 突出显示 */} + + {data.name} + + ({data.code}) + + + {/* 行业标签 */} + {(data.industryL1 || data.industry) && ( + + {data.industryL1 && data.industry + ? `${data.industryL1} · ${data.industry}` + : data.industry || data.industryL1} + + )} + + {/* 指数标签 */} {data.indexTags?.length > 0 && ( - <> - | - - {data.indexTags.join('、')} - - + + {data.indexTags.join('、')} + )} diff --git a/src/views/Company/components/StockQuoteCard/types.ts b/src/views/Company/components/StockQuoteCard/types.ts index ee286682..73107ba5 100644 --- a/src/views/Company/components/StockQuoteCard/types.ts +++ b/src/views/Company/components/StockQuoteCard/types.ts @@ -10,6 +10,8 @@ export interface StockQuoteCardData { name: string; // 股票名称 code: string; // 股票代码 indexTags: string[]; // 指数标签（如 沪深300、上证50） + industry?: string; // 所属行业（二级），如 "银行" + industryL1?: string; // 一级行业，如 "金融" // 价格信息 currentPrice: number; // 当前价格 diff --git a/src/views/Company/hooks/useStockQuote.js b/src/views/Company/hooks/useStockQuote.js index cec0e87d..817a8af2 100644 --- a/src/views/Company/hooks/useStockQuote.js +++ b/src/views/Company/hooks/useStockQuote.js @@ -16,6 +16,8 @@ const transformQuoteData = (apiData, stockCode) => { name: apiData.name || apiData.stock_name || '未知', code: apiData.code || apiData.stock_code || stockCode, indexTags: apiData.index_tags || apiData.indexTags || [], + industry: apiData.industry || apiData.sw_industry_l2 || '', + industryL1: apiData.industry_l1 || apiData.sw_industry_l1 || '', // 价格信息 currentPrice: apiData.current_price || apiData.currentPrice || apiData.close || 0,