成交行情页面按维度展示

frontend/src/pages/News.jsx

@@ -482,9 +482,47 @@ export default function News() {
         ) : (
           <div style={{ display: 'flex', flexDirection: 'column', gap: '12px' }}>
             {infoList.map(item => {
-              // 成交行情 tab - 暂时不显示内容
+              // 成交行情 tab - 按维度汇总展示
               if (activeTab === 'deal') {
-                return null
+                // 从content中解析各个字段
+                const content = item.content || ''
+                const categoryMatch = content.match(/分类:\s*(.+?)(?:\n|$)/)
+                const packagingMatch = content.match(/包装:\s*(.+?)(?:\n|$)/)
+                const platformMatch = content.match(/平台:\s*(.+?)(?:\n|$)/)
+                const sellerMatch = content.match(/出售者:\s*(.+?)(?:\n|$)/)
+                const dateMatch = content.match(/日期:\s*(.+?)(?:\n|$)/)
+                
+                const category = categoryMatch ? categoryMatch[1].trim() : item.category || '-'
+                const packaging = packagingMatch ? packagingMatch[1].trim() : item.packaging || '-'
+                const platform = platformMatch ? platformMatch[1].trim() : '-'
+                const seller = sellerMatch ? sellerMatch[1].trim() : '-'
+                const dealDate = dateMatch ? dateMatch[1].trim() : item.deal_date || '-'
+                
+                // 从冠字号判断版本（龙钞J0，马钞J1，蛇钞J3等）
+                const serial = item.title?.split('-')[0] || ''
+                let version = '其他'
+                if (serial.startsWith('J0')) version = '龙钞'
+                else if (serial.startsWith('J1')) version = '马钞'
+                else if (serial.startsWith('J3')) version = '蛇钞'
+                
+                return (
+                  <div key={item.id} style={{ background: '#1e293b', borderRadius: '12px', padding: '12px', marginBottom: '10px' }}>
+                    <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: '8px' }}>
+                      <div style={{ color: '#fbbf24', fontSize: '15px', fontWeight: '600' }}>{item.title}</div>
+                      <div style={{ color: '#22c55e', fontSize: '16px', fontWeight: '700' }}>¥{item.deal_price?.toLocaleString()}</div>
+                    </div>
+                    <div style={{ display: 'flex', flexWrap: 'wrap', gap: '6px' }}>
+                      <span style={{ background: '#3b82f6', color: '#fff', padding: '2px 8px', borderRadius: '4px', fontSize: '11px' }}>{version}</span>
+                      <span style={{ background: '#8b5cf6', color: '#fff', padding: '2px 8px', borderRadius: '4px', fontSize: '11px' }}>{packaging}</span>
+                      <span style={{ background: '#06b6d4', color: '#fff', padding: '2px 8px', borderRadius: '4px', fontSize: '11px' }}>{category}</span>
+                      <span style={{ background: '#f97316', color: '#fff', padding: '2px 8px', borderRadius: '4px', fontSize: '11px' }}>{platform}</span>
+                      <span style={{ background: '#64748b', color: '#fff', padding: '2px 8px', borderRadius: '4px', fontSize: '11px' }}>{dealDate}</span>
+                    </div>
+                    {seller && seller !== '-' && (
+                      <div style={{ color: '#94a3b8', fontSize: '12px', marginTop: '6px' }}>出售者: {seller}</div>
+                    )}
+                  </div>
+                )
               }
               
               // 解析正文中的号码特征和联系方式