Merge pull request #66 from SuanmoSuanyangTechnology/feature/workflow_zy

Feature/workflow zy

web/src/api/memory.ts

@@ -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 用户记忆 相关接口 ******************************/

web/src/i18n/en.ts

@@ -1246,6 +1246,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',
@@ -2274,6 +2278,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',
     }
   },
 };

web/src/i18n/zh.ts

@@ -1327,6 +1327,10 @@ export const zh = {
       associative_memory: '关联记忆',
       unix: '个',
       completeMemory: '完整记忆',
+      relationshipEvolution: '关系演化',
+      timelineMemories: '共同记忆时间线',
+      emotionLine: '情绪随时间变化',
+      interaction: '互动频率 & 关系阶段',
     },
     space: {
       createSpace: '创建空间',
@@ -2374,6 +2378,15 @@ export const zh = {
       section_count: '段落数',
       timeLine: '感知时间线',
       lastInfo: '实时感知仪表盘',
+    },
+    explicitDetail: {
+      episodic_memories: '情景记忆',
+      semantic_memories: '语义记忆',
+      content: '核心描述',
+      created_at: '创建时间',
+      emotion: '情绪',
+      core_definition: '核心定义',
+      detailed_notes: '详细笔记',
     }
   },
 }

web/src/routes/index.tsx

@@ -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')),

web/src/routes/routes.json

@@ -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": "/user-memory/detail/:id/:type", "element": "MemoryNodeDetail" }
-      { "path": "/graph/:id", "element": "GraphDetail" }
     ]
   },
   {

web/src/views/UserMemoryDetail/components/AboutMe.tsx

@@ -30,7 +30,6 @@ const AboutMe = forwardRef<AboutMeRef>((_props, ref) => {
     getData()
   }, [id])
   
-  // 记忆洞察
   const getData = () => {
     if (!id) return
     setLoading(true)

web/src/views/UserMemoryDetail/components/EmotionLine.tsx

@@ -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

web/src/views/UserMemoryDetail/components/ExplicitDetailModal.tsx

@@ -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;

web/src/views/UserMemoryDetail/components/GraphDetail.tsx

@@ -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

web/src/views/UserMemoryDetail/components/Habits.tsx

@@ -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)

web/src/views/UserMemoryDetail/components/InterestAreas.tsx

@@ -34,7 +34,6 @@ const InterestAreas: FC = () => {
     getData()
   }, [id])
 
-  // 记忆洞察
   const getData = () => {
     if (!id) return
     setLoading(true)

web/src/views/UserMemoryDetail/components/NodeStatistics.tsx

@@ -48,7 +48,6 @@ const NodeStatistics: FC = () => {
     getData()
   }, [id])
 
-  // 记忆洞察
   const getData = () => {
     if (!id) return
     setLoading(true)

web/src/views/UserMemoryDetail/components/RelationshipNetwork.tsx

@@ -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>
   )
 }

web/src/views/UserMemoryDetail/pages/EpisodicDetail.tsx

@@ -72,10 +72,9 @@ const EpisodicDetail: FC = () => {
 
   useEffect(() => {
     if (!id) return
-    // getData()
+    getData()
   }, [id])
 
-  // 记忆洞察
   const getData = () => {
     if (!id) return
     setLoading(true)

web/src/views/UserMemoryDetail/pages/ExplicitDetail.tsx

@@ -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

web/src/views/UserMemoryDetail/pages/ForgetDetail.tsx

@@ -31,7 +31,6 @@ const ForgetDetail: FC = () => {
     getData()
   }, [id])
 
-  // 记忆洞察
   const getData = () => {
     if (!id) return
     setLoading(true)

web/src/views/UserMemoryDetail/pages/GraphDetail.tsx

@@ -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

web/src/views/UserMemoryDetail/pages/index.tsx

@@ -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>
   )

web/src/views/UserMemoryDetail/types.ts

@@ -185,3 +185,6 @@ export interface ForgetData {
   }[],
   timestamp: number;
 }
+export interface GraphDetailRef {
+  handleOpen: (vo: Node) => void
+}

web/src/views/Workflow/components/AddChatVariable/ChatVariableModal.tsx

@@ -1,5 +1,5 @@
 import { forwardRef, useImperativeHandle, useState } from 'react';
-import { Form, Input, Select, Checkbox, InputNumber } from 'antd';
+import { Form, Input, Select, InputNumber } from 'antd';
 import { useTranslation } from 'react-i18next';
 
 import type { ChatVariableModalRef } from './types'
@@ -26,6 +26,7 @@ const ChatVariableModal = forwardRef<ChatVariableModalRef, ChatVariableModalProp
   const [form] = Form.useForm<ChatVariable>();
   const [loading, setLoading] = useState(false)
   const [editIndex, setEditIndex] = useState<number | undefined>(undefined)
