Update src

app.py

@@ -45,7 +45,6 @@ def generate_quant_dashboard(ticker, model_name):
         preds, last_close, last_date, _ = predict_horizons(ticker, model_name)
         
         # 2. Lấy dữ liệu OHLCV 90 ngày để vẽ Candlestick & tính toán Context
-        # Sử dụng yfinance trực tiếp để render UI mượt mà, độc lập với backend load_data nặng nề
         end_dt = datetime.strptime(last_date, '%Y-%m-%d') + timedelta(days=1)
         start_dt = end_dt - timedelta(days=90)
         
@@ -81,8 +80,7 @@ def generate_quant_dashboard(ticker, model_name):
     consensus_html = ""
     target_price = 0
     
-    # --- TẠO BẢNG CONTEXT & CONSENSUS HIỂN THỊ 3 HORIZONS ---
-    # Hàm tính giá trung bình giữa các model (đã có từ bước trước)
+    # Hàm tính giá trung bình giữa các model
     def get_avg_price(h):
         if model_name == "Cả Hai":
             return (preds[h]["Linear Regression"]["pred_price"] + preds[h]["SVR"]["pred_price"]) / 2
@@ -96,38 +94,34 @@ def generate_quant_dashboard(ticker, model_name):
         else:
             return preds[h][model_name]["pred_return"]
 
-    # Lấy giá mục tiêu
     target_1d = get_avg_price(1)
     target_7d = get_avg_price(7)
     target_21d = get_avg_price(21)
     
-    # Lấy tỷ suất sinh lời (return)
     ret_1d = get_avg_return(1)
     ret_7d = get_avg_return(7)
     ret_21d = get_avg_return(21)
 
-    # 1. LOGIC XÁC ĐỊNH TÍN HIỆU TỔNG THỂ (OVERALL SIGNAL)
-    # Dựa vào mức tăng/giảm của dự báo T+21 (Dài nhất) và T+7 (Trung bình)
+    # 1. LOGIC XÁC ĐỊNH TÍN HIỆU TỔNG THỂ
     if ret_21d > 0.02 and ret_7d > 0:
         signal_text = "STRONG BUY"
-        signal_color = "#00ff00" # Xanh lá sáng
+        signal_color = "#00ff00"
         bg_color = "rgba(0, 255, 0, 0.1)"
     elif ret_21d > 0:
         signal_text = "ACCUMULATE"
-        signal_color = "#00cc66" # Xanh lục
+        signal_color = "#00cc66"
         bg_color = "rgba(0, 204, 102, 0.1)"
     elif ret_21d < -0.02 and ret_7d < 0:
         signal_text = "STRONG SELL"
-        signal_color = "#ff0000" # Đỏ
+        signal_color = "#ff0000"
         bg_color = "rgba(255, 0, 0, 0.1)"
     else:
         signal_text = "REDUCE / SELL"
-        signal_color = "#ff6666" # Đỏ nhạt
+        signal_color = "#ff6666"
         bg_color = "rgba(255, 102, 102, 0.1)"
 
-    # Hàm định dạng HTML cho % Return (Tự động đổi màu Xanh/Đỏ)
     def fmt_ret(val):
-        color = "#00ff00" if val > 0 else "#ff4444"
+        color = "#00cc00" if val > 0 else "#ff4444" # Điều chỉnh màu xanh lá cây hơi tối xuống 1 chút cho chế độ nền trắng dễ nhìn
         sign = "+" if val > 0 else ""
         return f"<span style='color: {color}; font-weight: bold;'>{sign}{val*100:.2f}%</span>"
 
@@ -166,12 +160,7 @@ def generate_quant_dashboard(ticker, model_name):
     </div>
     """
 
-    # (Giữ nguyên đoạn tạo context_html ở phía dưới nếu bạn muốn hiển thị thêm thông tin khác)
-
-    # 4. Market Context Panel (Technical Stats)
-    rsi_color = "#ff3333" if rsi_val > 70 else ("#00ff00" if rsi_val < 30 else "#a8b2d1")
-    macd_color = "#00ff00" if macd_h > 0 else "#ff3333"
-    
+    # 4. Market Context Panel
     context_html = f"""
     <div style="background: var(--background-fill-secondary); border: 1px solid var(--border-color-primary); padding: 15px; border-radius: 5px; font-family: monospace;">
         <p style="color: var(--body-text-color-subdued); margin:0 0 10px 0; font-size:12px;">LAST CLOSE: {last_date}</p>
