feat: user memory
This commit is contained in:
@@ -181,6 +181,20 @@ export const getEpisodicOverview = (data: { end_user_id: string; time_range: str
|
||||
export const getEpisodicDetail = (data: { end_user_id: string; summary_id: string; } ) => {
|
||||
return request.post(`/memory-storage/classifications/episodic-memory-details`, data)
|
||||
}
|
||||
// 关系演化
|
||||
export const getRelationshipEvolution = (data: { id: string; label: string; } ) => {
|
||||
return request.get(`/memory-storage/memory_space/relationship_evolution`, data)
|
||||
}
|
||||
// 共同记忆时间线
|
||||
export const getTimelineMemories = (data: { id: string; label: string; }) => {
|
||||
return request.get(`/memory-storage/memory_space/timeline_memories`, data)
|
||||
}
|
||||
export const getExplicitMemory = (end_user_id: string) => {
|
||||
return request.post(`/memory-storage/classifications/explicit-memory`, { end_user_id })
|
||||
}
|
||||
export const getExplicitMemoryDetails = (data: { end_user_id: string, memory_id: string; }) => {
|
||||
return request.post(`/memory-storage/classifications/explicit-memory-details`, data)
|
||||
}
|
||||
|
||||
|
||||
/*************** end 用户记忆 相关接口 ******************************/
|
||||
|
||||
@@ -1240,6 +1240,10 @@ export const en = {
|
||||
associative_memory: 'Associative Memory',
|
||||
unix: 'items',
|
||||
completeMemory: 'Complete Memory',
|
||||
relationshipEvolution: 'Relationship Evolution',
|
||||
timelineMemories: 'Shared Memory Timeline',
|
||||
emotionLine: 'Emotion Changes Over Time',
|
||||
interaction: 'Interaction Frequency & Relationship Stages',
|
||||
},
|
||||
space: {
|
||||
createSpace: 'Create Space',
|
||||
@@ -2268,6 +2272,15 @@ Memory Bear: After the rebellion, regional warlordism intensified for several re
|
||||
section_count: 'Number of Sections',
|
||||
timeLine: 'Perception Timeline',
|
||||
lastInfo: 'Real-time Perception Dashboard',
|
||||
},
|
||||
explicitDetail: {
|
||||
episodic_memories: 'Episodic Memories',
|
||||
semantic_memories: 'Semantic Memories',
|
||||
content: 'Core Description',
|
||||
created_at: 'Created At',
|
||||
emotion: 'Emotion',
|
||||
core_definition: 'Core Definition',
|
||||
detailed_notes: 'Detailed Notes',
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
@@ -1321,6 +1321,10 @@ export const zh = {
|
||||
associative_memory: '关联记忆',
|
||||
unix: '个',
|
||||
completeMemory: '完整记忆',
|
||||
relationshipEvolution: '关系演化',
|
||||
timelineMemories: '共同记忆时间线',
|
||||
emotionLine: '情绪随时间变化',
|
||||
interaction: '互动频率 & 关系阶段',
|
||||
},
|
||||
space: {
|
||||
createSpace: '创建空间',
|
||||
@@ -2368,6 +2372,15 @@ export const zh = {
|
||||
section_count: '段落数',
|
||||
timeLine: '感知时间线',
|
||||
lastInfo: '实时感知仪表盘',
|
||||
},
|
||||
explicitDetail: {
|
||||
episodic_memories: '情景记忆',
|
||||
semantic_memories: '语义记忆',
|
||||
content: '核心描述',
|
||||
created_at: '创建时间',
|
||||
emotion: '情绪',
|
||||
core_definition: '核心定义',
|
||||
detailed_notes: '详细笔记',
|
||||
}
|
||||
},
|
||||
}
|
||||
@@ -61,7 +61,6 @@ const componentMap: Record<string, LazyExoticComponent<ComponentType<object>>> =
|
||||
StatementDetail: lazy(() => import('@/views/UserMemoryDetail/pages/StatementDetail')),
|
||||
ForgetDetail: lazy(() => import('@/views/UserMemoryDetail/pages/ForgetDetail')),
|
||||
MemoryNodeDetail: lazy(() => import('@/views/UserMemoryDetail/pages/index')),
|
||||
GraphDetail: lazy(() => import('@/views/UserMemoryDetail/pages/GraphDetail')),
|
||||
SelfReflectionEngine: lazy(() => import('@/views/SelfReflectionEngine')),
|
||||
OrderPayment: lazy(() => import('@/views/OrderPayment')),
|
||||
OrderHistory: lazy(() => import('@/views/OrderHistory')),
|
||||
|
||||
@@ -44,8 +44,7 @@
|
||||
{ "path": "/conversation/:token", "element": "Conversation" },
|
||||
{ "path": "/user-memory/neo4j/:id", "element": "Neo4jUserMemoryDetail" },
|
||||
{ "path": "/statement/:id", "element": "StatementDetail" },
|
||||
{ "path": "/user-memory/detail/:id/:type", "element": "MemoryNodeDetail" },
|
||||
{ "path": "/graph/:id", "element": "GraphDetail" }
|
||||
{ "path": "/user-memory/detail/:id/:type", "element": "MemoryNodeDetail" }
|
||||
]
|
||||
},
|
||||
{
|
||||
|
||||
@@ -30,7 +30,6 @@ const AboutMe = forwardRef<AboutMeRef>((_props, ref) => {
|
||||
getData()
|
||||
}, [id])
|
||||
|
||||
// 记忆洞察
|
||||
const getData = () => {
|
||||
if (!id) return
|
||||
setLoading(true)
|
||||
|
||||
173
web/src/views/UserMemoryDetail/components/EmotionLine.tsx
Normal file
173
web/src/views/UserMemoryDetail/components/EmotionLine.tsx
Normal file
@@ -0,0 +1,173 @@
|
||||
import { type FC, useRef } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import ReactEcharts from 'echarts-for-react';
|
||||
import * as echarts from 'echarts';
|
||||
import Empty from '@/components/Empty'
|
||||
import Loading from '@/components/Empty/Loading'
|
||||
import type { Emotion } from './GraphDetail'
|
||||
|
||||
interface EmotionLineProps {
|
||||
chartData: Emotion[];
|
||||
loading?: boolean;
|
||||
}
|
||||
|
||||
const Colors = ['#369F21', '#155EEF', '#FF5D34']
|
||||
|
||||
const EmotionLine: FC<EmotionLineProps> = ({ chartData, loading }) => {
|
||||
const { t } = useTranslation()
|
||||
const chartRef = useRef<ReactEcharts>(null);
|
||||
|
||||
const getSeries = () => {
|
||||
const emotionTypes = [...new Set(chartData.map(item => item.emotion_type))]
|
||||
const timePoints = [...new Set(chartData.map(item => item.created_at))].sort()
|
||||
|
||||
return emotionTypes.map((emotionType, index) => {
|
||||
const emotionData = chartData.filter(item => item.emotion_type === emotionType)
|
||||
const dataMap = new Map(emotionData.map(item => [item.created_at, item.emotion_intensity]))
|
||||
const seriesData = timePoints.map(time => dataMap.get(time) || 0)
|
||||
|
||||
return {
|
||||
name: emotionType,
|
||||
type: 'line',
|
||||
smooth: true,
|
||||
lineStyle: {
|
||||
width: 3,
|
||||
color: Colors[index % Colors.length]
|
||||
},
|
||||
itemStyle: {
|
||||
color: Colors[index % Colors.length]
|
||||
},
|
||||
areaStyle: {
|
||||
color: Colors[index % Colors.length],
|
||||
opacity: 0.08
|
||||
},
|
||||
data: seriesData
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
return (
|
||||
<>
|
||||
<div>{t('userMemory.emotionLine')}</div>
|
||||
{loading
|
||||
? <Loading size={249} />
|
||||
: !chartData || chartData.length === 0
|
||||
? <Empty size={120} className="rb:mt-12 rb:mb-20.25" />
|
||||
: <ReactEcharts
|
||||
ref={chartRef}
|
||||
option={{
|
||||
color: Colors,
|
||||
tooltip: {
|
||||
trigger: 'axis',
|
||||
extraCssText: 'box-shadow: 0px 2px 6px 0px rgba(33,35,50,0.16); border-radius: 8px;',
|
||||
axisPointer: {
|
||||
type: 'line',
|
||||
crossStyle: {
|
||||
color: '#5F6266',
|
||||
},
|
||||
lineStyle: {
|
||||
color: '#5F6266',
|
||||
}
|
||||
},
|
||||
formatter: function(params: any) {
|
||||
let result = `${params[0].axisValue}<br/>`
|
||||
params.forEach((param: any) => {
|
||||
result += `${param.marker}${param.seriesName}: ${param.value}<br/>`
|
||||
})
|
||||
return result
|
||||
}
|
||||
},
|
||||
legend: {
|
||||
bottom: 2,
|
||||
padding: 0,
|
||||
itemGap: 24,
|
||||
itemWidth: 40,
|
||||
itemHeight: 12,
|
||||
borderRadius: 2,
|
||||
orient: 'horizontal',
|
||||
textStyle: {
|
||||
color: '#5B6167',
|
||||
fontFamily: 'PingFangSC, PingFang SC',
|
||||
lineHeight: 16,
|
||||
}
|
||||
},
|
||||
grid: {
|
||||
top: 16,
|
||||
left: 30,
|
||||
right: 36,
|
||||
bottom: 48,
|
||||
// containLabel: false
|
||||
},
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
data: [...new Set(chartData.map(item => item.created_at))].sort().map(time => {
|
||||
const date = new Date(time)
|
||||
return `${date.getFullYear()}.${String(date.getMonth() + 1).padStart(2, '0')}`
|
||||
}),
|
||||
boundaryGap: false,
|
||||
axisLabel: {
|
||||
color: '#A8A9AA',
|
||||
fontFamily: 'PingFangSC, PingFang SC'
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: '#EBEBEB'
|
||||
}
|
||||
},
|
||||
splitLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: '#EBEBEB',
|
||||
type: 'solid'
|
||||
}
|
||||
},
|
||||
axisTick: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: '#EBEBEB',
|
||||
type: 'solid'
|
||||
}
|
||||
}
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
axisLabel: {
|
||||
color: '#A8A9AA',
|
||||
fontFamily: 'PingFangSC, PingFang SC'
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: '#EBEBEB'
|
||||
}
|
||||
},
|
||||
splitLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: '#EBEBEB',
|
||||
type: 'solid'
|
||||
}
|
||||
},
|
||||
axisTick: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: '#EBEBEB',
|
||||
type: 'solid'
|
||||
}
|
||||
},
|
||||
max: 1,
|
||||
min: 0
|
||||
},
|
||||
series: getSeries()
|
||||
}}
|
||||
style={{ height: '265px', width: '100%', minWidth: '100%' }}
|
||||
notMerge={true}
|
||||
lazyUpdate={true}
|
||||
/>
|
||||
}
|
||||
</>
|
||||
)
|
||||
}
|
||||
|
||||
export default EmotionLine
|
||||
@@ -0,0 +1,100 @@
|
||||
import { forwardRef, useImperativeHandle, useState, useCallback } from 'react';
|
||||
import { useParams } from 'react-router-dom'
|
||||
import { Descriptions, Skeleton } from 'antd';
|
||||
import { useTranslation } from 'react-i18next';
|
||||
|
||||
import RbModal from '@/components/RbModal'
|
||||
import { getExplicitMemoryDetails } from '@/api/memory'
|
||||
import { formatDateTime } from '@/utils/format'
|
||||
import type { ExplicitDetailModalRef, EpisodicMemory, SemanticMemory } from '../pages/ExplicitDetail'
|
||||
|
||||
|
||||
interface Data {
|
||||
memory_type: 'episodic' | 'semantic';
|
||||
title: string;
|
||||
content: string;
|
||||
emotion: string;
|
||||
created_at: number;
|
||||
|
||||
name: string;
|
||||
core_definition: string;
|
||||
detailed_notes: string;
|
||||
}
|
||||
const ExplicitDetailModal = forwardRef<ExplicitDetailModalRef>((_props, ref) => {
|
||||
const { t } = useTranslation();
|
||||
const { id } = useParams()
|
||||
const [visible, setVisible] = useState(false);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [data, setData] = useState<Data>({} as Data)
|
||||
|
||||
// 封装取消方法,添加关闭弹窗逻辑
|
||||
const handleClose = () => {
|
||||
setVisible(false);
|
||||
setData({} as Data)
|
||||
};
|
||||
|
||||
const handleOpen = (vo: EpisodicMemory | SemanticMemory) => {
|
||||
setLoading(true)
|
||||
getExplicitMemoryDetails({
|
||||
end_user_id: id as string,
|
||||
memory_id: vo.id
|
||||
})
|
||||
.then(res => {
|
||||
setVisible(true);
|
||||
setData(res as Data)
|
||||
})
|
||||
.finally(() => {
|
||||
setLoading(false)
|
||||
})
|
||||
};
|
||||
|
||||
const getEmotionColor = (emotionType: string) => {
|
||||
const colors: Record<string, string> = {
|
||||
joy: '#52c41a',
|
||||
anger: '#ff4d4f',
|
||||
sadness: '#1890ff',
|
||||
fear: '#fa8c16',
|
||||
neutral: '#8c8c8c',
|
||||
surprise: '#722ed1'
|
||||
}
|
||||
return colors[emotionType] || '#8c8c8c'
|
||||
}
|
||||
|
||||
// 暴露给父组件的方法
|
||||
useImperativeHandle(ref, () => ({
|
||||
handleOpen,
|
||||
}));
|
||||
return (
|
||||
<RbModal
|
||||
title={data.name || data.title}
|
||||
open={visible}
|
||||
footer={null}
|
||||
onCancel={handleClose}
|
||||
>
|
||||
{loading ? <Skeleton active />
|
||||
: <Descriptions column={data.memory_type === 'semantic' ? 1 : 2} classNames={{ label: 'rb:w-20' }}>
|
||||
{data.emotion && <Descriptions.Item label={t('explicitDetail.emotion')}>
|
||||
<div className="rb:flex rb:items-center rb:gap-2">
|
||||
<div className="rb:w-3 rb:h-3 rb:rounded-full" style={{ backgroundColor: getEmotionColor(data.emotion) }}></div>
|
||||
<span className="rb:text-gray-600">{t(`statementDetail.${data.emotion || 'neutral'}`)}</span>
|
||||
</div>
|
||||
</Descriptions.Item>}
|
||||
{data.core_definition && <Descriptions.Item label={t('explicitDetail.core_definition')}>
|
||||
{data.core_definition}
|
||||
</Descriptions.Item>}
|
||||
{data.detailed_notes && <Descriptions.Item label={t('explicitDetail.detailed_notes')}>
|
||||
{data.detailed_notes}
|
||||
</Descriptions.Item>}
|
||||
{data.created_at && <Descriptions.Item label={t('explicitDetail.created_at')}>
|
||||
{formatDateTime(data.created_at)}
|
||||
</Descriptions.Item>}
|
||||
{data.content && <Descriptions.Item span="filled" label={t('explicitDetail.content')}>
|
||||
{data.content}
|
||||
</Descriptions.Item>}
|
||||
</Descriptions>
|
||||
}
|
||||
</RbModal>
|
||||
);
|
||||
});
|
||||
|
||||
export default ExplicitDetailModal;
|
||||
174
web/src/views/UserMemoryDetail/components/GraphDetail.tsx
Normal file
174
web/src/views/UserMemoryDetail/components/GraphDetail.tsx
Normal file
@@ -0,0 +1,174 @@
|
||||
import { type FC, useState, forwardRef, useImperativeHandle } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import { useParams } from 'react-router-dom'
|
||||
import { Row, Col, Tabs } from 'antd'
|
||||
|
||||
import { getRelationshipEvolution, getTimelineMemories } from '@/api/memory'
|
||||
import type { Node, GraphDetailRef } from '../types'
|
||||
import RbDrawer from '@/components/RbDrawer'
|
||||
import RbCard from '@/components/RbCard/Card'
|
||||
import EmotionLine from './EmotionLine'
|
||||
|
||||
export interface Emotion {
|
||||
emotion_intensity: number;
|
||||
emotion_type: string;
|
||||
created_at: string | number;
|
||||
}
|
||||
export interface Interaction {
|
||||
name: string;
|
||||
importance_score: number;
|
||||
interaction_count: number;
|
||||
}
|
||||
|
||||
const GraphDetail = forwardRef<GraphDetailRef>((_props, ref) => {
|
||||
const { t } = useTranslation()
|
||||
const { id } = useParams()
|
||||
const [open, setOpen] = useState(false);
|
||||
const [vo, setVo] = useState<Node | null>(null)
|
||||
const [emotionData, setEmotionData] = useState<Emotion[]>([
|
||||
{
|
||||
"emotion_intensity": 0.1,
|
||||
"emotion_type": "neutral",
|
||||
"created_at": "2026-01-07 19:14:34"
|
||||
},
|
||||
{
|
||||
"emotion_intensity": 0.2,
|
||||
"emotion_type": "neutral",
|
||||
"created_at": "2026-02-08 19:14:34"
|
||||
},
|
||||
{
|
||||
"emotion_intensity": 0.1,
|
||||
"emotion_type": "neutral",
|
||||
"created_at": "2026-03-09 19:14:34"
|
||||
},
|
||||
{
|
||||
"emotion_intensity": 0.1,
|
||||
"emotion_type": "neutral",
|
||||
"created_at": "2026-04-10 19:14:34"
|
||||
},
|
||||
{
|
||||
"emotion_intensity": 0.1,
|
||||
"emotion_type": "sadness",
|
||||
"created_at": "2026-01-07 19:14:34"
|
||||
},
|
||||
{
|
||||
"emotion_intensity": 0.2,
|
||||
"emotion_type": "sadness",
|
||||
"created_at": "2026-02-08 19:14:34"
|
||||
},
|
||||
{
|
||||
"emotion_intensity": 0.1,
|
||||
"emotion_type": "sadness",
|
||||
"created_at": "2026-03-09 19:14:34"
|
||||
},
|
||||
{
|
||||
"emotion_intensity": 0.1,
|
||||
"emotion_type": "sadness",
|
||||
"created_at": "2026-04-10 19:14:34"
|
||||
},
|
||||
])
|
||||
const [interactionData, setInteractionData] = useState<Interaction[]>([
|
||||
{
|
||||
"name": "小蓝",
|
||||
"importance_score": 0.5,
|
||||
"interaction_count": 1
|
||||
}
|
||||
])
|
||||
const [timelineMemories, setTimelineMemories] = useState({
|
||||
"code": 0,
|
||||
"msg": "共同记忆时间线",
|
||||
"data": {
|
||||
"success": true,
|
||||
"data": {
|
||||
"MemorySummary": [
|
||||
"小蓝今天原计划与小明野餐、与小绿看电影,但最终选择与姐姐小红一起看戏。",
|
||||
"用户小明喜欢喝咖啡,每天都要喝拿铁。"
|
||||
],
|
||||
"Statement": [
|
||||
"小蓝对是否去野餐或看电影感到犹豫。",
|
||||
"小蓝和她姐姐小红出去看戏。",
|
||||
"小明喜欢喝咖啡。",
|
||||
"小明每天都要喝拿铁。",
|
||||
"小明今天约小蓝出去野餐。"
|
||||
],
|
||||
"ExtractedEntity": [
|
||||
"小明",
|
||||
"咖啡",
|
||||
"拿铁",
|
||||
"小蓝",
|
||||
"野餐"
|
||||
],
|
||||
"timelines_memory": [
|
||||
"小蓝今天原计划与小明野餐、与小绿看电影,但最终选择与姐姐小红一起看戏。",
|
||||
"用户小明喜欢喝咖啡,每天都要喝拿铁。",
|
||||
"小蓝对是否去野餐或看电影感到犹豫。",
|
||||
"小蓝和她姐姐小红出去看戏。",
|
||||
"小明喜欢喝咖啡。",
|
||||
"小明每天都要喝拿铁。",
|
||||
"小明今天约小蓝出去野餐。",
|
||||
"小明",
|
||||
"咖啡",
|
||||
"拿铁",
|
||||
"小蓝",
|
||||
"野餐"
|
||||
]
|
||||
}
|
||||
},
|
||||
"error": "",
|
||||
"time": 1767852781464
|
||||
})
|
||||
|
||||
const handleCancel = () => {
|
||||
setVo(null)
|
||||
setOpen(false)
|
||||
}
|
||||
const handleOpen = (vo: Node) => {
|
||||
setOpen(true)
|
||||
setVo(vo)
|
||||
getTimelineMemoriesData(vo)
|
||||
}
|
||||
const getRelationshipEvolutionData = (vo: Node) => {
|
||||
if (!id || !vo.label) return
|
||||
|
||||
getRelationshipEvolution({ id: id as string, label: vo.label })
|
||||
.then(res => {
|
||||
const { emotion, interaction } = res as { emotion: { data: Emotion[]}; interaction: {data: Interaction[]} } || {}
|
||||
setEmotionData(emotion?.data)
|
||||
setInteractionData(interaction?.data)
|
||||
})
|
||||
}
|
||||
const getTimelineMemoriesData = (vo: Node) => {
|
||||
if (!id || !vo.label) return
|
||||
|
||||
getTimelineMemories({ id: id as string, label: vo.label })
|
||||
.then(res => {
|
||||
|
||||
})
|
||||
}
|
||||
|
||||
useImperativeHandle(ref, () => ({
|
||||
handleOpen,
|
||||
}));
|
||||
|
||||
return (
|
||||
<RbDrawer
|
||||
title={vo?.name}
|
||||
open={open}
|
||||
onClose={handleCancel}
|
||||
width={1000}
|
||||
>
|
||||
<div className="rb:text-[16px] rb:font-medium rb:leading-5.5 rb:mb-3">{t('useMemory.relationshipEvolution')}</div>
|
||||
<RbCard>
|
||||
<Row gutter={16}>
|
||||
<Col span={12}>
|
||||
<EmotionLine chartData={emotionData} />
|
||||
</Col>
|
||||
<Col span={12}>
|
||||
<div>{t('userMemory.interaction')}</div>
|
||||
</Col>
|
||||
</Row>
|
||||
</RbCard>
|
||||
</RbDrawer>
|
||||
)
|
||||
})
|
||||
export default GraphDetail
|
||||
@@ -12,7 +12,7 @@ interface HabitsItem {
|
||||
habit_description: string;
|
||||
frequency_pattern: string;
|
||||
time_context: string;
|
||||
confidence_level: string;
|
||||
confidence_level: number;
|
||||
supporting_summaries: string[];
|
||||
first_observed: string;
|
||||
last_observed: string;
|
||||
@@ -31,7 +31,6 @@ const Habits: FC = () => {
|
||||
getData()
|
||||
}, [id])
|
||||
|
||||
// 记忆洞察
|
||||
const getData = () => {
|
||||
if (!id) return
|
||||
setLoading(true)
|
||||
|
||||
@@ -33,8 +33,7 @@ const InterestAreas: FC = () => {
|
||||
if (!id) return
|
||||
getData()
|
||||
}, [id])
|
||||
|
||||
// 记忆洞察
|
||||
|
||||
const getData = () => {
|
||||
if (!id) return
|
||||
setLoading(true)
|
||||
|
||||
@@ -47,8 +47,7 @@ const NodeStatistics: FC = () => {
|
||||
if (!id) return
|
||||
getData()
|
||||
}, [id])
|
||||
|
||||
// 记忆洞察
|
||||
|
||||
const getData = () => {
|
||||
if (!id) return
|
||||
setLoading(true)
|
||||
|
||||
@@ -7,12 +7,13 @@ import dayjs from 'dayjs'
|
||||
import RbCard from '@/components/RbCard/Card'
|
||||
import ReactEcharts from 'echarts-for-react'
|
||||
import detailEmpty from '@/assets/images/userMemory/detail_empty.png'
|
||||
import type { Node, Edge, GraphData, StatementNodeProperties, ExtractedEntityNodeProperties } from '../types'
|
||||
import type { Node, Edge, GraphData, StatementNodeProperties, ExtractedEntityNodeProperties, GraphDetailRef } from '../types'
|
||||
import {
|
||||
getMemorySearchEdges,
|
||||
} from '@/api/memory'
|
||||
import Empty from '@/components/Empty'
|
||||
import Tag from '@/components/Tag'
|
||||
import GraphDetail from '../components/GraphDetail'
|
||||
|
||||
const colors = ['#155EEF', '#369F21', '#4DA8FF', '#FF5D34', '#9C6FFF', '#FF8A4C', '#8BAEF7', '#FFB048']
|
||||
const RelationshipNetwork:FC = () => {
|
||||
@@ -25,6 +26,7 @@ const RelationshipNetwork:FC = () => {
|
||||
const [categories, setCategories] = useState<{ name: string }[]>([])
|
||||
const [selectedNode, setSelectedNode] = useState<Node | null>(null)
|
||||
// const [fullScreen, setFullScreen] = useState<boolean>(false)
|
||||
const graphDetailRef = useRef<GraphDetailRef>(null)
|
||||
|
||||
console.log('categories', categories)
|
||||
// 关系网络
|
||||
@@ -139,7 +141,7 @@ const RelationshipNetwork:FC = () => {
|
||||
|
||||
const handleViewAll = () => {
|
||||
if (!selectedNode) return
|
||||
window.open(`/#/graph/${selectedNode.id}`);
|
||||
graphDetailRef.current?.handleOpen(selectedNode)
|
||||
}
|
||||
|
||||
return (
|
||||
@@ -332,6 +334,8 @@ const RelationshipNetwork:FC = () => {
|
||||
</div>
|
||||
</RbCard>
|
||||
</Col>
|
||||
|
||||
<GraphDetail ref={graphDetailRef} />
|
||||
</Row>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -72,10 +72,9 @@ const EpisodicDetail: FC = () => {
|
||||
|
||||
useEffect(() => {
|
||||
if (!id) return
|
||||
// getData()
|
||||
getData()
|
||||
}, [id])
|
||||
|
||||
// 记忆洞察
|
||||
|
||||
const getData = () => {
|
||||
if (!id) return
|
||||
setLoading(true)
|
||||
|
||||
109
web/src/views/UserMemoryDetail/pages/ExplicitDetail.tsx
Normal file
109
web/src/views/UserMemoryDetail/pages/ExplicitDetail.tsx
Normal file
@@ -0,0 +1,109 @@
|
||||
import { type FC, useEffect, useState, useRef } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import { useParams } from 'react-router-dom'
|
||||
import { List, Skeleton, Row, Col } from 'antd'
|
||||
import RbCard from '@/components/RbCard/Card'
|
||||
import {
|
||||
getExplicitMemory,
|
||||
} from '@/api/memory'
|
||||
import { formatDateTime } from '@/utils/format'
|
||||
import Empty from '@/components/Empty'
|
||||
import ExplicitDetailModal from '../components/ExplicitDetailModal'
|
||||
|
||||
export interface EpisodicMemory {
|
||||
id: string;
|
||||
title: string;
|
||||
content: string;
|
||||
created_at: number;
|
||||
}
|
||||
export interface SemanticMemory {
|
||||
id: string;
|
||||
name: string;
|
||||
entity_type: string;
|
||||
core_definition: string;
|
||||
created_at: number;
|
||||
}
|
||||
interface Data {
|
||||
episodic_memories: EpisodicMemory[];
|
||||
semantic_memories: SemanticMemory[]
|
||||
}
|
||||
|
||||
export interface ExplicitDetailModalRef {
|
||||
handleOpen: (vo: EpisodicMemory | SemanticMemory) => void;
|
||||
}
|
||||
|
||||
const ExplicitDetail: FC = () => {
|
||||
const { t } = useTranslation()
|
||||
const { id } = useParams()
|
||||
const explicitDetailModalRef = useRef<ExplicitDetailModalRef>(null)
|
||||
const [loading, setLoading] = useState<boolean>(false)
|
||||
const [data, setData] = useState<Data>({ episodic_memories: [], semantic_memories: [] })
|
||||
|
||||
useEffect(() => {
|
||||
if (!id) return
|
||||
getData()
|
||||
}, [id])
|
||||
|
||||
const getData = () => {
|
||||
if (!id) return
|
||||
setLoading(true)
|
||||
getExplicitMemory(id).then((res) => {
|
||||
const response = res as Data
|
||||
setData(response)
|
||||
setLoading(false)
|
||||
})
|
||||
.finally(() => {
|
||||
setLoading(false)
|
||||
})
|
||||
}
|
||||
const handleView = (item: EpisodicMemory | SemanticMemory) => {
|
||||
explicitDetailModalRef.current?.handleOpen(item)
|
||||
}
|
||||
return (
|
||||
<div className="rb:h-full rb:w-full">
|
||||
<div className="rb:bg-[rgba(21,94,239,0.12)] rb:px-3 rb:py-2.5 rb:font-medium rb:leading-5 rb:mt-3 rb:rounded-md rb:mb-4">{t('explicitDetail.episodic_memories')}</div>
|
||||
{loading ?
|
||||
<Skeleton active />
|
||||
: data.episodic_memories?.length > 0 ? (
|
||||
<Row gutter={16}>
|
||||
{data.episodic_memories.map(item => (
|
||||
<Col key={item.id} span={6}>
|
||||
<RbCard
|
||||
title={item.title}
|
||||
className="rb:h-full! rb:cursor-pointer"
|
||||
onClick={() => handleView(item)}
|
||||
>
|
||||
<div>{formatDateTime(item.created_at)}</div>
|
||||
<div>{item.content}</div>
|
||||
</RbCard>
|
||||
</Col>
|
||||
))}
|
||||
</Row>
|
||||
) : <Empty />}
|
||||
|
||||
<div className="rb:bg-[rgba(21,94,239,0.12)] rb:px-3 rb:py-2.5 rb:font-medium rb:leading-5 rb:mt-6 rb:rounded-md rb:mb-4">{t('explicitDetail.semantic_memories')}</div>
|
||||
{loading ?
|
||||
<Skeleton active />
|
||||
: data.semantic_memories?.length > 0 ? (
|
||||
<Row gutter={16}>
|
||||
{data.semantic_memories.map(item => (
|
||||
<Col key={item.id} span={6}>
|
||||
<RbCard
|
||||
title={item.name}
|
||||
className="rb:h-full! rb:cursor-pointer"
|
||||
onClick={() => handleView(item)}
|
||||
>
|
||||
<div>{item.core_definition}</div>
|
||||
</RbCard>
|
||||
</Col>
|
||||
))}
|
||||
</Row>
|
||||
) : <Empty />}
|
||||
|
||||
<ExplicitDetailModal
|
||||
ref={explicitDetailModalRef}
|
||||
/>
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default ExplicitDetail
|
||||
@@ -30,8 +30,7 @@ const ForgetDetail: FC = () => {
|
||||
if (!id) return
|
||||
getData()
|
||||
}, [id])
|
||||
|
||||
// 记忆洞察
|
||||
|
||||
const getData = () => {
|
||||
if (!id) return
|
||||
setLoading(true)
|
||||
|
||||
@@ -1,14 +0,0 @@
|
||||
import { type FC } from 'react'
|
||||
import { useTranslation } from 'react-i18next'
|
||||
import { Row, Col } from 'antd'
|
||||
|
||||
const GraphDetail: FC = () => {
|
||||
const { t } = useTranslation()
|
||||
|
||||
return (
|
||||
<div className="rb:h-full rb:max-w-266 rb:mx-auto">
|
||||
GraphDetail
|
||||
</div>
|
||||
)
|
||||
}
|
||||
export default GraphDetail
|
||||
@@ -10,6 +10,7 @@ import ImplicitDetail from './ImplicitDetail'
|
||||
import ShortTermDetail from './ShortTermDetail'
|
||||
import PerceptualDetail from './PerceptualDetail'
|
||||
import EpisodicDetail from './EpisodicDetail'
|
||||
import ExplicitDetail from './ExplicitDetail'
|
||||
import {
|
||||
getEndUserProfile,
|
||||
} from '@/api/memory'
|
||||
@@ -62,6 +63,8 @@ const Detail: FC = () => {
|
||||
{type === 'SHORT_TERM_MEMORY' && <ShortTermDetail />}
|
||||
{type === 'PERCEPTUAL_MEMORY' && <PerceptualDetail />} {/** TODO */}
|
||||
{type === 'EPISODIC_MEMORY' && <EpisodicDetail />}
|
||||
{/* {type === 'WORKING_MEMORY' && <WorkingDetail />} */} {/** TODO */}
|
||||
{type === 'EXPLICIT_MEMORY' && <ExplicitDetail />} {/** TODO */}
|
||||
</div>
|
||||
</div>
|
||||
)
|
||||
|
||||
@@ -184,4 +184,7 @@ export interface ForgetData {
|
||||
last_access_time: number;
|
||||
}[],
|
||||
timestamp: number;
|
||||
}
|
||||
export interface GraphDetailRef {
|
||||
handleOpen: (vo: Node) => void
|
||||
}
|
||||
Reference in New Issue
Block a user