Update app.py

app.py

@@ -679,13 +679,13 @@ def get_demo_path(filename):
 #                 ]], 
 #                 inputs=llm_input
 #             )
+
 with gr.Blocks(title="AI 剧本视频工厂") as demo:
     gr.Markdown("# 🎬 ScriptAgent & Sora/Veo 视频生成工坊 ")
     
-    # 🔥 给 Tabs 添加 elem_id
-    with gr.Tabs(elem_id="main_tabs") as tabs:
+    with gr.Tabs():
         # --- TAB 1: 剧本创作 ---
-        with gr.Tab("📝 第一步：剧本创作", id=0):
+        with gr.Tab("📝 第一步：剧本创作"):
             with gr.Row():
                 with gr.Column():
                     llm_input = gr.Textbox(
@@ -701,7 +701,14 @@ with gr.Blocks(title="AI 剧本视频工厂") as demo:
                         lines=10, 
                         interactive=True
                     )
-                    to_video_btn = gr.Button("⬇️ 发送到视频生成", variant="secondary")
+                    # 🔥 修改：添加提示信息组件
+                    copy_status = gr.Textbox(
+                        label="", 
+                        value="", 
+                        visible=False,
+                        elem_classes="copy-status"
+                    )
+                    to_video_btn = gr.Button("⬇️ 复制到视频生成", variant="secondary")
             
             gr.Examples(
                 [[
@@ -712,7 +719,7 @@ with gr.Blocks(title="AI 剧本视频工厂") as demo:
                 inputs=llm_input
             )
             
-            # 🔥 新增：本地部署代码展示区
+            # 本地部署代码展示区（保持不变）
             gr.Markdown("---")
             with gr.Accordion("💻 本地部署完整代码（点击展开查看）", open=False):
                 gr.Markdown("""
@@ -733,13 +740,13 @@ print("下载模型所有文件...")
 snapshot_download(
     repo_id=model_name,
     local_dir=local_path,
-    local_dir_use_symlinks=False,  # 直接复制文件，不使用符号链接
-    resume_download=True  # 支持断点续传
+    local_dir_use_symlinks=False,
+    resume_download=True
 )
 
 print(f"模型已完整下载到: {local_path}")
 
-# 然后使用 SWIFT 加载
+# 使用 SWIFT 加载
 from swift.llm import PtEngine, RequestConfig, InferRequest
 
 engine = PtEngine(local_path, max_batch_size=1)
@@ -780,7 +787,19 @@ print(response.choices[0].message.content)'''
                 """)
         
         # --- TAB 2: 视频生成 ---
-        with gr.Tab("🎥 第二步：视频生成", id=1):
+        with gr.Tab("🎥 第二步：视频生成"):
+            # 🔥 新增：顶部提示区域
+            gr.Markdown("""
+            <div style="background: linear-gradient(90deg, #667eea 0%, #764ba2 100%); 
+                        padding: 15px; 
+                        border-radius: 10px; 
+                        color: white; 
+                        text-align: center; 
+                        margin-bottom: 20px;">
+                💡 <b>提示</b>：在「第一步：剧本创作」中点击「⬇️ 复制到视频生成」后，剧本会自动填充到下方「分镜脚本」输入框
+            </div>
+            """)
+            
             with gr.Row():
                 # 左侧配置区
                 with gr.Column(scale=1):
@@ -822,7 +841,8 @@ print(response.choices[0].message.content)'''
                     video_script_input = gr.TextArea(
                         label="分镜脚本", 
                         lines=8, 
-                        placeholder="1. [0-8秒] ..."
+                        placeholder="1. [0-8秒] ...",
+                        elem_classes="script-input"  # 🔥 添加样式类
                     )
                     gen_btn = gr.Button("🚀 开始生成", variant="primary")
                     status_log = gr.Textbox(label="日志", interactive=False)
@@ -843,7 +863,6 @@ print(response.choices[0].message.content)'''
                     gr.Markdown("---")
                     gr.Markdown("### 🌟 精选成片案例 (Demo Showcase)")
                     
-                    # 使用 2x2 布局
                     for i in range(0, 4, 2): 
                         with gr.Row():
                             for j in range(2): 
@@ -862,26 +881,46 @@ print(response.choices[0].message.content)'''
                                                     interactive=False
                                                 )
     
-    # 🔥 页面底部警告提示
+    # 页面底部警告
     gr.HTML('<p style="color: red; font-weight: bold; text-align: center; margin-top: 20px; font-size: 16px;">⚠️ 注意：仅供简单测试，由于成本问题在线平台内存只有18G，我们量化了模型，性能效果并不能保证，如果需要最准确的输出请自行部署即可</p>')
 
+    # 🔥 添加自定义 CSS 实现高亮动画
+    demo.load(
+        None,
+        None,
+        None,
+        js="""
+        function() {
+            const style = document.createElement('style');
+            style.textContent = `
+                @keyframes highlight {
+                    0%, 100% { background-color: transparent; }
+                    50% { background-color: rgba(102, 126, 234, 0.2); }
+                }
+                .script-input.highlight {
+                    animation: highlight 1.5s ease-in-out 3;
+                    border: 2px solid #667eea !important;
+                }
+            `;
+            document.head.appendChild(style);
+        }
+        """
+    )
+
     # --- 逻辑绑定 ---
     llm_btn.click(chat_with_scriptagent, llm_input, llm_output)
     
-    # 🔥 关键修改：使用 _js 参数执行 JavaScript 切换标签页
+    # 🔥 修改后的按钮逻辑：复制文本 + 显示成功提示
+    def copy_to_video(script_text):
+        """复制剧本到视频生成标签页"""
+        if not script_text or not script_text.strip():
+            return script_text, gr.update(value="⚠️ 剧本为空，无法复制", visible=True)
+        return script_text, gr.update(value="✅ 已复制到「第二步：视频生成」→「分镜脚本」，请切换标签页查看", visible=True)
+    
     to_video_btn.click(
-        fn=lambda x: x,  # 只返回剧本内容
+        fn=copy_to_video,
         inputs=llm_output,
-        outputs=video_script_input,
-        _js="""
-        () => {
-            // 查找第二个标签页按钮并点击
-            const tabs = document.querySelectorAll('#main_tabs button[role="tab"]');
-            if (tabs && tabs.length > 1) {
-                tabs[1].click();  // 点击第二个标签页
-            }
-        }
-        """
+        outputs=[video_script_input, copy_status]
     )
     
     model_sel.change(