Update app.py

app.py

@@ -68,7 +68,7 @@ def toggle_ai_button(use_ai):
     return gr.update(visible=use_ai), gr.update(visible=use_ai)
 
 # ================================
-#  介面配置
+#  介面配置 - 分頁版本
 # ================================
 with gr.Blocks(css="""
     #card-group { padding: 15px; border-radius: 12px; background-color: rgba(255, 255, 255, 0.05); box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); margin-bottom: 15px; }
@@ -76,51 +76,55 @@ with gr.Blocks(css="""
 """) as demo:
     gr.Markdown(project_description())
 
-    with gr.Group():
-        with gr.Row():
-            mode_radio = gr.Radio(
-                ["查詢單字", "隨機抽單字"],
-                label="選擇模式",
-                value="查詢單字",
-                interactive=True
-            )
-
-        with gr.Group(elem_id="card-group"):
-            word_input = gr.Textbox(label="輸入單字", visible=True)
-            num_input = gr.Slider(minimum=1, maximum=10, value=5, step=1, label="抽取單字數量")
-            source_dropdown = gr.Dropdown(
-                choices=get_sources(),
-                value="common3000",
-                label="選擇單字庫"
-            )
-
-    with gr.Group(elem_id="card-group"):
-        use_ai_checkbox = gr.Checkbox(label="使用 AI 生成句子（較慢，約 30 秒）", elem_id="use-ai-checkbox")
-
-        with gr.Row():
-            model_dropdown = gr.Dropdown(
-                choices=MODEL_LIST,
-                value="gpt2",
-                label="選擇 AI 模型",
-                visible=False
-            )
-            ai_warning = gr.Textbox(
-                value="⚠️ 使用 AI 生成句子為功能測試，每一個單字的生成過程可能需要 30 秒以上，請耐心等待。",
-                visible=False,
-                interactive=False,
-                label=""
-            )
-
-    result_output = gr.HTML(label="結果")
-    status_output = gr.Textbox(label="處理狀態", interactive=False)
-
-    with gr.Row():
-        generate_button = gr.Button("✨ 生成句子", elem_id="generate-button")
-        gr.HTML("<a href='quiz_app' target='_blank'><button style='background-color:#ff5722;color:white;'>📝 生成小考</button></a>")
-
-    mode_radio.change(switch_mode, inputs=[mode_radio], outputs=[word_input, num_input])
-    use_ai_checkbox.change(toggle_ai_button, inputs=[use_ai_checkbox], outputs=[model_dropdown, ai_warning])
-    generate_button.click(process_sentence, inputs=[mode_radio, word_input, source_dropdown, num_input, use_ai_checkbox, model_dropdown], outputs=[result_output, status_output])
+    with gr.Tabs():
+        with gr.Tab("單字例句工具"):
+            with gr.Group():
+                with gr.Row():
+                    mode_radio = gr.Radio(
+                        ["查詢單字", "隨機抽單字"],
+                        label="選擇模式",
+                        value="查詢單字",
+                        interactive=True
+                    )
+
+                with gr.Group(elem_id="card-group"):
+                    word_input = gr.Textbox(label="輸入單字", visible=True)
+                    num_input = gr.Slider(minimum=1, maximum=10, value=5, step=1, label="抽取單字數量")
+                    source_dropdown = gr.Dropdown(
+                        choices=get_sources(),
+                        value="common3000",
+                        label="選擇單字庫"
+                    )
+
+            with gr.Group(elem_id="card-group"):
+                use_ai_checkbox = gr.Checkbox(label="使用 AI 生成句子（較慢，約 30 秒）", elem_id="use-ai-checkbox")
+
+                with gr.Row():
+                    model_dropdown = gr.Dropdown(
+                        choices=MODEL_LIST,
+                        value="gpt2",
+                        label="選擇 AI 模型",
+                        visible=False
+                    )
+                    ai_warning = gr.Textbox(
+                        value="⚠️ 使用 AI 生成句子為功能測試，每一個單字的生成過程可能需要 30 秒以上，請耐心等待。",
+                        visible=False,
+                        interactive=False,
+                        label=""
+                    )
+
+            result_output = gr.HTML(label="結果")
+            status_output = gr.Textbox(label="處理狀態", interactive=False)
+
+            with gr.Row():
+                generate_button = gr.Button("✨ 生成句子", elem_id="generate-button")
+
+            mode_radio.change(switch_mode, inputs=[mode_radio], outputs=[word_input, num_input])
+            use_ai_checkbox.change(toggle_ai_button, inputs=[use_ai_checkbox], outputs=[model_dropdown, ai_warning])
+            generate_button.click(process_sentence, inputs=[mode_radio, word_input, source_dropdown, num_input, use_ai_checkbox, model_dropdown], outputs=[result_output, status_output])
+
+        with gr.Tab("英文小考"):
+            gr.HTML("<p>這裡未來可放 quiz 小考頁面的內容或跳轉說明</p>")
 
 # 啟動
-    demo.launch()
+    demo.launch()