diff --git a/智能体/application/application.py b/智能体/application/application.py
index 2e7967e..7191d2c 100644
--- a/智能体/application/application.py
+++ b/智能体/application/application.py
@@ -12,13 +12,23 @@ app = rx.App(
"margin": "0",
"padding": "0",
"box_sizing": "border-box",
+ "background-color": "transparent",
+ "font-family": "HuaweiFont,Helvetica,Arial,PingFangSC-Regular,Hiragino Sans GB,Microsoft YaHei,微软雅黑,Microsoft JhengHei",
+ "gap": "0",
},
# 覆盖伪元素 ::before 和 ::after
"*::before, *::after": {
"box_sizing": "border-box",
},
+ "--devui-base-bg": "#ffffff",
"--mc-global-bg": "linear-gradient(to bottom, #D0C9FF 0%, #E6D6F0 8%, #F1DBEA 12%, #C8DCFB 40%, #ABC6F6 60%, #87AEFE 90%)",
- "--devui-base-bg-dark": "#252b3a",
+ "--devui-border-radius-feedback": "4px",
+ "--devui-border-radius-card": "8px",
+ "--devui-font-size-sm": "11px",
+ "--devui-font-size": "12px",
+ "--devui-font-size-lg": "14px",
+ "--devui-text": "#252b3a",
+ "--devui-text-weak": "#575d6c",
} # 自定义主题颜色
) # 此处变量名需使用 app ，具体原因目前尚不清楚
# 注册首页路由
diff --git a/智能体/application/assets/knowledge_base.svg b/智能体/application/assets/knowledge_base.svg
new file mode 100644
index 0000000..1277a20
--- /dev/null
+++ b/智能体/application/assets/knowledge_base.svg
@@ -0,0 +1,22 @@
+
diff --git a/智能体/application/components/conversation.py b/智能体/application/components/conversation.py
index 00f9fc9..5f7396b 100644
--- a/智能体/application/components/conversation.py
+++ b/智能体/application/components/conversation.py
@@ -4,107 +4,149 @@
"""
import reflex as rx
-
+from typing import Tuple
from application.models import Run, Reasoning, Conversation
from application.state.conversation import ConversationState
from application.state.create_conversation_modal import CreateConversationModalState
-def render_delete_conversation_component(
- conversation_id: str,
-):
+def render_conversation_history_item(
+ conversation_id: str, conversation: Conversation
+) -> rx.Component:
"""
- 渲染删除对话组件
+ 渲染对话历史的对话卡片
:param conversation_id: 对话唯一标识
- :return: 删除对话组件
+ :param conversation: 对话实例
+ :return: Component
"""
- return rx.popover.root(
- rx.popover.trigger(
- rx.button(
- rx.icon("ellipsis", size=16),
- variant="ghost",
- padding="4px",
- height="auto",
- )
- ),
- rx.popover.content(
- rx.popover.close(
+
+ def render_more_button(
+ conversation_id: str,
+ ) -> rx.Component:
+ """
+ 渲染更多按钮
+ :param conversation_id: 对话唯一标识
+ :return: Component
+ """
+ return rx.popover.root(
+ # 触发事件：点击更多按钮
+ rx.popover.trigger(
rx.button(
- "删除",
- color_scheme="red",
- variant="ghost",
- width="100%",
- justify_content="center",
- on_click=lambda: ConversationState.delete_conversation(
- conversation_id
- ),
+ rx.icon("ellipsis", size=14, color="var(--devui-text-weak)"),
+ cursor="pointer", # 鼠标光标显示为手指
)
),
- padding="4px",
- ),
- open_delay=0,
- )
-
-
-def render_conversation_item_component(
- conversation_id: str, conversation: Conversation
-):
- """
- 渲染对话项组件
- """
- # 对话描述
- description = conversation.description
-
- # 若当前对话唯一标识非指定对话唯一标识则正常渲染，否则高亮渲染
- return rx.cond(
- ConversationState.conversation_id != conversation_id,
- # 正常渲染
- rx.button(
- rx.hstack(
- rx.text(
- description,
- flex=1,
- overflow="hidden",
- text_overflow="ellipsis",
- white_space="nowrap",
- text_align="left",
+ # 渲染气泡卡片
+ rx.popover.content(
+ rx.box(
+ width="14px",
+ height="14px",
+ position="absolute",
+ top="-7px",
+ left="50%",
+ transform="translateX(-50%) rotate(45deg)",
+ background_color="var(--devui-base-bg, #ffffff)",
+ box_shadow="-2px -2px 4px rgba(0,0,0,0.05)",
),
- render_delete_conversation_component(conversation_id),
- align_items="center",
- width="100%",
- spacing="2",
- ),
- width="100%",
- justify_content="flex-start",
- padding_x="12px",
- padding_y="10px",
- variant="surface",
- color_scheme="blue",
- on_click=lambda: ConversationState.switch_conversation(conversation_id),
- ),
- # 高亮渲染
- rx.button(
- rx.hstack(
- rx.text(
- description,
- flex=1,
- overflow="hidden",
- text_overflow="ellipsis",
- white_space="nowrap",
- text_align="left",
+ rx.popover.close(
+ rx.box(
+ "删除",
+ width="100%", # 宽度
+ height="24px", # 高度
+ padding="4px", # 内边距
+ line_height="16px", # 行高
+ font_size="12px", # 字体大小
+ color="#252b3a",
+ display="flex", # 弹性布局
+ flex_wrap="wrap", # 换行
+ align_items="center", # 子元素垂直居中
+ background_color="var(--devui-base-bg)", # 背景颜色
+ white_space="nowrap", # 不换行
+ border_radius="var(--devui-border-radius-feedback)", # 圆角
+ # 点击事件：删除对话
+ on_click=lambda: ConversationState.delete_conversation(
+ conversation_id
+ ),
+ ),
),
- render_delete_conversation_component(conversation_id),
- align_items="center",
- width="100%",
- spacing="2",
+ padding="8px", # 内边距
+ arrow_size=10, # 三角大小
+ side="bottom", # 气泡在按钮下方，三角朝上
+ side_offset=8, # 气泡和按钮之间间距
+ align="center", # 水平居中对齐触发按钮中线
+ style={
+ "position": "relative", # 关键：给三角提供定位基准
+ "background_color": "var(--devui-base-bg, #ffffff) !important",
+ "border_radius": "var(--devui-border-radius-feedback, 8px) !important",
+ "box_shadow": "0 2px 12px rgba(0,0,0,0.1)",
+ },
),
- width="100%",
- justify_content="flex-start",
- padding_x="12px",
- padding_y="10px",
- variant="soft",
- color_scheme="blue",
+ )
+
+ # 指定对话的激活状态
+ is_actived = conversation_id == ConversationState.conversation_id
+
+ return rx.box(
+ rx.hstack(
+ # 渲染对话描述
+ rx.text(
+ conversation.description,
+ flex=1,
+ height="22px",
+ line_height="22px",
+ font_size="var(--devui-font-size)",
+ padding_right="4px",
+ overflow="hidden",
+ text_overflow="ellipsis",
+ white_space="nowrap",
+ ),
+ # 渲染更多按钮
+ rx.box(
+ render_more_button(conversation_id=conversation_id),
+ min_width="14px",
+ cursor="pointer", # 鼠标光标显示为手指
+ style={
+ "opacity": rx.cond(
+ is_actived, "1", "0"
+ ), # 若已激活则不透明，否则透明
+ "pointer_events": rx.cond(
+ is_actived, "auto", "none"
+ ), # 若已激活则可点击，否则不可点击
+ "transition": "opacity 0.18s ease",
+ },
+ ),
+ display="flex", # 弹性布局
+ align_items="center", # 子元素垂直居中
+ width="100%", # 宽度
+ margin_bottom="8px", # 底部外边距
),
+ line_height="1.5", # 行高
+ color="var(--devui-text-weak)", # 字体颜色
+ cursor="pointer", # 鼠标悬停显示手指
+ margin_bottom="8px", # 底部外边距
+ width="100%", # 宽度
+ padding="16px", # 内边距
+ border_radius="8px", # 圆角
+ style={
+ "background": rx.cond(
+ is_actived,
+ "linear-gradient(to right, #f3efff, #f3efff33, #e2f1fd33, #e2f1fd)",
+ "var(--devui-base-bg)",
+ ),
+ "box_shadow": rx.cond(is_actived, "2px 2px 8px #e9e9e9", "none"),
+ # 鼠标悬停时渲染背景颜色和阴影
+ "&:hover": {
+ "background": "linear-gradient(to right, #f3efff, #f3efff33, #e2f1fd33, #e2f1fd)",
+ "box_shadow": "2px 2px 8px #e9e9e9",
+ },
+ # 鼠标悬停时强制显示右侧三点按钮，覆盖默认隐藏
+ "&:hover > div > div:last-child": {
+ "opacity": "1 !important",
+ "pointer_events": "auto !important",
+ },
+ },
+ # 点击事件：将指定对话唯一标识设置为当前对话唯一标识
+ on_click=lambda: ConversationState.switch_conversation(conversation_id),
)
@@ -277,108 +319,101 @@ def render_conversation_component() -> rx.Component:
)
-def render_input_component() -> rx.Component:
+def render_create_conversation_component() -> rx.Component:
"""
- 渲染输入和其它组件
+ 渲染创建对话组件
"""
- return rx.center(
- rx.vstack(
- # 渲染创建对话组件
- rx.hstack(
- rx.spacer(), # 占位符
- rx.dialog.root(
- # 触发事件：点击创建对话图标，支持鼠标悬停提示
- rx.dialog.trigger(
- rx.box(rx.tooltip(rx.icon("circle-plus"), content="创建对话"))
- ),
- # 内容层
- rx.dialog.content(
- rx.form(
- rx.hstack(
- rx.input(
- name="description",
- placeholder="请输入对话描述",
- flex="auto",
- min_width="20ch",
- ),
- rx.button("创建"),
- spacing="2",
- wrap="wrap",
- width="100%",
- ),
- on_submit=ConversationState.create_conversation,
- ),
- background_color=rx.color("mauve", 1),
- ),
- open=CreateConversationModalState.is_open,
- on_open_change=CreateConversationModalState.toggle,
- ),
- width="100%",
+ return rx.hstack(
+ rx.spacer(), # 占位符
+ rx.dialog.root(
+ # 触发事件：点击创建对话图标，支持鼠标悬停提示
+ rx.dialog.trigger(
+ rx.box(rx.tooltip(rx.icon("circle-plus"), content="创建对话"))
),
- # 渲染自定义输入组件
- rx.form(
- rx.box(
- rx.vstack(
- # 输入区域
+ # 内容层
+ rx.dialog.content(
+ rx.form(
+ rx.hstack(
rx.input(
- name="user_prompt",
- placeholder="发消息...",
+ name="description",
+ placeholder="请输入对话描述",
flex="auto",
- border="none", # 外框边线
- outline="none", # 高亮轮廓线
- padding_bottom="8px",
+ min_width="20ch",
),
- # 操作区域，暂仅包含发送按钮
- rx.hstack(
- rx.spacer(), # 占位符
- # 发送按钮
- rx.button(
- rx.icon("arrow-up", size=18),
- color_scheme="blue",
- radius="full",
- width="36px",
- height="36px",
- padding="0",
- type="submit",
- loading=ConversationState.get_running_status,
- disabled=ConversationState.get_running_status,
- ),
- width="100%",
- ),
- spacing="8",
- padding_x="12px",
- padding_y="12px",
+ rx.button("创建"),
+ spacing="2",
+ wrap="wrap",
+ width="100%",
),
- border=f"1px solid {rx.color('mauve', 4)}",
- radius="large",
- background_color="white",
+ on_submit=ConversationState.create_conversation,
),
- max_width="50em", # 最大宽度
- margin="0 auto", # 水平居中
- align_items="center", # 子元素垂直居中
- spacing="0", # 子元素间距
- on_submit=ConversationState.run,
- reset_on_submit=True,
+ background_color=rx.color("mauve", 1),
),
- # 渲染底部文案
- rx.text(
- "内容由大模型生成，无法确保准确性和完整性，仅供参考",
- text_align="center",
- font_size=".75em",
- color=rx.color("mauve", 10),
- ),
- width="100%",
- padding_x="16px",
- align="stretch",
+ open=CreateConversationModalState.is_open,
+ on_open_change=CreateConversationModalState.toggle,
),
- position="sticky",
- bottom="0",
- left="0",
- padding_y="16px",
- backdrop_filter="auto",
- backdrop_blur="lg",
- border_top=f"1px solid {rx.color('mauve', 3)}",
- background_color=rx.color("mauve", 2),
- align="stretch",
width="100%",
)
+
+
+def render_input_component() -> rx.Component:
+ """
+ 渲染输入组件
+ """
+ return rx.vstack(
+ # 渲染自定义输入组件
+ rx.form(
+ rx.box(
+ rx.vstack(
+ # 输入区域
+ rx.input(
+ name="user_prompt",
+ placeholder="发消息...",
+ flex="auto",
+ border="none", # 外框边线
+ outline="none", # 高亮轮廓线
+ padding_bottom="8px",
+ ),
+ # 操作区域，暂仅包含发送按钮
+ rx.hstack(
+ rx.spacer(), # 占位符
+ # 发送按钮
+ rx.button(
+ rx.icon("arrow-up", size=18),
+ color_scheme="blue",
+ radius="full",
+ width="36px",
+ height="36px",
+ padding="0",
+ type="submit",
+ loading=ConversationState.get_running_status,
+ disabled=ConversationState.get_running_status,
+ ),
+ width="100%",
+ ),
+ spacing="8",
+ padding_x="12px",
+ padding_y="12px",
+ ),
+ border=f"1px solid {rx.color('mauve', 4)}",
+ radius="large",
+ background_color="white",
+ ),
+ max_width="50em", # 最大宽度
+ margin="0 auto", # 水平居中
+ align_items="center", # 子元素垂直居中
+ spacing="0", # 子元素间距
+ on_submit=ConversationState.run,
+ reset_on_submit=True,
+ ),
+ # 渲染底部文案
+ rx.text(
+ "内容由大模型生成，无法确保准确性和完整性，仅供参考",
+ text_align="center",
+ font_size=".75em",
+ color=rx.color("mauve", 10),
+ ),
+ width="100%",
+ padding_x="16px",
+ align="stretch",
+ )
diff --git a/智能体/application/components/frame.py b/智能体/application/components/frame.py
index a897c82..8f0b4ae 100644
--- a/智能体/application/components/frame.py
+++ b/智能体/application/components/frame.py
@@ -9,8 +9,8 @@ from application.state.frame import FrameState
# 初始化侧边栏图标导航按钮字典
sidebar_icon_nav_buttons = {
- "conversation": {"src": "/assets/conversation.svg", "text": "对话"},
- "knowledge_base": {"src": "/assets/knowledge_base.svg", "text": "知识库"},
+ "conversation": {"src": "/conversation.svg", "text": "对话"},
+ "knowledge_base": {"src": "/knowledge_base.svg", "text": "知识库"},
}
@@ -21,7 +21,7 @@ def render_brand_logo(width: str = "34px", height: str = "34px") -> rx.Component
:param height: 高度，默认为 34px
"""
return rx.image(
- src="/assets/logo.png",
+ src="/logo.png",
width=width,
height=height,
object_fit="contain", # 等比缩放
@@ -35,55 +35,45 @@ def render_sidebar_icon_nav_button(
渲染侧边栏图标导航按钮
:param sidebar_icon_nav_button: 侧边栏图标导航按钮
"""
- # 侧边栏图标导航按钮图标
- src = sidebar_icon_nav_buttons[sidebar_icon_nav_button]["src"]
- # 侧边栏图标导航按钮标签
- text = sidebar_icon_nav_buttons[sidebar_icon_nav_button]["text"]
+ # 指定侧边栏图标导航按钮的激活状态
+ is_actived = sidebar_icon_nav_button == FrameState.sidebar_icon_nav_button
- # 若选中侧边栏图标导航按钮图标非指定图标导航按钮图标则正常渲染，否则高亮渲染
- return rx.cond(
- FrameState.sidebar_icon_nav_button != sidebar_icon_nav_button,
- # 正常渲染
- rx.button(
- rx.vstack(
- rx.icon(icon, size=18),
- rx.text(text, font_size="10px"),
- spacing="2",
- align_items="center",
+ return rx.box(
+ # 渲染图标盒子
+ rx.box(
+ rx.image(
+ src=sidebar_icon_nav_buttons[sidebar_icon_nav_button]["src"],
+ width="24px",
+ height="24px",
+ object_fit="contain", # 等比缩放
),
- width="100%",
- justify_content="center",
- variant="surface",
- color_scheme="blue",
- on_click=lambda: FrameState.switch_active_sidebar_tab(
- sidebar_icon_nav_button
- ),
- padding_y="10px",
- ),
- # 高亮渲染
- rx.button(
- rx.vstack(
- rx.box(
- # 渲染图标
- rx.image(
- src=src,
- width="24px",
- height="24px",
- object_fit="contain", # 等比缩放
- ),
- background_color="#e4f7ff",
- border_radius="4px",
+ display="flex", # 弹性布局
+ justify_content="center", # 水平居中对齐
+ align_items="center", # 垂直居中对齐
+ width="36px", # 宽度
+ height="36px", # 高度
+ border_radius="var(--devui-border-radius-card)", # 圆角
+ # 若已激活则渲染图标盒子背景颜色和阴影，否则不渲染
+ style={
+ "background-color": rx.cond(
+ is_actived, "var(--devui-base-bg)", "transparent"
),
- rx.text(text, size="8"),
- spacing="2",
- align_items="center",
- ),
- width="100%",
- justify_content="center",
- variant="soft",
- color_scheme="blue",
- padding_y="10px",
+ "box-shadow": rx.cond(is_actived, "0 4px 12px #0000001a", "none"),
+ },
),
+ # 渲染标签
+ rx.text(
+ sidebar_icon_nav_buttons[sidebar_icon_nav_button]["text"],
+ color="var(--devui-text)",
+ font_size="var(--devui-font-size-sm)",
+ line_height="20px",
+ ),
+ display="flex", # 弹性布局
+ flex_direction="column", # 垂直方向布局
+ align_items="center", # 垂直居中对齐
+ gap="4px",
+ font_size="var(--devui-font-size-sm)", # 字体大小
+ cursor="pointer", # 鼠标指针
)
@@ -100,7 +90,7 @@ def render_sidebar() -> rx.Component:
render_brand_logo(),
# 渲染品牌名称
rx.text(
- "MateAgent",
+ "MateAI",
line_height="20px", # 行高
font_size="11px",
font_weight="700",
@@ -108,8 +98,8 @@ def render_sidebar() -> rx.Component:
),
display="flex", # 弹性布局
flex_direction="column", # 垂直方向布局
- justify_content="center", # 水平居中对齐
- align_items="center", # 水平居中对齐
+ justify_content="center", # 子元素垂直居中分布
+ align_items="center", # 子元素水平居中
gap="4px",
),
# 渲染分隔线
@@ -123,14 +113,14 @@ def render_sidebar() -> rx.Component:
margin_top="12px", # 上外边距
display="flex", # 弹性布局
flex_direction="column", # 垂直方向布局
- align_items="center", # 水平居中对齐
+ align_items="center", # 子元素水平居中
width="100%", # 宽度为父容器宽度
),
display="flex", # 弹性布局
flex_direction="column", # 垂直方向布局
- justify_content="space-between", # 间距分布
- align_items="center", # 水平居中对齐
+ justify_content="space-between", # 子元素垂直两端分布
+ align_items="center", # 子元素水平居中
width="60px", # 宽度
- height="100%", # 高度为父容器高度
+ height="100%", # 高度
box_sizing="border-box", # 盒模型
)
diff --git a/智能体/application/pages/conversation.py b/智能体/application/pages/conversation.py
index 15612ab..d5416d1 100644
--- a/智能体/application/pages/conversation.py
+++ b/智能体/application/pages/conversation.py
@@ -6,8 +6,9 @@ import reflex as rx
from application.components.conversation import (
render_conversation_component,
- render_conversation_item_component,
+ render_conversation_history_item,
render_input_component,
+ render_create_conversation_component,
)
from application.state.conversation import ConversationState
from application.state.conversation_history_collapse import (
@@ -17,49 +18,61 @@ from application.state.conversation_history_collapse import (
def render_conversation_page() -> rx.Component:
"""
- 渲染对话页面：左侧为对话历史折叠面板，右侧为对话和输入等组件
+ 渲染对话页面：左侧为对话历史折叠面板，右侧为对话历史、运行历史、创建和输入等组件
"""
# 对话历史折叠面板打开状态
is_open = ConversationHistoryCollapseState.is_open
return rx.hstack(
- # 渲染对话历史组件（聊天容器左侧部分），若对话历史列表
+ # 渲染左侧
rx.hstack(
- # 若对话历史折叠面板关闭则不渲染，否则渲染
+ # 若对话历史折叠面板打开则渲染，否则不渲染
rx.cond(
is_open,
- rx.fragment(),
- # 渲染对话历史组件
- rx.box(
- rx.vstack(
- # 标题
+ # 渲染标题、搜索栏和对话历史列表
+ rx.vstack(
+ # 标题
+ rx.hstack(
rx.text(
- "对话历史", font_size="16px", weight="bold", width="100%"
+ "对话历史",
+ font_size="var(--devui-font-size-lg)", # 字体大小
+ font_weight="700", # 字体粗细
+ margin_bottom="8px", # 底部外边距
+ white_space="nowrap", # 不换行
),
- # 分割线
- rx.divider(),
- # 遍历渲染对话字典
- rx.foreach(
- ConversationState.get_conversations,
- lambda i, _: render_conversation_item_component(i[0], i[1]),
- ),
- rx.vstack(
- rx.icon("box", size=64, color=rx.color("mauve", 8)),
- rx.text("无数据", size="3", color=rx.color("mauve", 10)),
- align_items="center",
- justify_content="center",
- flex="1",
- margin_top="60px",
- ),
- align_items="stretch",
- width="100%",
- spacing="2",
- padding="2em",
+ display="flex", # 弹性布局
+ align_items="center", # 子元素垂直居中
+ justify_content="space-between", # 子元素两端对齐
),
- width="20em",
- height="100vh",
- background_color=rx.color("mauve", 1),
+ # 渲染搜索栏(暂未实现)
+ # 渲染对话历史列表
+ rx.vstack(
+ rx.foreach(
+ ConversationState.get_conversation_history,
+ lambda item, _: render_conversation_history_item(
+ item[0], item[1]
+ ),
+ ),
+ flex="1", # 占满父元素高度
+ margin_top="8px", # 顶部外边距
+ width="100%", # 宽度
+ overflow="auto", # 允许溢出时显示垂直滚动条
+ align_items="stretch", # 子元素水平拉伸
+ ),
+ backdrop_filter="blur(50px)", # 背景模糊
+ background_color="#f9f9f9cc", # 背景颜色
+ display="flex", # 弹性布局
+ flex_direction="column", # 垂直方向布局
+ gap="12px", # 子元素间距
+ min_width="240px", # 最小宽度
+ max_width="380px", # 最大宽度
+ width="25%", # 宽度
+ height="100%", # 高度
+ padding="12px", # 内边距
+ color="var(--devui-text)",
+ transition="all 0.3s ease-in-out", # 过渡动画
),
+ rx.fragment(),
),
rx.button(
rx.cond(
@@ -79,16 +92,35 @@ def render_conversation_page() -> rx.Component:
height="100vh",
spacing="0",
),
- # 渲染对话、输入和其它组件（聊天容器右侧部分）
- rx.vstack(
- render_conversation_component(),
- render_input_component(),
- flex=1,
- height="100vh",
- spacing="0",
+ # 渲染右侧布局占位层
+ rx.box(
+ # 渲染内容排版层
+ rx.vstack(
+ # 渲染对话
+ render_conversation_component(),
+ # 渲染创建对话
+ render_create_conversation_component(),
+ # 渲染输入
+ render_input_component(),
+ width="100%", # 宽度
+ height="100%", # 高度
+ display="flex", # 弹性布局
+ flex_flow="column", # 垂直方向布局
+ align_items="center", # 子元素水平居中
+ gap="8px", # 子元素间距
+ ),
+ background_color="linear-gradient(180deg, #fffffff2, #f8fafff2 99%)", # 背景颜色
+ position="relative", # 相对定位
+ display="flex", # 弹性布局
+ flex="1", # 分配父容器宽度
+ width="0", # 宽度
+ height="100%", # 高度
),
- width="100vw",
- height="100vh",
- spacing="0",
- align_items="stretch",
+ position="relative", # 相对定位
+ flex="1", # 分配父容器宽度
+ display="flex", # 弹性布局
+ overflow="hidden", # 隐藏溢出内容
+ height="100%", # 高度
+ min_height="0", # 最小高度
+ border_radius="12px", # 圆角
)
diff --git a/智能体/application/pages/index.py b/智能体/application/pages/index.py
index 4e37e16..a6d1ec8 100644
--- a/智能体/application/pages/index.py
+++ b/智能体/application/pages/index.py
@@ -26,8 +26,8 @@ def render_index_page() -> rx.Component:
# 渲染知识库页面
("knowledge_base", render_knowledge_base_page()),
),
- width="100%",
- height="100vh", # 垂直高度为可视窗口高度
+ width="100%", # 宽度
+ height="100vh", # 高度
padding="8px 8px 8px 0", # 内边距
overflow="auto", # 垂直方向拉伸至父元素高度
box_sizing="border-box", # 盒模型
diff --git a/智能体/application/state/conversation.py b/智能体/application/state/conversation.py
index 03175ed..88e0277 100644
--- a/智能体/application/state/conversation.py
+++ b/智能体/application/state/conversation.py
@@ -71,10 +71,10 @@ class ConversationState(rx.State):
conversation_id: str = next(reversed(conversations.keys()))
@rx.var
- def get_conversations(self) -> Dict[str, Conversation]:
+ def get_conversation_history(self) -> Dict[str, Conversation]:
"""
- 获取对话字典，用于前端按照创建倒序渲染对话历史
- :return: 对话字典（倒序）
+ 获取对话历史，用于前端渲染对话历史
+ :return: 对话历史
"""
return dict(reversed(self.conversations.items()))
diff --git a/智能体/application/state/conversation_history_collapse.py b/智能体/application/state/conversation_history_collapse.py
index f929270..266cfa6 100644
--- a/智能体/application/state/conversation_history_collapse.py
+++ b/智能体/application/state/conversation_history_collapse.py
@@ -11,7 +11,7 @@ class ConversationHistoryCollapseState(rx.State):
"""
# 对话历史折叠面板打开状态，True表示打开，False表示关闭
- is_open: bool = True
+ is_open: bool = False
@rx.event
def toggle(self) -> None:
diff --git a/智能体/assets/conversation.svg b/智能体/assets/conversation.svg
new file mode 100644
index 0000000..1277a20
--- /dev/null
+++ b/智能体/assets/conversation.svg
@@ -0,0 +1,22 @@
+
diff --git a/智能体/assets/knowledge_base.svg b/智能体/assets/knowledge_base.svg
new file mode 100644
index 0000000..1277a20
--- /dev/null
+++ b/智能体/assets/knowledge_base.svg
@@ -0,0 +1,22 @@
+
diff --git a/智能体/assets/logo.png b/智能体/assets/logo.png
new file mode 100644
index 0000000..c9b75a7
Binary files /dev/null and b/智能体/assets/logo.png differ