@@ -184,7 +173,7 @@ def generate_quant_dashboard(ticker, model_name):
     </div>
     """
 
-    # 5. Vẽ biểu đồ Plotly cấp độ Institutional
+    # 5. Vẽ biểu đồ Plotly cấp độ Institutional (ĐÃ TỐI ƯU CHO LIGHT/DARK MODE)
     fig = make_subplots(rows=2, cols=1, shared_xaxes=True, 
                         vertical_spacing=0.03, row_heights=[0.75, 0.25],
                         subplot_titles=(f"{ticker} - MULTI-HORIZON PROJECTIONS", "VOLUME"))
@@ -193,7 +182,7 @@ def generate_quant_dashboard(ticker, model_name):
     fig.add_trace(go.Candlestick(
         x=df_ui['Date'], open=df_ui['Open'], high=df_ui['High'], 
         low=df_ui['Low'], close=df_ui['Close'], name='Price',
-        increasing_line_color='#00ff00', decreasing_line_color='#ff3333'
+        increasing_line_color='#00cc00', decreasing_line_color='#ff3333' # Điều chỉnh màu nến tăng để không bị chói ở nền trắng
     ), row=1, col=1)
 
     # SMAs
@@ -201,10 +190,12 @@ def generate_quant_dashboard(ticker, model_name):
     fig.add_trace(go.Scatter(x=df_ui['Date'], y=df_ui['SMA_50'], mode='lines', name='SMA 50', line=dict(color='#00bfff', width=1)), row=1, col=1)
 
     # Volume subplot
-    colors = ['#00ff00' if row['Close'] >= row['Open'] else '#ff3333' for _, row in df_ui.iterrows()]
+    colors = ['#00cc00' if row['Close'] >= row['Open'] else '#ff3333' for _, row in df_ui.iterrows()]
     fig.add_trace(go.Bar(x=df_ui['Date'], y=df_ui['Volume'], marker_color=colors, name='Volume'), row=2, col=1)
+    
     x_future = [base_date, dates_future[1], dates_future[7], dates_future[21]]
-    # --- Thêm điểm dự báo và Confidence Interval (Error Bands) dựa trên ATR ---
+    
+    # Thêm điểm dự báo
     if model_name in ["Linear Regression", "Cả Hai"]:
         y_lr = [last_close, preds[1]["Linear Regression"]["pred_price"], 
                 preds[7]["Linear Regression"]["pred_price"], preds[21]["Linear Regression"]["pred_price"]]
@@ -215,27 +206,32 @@ def generate_quant_dashboard(ticker, model_name):
         y_svr = [last_close, preds[1]["SVR"]["pred_price"], 
                  preds[7]["SVR"]["pred_price"], preds[21]["SVR"]["pred_price"]]
         fig.add_trace(go.Scatter(x=x_future, y=y_svr, mode='lines+markers', name='SVR Trajectory',
-            line=dict(color='#00ffff', dash='dot'), marker=dict(size=8, symbol='diamond')), row=1, col=1)
+            line=dict(color='#00cccc', dash='dot'), marker=dict(size=8, symbol='diamond')), row=1, col=1)
+            
     upper_band = [last_close, target_1d + atr_val*np.sqrt(1), target_7d + atr_val*np.sqrt(7), target_21d + atr_val*np.sqrt(21)]
     lower_band = [last_close, target_1d - atr_val*np.sqrt(1), target_7d - atr_val*np.sqrt(7), target_21d - atr_val*np.sqrt(21)]
-    # Error Band (±1 ATR cho mức target)
-    fig.add_trace(go.Scatter(x=x_future, y=upper_band, mode='lines', name='Risk Cone Upper', line=dict(color='rgba(0, 255, 0, 1)')), row=1, col=1)
-    fig.add_trace(go.Scatter(x=x_future, y=lower_band, mode='lines', fill='tonexty', fillcolor='rgba(255, 255, 255, 0.5)', name='Risk Cone Lower', line=dict(color='rgba(255, 0, 0, 0.2)')), row=1, col=1)
+    
+    # Error Band (Đã đổi màu fillcolor thành xám trung tính có độ trong suốt để tương thích tốt cả nền trắng và đen)
+    fig.add_trace(go.Scatter(x=x_future, y=upper_band, mode='lines', name='Risk Cone Upper', line=dict(color='rgba(0, 256, 0, 1)')), row=1, col=1)
+    fig.add_trace(go.Scatter(x=x_future, y=lower_band, mode='lines', fill='tonexty', fillcolor='rgba(128, 128, 128, 0.25)', name='Risk Cone Lower', line=dict(color='rgba(256, 0, 0, 0.6)')), row=1, col=1)
 
-    # Tối ưu giao diện Plotly Dark Mode
+    # --- TỐI ƯU LAYOUT CHO DARK / LIGHT MODE ---
     fig.update_layout(
         margin=dict(l=40, r=40, t=40, b=40),
         xaxis_rangeslider_visible=False,
-        legend=dict(orientation="h", yanchor="bottom", y=1.02, xanchor="right", x=1),
-        font=dict(family="Courier New, monospace") 
-        # ĐÃ BỎ: plot_bgcolor và paper_bgcolor
+        legend=dict(orientation="h", yanchor="bottom", y=1.02, xanchor="right", x=1, font=dict(color="#888888")), # Chữ xám trung tính
+        font=dict(family="Courier New, monospace", color="#525252"), # Cả tiêu đề và nhãn đều xám trung tính
+        paper_bgcolor='rgba(0,0,0,0)', # Nền ngoài TRONG SUỐT
+        plot_bgcolor='rgba(0,0,0,0)'   # Nền trong TRONG SUỐT
     )
     
-    fig.update_xaxes(showgrid=True, gridwidth=1)
-    fig.update_yaxes(showgrid=True, gridwidth=1)
+    # Thiết lập màu lưới trung tính chống chói
+    fig.update_xaxes(showgrid=True, gridwidth=1, gridcolor='rgba(128, 128, 128, 0.2)', linecolor='rgba(128, 128, 128, 0.3)', tickfont=dict(color="#888888"))
+    fig.update_yaxes(showgrid=True, gridwidth=1, gridcolor='rgba(128, 128, 128, 0.2)', linecolor='rgba(128, 128, 128, 0.3)', tickfont=dict(color="#888888"))
+    
     return consensus_html, context_html, fig
 
-# --- KIẾN TRÚC GRADIO GIAO DIỆN DARK MODE ---
+# --- KIẾN TRÚC GRADIO GIAO DIỆN ---
 css = """
 .gradio-container { max-width: 1400px !important; }
 #main-row { margin-top: 20px; }
