refactor UXUI at full paragraph

app.py

@@ -881,7 +881,6 @@ def generate_correct_grammatical_spelling_errors(model, max_tokens, sys_content,
             error_msg = "選擇的模型不存在或無法存取"
         raise gr.Error(error_msg)
 
-
 def highlight_diff_texts(highlight_list, text):
     """
     將文本中需要高亮的部分用紅色標記出來
@@ -3250,48 +3249,49 @@ with gr.Blocks(theme=THEME, css=CSS) as demo:
                     with gr.Row():
                         with gr.Column():
                             full_paragraph_input = gr.TextArea(label="輸入段落全文")
-                        with gr.Column():
+                    with gr.Row():
+                        full_paragraph_ai_analysis_button = gr.Button("✨ JUTOR 分析", variant="primary")
+
+                    with gr.Tabs():
+                        with gr.TabItem("JUTOR 段落全文分析"):
                             with gr.Row():
-                                full_paragraph_evaluate_button = gr.Button("✨ JUTOR 段落全文分析", variant="primary")
+                                full_paragraph_evaluate_button = gr.Button("✨ JUTOR 段落全文分析", variant="primary", visible=False)
                             with gr.Row():
                                 full_paragraph_evaluate_output = gr.Dataframe(label="段落全文分析", wrap=True, column_widths=[35, 15, 50], interactive=False)
 
-                    # JUTOR 段落批改與整體建議
-                    with gr.Row():
-                        gr.Markdown("# JUTOR 修訂文法與拼字錯誤")
-                    with gr.Row():
-                        with gr.Column():
-                            full_paragraph_correct_grammatical_spelling_errors_input = gr.TextArea(label="這是你的原始寫作內容，參考 JUTOR 的建議，你可以選擇是否修改：")
-                        with gr.Column():
-                            generate_full_paragraph_correct_grammatical_spelling_errors_button = gr.Button("✨ JUTOR 修訂文法與拼字錯誤", variant="primary")
-                            full_paragraph_correct_grammatical_spelling_errors_output_table = gr.Dataframe(label="修訂文法與拼字錯誤", interactive=False, column_widths=[30, 30, 40])
-                            revised_full_paragraph_output = gr.Textbox(label="Revised Paragraph", show_copy_button=True, visible=False)
-                            gr.Markdown("## 修訂建議")
-                            revised_full_paragraph_diff = gr.HTML()
-
-                    # JUTOR 段落批改與整體建議
-                    with gr.Row():
-                        gr.Markdown("# JUTOR 段落改善建議")
-                    with gr.Row():
-                        with gr.Column():
-                            full_paragraph_refine_input = gr.TextArea(label="這是你的原始寫作內容，參考 JUTOR 的建議，你可以選擇是否修改：", show_copy_button=True)
-                        with gr.Column():
-                            generate_full_paragraph_refine_button = gr.Button("✨ JUTOR 段落改善建議", variant="primary")
-                            full_paragraph_refine_output_table = gr.DataFrame(label="段落改善建議", wrap=True, interactive=False)
-                            gr.Markdown("## 修改建議")
-                            full_paragraph_refine_output = gr.HTML(label="修改建議", visible=True)
-                            full_paragraph_refine_output_audio = gr.Audio(label="音檔", type="filepath")
-
-                            # full_paragraph_refine_output_diff = gr.HTML()
+                        with gr.TabItem("JUTOR 修訂文法與拼字錯誤"):
+                            # JUTOR 段落批改與整體建議
+                            with gr.Row():
+                                full_paragraph_correct_grammatical_spelling_errors_input = gr.TextArea(label="這是你的原始寫作內容，參考 JUTOR 的建議，你可以選擇是否修改：", visible=False)
+                            with gr.Row():
+                                with gr.Column():
+                                    generate_full_paragraph_correct_grammatical_spelling_errors_button = gr.Button("✨ JUTOR 修訂文法與拼字錯誤", variant="primary", visible=False)
+                                    full_paragraph_correct_grammatical_spelling_errors_output_table = gr.Dataframe(label="修訂文法與拼字錯誤", interactive=False, column_widths=[30, 30, 40])
+                                    revised_full_paragraph_output = gr.Textbox(label="Revised Paragraph", show_copy_button=True, visible=False)
+                                    gr.Markdown("## 修訂建議")
+                                    revised_full_paragraph_diff = gr.HTML()
+                        with gr.TabItem("JUTOR 段落改善建議"):
+                            # JUTOR 段落批改與整體建議
+                            with gr.Row():
+                                full_paragraph_refine_input = gr.TextArea(label="這是你的原始寫作內容，參考 JUTOR 的建議，你可以選擇是否��改：", show_copy_button=True, visible=False)
+                            with gr.Row():
+                                with gr.Column():
+                                    with gr.Row():
+                                        generate_full_paragraph_refine_button = gr.Button("✨ JUTOR 段落改善建議", variant="primary", visible=False)
+                                        full_paragraph_refine_output_table = gr.DataFrame(label="段落改善建議", wrap=True, interactive=False)
+                                    with gr.Row():
+                                        gr.Markdown("## 修改建議")
+                                    with gr.Row():
+                                        with gr.Column(scale=2):
+                                            full_paragraph_refine_output = gr.HTML(label="修改建議", visible=True)
+                                        with gr.Column(scale=1):
+                                            full_paragraph_refine_output_audio = gr.Audio(label="音檔", type="filepath")
 
                     # 寫作完成
                     with gr.Row():
-                        gr.Markdown("# 寫作完成")
-                    with gr.Row():
-                        full_paragraph_save_button = gr.Button("輸出結果", variant="primary")
+                        gr.Markdown("# 自行根據建議修改")
                     with gr.Row():
-                        full_paragraph_save_output = gr.TextArea(label="最後結果")
-                        full_audio_output = gr.Audio(label="音檔", type="filepath")
+                        full_paragraph_save_output = gr.TextArea(label="自行修改結果")
 
                     # 建立歷程回顧
                     with gr.Row():
@@ -3314,12 +3314,73 @@ with gr.Blocks(theme=THEME, css=CSS) as demo:
                             full_paragraph_refine_input_history = gr.Markdown()
                             gr.Markdown("<span style='color:#4e80ee'>段落改善建議</span>")
                             full_paragraph_refine_output_table_history = gr.Dataframe(wrap=True, interactive=False, column_widths=[30, 30, 40])
-                            
-                            gr.Markdown("<span style='color:#4e80ee'>修改建議</span>")
+
+                            gr.Markdown("<span style='color:#4e80ee'>AI 修改建議</span>")
                             full_paragraph_refine_output_history = gr.Markdown()
-                            gr.Markdown("<span style='color:#4e80ee'>修改結果</span>")
+                            gr.Markdown("<span style='color:#4e80ee'>自行修改結果</span>")
                             full_paragraph_save_output_history = gr.Markdown()
-                           
+                    
+                    # JUTOR 分析
+                    full_paragraph_ai_analysis_button.click(
+                        fn=duplicate_element,
+                        inputs=full_paragraph_input,
+                        outputs=full_paragraph_correct_grammatical_spelling_errors_input
+                    ).then(
+                        fn=duplicate_element,
+                        inputs=full_paragraph_input,
+                        outputs=full_paragraph_refine_input
+                    ).then(
+                        # 段落全文分析
+                        fn=generate_paragraph_evaluate,
+                        inputs=[
+                            model,
+                            max_tokens,
+                            full_paragraph_sys_content_input, 
+                            full_paragraph_input
+                        ],
+                        outputs=full_paragraph_evaluate_output
+                    ).then(
+                        # 修訂文法與拼字錯誤
+                        fn=generate_correct_grammatical_spelling_errors,
+                        inputs=[
+                            model,
+                            max_tokens,
+                            full_paragraph_sys_content_input, 
+                            eng_level_input, 
+                            full_paragraph_correct_grammatical_spelling_errors_input, 
+                        ],
+                        outputs=[
+                            full_paragraph_correct_grammatical_spelling_errors_output_table,
+                            revised_full_paragraph_output
+                        ]
+                    ).then(
+                        fn=highlight_diff_texts,
+                        inputs=[full_paragraph_correct_grammatical_spelling_errors_output_table, revised_full_paragraph_output],
+                        outputs=revised_full_paragraph_diff
+                    ).then(
+                        # 段落改善建議
+                        fn=generate_refine_paragraph,
+                        inputs=[
+                            model,
+                            max_tokens,
+                            full_paragraph_sys_content_input,
+                            eng_level_input, 
+                            full_paragraph_refine_input, 
+                        ],
+                        outputs=[
+                            full_paragraph_refine_output_table,
+                            full_paragraph_refine_output,
+                        ]
+                    ).then(
+                        fn=paragraph_save_and_tts,
+                        inputs=[full_paragraph_refine_output],
+                        outputs=[
+                            full_paragraph_refine_output,
+                            full_paragraph_refine_output_audio
+                        ]
+                    )
+
+                    # 段落全文分析
                     full_paragraph_evaluate_button.click(
                         fn=generate_paragraph_evaluate,
                         inputs=[
@@ -3334,7 +3395,8 @@ with gr.Blocks(theme=THEME, css=CSS) as demo:
                         inputs=[full_paragraph_input],
                         outputs=full_paragraph_correct_grammatical_spelling_errors_input
                     )
-                    
+
+                    # 修訂文法與拼字錯誤
                     generate_full_paragraph_correct_grammatical_spelling_errors_button.click(
                         fn=generate_correct_grammatical_spelling_errors,
                         inputs=[
@@ -3355,6 +3417,7 @@ with gr.Blocks(theme=THEME, css=CSS) as demo:
                         outputs=full_paragraph_refine_input
                     )
 
+                    # 段落改善建議
                     generate_full_paragraph_refine_button.click(
                         fn=generate_refine_paragraph,
                         inputs=[
@@ -3377,12 +3440,6 @@ with gr.Blocks(theme=THEME, css=CSS) as demo:
                         ]
                     )
 
-                    full_paragraph_save_button.click(
-                        fn=paragraph_save_and_tts,
-                        inputs=[full_paragraph_refine_input],
-                        outputs=[full_paragraph_save_output, full_audio_output]
-                    )
-
                     full_paragraph_history_save_button.click(
                         fn=generate_paragraph_evaluate_history,
                         inputs=[