Update app.py

app.py

@@ -29,11 +29,12 @@ def get_bookings():
     except:
         return pd.DataFrame()
 
-# 🔥🔥🔥 核心後端：區分「確認信」與「提醒信」 🔥🔥🔥
+# 🔥🔥🔥 5.0 修正版：邏輯統一，不再分流，保證發送 🔥🔥🔥
 def send_confirmation_hybrid(booking_id):
-    if not booking_id: return "❌ 無效 ID (JS Error)"
+    if not booking_id: return "❌ 錯誤：未讀取到 ID"
+    
     try:
-        # 1. 抓取最新資料
+        # 1. 撈資料
         res = supabase.table("bookings").select("*").eq("id", booking_id).execute()
         if not res.data: return "❌ 找不到訂單"
         booking = res.data[0]
@@ -48,20 +49,18 @@ def send_confirmation_hybrid(booking_id):
         
         log_msg = f"🆔 {booking_id}: "
 
-        # 2. 判斷：是「發送提醒」還是「發送確認」？
-        # 如果狀態包含 "確認"，代表客人已經確認過了 -> 發送行前提醒
+        # 2. 準備內容 (不管發送有沒有成功，內容先準備好)
+        # 如果狀態包含「確認」，就準備「提醒信」的內容
+        # 否則，準備「確認信」的內容
         is_reminder = "確認" in current_status
 
         if is_reminder:
-            # ==========================================
-            # 🔔 模式 A：行前提醒 (Reminder)
-            # ==========================================
+            # --- 🅰️ 提醒信內容 (Reminder) ---
             action_label = "提醒"
-            mail_subject = f"🔔 行前提醒: {booking['date']} - Cié Cié Taipei"
+            mail_subject = f"🔔 訂位提醒: {booking['date']} - Cié Cié Taipei"
             
-            # LINE: 純文字提醒，無按鈕
             line_text = (
-                f"🔔 行前提醒\n\n"
+                f"🔔 訂位提醒\n\n"
                 f"{booking['name']} 您好，期待今晚與您相見！\n\n"
                 f"📅 日期：{booking['date']}\n"
                 f"⏰ 時間：{booking['time']}\n"
@@ -69,7 +68,6 @@ def send_confirmation_hybrid(booking_id):
                 f"座位已為您準備好，若需變更請聯繫我們。"
             )
             
-            # Email: 沒有確認按鈕，只有取消連結
             mail_html = f"""
             <div style="background:#1a1a1a; color:#d4af37; padding:20px; border-radius:8px; font-family:sans-serif; border:1px solid #333;">
                 <h2 style="text-align:center; border-bottom:1px solid #444; padding-bottom:15px;">Cié Cié Taipei</h2>
@@ -82,20 +80,16 @@ def send_confirmation_hybrid(booking_id):
                     </ul>
                 </div>
                 <div style="text-align:center; margin-top:30px;">
-                    <span style="color:#888; font-size:14px;">這是一封行前提醒，您無需再次確認。</span><br><br>
+                    <span style="color:#888; font-size:14px;">這是一封行前提醒。</span><br><br>
                     <a href="{cancel_link}" style="display:inline-block; border:1px solid #555; color:#aaa; padding:10px 20px; text-decoration:none; border-radius:50px; font-size:12px;">若無法前來，請點此取消</a>
                 </div>
             </div>
             """
-        
         else:
-            # ==========================================
-            # 🚀 模式 B：訂位確認 (Confirmation)
-            # ==========================================
+            # --- 🅱️ 確認信內容 (Confirmation) ---
             action_label = "確認"
             mail_subject = f"訂位確認: {booking['date']} - Cié Cié Taipei"
             
-            # LINE: 要求確認
             line_text = (
                 f"✅ 訂位確認\n\n"
                 f"{booking['name']} 您好，已收到您的預約。\n\n"
@@ -105,7 +99,6 @@ def send_confirmation_hybrid(booking_id):
                 f"請務必查收 Email 並點擊「確認出席」，謝謝！"
             )
             