+  const type = Form.useWatch('type', form);
 
   // 封装取消方法，添加关闭弹窗逻辑
   const handleClose = () => {
@@ -38,7 +39,8 @@ const ChatVariableModal = forwardRef<ChatVariableModalRef, ChatVariableModalProp
   const handleOpen = (variable?: ChatVariable, index?: number) => {
     setVisible(true);
     if (variable) {
-      form.setFieldsValue(variable)
+      const { default: _, ...rest } = variable
+      form.setFieldsValue({ ...rest })
       setEditIndex(index)
     } else {
       form.resetFields();
@@ -48,7 +50,7 @@ const ChatVariableModal = forwardRef<ChatVariableModalRef, ChatVariableModalProp
   // 封装保存方法，添加提交逻辑
   const handleSave = () => {
     form.validateFields().then((values) => {
-      refresh({ ...values }, editIndex)
+      refresh({ ...values, default: values.defaultValue }, editIndex)
       handleClose()
     })
   }
@@ -89,52 +91,36 @@ const ChatVariableModal = forwardRef<ChatVariableModalRef, ChatVariableModalProp
         >
           <Select
             placeholder={t('common.pleaseSelect')}
-            onChange={() => form.setFieldValue('default', undefined)}
+            onChange={() => form.setFieldValue('defaultValue', undefined)}
             options={types.map(key => ({
               value: key,
               label: t(`workflow.config.parameter-extractor.${key}`),
             }))}
           />
         </FormItem>
-        <FormItem
+        <Form.Item
-          name="default"
+          name="defaultValue"
           label={t('workflow.config.parameter-extractor.default')}
         >
-          <Form.Item noStyle shouldUpdate={(prevValues, currentValues) => prevValues.type !== currentValues.type}>
+          {type === 'number'
-            {({ getFieldValue }) => {
+            ? <InputNumber placeholder={t('common.enter')} style={{ width: '100%' }} />
-              const type = getFieldValue('type');
+            : type === 'boolean'
-              if (type === 'number') {
+            ? <Select
-                return <InputNumber placeholder={t('common.enter')} style={{ width: '100%' }} />;
+              placeholder={t('common.pleaseSelect')}
-              }
+              options={[
-              if (type === 'boolean') {
+                { value: true, label: 'true' },
-                return (
+                { value: false, label: 'false' }
-                  <Select
+              ]}
-                    placeholder={t('common.pleaseSelect')}
+            />
-                    options={[
+            : <Input placeholder={t('common.enter')} />
-                      { value: true, label: 'true' },
+          }
-                      { value: false, label: 'false' }
+        </Form.Item>
-                    ]}
-                  />
-                );
-              }
-              return <Input placeholder={t('common.enter')} />;
-            }}
-          </Form.Item>
-        </FormItem>
-
         <FormItem
           name="description"
           label={t('workflow.config.parameter-extractor.desc')}
         >
           <Input.TextArea placeholder={t('common.enter')} />
         </FormItem>
-
-        <FormItem
-          name="required"
-          valuePropName="checked"
-        >
-          <Checkbox>{t('workflow.config.parameter-extractor.required')}</Checkbox>
-        </FormItem>
       </Form>
     </RbModal>
   );

web/src/views/Workflow/components/AddChatVariable/index.tsx

@@ -40,7 +40,7 @@ const AddChatVariable = forwardRef<AddChatVariableRef, AddChatVariableProps>(({
   }
   const handleSave = (value: ChatVariable, index?: number) => {
     const list = [...variables]
-    if (index && index > -1) {
+    if (typeof index === 'number' && index > -1) {
       list[index] = value
     } else {
       list.push(value)
@@ -75,17 +75,15 @@ const AddChatVariable = forwardRef<AddChatVariableRef, AddChatVariableProps>(({
             dataSource={variables}
             renderItem={(item, index) => (
               <List.Item>
-                <div key={index} className="rb:group rb:relative rb:p-[12px_16px] rb:bg-[#FBFDFF] rb:cursor-pointer rb:border rb:border-[#DFE4ED] rb:rounded-lg">
+                <div key={index} className="rb:relative rb:p-[12px_16px] rb:bg-[#FBFDFF] rb:cursor-pointer rb:border rb:border-[#DFE4ED] rb:rounded-lg">
                   <div className="rb:flex rb:items-center rb:justify-between">
                     <div className="rb:leading-4">
                       <span className="rb:font-medium">{item.name}</span>
                       <span className="rb:text-[12px] rb:text-[#5B6167] rb:font-regular"> ({t(`workflow.config.parameter-extractor.${item.type}`)})</span>
                     </div>
-                    <span className="rb:block rb:group-hover:hidden rb:text-[12px] rb:text-[#5B6167] rb:font-regular">{item.required ? t('workflow.config.parameter-extractor.required') : ''}</span>
-
                   </div>
                   <div className="rb:mt-1 rb:text-[12px] rb:text-[#5B6167] rb:font-regular rb:leading-5 rb:wrap-break-word rb:line-clamp-1">{item.description}</div>
-                  <Space size={12} className="rb:hidden! rb:group-hover:flex! rb:absolute rb:right-4 rb:top-[50%] rb:transform-[translateY(-50%)] rb:bg-white">
+                  <Space size={12} className="rb:flex rb:absolute rb:right-4 rb:top-[50%] rb:transform-[translateY(-50%)] rb:bg-white">
                     <div
                       className="rb:size-5 rb:cursor-pointer rb:bg-cover rb:bg-[url('@/assets/images/editBorder.svg')] rb:hover:bg-[url('@/assets/images/editBg.svg')]"
                       onClick={() => handleEdit(index)}

web/src/views/Workflow/components/AddChatVariable/types.ts

@@ -11,8 +11,8 @@ export interface VariableFormData {
   name: string;
   type: ChatVariable['type'];
   description?: string;
-  required?: boolean;
+  defaultValue?: string;
-  defaultValue?: any;
+  default?: string;
 }
 
 export interface ChatVariableModalRef {

web/src/views/Workflow/components/Properties/AssignmentList/index.tsx

@@ -114,6 +114,7 @@ const AssignmentList: FC<AssignmentListProps> = ({
                           ? <InputNumber
                             placeholder={t('common.pleaseEnter')}
                             className="rb:w-full!"
+                            onChange={(value) => form.setFieldValue([name, 'value'], value)}
                           />
                           : operation === 'assign'
                           ? <>

web/src/views/Workflow/components/Properties/CaseList/index.tsx

@@ -348,8 +348,12 @@ const CaseList: FC<CaseListProps> = ({
                                               popupMatchSelectWidth={false}
                                               variant="borderless"
                                             />
-                                            : <InputNumber placeholder={t('common.pleaseEnter')}
+                                            : <InputNumber
-                                              variant="borderless" className="rb:w-full!" />
+                                                placeholder={t('common.pleaseEnter')}
+                                                variant="borderless"
+                                                className="rb:w-full!"
+                                                onChange={(value) => form.setFieldValue([name, caseIndex, 'expressions', conditionIndex, 'right'], value)}
+                                              />
                                           }
                                         </Form.Item>
                                       </Col>

web/src/views/Workflow/components/Properties/ConditionList/index.tsx

@@ -169,8 +169,12 @@ const ConditionList: FC<CaseListProps> = ({
                                     variant="borderless"
                                     className="rb:w-full!"
                                   />
-                                  : <InputNumber placeholder={t('common.pleaseEnter')}
+                                  : <InputNumber
-                                    variant="borderless" className="rb:w-full!" />
+                                      placeholder={t('common.pleaseEnter')}
+                                      variant="borderless"
+                                      className="rb:w-full!"
+                                      onChange={(value) => form.setFieldValue([parentName, 'expressions', index, 'right'], value)}
+                                    />
                                 }
                               </Form.Item>
                             </Col>

web/src/views/Workflow/components/Properties/HttpRequest/index.tsx

@@ -194,19 +194,31 @@ const HttpRequest: FC<{ options: Suggestion[]; selectedNode?: any; graphRef?: an
         name={['timeouts', 'connect_timeout']}
         label={t('workflow.config.http-request.connect_timeout')}
       >
-        <InputNumber placeholder={t('common.pleaseEnter')} className="rb:w-full!" />
+        <InputNumber
+          placeholder={t('common.pleaseEnter')}
+          className="rb:w-full!"
+          onChange={(value) => form.setFieldValue(['timeouts', 'connect_timeout'], value)}
+        />
       </Form.Item>
       <Form.Item
         name={['timeouts', 'read_timeout']}
         label={t('workflow.config.http-request.read_timeout')}
       >
-        <InputNumber placeholder={t('common.pleaseEnter')} className="rb:w-full!" />
+        <InputNumber
+          placeholder={t('common.pleaseEnter')}
+          className="rb:w-full!"
+          onChange={(value) => form.setFieldValue(['timeouts', 'read_timeout'], value)}
+        />
       </Form.Item>
       <Form.Item
         name={['timeouts', 'write_timeout']}
         label={t('workflow.config.http-request.write_timeout')}
       >
-        <InputNumber placeholder={t('common.pleaseEnter')} className="rb:w-full!" />
+        <InputNumber
+          placeholder={t('common.pleaseEnter')}
+          className="rb:w-full!"
+          onChange={(value) => form.setFieldValue(['timeouts', 'write_timeout'], value)}
+        />
       </Form.Item>
 
       <Divider />
@@ -219,13 +231,21 @@ const HttpRequest: FC<{ options: Suggestion[]; selectedNode?: any; graphRef?: an
             name={['retry', 'max_attempts']}
             label={t('workflow.config.http-request.max_attempts')}
           >
-            <InputNumber placeholder={t('common.pleaseEnter')} className="rb:w-full!" />
+            <InputNumber
+              placeholder={t('common.pleaseEnter')}
+              className="rb:w-full!"
+              onChange={(value) => form.setFieldValue(['retry', 'max_attempts'], value)}
+            />
           </Form.Item>
           <Form.Item
             name={['retry', 'retry_interval']}
             label={<>{t('workflow.config.http-request.retry_interval')} <span className="rb:text-[#5B6167]">(ms)</span></>}
           >
-            <InputNumber placeholder={t('common.pleaseEnter')} className="rb:w-full!" />
+            <InputNumber
+              placeholder={t('common.pleaseEnter')}
+              className="rb:w-full!"
+              onChange={(value) => form.setFieldValue(['retry', 'retry_interval'], value)}
+            />
           </Form.Item>
         </>
       }
@@ -254,7 +274,11 @@ const HttpRequest: FC<{ options: Suggestion[]; selectedNode?: any; graphRef?: an
             name={['error_handle', 'status_code']}
             label={<>status_code <span className="rb:text-[#5B6167] rb:ml-1">number</span></>}
           >
-            <InputNumber placeholder={t('common.pleaseEnter')} className="rb:w-full!" />
+            <InputNumber
+              placeholder={t('common.pleaseEnter')}
+              className="rb:w-full!"
+              onChange={(value) => form.setFieldValue(['error_handle', 'status_code'], value)}
+            />
           </Form.Item>
           <Form.Item
             name={['error_handle', 'headers']}

web/src/views/Workflow/components/Properties/Knowledge/KnowledgeConfigModal.tsx

@@ -117,7 +117,12 @@ const KnowledgeConfigModal = forwardRef<KnowledgeConfigModalRef, KnowledgeConfig
           extra={t('application.top_k_desc')}
           initialValue={5}
         >
-          <InputNumber style={{ width: '100%' }} min={1} max={20} />
+          <InputNumber
+            style={{ width: '100%' }}
+            min={1}
+            max={20}
+            onChange={(value) => form.setFieldValue('top_k', value)}
+          />
         </FormItem>
         {/* 语义相似度阈值 similarity_threshold */}
         {values?.retrieve_type === 'semantic' && (

web/src/views/Workflow/components/Properties/Knowledge/KnowledgeGlobalConfigModal.tsx

@@ -110,7 +110,12 @@ const KnowledgeGlobalConfigModal = forwardRef<KnowledgeGlobalConfigModalRef, Kno
             rules={[{ required: true, message: t('common.pleaseEnter') }]}
             extra={t('application.reranker_top_k_desc')}
           >
-            <InputNumber style={{ width: '100%' }} min={1} max={20} />
+            <InputNumber
+              style={{ width: '100%' }}
+              min={1}
+              max={20}
+              onChange={(value) => form.setFieldValue('reranker_top_k', value)}
+            />
           </FormItem>
         </>}
       </Form>

web/src/views/Workflow/components/Properties/ToolConfig/index.tsx

@@ -197,7 +197,14 @@ const ToolConfig: FC<{ options: Suggestion[]; }> = ({
                 : parameter.type === 'boolean'
                 ? <Switch />
                 : parameter.type === 'integer' || parameter.type === 'number'
-                ? <InputNumber min={parameter.minimum} max={parameter.maximum} step={parameter.type === 'integer' ? 1 : 0.01} placeholder={t('common.pleaseEnter')} className="rb:w-full!" />
+                ? <InputNumber
+                    min={parameter.minimum}
+                    max={parameter.maximum}
+                    step={parameter.type === 'integer' ? 1 : 0.01}
+                    placeholder={t('common.pleaseEnter')}
+                    className="rb:w-full!"
+                    onChange={(value) => form.setFieldValue(['tool_parameters', parameter.name], value)}
+                  />
                 : <Editor
                     height={32}
                     variant="outlined"

web/src/views/Workflow/components/Properties/VariableEditModal.tsx

@@ -141,7 +141,11 @@ const VariableEditModal = forwardRef<VariableEditModalRef, VariableEditModalProp
             name="max_length"
             label={t('workflow.config.start.max_length')}
           >
-            <InputNumber placeholder={t('common.enter')} style={{ width: '100%' }} />
+            <InputNumber
+              placeholder={t('common.enter')}
+              style={{ width: '100%' }}
+              onChange={(value) => form.setFieldValue('max_length', value)}
+            />
           </FormItem>
         )}
         {/* 默认值 */}
@@ -151,7 +155,13 @@ const VariableEditModal = forwardRef<VariableEditModalRef, VariableEditModalProp
             label={t('workflow.config.start.default')}
           >
             {['string'].includes(values.type) && <Input placeholder={t('common.enter')} />}
-            {['number'].includes(values.type) && <InputNumber placeholder={t('common.enter')} style={{ width: '100%' }} />}
+            {['number'].includes(values.type) && (
+              <InputNumber
+                placeholder={t('common.enter')}
+                style={{ width: '100%' }}
+                onChange={(value) => form.setFieldValue('default', value)}
+              />
+            )}
             {['boolean'].includes(values.type) && <Select placeholder={t('common.pleaseSelect')} options={[{ value: true, label: t('workflow.config.start.defaultChecked') }, { value: false, label: t('workflow.config.start.notDefaultChecked') }]} />}
           </FormItem>
         )}

web/src/views/Workflow/components/Properties/VariableSelect.tsx

@@ -72,7 +72,10 @@ const VariableSelect: FC<VariableSelectProps> = ({
 
   const groupedOptions = Object.entries(groupedSuggestions).map(([_nodeId, suggestions]) => ({
     label: suggestions[0].nodeData.name,
-    options: suggestions.map(s => ({ label: s.label, value: `{{${s.value}}}` }))
+    options: suggestions.map(s => ({ 
+      label: <div className="rb:flex rb:items-center rb:gap-1 rb:justify-between"> { s.label } <span>{s.dataType}</span></div>, 
+      value: `{{${s.value}}}` 
+    }))
   }));
   
   return (

web/src/views/Workflow/components/Properties/index.tsx

@@ -36,7 +36,7 @@ interface PropertiesProps {
 const Properties: FC<PropertiesProps> = ({
   selectedNode,
   graphRef,
-  config,
+  config: workflowConfig,
 }) => {
   const { t } = useTranslation()
   const { modal } = App.useApp()
@@ -47,7 +47,7 @@ const Properties: FC<PropertiesProps> = ({
   const [editIndex, setEditIndex] = useState<number | null>(null)
   const prevMappingNamesRef = useRef<string[]>([])
   const prevTemplateVarsRef = useRef<string[]>([])
-  const syncTimeoutRef = useRef<NodeJS.Timeout | null>(null)
+  const syncTimeoutRef = useRef<number | null>(null)
   const isSyncingRef = useRef(false)
   const lastSyncSourceRef = useRef<'mapping' | 'template' | null>(null)
 
@@ -64,7 +64,7 @@ const Properties: FC<PropertiesProps> = ({
   useEffect(() => {
     if (isSyncingRef.current || lastSyncSourceRef.current === 'mapping' || selectedNode?.data?.type !== 'jinja-render' || !values?.mapping || !values?.template) return
     
-    const currentMappingNames = values.mapping.map((item: any) => item.name).filter(Boolean)
+    const currentMappingNames = Array.isArray(values.mapping) ? values.mapping.map((item: any) => item.name).filter(Boolean) : []
     const prevNames = prevMappingNamesRef.current
     
     if (prevNames.length === 0) {
@@ -121,7 +121,7 @@ const Properties: FC<PropertiesProps> = ({
       return
     }
     
-    const updatedMapping = [...values.mapping]
+    const updatedMapping = Array.isArray(values.mapping) ? [...values.mapping] : []
     const existingNames = updatedMapping.map(item => item.name)
     let updatedTemplate = String(values.template)
     
@@ -343,11 +343,12 @@ const Properties: FC<PropertiesProps> = ({
     // Add parent loop/iteration node variables if current node is a child
     if (parentLoopNode) {
       const parentData = parentLoopNode.getData();
+      const parentNodeId = parentLoopNode.getData().id;
       
       if (parentData.type === 'loop') {
         const cycleVars = parentData.cycle_vars || [];
         cycleVars.forEach((cycleVar: any) => {
-          const key = `${parentLoopNode.getData().id}_cycle_${cycleVar.name}`;
+          const key = `${parentNodeId}_cycle_${cycleVar.name}`;
           if (!addedKeys.has(key)) {
             addedKeys.add(key);
             variableList.push({
@@ -355,15 +356,15 @@ const Properties: FC<PropertiesProps> = ({
               label: cycleVar.name,
               type: 'variable',
               dataType: cycleVar.type || 'String',
-              value: `${parentLoopNode.getData().id}.${cycleVar.name}`,
+              value: `${parentNodeId}.${cycleVar.name}`,
               nodeData: parentData,
             });
           }
         });
       } else if (parentData.type === 'iteration') {
         // Add item and index variables for iteration parent
-        const itemKey = `${parentLoopNode.getData().id}_item`;
+        const itemKey = `${parentNodeId}_item`;
-        const indexKey = `${parentLoopNode.getData().id}_index`;
+        const indexKey = `${parentNodeId}_index`;
         
         if (!addedKeys.has(itemKey)) {
           addedKeys.add(itemKey);
@@ -372,7 +373,7 @@ const Properties: FC<PropertiesProps> = ({
             label: 'item',
             type: 'variable',
             dataType: 'Object',
-            value: `${parentLoopNode.getData().id}.item`,
+            value: `${parentNodeId}.item`,
             nodeData: parentData,
           });
         }
@@ -384,7 +385,7 @@ const Properties: FC<PropertiesProps> = ({
             label: 'index',
             type: 'variable',
             dataType: 'Number',
-            value: `${parentLoopNode.getData().id}.index`,
+            value: `${parentNodeId}.index`,
             nodeData: parentData,
           });
         }
@@ -400,6 +401,7 @@ const Properties: FC<PropertiesProps> = ({
       if (!node) return;
       
       const nodeData = node.getData();
+      const dataNodeId = nodeData.id; // Use the data.id instead of node.id for consistency
 
       switch(nodeData.type) {
         case 'start':
@@ -409,7 +411,7 @@ const Properties: FC<PropertiesProps> = ({
           ]
           list.forEach((variable: any) => {
             if (!variable || !variable?.name) return;
-            const key = `${nodeId}_${variable.name}`;
+            const key = `${dataNodeId}_${variable.name}`;
             if (!addedKeys.has(key)) {
               addedKeys.add(key);
               variableList.push({
@@ -417,14 +419,14 @@ const Properties: FC<PropertiesProps> = ({
                 label: variable.name,
                 type: 'variable',
                 dataType: variable.type,
-                value: `${node.getData().id}.${variable.name}`,
+                value: `${dataNodeId}.${variable.name}`,
                 nodeData: nodeData,
               });
             }
           });
           nodeData.config?.variables?.sys?.forEach((variable: any) => {
             if (!variable || !variable?.name) return;
-            const key = `${nodeId}_sys_${variable.name}`;
+            const key = `${dataNodeId}_sys_${variable.name}`;
             if (!addedKeys.has(key)) {
               addedKeys.add(key);
               variableList.push({
@@ -439,7 +441,7 @@ const Properties: FC<PropertiesProps> = ({
           });
           break
         case 'llm':
-          const llmKey = `${nodeId}_output`;
+          const llmKey = `${dataNodeId}_output`;
           if (!addedKeys.has(llmKey)) {
             addedKeys.add(llmKey);
             variableList.push({
@@ -447,13 +449,13 @@ const Properties: FC<PropertiesProps> = ({
               label: 'output',
               type: 'variable',
               dataType: 'String',
-              value: `${node.getData().id}.output`,
+              value: `${dataNodeId}.output`,
               nodeData: nodeData,
             });
           }
           break
         case 'knowledge-retrieval':
-          const knowledgeKey = `${nodeId}_message`;
+          const knowledgeKey = `${dataNodeId}_message`;
           if (!addedKeys.has(knowledgeKey)) {
             addedKeys.add(knowledgeKey);
             variableList.push({
@@ -461,14 +463,14 @@ const Properties: FC<PropertiesProps> = ({
               label: 'message',
               type: 'variable',
               dataType: 'array[object]',
-              value: `${node.getData().id}.message`,
+              value: `${dataNodeId}.message`,
               nodeData: nodeData,
             });
           }
           break
         case 'parameter-extractor':
-          const successKey = `${nodeId}___is_success`;
+          const successKey = `${dataNodeId}___is_success`;
-          const reasonKey = `${nodeId}___reason`;
+          const reasonKey = `${dataNodeId}___reason`;
           if (!addedKeys.has(successKey)) {
             addedKeys.add(successKey);
             variableList.push({
@@ -476,7 +478,7 @@ const Properties: FC<PropertiesProps> = ({
               label: '__is_success',
               type: 'variable',
               dataType: 'number',
-              value: `${node.getData().id}.__is_success`,
+              value: `${dataNodeId}.__is_success`,
               nodeData: nodeData,
             });
           }
@@ -487,7 +489,7 @@ const Properties: FC<PropertiesProps> = ({
               label: '__reason',
               type: 'variable',
               dataType: 'string',
-              value: `${node.getData().id}.__reason`,
+              value: `${dataNodeId}.__reason`,
               nodeData: nodeData,
             });
           }
@@ -495,7 +497,7 @@ const Properties: FC<PropertiesProps> = ({
           const paramsList = nodeData.config?.params?.defaultValue || [];
           paramsList.forEach((param: any) => {
             if (!param || !param?.name) return;
-            const paramKey = `${nodeId}_${param.name}`;
+            const paramKey = `${dataNodeId}_${param.name}`;
             if (!addedKeys.has(paramKey)) {
               addedKeys.add(paramKey);
               variableList.push({
@@ -503,29 +505,50 @@ const Properties: FC<PropertiesProps> = ({
                 label: param.name,
                 type: 'variable',
                 dataType: param.type || 'string',
-                value: `${node.getData().id}.${param.name}`,
+                value: `${dataNodeId}.${param.name}`,
                 nodeData: nodeData,
               });
             }
           });
           break
         case 'var-aggregator':
-          const varAggregatorKey = `${nodeId}_output`;
+          if (nodeData.config.group.defaultValue) {
-          if (!addedKeys.has(varAggregatorKey)) {
+            // If group=true, add variables from group_variables with key as variable name
-            addedKeys.add(varAggregatorKey);
+            const groupVariables = nodeData.config.group_variables.defaultValue || [];
-            variableList.push({
+            groupVariables?.forEach((groupVar: any) => {
-              key: varAggregatorKey,
+              if (!groupVar || !groupVar.key) return;
-              label: 'output',
+              const groupVarKey = `${dataNodeId}_${groupVar.key}`;
-              type: 'variable',
+              if (!addedKeys.has(groupVarKey)) {
-              dataType: 'string',
+                addedKeys.add(groupVarKey);
-              value: `${node.getData().id}.output`,
+                variableList.push({
-              nodeData: nodeData,
+                  key: groupVarKey,
+                  label: groupVar.key,
+                  type: 'variable',
+                  dataType: 'string',
+                  value: `${dataNodeId}.${groupVar.key}`,
+                  nodeData: nodeData,
+                });
+              }
             });
+          } else {
+            // If group=false, add output variable
+            const varAggregatorKey = `${dataNodeId}_output`;
+            if (!addedKeys.has(varAggregatorKey)) {
+              addedKeys.add(varAggregatorKey);
+              variableList.push({
+                key: varAggregatorKey,
+                label: 'output',
+                type: 'variable',
+                dataType: 'string',
+                value: `${dataNodeId}.output`,
+                nodeData: nodeData,
+              });
+            }
           }
           break
         case 'http-request':
-          const httpBodyKey = `${nodeId}_body`;
+          const httpBodyKey = `${dataNodeId}_body`;
-          const httpStatusKey = `${nodeId}_status_code`;
+          const httpStatusKey = `${dataNodeId}_status_code`;
           if (!addedKeys.has(httpBodyKey)) {
             addedKeys.add(httpBodyKey);
             variableList.push({
@@ -533,7 +556,7 @@ const Properties: FC<PropertiesProps> = ({
               label: 'body',
               type: 'variable',
               dataType: 'string',
-              value: `${node.getData().id}.body`,
+              value: `${dataNodeId}.body`,
               nodeData: nodeData,
             });
           }
@@ -544,13 +567,13 @@ const Properties: FC<PropertiesProps> = ({
               label: 'status_code',
               type: 'variable',
               dataType: 'number',
-              value: `${node.getData().id}.status_code`,
+              value: `${dataNodeId}.status_code`,
               nodeData: nodeData,
             });
           }
           break
         case 'jinja-render':
-          const jinjaOutputKey = `${nodeId}_output`;
+          const jinjaOutputKey = `${dataNodeId}_output`;
           if (!addedKeys.has(jinjaOutputKey)) {
             addedKeys.add(jinjaOutputKey);
             variableList.push({
@@ -558,14 +581,14 @@ const Properties: FC<PropertiesProps> = ({
               label: 'output',
               type: 'variable',
               dataType: 'string',
-              value: `${node.getData().id}.output`,
+              value: `${dataNodeId}.output`,
               nodeData: nodeData,
             });
           }
           break
         case 'question-classifier':
-          const classNameKey = `${nodeId}_class_name`;
+          const classNameKey = `${dataNodeId}_class_name`;
-          const outputKey = `${nodeId}_output`;
+          const outputKey = `${dataNodeId}_output`;
           if (!addedKeys.has(classNameKey)) {
             addedKeys.add(classNameKey);
             variableList.push({
@@ -573,7 +596,7 @@ const Properties: FC<PropertiesProps> = ({
               label: 'class_name',
               type: 'variable',
               dataType: 'string',
-              value: `${node.getData().id}.class_name`,
+              value: `${dataNodeId}.class_name`,
               nodeData: nodeData,
             });
           }
@@ -584,13 +607,15 @@ const Properties: FC<PropertiesProps> = ({
               label: 'output',
               type: 'variable',
               dataType: 'string',
-              value: `${node.getData().id}.output`,
+              value: `${dataNodeId}.output`,
               nodeData: nodeData,
             });
           }
           break
         case 'iteration':
-          const iterationOutputKey = `${nodeId}_output`;
+          console.log('iteration addedKeys', addedKeys)
+          const iterationOutputKey = `${dataNodeId}_output`;
+          const iterationItemKey = `${dataNodeId}_item`;
           if (!addedKeys.has(iterationOutputKey)) {
             addedKeys.add(iterationOutputKey);
             // Get the data type from the output configuration, default to string
@@ -608,15 +633,26 @@ const Properties: FC<PropertiesProps> = ({
               label: 'output',
               type: 'variable',
               dataType: outputDataType,
-              value: `${node.getData().id}.output`,
+              value: `${dataNodeId}.output`,
+              nodeData: nodeData,
+            });
+          }
+          if (!addedKeys.has(iterationItemKey)) {
+            addedKeys.add(iterationItemKey);
+            variableList.push({
+              key: iterationItemKey,
+              label: 'item',
+              type: 'variable',
+              dataType: 'string',
+              value: `${dataNodeId}.item`,
               nodeData: nodeData,
             });
           }
           break
         case 'loop':
-          const cycleVars = nodeData.cycle_vars || [];
+          const cycleVars = nodeData.config.cycle_vars.defaultValue || [];
           cycleVars.forEach((cycleVar: any) => {
-            const cycleVarKey = `${nodeId}_cycle_${cycleVar.name}`;
+            const cycleVarKey = `${dataNodeId}_cycle_${cycleVar.name}`;
             if (!addedKeys.has(cycleVarKey)) {
               addedKeys.add(cycleVarKey);
               variableList.push({
@@ -624,14 +660,14 @@ const Properties: FC<PropertiesProps> = ({
                 label: cycleVar.name,
                 type: 'variable',
                 dataType: cycleVar.type || 'string',
-                value: `${node.getData().id}.${cycleVar.name}`,
+                value: `${dataNodeId}.${cycleVar.name}`,
                 nodeData: nodeData,
               });
             }
           });
           break
         case 'tool':
-          const toolDataKey = `${nodeId}_data`;
+          const toolDataKey = `${dataNodeId}_data`;
           if (!addedKeys.has(toolDataKey)) {
             addedKeys.add(toolDataKey);
             variableList.push({
@@ -639,7 +675,7 @@ const Properties: FC<PropertiesProps> = ({
               label: 'data',
               type: 'variable',
               dataType: 'object',
-              value: `${node.getData().id}.data`,
+              value: `${dataNodeId}.data`,
               nodeData: nodeData,
             });
           }
@@ -648,7 +684,7 @@ const Properties: FC<PropertiesProps> = ({
     });
 
     // Add conversation variables from global config
-    const conversationVariables = config?.variables || [];
+    const conversationVariables = workflowConfig?.variables || [];
     
     conversationVariables.forEach((variable: any) => {
       const key = `CONVERSATION_${variable.name}`;
@@ -667,7 +703,7 @@ const Properties: FC<PropertiesProps> = ({
     });
 
     return variableList;
-  }, [selectedNode, graphRef]);
+  }, [selectedNode, graphRef, workflowConfig?.variables]);
 
   // Filter out boolean type variables for loop and llm nodes
   const getFilteredVariableList = (nodeType?: string) => {
@@ -885,67 +921,7 @@ const Properties: FC<PropertiesProps> = ({
                         parentName={key}
                         options={(() => {
                           if (config.filterLoopIterationVars) {
-                            // Add loop cycle variables and iteration item/index variables
                             const loopIterationVars: Suggestion[] = [];
-                            const graph = graphRef.current;
-                            if (graph && selectedNode) {
-                              const nodes = graph.getNodes();
-                              
-                              // Find parent loop/iteration nodes
-                              const findParentLoopIteration = (nodeId: string): string[] => {
-                                const node = nodes.find(n => n.id === nodeId);
-                                if (!node) return [];
-                                
-                                const nodeData = node.getData();
-                                const cycle = nodeData?.cycle;
-                                
-                                if (cycle) {
-                                  const parentNode = nodes.find(n => n.getData().id === cycle);
-                                  if (parentNode) {
-                                    const parentData = parentNode.getData();
-                                    if (parentData?.type === 'loop') {
-                                      console.log('parentData', parentData)
-                                      // Add cycle variables from loop node
-                                      const cycleVars = parentData.cycle_vars || [];
-                                      cycleVars.forEach((cycleVar: any) => {
-                                        loopIterationVars.push({
-                                          key: `${cycle}_cycle_${cycleVar.name}`,
-                                          label: cycleVar.name,
-                                          type: 'variable',
-                                          dataType: 'String',
-                                          value: `${cycle}.${cycleVar.name}`,
-                                          nodeData: parentData,
-                                        });
-                                      });
-                                    } else if (parentData?.type === 'iteration') {
-                                      // Add item and index variables from iteration node
-                                      loopIterationVars.push(
-                                        {
-                                          key: `${cycle}_item`,
-                                          label: 'item',
-                                          type: 'variable',
-                                          dataType: 'Object',
-                                          value: `${cycle}.item`,
-                                          nodeData: parentData,
-                                        },
-                                        {
-                                          key: `${cycle}_index`,
-                                          label: 'index',
-                                          type: 'variable',
-                                          dataType: 'Number',
-                                          value: `${cycle}.index`,
-                                          nodeData: parentData,
-                                        }
-                                      );
-                                    }
-                                    return [cycle, ...findParentLoopIteration(cycle)];
-                                  }
-                                }
-                                return [];
-                              };
-                              
-                              findParentLoopIteration(selectedNode.id);
-                            }
                             
                             return [...getFilteredVariableList(selectedNode?.data?.type), ...loopIterationVars];
                           }
@@ -974,7 +950,11 @@ const Properties: FC<PropertiesProps> = ({
                         placeholder={t('common.pleaseSelect')}
                       />
                       : config.type === 'inputNumber'
-                      ? <InputNumber />
+                      ? <InputNumber
+                          placeholder={t('common.pleaseEnter')}
+                          className="rb:w-full!"
+                          onChange={(value) => form.setFieldValue(key, value)}
+                        />
                       : config.type === 'slider'
                       ? <Slider min={config.min} max={config.max} step={config.step} />
                       : config.type === 'customSelect'
@@ -1041,9 +1021,28 @@ const Properties: FC<PropertiesProps> = ({
                               value: `${selectedNode.getData().id}.${cycleVar.name}`,
                               nodeData: selectedNode.getData(),
                             }));
-                            return [...getFilteredVariableList(selectedNode?.data?.type), ...cycleVarSuggestions];
+                            return [...getFilteredVariableList(selectedNode?.data?.type).filter(variable => {
+                              // Keep conversation variables
+                              if (variable.group === 'CONVERSATION') return true;
+                              // Keep sys variables from start nodes
+                              if (variable.nodeData?.type === 'start' && variable.value?.startsWith('sys.')) return true;
+                              // Keep variables from non-start nodes
+                              if (variable.nodeData?.type !== 'start') return true;
+                              // Filter out custom variables from start nodes
+                              return false;
+                            }), ...cycleVarSuggestions];
                           }
-                          return getFilteredVariableList(selectedNode?.data?.type);
+                          // Filter options for condition list: only sys variables from start nodes and conversation variables
+                          return getFilteredVariableList(selectedNode?.data?.type).filter(variable => {
+                            // Keep conversation variables
+                            if (variable.group === 'CONVERSATION') return true;
+                            // Keep sys variables from start nodes
+                            if (variable.nodeData?.type === 'start' && variable.value?.startsWith('sys.')) return true;
+                            // Keep variables from non-start nodes
+                            if (variable.nodeData?.type !== 'start') return true;
+                            // Filter out custom variables from start nodes
+                            return false;
+                          });
                         })()
                       }
                         selectedNode={selectedNode}

web/src/views/Workflow/hooks/useWorkflowGraph.ts

@@ -63,7 +63,17 @@ export const useWorkflowGraph = ({
     if (!id) return
     getWorkflowConfig(id)
       .then(res => {
-        setConfig(res as WorkflowConfig)
+        const { variables, ...rest } = res as WorkflowConfig
+        setConfig({
+          ...rest,
+          variables: variables.map(v => {
+            const { default: _, ...cleanV } = v
+            return {
+              ...cleanV,
+              defaultValue: v.default ?? ''
+            }
+          })
+        })
       })
   }
 
@@ -332,6 +342,7 @@ export const useWorkflowGraph = ({
                 },
               },
             },
+            zIndex: 0
           }
 
           return edgeConfig
@@ -906,6 +917,13 @@ export const useWorkflowGraph = ({
 
       const params = {
         ...config,
+        variables: config.variables.map(v => {
+            const { defaultValue, ...cleanV } = v
+            return {
+              ...cleanV,
+              default: defaultValue ?? ''
+            }
+          }),
         nodes: nodes.map((node: Node) => {
           const data = node.getData();
           const position = node.getPosition();

web/src/views/Workflow/types.ts

@@ -74,7 +74,8 @@ export interface WorkflowConfig {
     type: string;
     required: boolean;
     description: string;
-    default: string;
+    default?: string;
+    defaultValue: string;
   }>,
   execution_config: {
     max_execution_time: number;
@@ -114,7 +115,8 @@ export interface ChatVariable {
   type: string;
   required: boolean;
   description: string;
-  default: string;
+  default?: string;
+  defaultValue: string;
 }
 export interface AddChatVariableRef {
   handleOpen: (value?: ChatVariable) => void;