1

agent/application/pages/task.py

@@ -46,7 +46,7 @@ def task_history_item(
             width="100%",
             margin_bottom="8px",
             # 点击事件：设置激活任务
-            on_click=lambda: TaskState.set_task(item.id),
+            on_click=lambda: TaskState.set_current_task_id(item.id),
         ),
         # 会话历史项的更多按钮
         rx.box(
@@ -855,10 +855,10 @@ def conversation_creating() -> rx.Component:
     )
 
 
-def user_prompt_sending() -> rx.Component:
+def user_prompt_box() -> rx.Component:
     """
-    用户提示词发送
+    用户提示词框
-    :return: Component
+    :return: rx.Component
     """
     return rx.vstack(
         # 创建对话
@@ -954,10 +954,6 @@ def user_prompt_sending() -> rx.Component:
             font_size="var(--prismui-font-size-1)",
             color="var(--prismui-color-10)",
         ),
-        position="absolute",
-        bottom="0",
-        left="0",
-        right="0",
         z_index="99",
         display="flex",
         flex_direction="column",
@@ -969,123 +965,32 @@ def user_prompt_sending() -> rx.Component:
     )
 
 
-def conversation_history_toggle_button(
-    is_conversation_history_shown: bool,
-) -> rx.Component:
-    """
-    会话历史显示 / 隐藏按钮
-    :param is_conversation_history_shown: 会话历史展示状态
-    :return: Component
-    """
-    return rx.button(
-        rx.icon(
-            rx.cond(is_conversation_history_shown, "chevron-left", "chevron-right"),
-            stroke_width=1,
-            width="16px",
-            height="16px",
-            color="var(--prismui-color-3)",
-        ),
-        position="absolute",
-        top="calc(50% - 20px)",
-        z_index="99",
-        width="16px",
-        height="40px",
-        background_color="var(--prismui-background-color-1)",
-        border_radius=rx.cond(
-            is_conversation_history_shown,
-            "var(--prismui-border-radius-2)",
-            "0 var(--prismui-border-radius-2)",
-        ),
-        box_shadow="var(--prismui-box-shadow-4)",
-        transition="all 0.18s ease-in-out",
-        cursor="pointer",
-    )
-
-
 def task_page() -> rx.Component:
     """
     任务页面
+    :return: rx.Component
     """
