diff --git a/frontend/src/components/stock-chart.tsx b/frontend/src/components/stock-chart.tsx index 20377d7..b6e6d05 100644 --- a/frontend/src/components/stock-chart.tsx +++ b/frontend/src/components/stock-chart.tsx @@ -1,7 +1,8 @@ - "use client" -import { useEffect, useRef, useState } from "react" +import { useEffect } from "react" +import { ExternalLink } from "lucide-react" +import { Button } from "@/components/ui/button" interface StockChartProps { symbol: string @@ -9,26 +10,8 @@ interface StockChartProps { } export function StockChart({ symbol, market }: StockChartProps) { - const containerRef = useRef(null) - useEffect(() => { - if (!containerRef.current) return - - // Clear previous widget - containerRef.current.innerHTML = "" - - // Create wrapper for widget - const widgetContainer = document.createElement("div") - widgetContainer.className = "tradingview-widget-container__widget h-full w-full" - containerRef.current.appendChild(widgetContainer) - - const script = document.createElement("script") - script.src = "https://s3.tradingview.com/external-embedding/embed-widget-advanced-chart.js" - script.type = "text/javascript" - script.async = true - - // Map Market/Symbol to TradingView format - console.log("[StockChart] Received market:", JSON.stringify(market), "symbol:", symbol) + const getTradingViewUrl = () => { let exchange = "NASDAQ" let tvSymbol = symbol @@ -38,52 +21,38 @@ export function StockChart({ symbol, market }: StockChartProps) { else if (symbol.startsWith("4") || symbol.startsWith("8")) exchange = "BSE" } else if (market === "HK") { exchange = "HKEX" - // TradingView usually expects HK stocks without leading zeros if they are 4 digits, but let's check. - // Actually HKEX:700 works, HKEX:0700 might work too. Let's try to keep it safe. + // Ensure no leading zeros for int conversion check tvSymbol = parseInt(symbol).toString() } else if (market === "JP") { exchange = "TSE" } else if (market === "VN") { - exchange = "HOSE" // Primary VN exchange + exchange = "HOSE" } else { // US - exchange = "NASDAQ" // Default, could be NYSE - // Basic heuristic for US - // If 4 chars or more, likely Nasdaq, <=3 likely NYSE? Not 100% accurate but acceptable default. + exchange = "NASDAQ" // Default fallback } const fullSymbol = `${exchange}:${tvSymbol}` + return `https://cn.tradingview.com/chart/?symbol=${fullSymbol}` + } - script.innerHTML = JSON.stringify({ - "autosize": true, - "symbol": fullSymbol, - "interval": "D", - "range": "12m", - "scale": "log", - "timezone": "Asia/Shanghai", - "theme": "light", - "style": "1", - "locale": "zh_CN", - "enable_publishing": false, - "allow_symbol_change": true, - "calendar": false, - "support_host": "https://www.tradingview.com" - }) - - containerRef.current.appendChild(script) - + useEffect(() => { + const url = getTradingViewUrl() + // Attempt to open in new tab automatically + const win = window.open(url, '_blank') + if (!win) { + console.warn("Popup blocked. Please allow popups for this site.") + } }, [symbol, market]) return ( -
-
-
- - 在 TradingView 上查看完整图表 - ({symbol}) - -
-
+
+

+ 正在前往 TradingView ({symbol})... + + 若未跳转请点击 + +

) }