adai/MemoryBear
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(web): ui

Browse Source
This commit is contained in:
zhaoying
2026-03-25 15:54:11 +08:00
parent edd115582f
commit 491ef27b8a
2 changed files with 17 additions and 24 deletions
Download Patch File Download Diff File Expand all files Collapse all files

27
web/src/views/Workflow/components/Editor/plugin/AutocompletePlugin.tsx
View File

@@ -2,11 +2,12 @@
* @Author: ZhaoYing * @Author: ZhaoYing
* @Date: 2025-12-23 16:22:51 * @Date: 2025-12-23 16:22:51
* @Last Modified by: ZhaoYing * @Last Modified by: ZhaoYing
* @Last Modified time: 2026-03-03 10:12:33 * @Last Modified time: 2026-03-25 15:53:57
*/ */
import { useEffect, useState, useRef, type FC } from 'react'; import { useEffect, useState, useRef, type FC } from 'react';
import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext'; import { useLexicalComposerContext } from '@lexical/react/LexicalComposerContext';
import { $getSelection, $isRangeSelection, $isTextNode, COMMAND_PRIORITY_HIGH, KEY_ENTER_COMMAND, KEY_ARROW_DOWN_COMMAND, KEY_ARROW_UP_COMMAND, KEY_ESCAPE_COMMAND } from 'lexical'; import { $getSelection, $isRangeSelection, $isTextNode, COMMAND_PRIORITY_HIGH, KEY_ENTER_COMMAND, KEY_ARROW_DOWN_COMMAND, KEY_ARROW_UP_COMMAND, KEY_ESCAPE_COMMAND } from 'lexical';
import { Space } from 'antd';
import { INSERT_VARIABLE_COMMAND, CLOSE_AUTOCOMPLETE_COMMAND } from '../commands'; import { INSERT_VARIABLE_COMMAND, CLOSE_AUTOCOMPLETE_COMMAND } from '../commands';
import type { NodeProperties } from '../../../types' import type { NodeProperties } from '../../../types'
@@ -317,26 +318,12 @@ const AutocompletePlugin: FC<{ options: Suggestion[], enableJinja2?: boolean }>
onClick={() => !option.disabled && insertMention(option)} onClick={() => !option.disabled && insertMention(option)}
onMouseEnter={() => setSelectedIndex(globalIndex)} onMouseEnter={() => setSelectedIndex(globalIndex)}
> >
<div style={{ display: 'flex', alignItems: 'center', gap: '8px' }}> <Space size={4}>
<span <span className="rb:text-[#155EEF]">{option.isContext ? '📄' : `{x}`}</span>
style={{ <span>{option.label}</span>
background: option.isContext ? '#722ed1' : </Space>
option.type === 'system' ? '#1890ff' : '#52c41a',
color: 'white',
padding: '2px 6px',
borderRadius: '4px',
fontSize: '12px',
minWidth: '16px',
textAlign: 'center',
}}
>
{option.isContext ? '📄' :
option.type === 'system' ? 'x' : 'x'}
</span>
<span style={{ fontSize: '14px' }}>{option.label}</span>
</div>
{option.dataType && ( {option.dataType && (
<span style={{ fontSize: '12px', color: '#999' }}> <span className="rb:text-[#5B6167]">
{option.dataType} {option.dataType}
</span> </span>
)} )}

14
web/src/views/Workflow/components/Properties/VariableSelect.tsx
View File

@@ -1,12 +1,12 @@
/* /*
* @Author: ZhaoYing * @Author: ZhaoYing
* @Date: 2026-02-03 15:40:13 * @Date: 2026-02-03 15:40:13
* @Last Modified by: ZhaoYing * @Last Modified by: ZhaoYing
* @Last Modified time: 2026-02-03 15:40:13 * @Last Modified time: 2026-03-25 15:52:24
*/ */
import { type FC } from 'react' import { type FC } from 'react'
import clsx from 'clsx'; import clsx from 'clsx';
import { Select, type SelectProps, Flex } from 'antd' import { Select, type SelectProps, Flex, Space } from 'antd'
import type { Suggestion } from '../Editor/plugin/AutocompletePlugin' import type { Suggestion } from '../Editor/plugin/AutocompletePlugin'
type LabelRender = SelectProps['labelRender']; type LabelRender = SelectProps['labelRender'];
@@ -110,7 +110,13 @@ const VariableSelect: FC<VariableSelectProps> = ({
const groupedOptions = Object.entries(groupedSuggestions).map(([_nodeId, suggestions]) => ({ const groupedOptions = Object.entries(groupedSuggestions).map(([_nodeId, suggestions]) => ({
label: suggestions[0].nodeData.name, label: suggestions[0].nodeData.name,
options: suggestions.map(s => ({ options: suggestions.map(s => ({
label: <Flex align="center" justify="space-between" gap={4}> {s.label} <span>{s.dataType}</span></Flex>, label: <Flex align="center" justify="space-between" gap={4}>
<Space size={8}>
<span className="rb:text-[#155EEF]">{`{x}`}</span>
{s.label}
</Space>
<span className="rb:text-[#5B6167]">{s.dataType}</span>
</Flex>,
value: `{{${s.value}}}` value: `{{${s.value}}}`
})) }))
})); }));