-            # Email: 有巨大的確認按鈕
             mail_html = f"""
             <div style="background:#1a1a1a; color:#d4af37; padding:20px; border-radius:8px; font-family:sans-serif; border:1px solid #333;">
                 <h2 style="text-align:center; border-bottom:1px solid #444; padding-bottom:15px;">Cié Cié Taipei</h2>
@@ -124,44 +117,49 @@ def send_confirmation_hybrid(booking_id):
             </div>
             """
 
-        # 3. 執行發送
-        # Send Email
+        # 3. 🔥🔥🔥 關鍵：不管上面是走哪條路，這裡統一執行發送，絕對不跳過 🔥🔥🔥
+        
+        # 發送 Email
         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: log_msg += "❌ MailErr "
+            except Exception as e: log_msg += f"❌ MailErr({str(e)}) "
+        else:
+            log_msg += "⚠️ 無Email "
         
-        # Send LINE
-        if user_id and len(str(user_id)) > 10 and LINE_ACCESS_TOKEN:
+        # 發送 LINE
+        if user_id and len(str(user_id)) > 5 and LINE_ACCESS_TOKEN:
             try:
                 requests.post("https://api.line.me/v2/bot/message/push", 
                               headers={"Authorization": f"Bearer {LINE_ACCESS_TOKEN}"}, 
                               json={"to": user_id, "messages": [{"type": "text", "text": line_text}]})
                 log_msg += f"✅ LINE({action_label}) "
-            except: log_msg += "❌ LINEErr"
+            except Exception as e: log_msg += f"❌ LINEErr({str(e)}) "
+        else:
+            log_msg += "⚠️ 無LINE ID "
 
-        # 4. 更新狀態 (僅在非提醒模式下更新，避免覆蓋已確認狀態)
+        # 4. 更新資料庫 (只有確認信才更新狀態，提醒信不更新)
         if not is_reminder:
             supabase.table("bookings").update({"status": "已發確認信"}).eq("id", booking_id).execute()
         
         return log_msg
-    except Exception as e: return f"Error: {e}"
 
-# 🔥🔥🔥 前端卡片生成 🔥🔥🔥
+    except Exception as e: 
+        return f"🔥 嚴重錯誤: {str(e)}"
+
+# --- 介面渲染 (保持您要的樣式) ---
 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>"
-    
-    if df.empty:
-        return f"{count_html}<div style='text-align:center; padding:60px; color:#666; font-size:1.5em;'>📭 目前沒有訂位資料</div>"
+    if df.empty: return f"{count_html}<div style='text-align:center; padding:60px; color:#666; font-size:1.5em;'>📭 目前沒有訂位資料</div>"
     
     cards_html = f"{count_html}<div style='display: flex; flex-direction: column; gap: 24px; padding-bottom: 50px;'>"
     
     for index, row in df.iterrows():
         status = row.get('status', '待處理')
-        # 顏色邏輯
+        
+        # 狀態與顏色
         status_color = "#ccc"; border_color = "#444"
         if '確認' in status: status_color = "#2ecc71"; border_color = "#2ecc71"
         elif '取消' in status: status_color = "#e74c3c"; border_color = "#e74c3c"
@@ -170,19 +168,18 @@ def render_booking_cards():
         is_canceled = '取消' in status
         is_confirmed = '確認' in status
         
-        # JS 事件綁定 (只要不是取消，都能點)
+        # JS 綁定
         btn_onclick = "" if is_canceled else f"cardAction({row['id']})"
         
-        # 按鈕外觀邏輯
+        # 按鈕外觀
         if is_canceled:
             btn_style = "background: #333; color: #666; cursor: not-allowed;"
             btn_text = "🚫 已取消"
         elif is_confirmed:
