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

fix(web): chat file ui update

Browse Source
This commit is contained in:
zhaoying
2026-02-09 10:37:29 +08:00
parent bca03f1365
commit 7fe2d8fbe1
2 changed files with 18 additions and 14 deletions
Download Patch File Download Diff File Expand all files Collapse all files

6
web/src/components/Chat/ChatInput.tsx
View File

@@ -2,7 +2,7 @@
* @Author: ZhaoYing
* @Date: 2025-12-10 16:46:14
* @Last Modified by: ZhaoYing
* @Last Modified time: 2026-02-06 21:23:37
* @Last Modified time: 2026-02-09 10:26:38
*/
import { type FC, useEffect, useMemo } from 'react'
import { Flex, Input, Form } from 'antd'
@@ -66,7 +66,7 @@ const ChatInput: FC<ChatInputProps> = ({
return (
<div className={`rb:absolute rb:bottom-3 rb:left-0 rb:right-0 rb:w-full ${className}`}>
<Flex vertical justify="space-between" className="rb:border rb:border-[#DFE4ED] rb:rounded-xl rb:min-h-30">
{previewFileList.length > 0 && <Flex gap={14} className="rb:mx-3! rb:mt-3!">
{previewFileList.length > 0 && <div className="rb:overflow-x-auto rb:max-w-full"><Flex gap={14} className="rb:mx-3! rb:mt-3! rb:w-max!">
{previewFileList.map((file) => {
if (file.type.includes('image')) {
return (
@@ -101,7 +101,7 @@ const ChatInput: FC<ChatInputProps> = ({
</div>
)
})}
</Flex>}
</Flex></div>}
{/* Message input form */}
<Form form={form} layout="vertical">
<Form.Item name="message" noStyle>

26
web/src/views/Conversation/components/UploadFileListModal.tsx
View File

@@ -1,8 +1,8 @@
/*
* @Author: ZhaoYing
* @Date: 2026-02-06 21:09:47
* @Last Modified by: ZhaoYing
* @Last Modified time: 2026-02-06 21:09:47
* @Last Modified by: ZhaoYing
* @Last Modified time: 2026-02-09 10:17:54
*/
/**
* Upload File List Modal Component
@@ -19,8 +19,7 @@
* @component
*/
import { forwardRef, useImperativeHandle, useState } from 'react';
import { Form, Input, Select, Button, Space } from 'antd';
import { PlusOutlined, MinusCircleOutlined } from '@ant-design/icons';
import { Form, Input, Select, Button, Flex } from 'antd';
import { useTranslation } from 'react-i18next';
import type { UploadFileListModalRef } from '../types'
@@ -95,11 +94,12 @@ const UploadFileListModal = forwardRef<UploadFileListModalRef, UploadFileListMod
<>
{/* Render each file entry with type selector and URL input */}
{fields.map(({ key, name, ...restField }) => (
<Space key={key} style={{ display: 'flex' }} align="baseline">
<Flex key={key} gap={8} align="center" className="rb:mb-3!">
<FormItem
{...restField}
name={[name, 'type']}
initialValue="image"
className="rb:mb-0!"
>
<Select
placeholder={t('memoryConversation.fileType')}
@@ -113,15 +113,19 @@ const UploadFileListModal = forwardRef<UploadFileListModalRef, UploadFileListMod
{...restField}
name={[name, 'url']}
rules={[{ required: true, message: t('common.pleaseEnter') }]}
className="rb:mb-0!"
>
<Input placeholder={t('memoryConversation.fileUrl')} className="rb:w-82.5" />
<Input placeholder={t('memoryConversation.fileUrl')} className="rb:w-82.5!" />
</FormItem>
<MinusCircleOutlined onClick={() => remove(name)} style={{ marginTop: 30 }} />
</Space>
<div
className="rb:w-5 rb:h-5 rb:cursor-pointer rb:bg-cover rb:bg-[url('@/assets/images/delete.svg')] rb:hover:bg-[url('@/assets/images/delete_hover.svg')]"
onClick={() => remove(name)}
></div>
</Flex>
))}
<Form.Item>
<Button type="dashed" onClick={() => add()} block icon={<PlusOutlined />}>
{t('common.add')}
<Form.Item noStyle>
<Button type="dashed" onClick={() => add()} block>
+ {t('common.add')}
</Button>
</Form.Item>
</>