1

2026-10-14 14:34:02 +08:00 · 2026-10-14 14:34:02 +08:00 · 05384916e1
parent 22d07cbb6e
commit 05384916e1
5 changed files with 51 additions and 138 deletions
--- a/agent/application/pages/task.py
+++ b/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(
-        rx.hstack(
-            # 任务历史
-            # 工作区
-            rx.box(
-                # 对话历史
+    return rx.hstack(
+        # 渲染消息历史和用户提示词框
        rx.vstack(
+            rx.vstack(
+                # 渲染消息历史
                message_history(),
+                align_items="center",
+                gap="8px",
+                flex="1",
+                width="100%",
+                overflow_y="auto",
+            ),
+            user_prompt_box(),
            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",
        ),
+        # 渲染...
+        width="100%",
+        height="100%",
        # 挂载事件：恢复任务状态
        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",
    )
--- a/agent/application/pages/workbench.py
+++ b/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",
        ),
    )
--- a/agent/application/states/auth.py
+++ b/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:
--- a/agent/application/states/task.py
+++ b/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)
--- a/agent/assets/styles.css
+++ b/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;