-            # 🔔 已確認 -> 發送提醒
-            btn_style = "background: #2c3e50; color: #fff; border: 1px solid #555; box-shadow: 0 0 10px rgba(46, 204, 113, 0.2);"
-            btn_text = "🔔 發送提醒" 
+            btn_style = "background: #2c3e50; color: #fff; border: 1px solid #555; box-shadow: 0 0 8px rgba(46, 204, 113, 0.3);"
+            btn_text = "🔔 發送提醒"
         elif '已發' in status:
-            btn_style = "background: #444; color: #ddd; border: 1px solid #666;"
+            btn_style = "background: #2c3e50; color: #ddd; border: 1px solid #555;"
             btn_text = "🔄 重發確認"
         else:
             btn_style = "background: #d4af37; color: #000; font-weight:800; box-shadow: 0 4px 12px rgba(212, 175, 55, 0.5);"
@@ -239,10 +236,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 onclick="{btn_onclick}" 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 onclick="{btn_onclick}" 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>
@@ -261,66 +255,45 @@ def check_login(user, password):
             admin_row: gr.update(visible=True),
             error_msg: ""
         }
-    else:
-        return {error_msg: "<span style='color: red'>❌ 帳號或密碼錯誤</span>"}
+    else: return {error_msg: "<span style='color: red'>❌ 帳號或密碼錯誤</span>"}
 
-# --- JS 邏輯 (強化版: 找按鈕更精確) ---
+# --- JS 邏輯 ---
 js_logic = """
 function() {
     window.cardAction = function(id) {
-        // 1. 更新隱藏 ID
         let idInput = document.querySelector('#hidden_id_input input');
-        if (!idInput) return alert("System Error: Cannot find ID input");
-        
-        idInput.value = id;
-        idInput.dispatchEvent(new Event('input', { bubbles: true }));
-        
-        // 2. 觸發隱藏按鈕 (針對 Off-screen 元件的點擊)
+        if (idInput) {
+            idInput.value = id;
+            idInput.dispatchEvent(new Event('input', { bubbles: true }));
+        }
         setTimeout(() => {
             const sendBtn = document.querySelector('#hidden_send_btn');
             if (sendBtn) sendBtn.click();
-            else alert("System Error: Cannot find Send button");
-        }, 100);
+        }, 150);
     }
 }
 """
 
-# --- CSS (🔥 關鍵修正：移出螢幕而非隱藏，保證 JS 按得到) ---
+# --- 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;
-}
-
+#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; }
 
-#header-panel {
-    background: #1a1a1a;
-    padding: 15px;
-    margin-bottom: 20px;
-    border-radius: 10px;
-}
-
-/* 🔥 這裡最重要：不要用 display: none，而是移到畫面外 */
-/* 這樣 Gradio 會認為它是可見的，點擊事件才會生效 */
+/* 絕對定位移出畫面，確保 JS 抓得到 */
 #hidden_ops {
     position: absolute !important;
     left: -9999px !important;
-    top: -9999px !important;
-    width: 1px !important;
-    height: 1px !important;
+    top: 0 !important;
+    width: 0 !important;
+    height: 0 !important;
     overflow: hidden !important;
-    opacity: 0 !important;
 }
 """
 
 # --- 介面 ---
 with gr.Blocks(title="Admin") as demo:
-    
     with gr.Group(visible=True) as login_row:
         gr.Markdown("# 🔒 Login")
         with gr.Row():
@@ -336,7 +309,7 @@ with gr.Blocks(title="Admin") as demo:
         
         booking_display = gr.HTML(elem_id="booking_display")
         
-        # 🔥 隱藏操作區：visible=True (讓元件存在)，但 CSS 把它踢到外太空
+        # 🔥 確保 visible=True
         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")
@@ -346,9 +319,9 @@ with gr.Blocks(title="Admin") as demo:
         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(
             send_confirmation_hybrid, 
             inputs=hidden_id_input,