Update app.py

app.py

@@ -19,94 +19,72 @@ def init_data_file():
 # 保存活動數據
 def save_activity(activity):
     timestamp = datetime.datetime.now()
-    record = {"activity": activity, "timestamp": timestamp.strftime("%Y-%m-%d %H:%M:%S")}
+    record = {"活動": activity, "時間": timestamp.strftime("%Y-%m-%d %H:%M:%S")}
     with open(data_file, "r") as file:
         data = json.load(file)
     data.append(record)
     with open(data_file, "w") as file:
         json.dump(data, file)
-    return f"記錄成功：{activity} - {record['timestamp']}"
+    return f"記錄成功：{activity} - {record['時間']}", pd.DataFrame(data)
 
-# 獲取活動數據並展示為表格
+# 獲取活動數據
 def get_activity_data():
-    with open(data_file, "r") as file:
-        data = json.load(file)
-    df = pd.DataFrame(data)
-    return df if not df.empty else pd.DataFrame(columns=["活動", "時間"])
+    try:
+        with open(data_file, "r") as file:
+            data = json.load(file)
+        return pd.DataFrame(data)
+    except:
+        return pd.DataFrame(columns=["活動", "時間"])
 
 # 驗證用戶登錄
 def login(username, password):
     if username in users and users[username] == password:
-        return True, "登錄成功"
+        return gr.update(visible=False), gr.update(visible=True), "登錄成功"
     else:
-        return False, "用戶名或密碼錯誤"
+        return gr.update(visible=True), gr.update(visible=False), "用戶名或密碼錯誤"
 
 # 主界面
 def main_interface():
-    with gr.Blocks(css=custom_css) as app:
+    init_data_file()
+
+    with gr.Blocks() as app:
         # 登錄界面
-        gr.Markdown("## 🐾 狗狗活動記錄器 - 登錄")
-        with gr.Row():
+        login_section = gr.Column(visible=True)
+        with login_section:
+            gr.Markdown("## 🐾 狗狗活動記錄器 - 登錄")
             username = gr.Textbox(label="用戶名", placeholder="輸入用戶名")
             password = gr.Textbox(label="密碼", type="password", placeholder="輸入密碼")
-        login_btn = gr.Button(value="登錄")
-        login_msg = gr.Textbox(label="消息", interactive=False, visible=True)
+            login_btn = gr.Button("登錄")
+            login_msg = gr.Textbox(label="消息", interactive=False)
 
-        # 主內容（隱藏直到登錄成功）
-        main_content = gr.Column(visible=False)
-        with main_content:
+        # 主內容界面
+        main_section = gr.Column(visible=False)
+        with main_section:
             gr.Markdown("### 🚀 點擊按鈕記錄活動")
-            # 活動按鈕區域
+            activity_buttons = gr.Row()
             buttons = ["拉屎", "尿尿", "全吃了", "吃了一半", "沒怎麼吃"]
-            with gr.Row():
-                activity_buttons = [gr.Button(value=btn) for btn in buttons]
+            activity_btns = [gr.Button(value=btn) for btn in buttons]
 
+            # 活動記錄表格
             gr.Markdown("### 📊 活動記錄")
-            data_table = gr.Dataframe(headers=["活動", "時間"], datatype=["str", "str"], interactive=False, max_rows=10)
+            data_table = gr.Dataframe(value=get_activity_data(), interactive=False)
 
-        # 功能邏輯
-        def handle_login(username, password):
-            success, msg = login(username, password)
-            return gr.update(visible=success), gr.update(value=msg)
+        # 登錄邏輯
+        login_btn.click(
+            login, 
+            inputs=[username, password], 
+            outputs=[login_section, main_section, login_msg]
+        )
 
-        def handle_activity(activity):
-            save_activity(activity)
-            return get_activity_data()
-
-        # 綁定登錄按鈕事件
-        login_btn.click(handle_login, inputs=[username, password], outputs=[main_content, login_msg])
-
-        # 綁定活動按鈕事件
-        for btn, activity in zip(activity_buttons, buttons):
+        # 綁定按鈕事件
+        for btn, activity in zip(activity_btns, buttons):
             btn.click(
-                lambda a=activity: handle_activity(a),
+                lambda a=activity: save_activity(a),
                 inputs=[],
-                outputs=[data_table]
+                outputs=[login_msg, data_table]
             )
 
     return app
 
-# 初始化數據文件
-init_data_file()
-
-# 自定義CSS來優化小屏幕顯示
-custom_css = """
-h1, h2, h3 {
-    text-align: center;
-}
-@media (max-width: 768px) {
-    .gradio-container {
-        padding: 10px;
-    }
-    .gr-button {
-        font-size: 12px;
-        padding: 8px;
-    }
-    input, textarea {
-        font-size: 12px;
-    }
-}
-"""
-
 # 啟動應用
 main_interface().launch(share=True, server_name="0.0.0.0", server_port=7860)