feat(web): rag content add page

This commit is contained in:
zhaoying
2026-03-12 18:36:49 +08:00
parent 2961ea4e44
commit 75b87955dd
4 changed files with 75 additions and 100 deletions

View File

@@ -1,8 +1,8 @@
/*
* @Author: ZhaoYing
* @Date: 2026-02-03 17:57:11
* @Last Modified by: ZhaoYing
* @Last Modified time: 2026-02-03 17:57:11
* @Last Modified by: ZhaoYing
* @Last Modified time: 2026-03-12 18:00:11
*/
/**
* RAG User Memory Detail View
@@ -150,9 +150,12 @@ const Rag: FC = () => {
})
}
return (
<Row gutter={[16, 16]} className="rb:pb-6">
<Row gutter={[16, 16]} className="rb:h-full!">
<Col span={8}>
<RbCard>
<RbCard
className="rb:h-[calc(100vh-104px)]!"
bodyClassName="rb:overflow-y-auto! rb:h-full!"
>
<div className="rb:flex rb:items-center">
<div className="rb:flex-[0_0_auto] rb:w-20 rb:h-20 rb:text-center rb:font-semibold rb:text-[28px] rb:leading-20 rb:rounded-lg rb:text-[#FBFDFF] rb:bg-[#155EEF]">{name?.[0]}</div>
<Flex>

View File

@@ -1,74 +1,43 @@
/*
* @Author: ZhaoYing
* @Date: 2026-02-03 18:34:04
* @Last Modified by: ZhaoYing
* @Last Modified time: 2026-02-03 18:34:04
* @Last Modified by: ZhaoYing
* @Last Modified time: 2026-03-12 18:34:52
*/
/**
* Conversation Memory Component
* Displays RAG conversation memory content list
*/
import { type FC, useEffect, useState } from 'react'
import { type FC } from 'react'
import { useTranslation } from 'react-i18next'
import { useParams } from 'react-router-dom'
import { Skeleton, List } from 'antd';
import RbCard from '@/components/RbCard/Card'
import Empty from '@/components/Empty';
import PageScrollList from '@/components/PageScrollList'
import Markdown from '@/components/Markdown'
import {
getRagContent
} from '@/api/memory'
import { getRagContentUrl } from '@/api/memory'
const ConversationMemory:FC = () => {
const ConversationMemory: FC = () => {
const { t } = useTranslation()
const { id } = useParams()
const [loading, setLoading] = useState<boolean>(true)
const [list, setList] = useState<string[]>([])
useEffect(() => {
if (!id) return
getList()
}, [id])
/** Fetch conversation memory list */
const getList = () => {
if (!id) return
setLoading(true)
getRagContent(id).then((res) => {
setList((res as { contents?: [] }).contents || [])
})
.finally(() => {
setLoading(false)
})
}
return (
<RbCard
<RbCard
title={t('userMemory.conversationMemory')}
headerClassName="rb:text-[18px]! rb:leading-[24px]"
bodyClassName="rb:h-[100%]! rb:overflow-hidden rb:py-0!"
bodyClassName="rb:h-[calc(100%-56px)]! rb:overflow-hidden"
className="rb:h-[calc(100vh-104px)]!"
>
{loading
? <Skeleton />
: list.length > 0
? <List
dataSource={list}
grid={{ gutter: 12, column: 1 }}
renderItem={(item, index) => (
<List.Item>
<div
key={index}
className="rb:rounded-lg rb:border rb:border-[#DFE4ED] rb:px-4 rb:py-3 rb:bg-[#F0F3F8] rb:mt-2 rb:text-gray-800 rb:text-sm"
>
<Markdown content={item} />
</div>
</List.Item>
)}
/>
: <Empty className="rb:h-full" />
}
<PageScrollList<string>
url={getRagContentUrl}
query={{ end_user_id: id }}
column={1}
renderItem={(item) => (
<div className="rb:rounded-lg rb:border rb:border-[#DFE4ED] rb:px-4 rb:py-3 rb:bg-[#F0F3F8] rb:text-gray-800 rb:text-sm">
<Markdown content={item} />
</div>
)}
className="rb:h-full!"
// className="rb:h-[calc(100%-24px)]!"
/>
</RbCard>
)
}
export default ConversationMemory
export default ConversationMemory