@@ -253,7 +249,6 @@ function toggle_theme() {
 with gr.Blocks(title="Quant Terminal | Stock ML", css=css, theme=gr.themes.Monochrome()) as demo:
     with gr.Row():
         with gr.Column(scale=9):
-            # Lưu ý: Đã bỏ style="color: #e6e6fa;" để chữ tự động đổi màu theo theme
             gr.Markdown("""
             <div style="padding: 10px 0; border-bottom: 2px solid var(--border-color-primary);">
                 <h1 style="margin: 0; font-family: monospace;">⚡ QUANTRONIC ML TERMINAL v2.0</h1>
@@ -261,12 +256,10 @@ with gr.Blocks(title="Quant Terminal | Stock ML", css=css, theme=gr.themes.Monoc
             </div>
             """)
         with gr.Column(scale=1, min_width=150):
-            # Thêm nút bấm chuyển đổi Theme
             btn_theme = gr.Button("🌓 Toggle Dark/Light", size="sm")
     
-    # Đã sửa lỗi tại dòng này: Dùng elem_id thay vì style
     with gr.Row(elem_id="main-row"):
-        # SIDEBAR (Controls & Context)
+        # SIDEBAR
         with gr.Column(scale=1, min_width=300):
             gr.Markdown("<h4 style='font-family: monospace;'>⚙️ PARAMETERS</h4>")
             ticker_dd = gr.Dropdown(choices=["AAPL", "MSFT", "GOOGL", "AMZN"], value="AAPL", label="Asset Ticker")
@@ -277,9 +270,10 @@ with gr.Blocks(title="Quant Terminal | Stock ML", css=css, theme=gr.themes.Monoc
             consensus_panel = gr.HTML()
             context_panel = gr.HTML()
             
-        # MAIN AREA (Charts)
+        # MAIN AREA
         with gr.Column(scale=3):
             plot_chart = gr.Plot()
+            
     btn_theme.click(fn=None, inputs=None, outputs=None, js=toggle_script)
     btn_predict.click(
         fn=generate_quant_dashboard,
@@ -287,7 +281,6 @@ with gr.Blocks(title="Quant Terminal | Stock ML", css=css, theme=gr.themes.Monoc
         outputs=[consensus_panel, context_panel, plot_chart]
     )
     
-    # Load default data on start
     demo.load(
         fn=generate_quant_dashboard,
         inputs=[ticker_dd, model_dd],