Austin/dify
1
0
Fork 0
mirror of https://github.com/langgenius/dify.git synced 2024-11-16 03:32:23 +08:00
Code Issues Actions 4 Packages Projects Releases Wiki Activity

fix: chat token spent info style (#1597)

Browse Source
This commit is contained in:
zxhlyh 2023-11-22 15:22:50 +08:00 committed by GitHub
parent 3c0fbf3a6a
commit 9587479b76
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 9 additions and 5 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

4
web/app/components/app/chat/answer/index.tsx
View File

@ -194,7 +194,7 @@ const Answer: FC<IAnswerProps> = ({
</div>
)
}
<div className={cn(s.answerWrapWrap, 'chat-answer-container')}>
<div className={cn(s.answerWrapWrap, 'chat-answer-container group')}>
<div className={`${s.answerWrap} ${showEdit ? 'w-full' : ''}`}>
<div className={`${s.answer} relative text-sm text-gray-900`}>
<div className={'ml-2 py-3 px-4 bg-gray-100 rounded-tr-2xl rounded-b-2xl'}>
@ -280,7 +280,7 @@ const Answer: FC<IAnswerProps> = ({
{!feedbackDisabled && renderFeedbackRating(feedback?.rating, !isHideFeedbackEdit, displayScene !== 'console')}
</div>
</div>
{more && <MoreInfo more={more} isQuestion={false} />}
{more && <MoreInfo className='hidden group-hover:block' more={more} isQuestion={false} />}
</div>
</div>
</div>

10
web/app/components/app/chat/more-info/index.tsx
View File

@ -5,11 +5,15 @@ import { useTranslation } from 'react-i18next'
import type { MessageMore } from '../type'
import { formatNumber } from '@/utils/format'
export type IMoreInfoProps = { more: MessageMore; isQuestion: boolean }
export type IMoreInfoProps = {
more: MessageMore
isQuestion: boolean
className?: string
}
const MoreInfo: FC<IMoreInfoProps> = ({ more, isQuestion }) => {
const MoreInfo: FC<IMoreInfoProps> = ({ more, isQuestion, className }) => {
const { t } = useTranslation()
return (<div className={`mt-1 w-full text-xs text-gray-400 !text-right ${isQuestion ? 'mr-2 text-right ' : 'ml-2 text-left float-right'}`}>
return (<div className={`mt-1 w-full text-xs text-gray-400 ${isQuestion ? 'mr-2 text-right ' : 'pl-2 text-left float-right'} ${className}`}>
<span>{`${t('appLog.detail.timeConsuming')} ${more.latency}${t('appLog.detail.second')}`}</span>
<span>{`${t('appLog.detail.tokenCost')} ${formatNumber(more.tokens)}`}</span>
<span>· </span>