Spaces:
Running
Running
File size: 5,507 Bytes
91b069f 4bfed4c 91b069f e794799 ccfb5f6 6320354 e20d451 ccfb5f6 07267f6 51f8064 07267f6 51f8064 e20d451 ccfb5f6 e794799 91b069f e794799 51f8064 d43a0d9 e794799 51f8064 d43a0d9 e794799 2239e64 51f8064 e794799 51f8064 e20d451 07267f6 2239e64 07267f6 2239e64 07267f6 2239e64 51f8064 d43a0d9 51f8064 e20d451 07267f6 51f8064 d43a0d9 51f8064 e20d451 51f8064 d43a0d9 91b069f e794799 4bfed4c e20d451 4bfed4c 6320354 4bfed4c d43a0d9 4bfed4c d43a0d9 4bfed4c 6320354 e20d451 6320354 e20d451 6320354 4bfed4c 91b069f 4bfed4c 6320354 ccfb5f6 51f8064 ccfb5f6 91b069f ccfb5f6 d43a0d9 91b069f 51f8064 e20d451 4bfed4c 51f8064 e20d451 ccfb5f6 51f8064 e20d451 d43a0d9 e20d451 51f8064 ccfb5f6 e20d451 91b069f e20d451 ccfb5f6 e794799 ccfb5f6 e20d451 91b069f ccfb5f6 | 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150 | import gradio as gr
from datetime import datetime, timedelta
# --- 1. 主題配色 ---
theme = gr.themes.Soft(
primary_hue="amber",
neutral_hue="zinc",
font=[gr.themes.GoogleFont("Playfair Display"), "ui-sans-serif", "sans-serif"],
).set(
body_background_fill="#0F0F0F",
block_background_fill="#1a1a1a",
block_border_width="1px",
block_border_color="#333",
input_background_fill="#262626",
input_border_color="#444",
body_text_color="#E0E0E0",
block_title_text_color="#d4af37",
button_primary_background_fill="#d4af37",
button_primary_text_color="#000000",
)
# --- 2. CSS ---
custom_css = """
/* 隱藏 Gradio 原生 footer */
footer {display: none !important;}
/* 強制讓所有容器允許內容溢出 */
.gradio-container, .block, .row, .column {
overflow: visible !important;
}
/* 下拉選單樣式修正 */
.options, .wrap .options {
background-color: #262626 !important;
border: 1px solid #d4af37 !important;
z-index: 10000 !important;
box-shadow: 0 5px 15px rgba(0,0,0,0.5);
}
/* 選單內的選項 */
.item, .options .item {
color: #E0E0E0 !important;
padding: 8px 12px !important;
}
/* 滑鼠滑過選項 */
.item:hover, .item.selected, .options .item:hover {
background-color: #d4af37 !important;
color: black !important;
}
/* 輸入框聚焦時的金色光暈 */
input:focus, .dropdown-trigger:focus-within {
border-color: #d4af37 !important;
box-shadow: 0 0 8px rgba(212, 175, 55, 0.4) !important;
}
/* 標題樣式 */
h3 {
border-bottom: 1px solid #444;
padding-bottom: 5px;
margin-bottom: 10px;
}
"""
# --- 核心邏輯 ---
def get_date_options():
options = []
today = datetime.now()
weekdays = ["(一)", "(二)", "(三)", "(四)", "(五)", "(六)", "(日)"]
for i in range(30):
current_date = today + timedelta(days=i)
date_str = f"{current_date.strftime('%Y-%m-%d')} {weekdays[current_date.weekday()]}"
options.append(date_str)
return options
def update_time_slots(date_str):
if not date_str:
return gr.update(choices=[]), "請先選擇日期"
try:
clean_date_str = date_str.split(" ")[0]
date_obj = datetime.strptime(clean_date_str, "%Y-%m-%d")
weekday = date_obj.weekday()
except:
return gr.update(choices=[]), "日期格式錯誤"
slots = ["18:00", "18:30", "19:00", "19:30", "20:00", "20:30",
"21:00", "21:30", "22:00", "22:30", "23:00", "23:30",
"00:00", "00:30", "01:00"]
if weekday == 4 or weekday == 5:
slots.extend(["01:30", "02:00", "02:30"])
status_msg = f"✨ 已選擇 {date_str} (週末營業至 03:00)"
else:
slots.extend(["01:30"])
status_msg = f"🌙 已選擇 {date_str} (平日營業至 02:00)"
return gr.update(choices=slots, value=slots[0] if slots else None), status_msg
def handle_booking(name, tel, date_str, time, pax):
if not name or not tel or not date_str or not time:
return "⚠️ 請完整填寫所有欄位"
return f"""
<div style='text-align: center; color: #fff; padding: 20px; border: 1px solid #d4af37; border-radius: 8px; background: #222;'>
<h2 style='color: #d4af37; margin: 0;'>Request Received</h2>
<p style='margin: 10px 0;'>🥂 預約申請已提交</p>
<p style='font-size: 0.9em; color: #aaa;'>系統將發送確認信至您的信箱。</p>
</div>
"""
# --- 介面佈局 ---
with gr.Blocks(theme=theme, css=custom_css, title="Booking") as demo:
with gr.Row():
with gr.Column():
gr.Markdown("### 📅 預約資訊 Booking Info")
date_options = get_date_options()
booking_date = gr.Dropdown(choices=date_options, label="選擇日期 Select Date", interactive=True)
pax_count = gr.Slider(minimum=1, maximum=10, value=2, step=1, label="用餐人數 Guest Count")
with gr.Column():
gr.Markdown("### 🕰️ 選擇時段 Time Slot")
status_box = gr.Markdown("請先選擇日期...", visible=True)
time_slot = gr.Dropdown(choices=[], label="可用時段 Available Time", interactive=True)
gr.HTML("<div style='height: 20px'></div>")
gr.Markdown("### 👤 聯絡人資料 Contact")
with gr.Group():
with gr.Row():
cust_name = gr.Textbox(label="訂位姓名 Name", placeholder="ex. 王小明")
cust_tel = gr.Textbox(label="手機號碼 Phone", placeholder="ex. 0912-xxx-xxx")
gr.HTML("<div style='height: 20px'></div>")
submit_btn = gr.Button("確認預約 Request Booking", size="lg", variant="primary")
output_msg = gr.HTML(label="系統訊息")
# --- 新增的頁尾宣告區 ---
gr.HTML("""
<div style="text-align: center; margin-top: 50px; padding-top: 20px; border-top: 1px solid #333; color: #666; font-size: 0.8rem; line-height: 1.6;">
<p>© 2026 CIE CIE TAIPEI. All Rights Reserved.</p>
<p style="margin-top: 5px; color: #888;">內容涉及酒類產品訊息,請勿轉發分享給未達法定購買年齡者;未滿十八歲請勿飲酒。<br>喝酒不開車,開車不喝酒。</p>
</div>
""")
booking_date.change(update_time_slots, inputs=booking_date, outputs=[time_slot, status_box])
submit_btn.click(handle_booking, inputs=[cust_name, cust_tel, booking_date, time_slot, pax_count], outputs=output_msg)
if __name__ == "__main__":
demo.launch() |