Update app.py

app.py

@@ -29,30 +29,34 @@ def get_bookings():
     except:
         return pd.DataFrame()
 
-# 🔥🔥🔥 發送邏輯 (暴力發送) 🔥🔥🔥
+# 🔥🔥🔥 後端：暴力發送邏輯 (加上 Print Debug) 🔥🔥🔥
 def send_confirmation_hybrid(booking_id):
-    print(f"收到後端請求，ID: {booking_id}")
-    if not booking_id: return "❌ 錯誤：未讀取到 ID (Backend received None)"
+    # Debug: 這裡會印在 Hugging Face 的 Logs 裡
+    print(f"🔥 [Backend] 收到發送請求，ID: {booking_id}") 
+    
+    if not booking_id: 
+        return "❌ 錯誤：後端收到的 ID 為空！"
     
     try:
+        # 1. 撈資料
         res = supabase.table("bookings").select("*").eq("id", booking_id).execute()
-        if not res.data: return "❌ 找不到訂單"
+        if not res.data: return f"❌ 找不到 ID 為 {booking_id} 的訂單"
         booking = res.data[0]
         
         email = booking.get('email')
         user_id = booking.get('user_id')
         current_status = booking.get('status', '')
         
-        # 連結
         confirm_link = f"{PUBLIC_SPACE_URL}/?id={booking_id}&action=confirm"
         cancel_link = f"{PUBLIC_SPACE_URL}/?id={booking_id}&action=cancel"
         
         log_msg = f"🆔 {booking_id}: "
 
-        # 判斷是提醒還是確認
+        # 2. 判斷模式
         is_reminder = "確認" in current_status
 
         if is_reminder:
+            # 提醒模式
             action_label = "提醒"
             mail_subject = f"🔔 訂位提醒: {booking['date']} - Cié Cié Taipei"
             line_text = (
@@ -80,6 +84,7 @@ def send_confirmation_hybrid(booking_id):
             </div>
             """
         else:
+            # 確認模式
             action_label = "確認"
             mail_subject = f"訂位確認: {booking['date']} - Cié Cié Taipei"
             line_text = (
@@ -108,14 +113,14 @@ def send_confirmation_hybrid(booking_id):
             </div>
             """
 
-        # 執行發送
+        # 3. 發送
         if email and "@" in email and GAS_MAIL_URL:
             try:
                 requests.post(GAS_MAIL_URL, json={"to": email, "subject": mail_subject, "htmlBody": mail_html, "name": "Cié Cié Taipei"})
                 log_msg += f"✅ Mail({action_label}) "
             except Exception as e: log_msg += f"❌ MailErr({str(e)}) "
         else:
-            log_msg += "⚠️ 無Email "
+            log_msg += "⚠️ 無Mail "
         
         if user_id and len(str(user_id)) > 5 and LINE_ACCESS_TOKEN:
             try:
@@ -130,11 +135,14 @@ def send_confirmation_hybrid(booking_id):
         if not is_reminder:
             supabase.table("bookings").update({"status": "已發確認信"}).eq("id", booking_id).execute()
         
+        print(f"🔥 [Backend] 處理完成: {log_msg}")
         return log_msg
 
-    except Exception as e: return f"🔥 嚴重錯誤: {str(e)}"
+    except Exception as e: 
+        print(f"🔥 [Backend] 嚴重錯誤: {str(e)}")
+        return f"嚴重錯誤: {str(e)}"
 
-# 🔥🔥🔥 卡片渲染 (修正：不使用 onclick，改用 data-id) 🔥🔥🔥
+# --- 卡片渲染 (純 CSS 驅動點擊) ---
 def render_booking_cards():
     df = get_bookings()
     count_html = f"<div style='color:#bbb; margin-bottom:20px; text-align:right; font-size:16px; padding: 0 10px;'>📊 共找到 <span style='color:#fff; font-weight:bold;'>{len(df)}</span> 筆資料</div>"
@@ -153,13 +161,14 @@ def render_booking_cards():
         is_canceled = '取消' in status
         is_confirmed = '確認' in status
         
-        # 🟢 修正：移除 onclick，改用 class 和 data-id 屬性
-        # 這樣就不會依賴全域函式是否存在，而是靠下方的監聽器
-        btn_attrs = f"class='op-btn' data-id='{row['id']}'" if not is_canceled else "disabled"
+        # JS Class 標記
+        btn_class = "op-btn"
+        btn_data = f"data-id='{row['id']}'"
         
         if is_canceled:
             btn_style = "background: #333; color: #666; cursor: not-allowed;"
             btn_text = "🚫 已取消"
+            btn_class = "" # 取消狀態不給按
         elif is_confirmed:
             btn_style = "background: #2c3e50; color: #fff; border: 1px solid #555; box-shadow: 0 0 8px rgba(46, 204, 113, 0.3);"
             btn_text = "🔔 發送提醒"
@@ -221,10 +230,7 @@ def render_booking_cards():
                 <div style="font-size: 1.1em; color: #000; font-weight: 900; background: #e0e0e0; padding: 8px 12px; border-radius: 6px; font-family: monospace;">
                     ID: {row['id']}
                 </div>
-                
-                <button {btn_attrs} style="
-                    border: none; padding: 14px 30px; border-radius: 8px; font-size: 1.1em; 
-                    transition: all 0.2s; min-width: 150px; cursor: pointer; {btn_style}">
+                <button class="{btn_class}" {btn_data} style="border: none; padding: 14px 30px; border-radius: 8px; font-size: 1.1em; transition: all 0.2s; min-width: 150px; cursor: pointer; {btn_style}">
                     {btn_text}
                 </button>
             </div>
@@ -245,76 +251,55 @@ def check_login(user, password):
         }
     else: return {error_msg: "<span style='color: red'>❌ 帳號或密碼錯誤</span>"}
 
