From a430284aa21e3ae1f0d5654e55b2ad2852519cc2 Mon Sep 17 00:00:00 2001 From: wwf <yearningwang@iqtogether.com> Date: 星期三, 04 六月 2025 15:17:49 +0800 Subject: [PATCH] 初始化 --- app/components/app/text-generate/saved-items/index.tsx | 83 ++++++++++++++++++++++++++--------------- 1 files changed, 52 insertions(+), 31 deletions(-) diff --git a/app/components/app/text-generate/saved-items/index.tsx b/app/components/app/text-generate/saved-items/index.tsx index c22a4ca..8bfebbc 100644 --- a/app/components/app/text-generate/saved-items/index.tsx +++ b/app/components/app/text-generate/saved-items/index.tsx @@ -1,19 +1,15 @@ 'use client' import type { FC } from 'react' import React from 'react' -import { - RiClipboardLine, - RiDeleteBinLine, -} from '@remixicon/react' import { useTranslation } from 'react-i18next' import copy from 'copy-to-clipboard' import NoData from './no-data' import cn from '@/utils/classnames' import type { SavedMessage } from '@/models/debug' import { Markdown } from '@/app/components/base/markdown' +import { SimpleBtn, copyIcon } from '@/app/components/app/text-generate/item' import Toast from '@/app/components/base/toast' -import ActionButton from '@/app/components/base/action-button' -import NewAudioButton from '@/app/components/base/new-audio-button' +import AudioBtn from '@/app/components/base/audio-btn' export type ISavedItemsProps = { className?: string @@ -22,6 +18,12 @@ onRemove: (id: string) => void onStartCreateContent: () => void } + +const removeIcon = ( + <svg width="14" height="14" viewBox="0 0 14 14" fill="none" xmlns="http://www.w3.org/2000/svg"> + <path d="M5.25 1.75H8.75M1.75 3.5H12.25M11.0833 3.5L10.6742 9.63625C10.6129 10.5569 10.5822 11.0172 10.3833 11.3663C10.2083 11.6735 9.94422 11.9206 9.62597 12.0748C9.26448 12.25 8.80314 12.25 7.88045 12.25H6.11955C5.19686 12.25 4.73552 12.25 4.37403 12.0748C4.05577 11.9206 3.79172 11.6735 3.61666 11.3663C3.41781 11.0172 3.38713 10.5569 3.32575 9.63625L2.91667 3.5M5.83333 6.125V9.04167M8.16667 6.125V9.04167" stroke="#344054" strokeWidth="1.25" strokeLinecap="round" strokeLinejoin="round" /> + </svg> +) const SavedItems: FC<ISavedItemsProps> = ({ className, @@ -33,37 +35,56 @@ const { t } = useTranslation() return ( - <div className={cn('space-y-4', className)}> + <div className={cn(className, 'space-y-3')}> {list.length === 0 ? ( - <NoData onStartCreateContent={onStartCreateContent} /> + <div className='px-6'> + <NoData onStartCreateContent={onStartCreateContent} /> + </div> ) : (<> {list.map(({ id, answer }) => ( - <div key={id} className='relative'> - <div className={cn( - 'rounded-2xl bg-background-section-burn p-4', - )}> - <Markdown content={answer} /> - </div> - <div className='system-xs-regular mt-1 h-4 px-4 text-text-quaternary'> - <span>{answer.length} {t('common.unit.char')}</span> - </div> - <div className='absolute bottom-1 right-2'> - <div className='ml-1 flex items-center gap-0.5 rounded-[10px] border-[0.5px] border-components-actionbar-border bg-components-actionbar-bg p-0.5 shadow-md backdrop-blur-sm'> - {isShowTextToSpeech && <NewAudioButton value={answer}/>} - <ActionButton onClick={() => { - copy(answer) - Toast.notify({ type: 'success', message: t('common.actionMsg.copySuccessfully') }) - }}> - <RiClipboardLine className='h-4 w-4' /> - </ActionButton> - <ActionButton onClick={() => { - onRemove(id) - }}> - <RiDeleteBinLine className='h-4 w-4' /> - </ActionButton> + <div + key={id} + className='p-4 rounded-xl bg-gray-50' + style={{ + boxShadow: '0px 1px 2px rgba(16, 24, 40, 0.05)', + }} + > + <Markdown content={answer} /> + <div className='flex items-center justify-between mt-3'> + <div className='flex items-center space-x-2'> + <SimpleBtn + className='space-x-1' + onClick={() => { + copy(answer) + Toast.notify({ type: 'success', message: t('common.actionMsg.copySuccessfully') }) + }}> + {copyIcon} + <div>{t('common.operation.copy')}</div> + </SimpleBtn> + + <SimpleBtn + className='space-x-1' + onClick={() => { + onRemove(id) + }}> + {removeIcon} + <div>{t('common.operation.remove')}</div> + </SimpleBtn> + + {isShowTextToSpeech && ( + <> + <div className='ml-2 mr-2 h-[14px] w-[1px] bg-gray-200'></div> + <AudioBtn + value={answer} + noCache={false} + className={'mr-1'} + /> + </> + )} </div> + <div className='text-xs text-gray-500'>{answer?.length} {t('common.unit.char')}</div> </div> </div> ))} -- Gitblit v1.8.0