-    return rx.box(
+    return rx.hstack(
-        rx.hstack(
+        # 渲染消息历史和用户提示词框
-            # 任务历史
+        rx.vstack(
-            # 工作区
+            rx.vstack(
-            rx.box(
+                # 渲染消息历史
-                # 对话历史
+                message_history(),
-                rx.vstack(
+                align_items="center",
-                    message_history(),
+                gap="8px",
-                    width="100%",
-                    height="100%",
-                    gap="8px",
-                    align_items="center",
-                ),
-                # 用户提示词发送
-                user_prompt_sending(),
-                position="relative",
-                display="flex",
                 flex="1",
-                width="0",
+                width="100%",
-                height="100%",
+                overflow_y="auto",
-                padding_bottom="120px",
-                background="var(--prismui-background-2)",
             ),
-            position="relative",
+            user_prompt_box(),
-            display="flex",
+            width="100%",
-            flex="1",
             height="100%",
-            min_height="0",
+            background="var(--prismui-background-2)",
             overflow="hidden",
-            transition="all 0.18s ease-in-out",
         ),
-        # 挂载事件：恢复任务状态
+        # 渲染...
-        on_mount=AuthState.resume_task_state,
-        position="relative",
         width="100%",
         height="100%",
-        border_radius="var(--prismui-border-radius-4)",
-        overflow="hidden",
-    )
-
-
-def conversation_page() -> rx.Component:
-    """
-    会话页面：布局参考 MetaChat，从左到右分别为会话历史和工作区。其中，工作区从上到下分别为消息历史和用户提示词输入框。
-    """
-    return rx.box(
-        rx.hstack(
-            # 工作区
-            rx.box(
-                # 对话历史
-                rx.vstack(
-                    message_history(),
-                    width="100%",
-                    height="100%",
-                    gap="8px",
-                    align_items="center",
-                ),
-                # 用户提示词发送
-                user_prompt_sending(),
-                position="relative",
-                display="flex",
-                flex="1",
-                width="0",
-                height="100%",
-                padding_bottom="120px",
-                background="var(--prismui-background-2)",
-            ),
-            position="relative",
-            display="flex",
-            flex="1",
-            height="100%",
-            min_height="0",
-            overflow="hidden",
-            transition="all 0.18s ease-in-out",
-        ),
         # 挂载事件：恢复任务状态
         on_mount=AuthState.resume_task_state,
-        position="relative",
-        width="100%",
-        height="100%",
-        border_radius="var(--prismui-border-radius-4)",
-        overflow="hidden",
     )

agent/application/pages/workbench.py

@@ -28,8 +28,9 @@ def nav_button(
     :param nav_button: 导航按钮
     :return : Component
     """
-    # 导航按钮激活状态
+
-    is_actived = nav_button == AuthState.activated_nav_button
+    # 导航按钮选中状态
+    is_selected = nav_button == AuthState.selected_nav_button
 
     return rx.hstack(
         # 导航按钮的图标
@@ -37,7 +38,7 @@ def nav_button(
             NAV_BUTTONS[nav_button]["src"],
             width="16px",
             height="16px",
-            object_fit="contain",
+            object_fit="contain",  # 保持图标宽高比
         ),
         # 导航按钮的文本
         rx.text(
@@ -45,19 +46,21 @@ def nav_button(
             line_height="20px",
             font_size="var(--prismui-font-size-2)",
             font_weight=rx.cond(
-                is_actived, "--prismui-font-weight-3", None
+                is_selected, "var(--prismui-font-weight-3)", None
-            ),  # 通过加粗字体区分是否激活
+            ),  # 通过加粗字体区分是否选中
             color="var(--prismui-color-1)",
         ),
         align_items="center",
         gap="8px",
+        width="100%",
         padding="5px 12px",
         background_color=rx.cond(
-            is_actived, "var(--prismui-background-color-2)", "transparent"
+            is_selected, "var(--prismui-background-color-2)", "transparent"
-        ),
+        ),  # 通过背景颜色区分是否选中
+        border_radius="var(--prismui-border-radius-3)",
         cursor="pointer",
-        # 点击事件：设置激活导航按钮
+        # 点击事件：设置选中导航按钮
-        on_click=AuthState.set_activated_nav_button(nav_button),
+        on_click=AuthState.set_selected_nav_button(nav_button),
     )
 
 
@@ -100,7 +103,7 @@ def task_history_item(
             width="100%",
             padding="5px 0",
             # 点击事件：设置激活任务
-            on_click=lambda: TaskState.set_task(item.id),
+            on_click=lambda: TaskState.set_current_task_id(item.id),
         ),
         width="100%",
     )
@@ -308,16 +311,15 @@ def workbench() -> rx.Component:
         rx.hstack(
             # 侧边栏
             sidebar(),
-            # 默认新建任务页面
+            # 根据选中的导航按钮渲染对应的页面
             rx.match(
-                AuthState.activated_nav_button,
+                AuthState.selected_nav_button,
                 # 知识库页面
                 ("knowledge_base", knowledge_base_page()),
-                # 会话页面
+                # 任务页面
                 task_page(),
             ),
             width="100%",
             height="100vh",
-            overflow="auto",
         ),
     )

agent/application/states/auth.py

@@ -44,8 +44,8 @@ class AuthState(rx.State):
     # 登录中状态
     is_logging_in: bool = False
 
-    # 激活的导航按钮
+    # 选中的导航按钮，默认为创建任务
-    activated_nav_button: str = "conversation"
+    selected_nav_button: str = "create_task"
     # 设置悬停卡片打开状态
     is_settings_hover_card_open: bool = False
 
@@ -279,11 +279,17 @@ class AuthState(rx.State):
         self.is_settings_hover_card_open = is_settings_hover_card_open
 
     @rx.event
-    def set_activated_nav_button(self, nav_button: str):
+    async def set_selected_nav_button(self, nav_button: str):
         """
-        设置激活导航按钮
+        设置选中导航按钮
         """
-        self.activated_nav_button = nav_button
+        self.selected_nav_button = nav_button
+
+        if nav_button == "create_task":
+            # 获取任务状态
+            task_state = await self.get_state(TaskState)
+            # 将空设置为当前任务唯一标识
+            task_state.set_current_task_id("")
 
     @rx.event
     async def logout(self) -> None:

agent/application/states/task.py

@@ -174,9 +174,9 @@ class TaskState(rx.State):
             self.task_id = next(reversed(self.tasks.keys()))
 
     @rx.event
-    def set_task(self, task_id: str) -> None:
+    def set_current_task_id(self, task_id: str) -> None:
         """
-        将指定任务设置为当前任务
+        将指定任务唯一标识设置为当前任务唯一标识
         :param task_id: 任务唯一标识
         :return: None
         """
@@ -185,8 +185,8 @@ class TaskState(rx.State):
     @rx.var
     def message_history(self) -> list[MessageHistoryItem]:
         """
-        获取当前会话的消息历史
+        获取当前任务的消息历史
-        :return: 当前会话的消息历史
+        :return: 当前任务的消息历史
         """
         # 当前任务
         task = self.tasks.get(self.task_id)

agent/assets/styles.css

@@ -1,6 +1,6 @@
 :root {
     --prismui-background-color-1: #ffffff;
-    --prismui-background-color-2: #ebebeb;
+    --prismui-background-color-2: #e6e6e6;
     --prismui-background-color-3: rgb(230, 230, 230);
     --prismui-background-color-4: #babbc0;
     --prismui-background-color-5: #ffffff33;