-# 🔥🔥🔥 絕對有效的事件監聽器 (Event Delegation) 🔥🔥🔥
-# 這次不是定義函式，而是直接監聽整個文件的點擊事件。
-# 只要點擊了 class="op-btn" 的元素，就執行。這不依賴作用域，一定有效。
+# 🔥🔥🔥 Debug 版 JS：有彈窗，按鈕看得到 🔥🔥🔥
 GLOBAL_JS = """
 <script>
 document.addEventListener('DOMContentLoaded', function() {
-    console.log("🟢 訂位系統監聽器已啟動");
+    console.log("🟢 Debug JS Loaded");
 });
 
-// 全域監聽點擊 (Event Delegation)
 document.addEventListener('click', function(e) {
-    // 檢查點擊的目標是否是我們的操作按鈕
     if (e.target && e.target.classList.contains('op-btn')) {
         const id = e.target.getAttribute('data-id');
-        console.log("👉 偵測到按鈕點擊，ID:", id);
         
-        if (!id) return;
-
-        // 1. 找輸入框
-        const idInput = document.querySelector('#hidden_id_input input');
+        // 1. 彈窗確認 JS 有活著
+        // alert("JS 偵測到點擊！準備發送 ID: " + id);
+        
+        const idInput = document.querySelector('#debug_id_input input');
         
         if (idInput) {
-            console.log("✅ 寫入 ID 到 Gradio...");
             idInput.value = id;
             idInput.dispatchEvent(new Event('input', { bubbles: true }));
             
-            // 2. 觸發發送按鈕
             setTimeout(() => {
-                const sendBtn = document.querySelector('#hidden_send_btn');
+                const sendBtn = document.querySelector('#debug_send_btn');
                 if (sendBtn) {
-                    console.log("🚀 觸發 Python 發送邏輯...");
+                    console.log("🚀 Clicking send button...");
                     sendBtn.click();
                 } else {
-                    console.error("❌ 找不到 hidden_send_btn");
+                    alert("❌ 找不到發送按鈕 (#debug_send_btn)");
                 }
             }, 100);
         } else {
-            console.error("❌ 找不到 hidden_id_input");
-            alert("系統錯誤：找不到對應的輸入框，請重新整理頁面。");
+            alert("❌ 找不到輸入框 (#debug_id_input)");
         }
     }
 });
 </script>
 """
 
-# --- CSS (確保按鈕可按) ---
 custom_css = """
 body, .gradio-container { background-color: #0F0F0F; color: #fff; }
 #booking_display { height: auto !important; max-height: none !important; overflow: visible !important; margin-bottom: 50px; }
 button:active { transform: scale(0.96); }
 #header-panel { background: #1a1a1a; padding: 15px; margin-bottom: 20px; border-radius: 10px; }
-
-/* 讓操作按鈕有點擊指標 */
 .op-btn { pointer-events: auto !important; }
 
-/* 隱藏操作區：移出畫面外 */
-#hidden_ops {
-    position: absolute !important;
-    left: -9999px !important;
-    top: 0 !important;
-    width: 0 !important;
-    height: 0 !important;
-    overflow: hidden !important;
-}
+/* 暫時不隱藏，方便 Debug */
+/* #debug_ops { display: none; } */
 """
 
-# --- 介面 ---
 with gr.Blocks(title="Admin") as demo:
-    
-    # 注入 JS (直接執行，不包在 function 裡)
     gr.HTML(GLOBAL_JS)
     
     with gr.Group(visible=True) as login_row:
@@ -330,23 +315,24 @@ with gr.Blocks(title="Admin") as demo:
             gr.Markdown("### 🍷 Cié Cié Dashboard")
             refresh_btn = gr.Button("🔄 刷新列表", size="sm", variant="secondary")
         
+        # ⚠️ 這裡我把隱藏區改名為 debug_ops 並且顯示出來
+        # 你會看到一個數字框和一個按鈕，這是正常的
+        with gr.Row(visible=True, elem_id="debug_ops"):
+            debug_id_input = gr.Number(label="Debug ID Input (Auto Fill)", elem_id="debug_id_input", precision=0)
+            debug_send_btn = gr.Button("Debug Send Button (Auto Click)", elem_id="debug_send_btn")
+            
         booking_display = gr.HTML(elem_id="booking_display")
-        
-        # 隱藏操作區
-        with gr.Column(visible=True, elem_id="hidden_ops"):
-            hidden_id_input = gr.Number(elem_id="hidden_id_input", precision=0)
-            hidden_send_btn = gr.Button("Send", elem_id="hidden_send_btn")
-        
-        log_output = gr.Textbox(label="系統日誌 (System Log)", lines=1, interactive=False)
+        log_output = gr.Textbox(label="系統日誌 (System Log)", lines=1)
         
         login_btn.click(check_login, inputs=[username_input, password_input], outputs=[login_row, admin_row, error_msg]).then(
             render_booking_cards, outputs=booking_display
         )
         refresh_btn.click(render_booking_cards, outputs=booking_display)
         
-        hidden_send_btn.click(
+        # 綁定
+        debug_send_btn.click(
             send_confirmation_hybrid, 
-            inputs=hidden_id_input, 
+            inputs=debug_id_input, 
             outputs=log_output
         ).then(
             render_booking_cards,