V4.8.15 feature (#3331)
* feat: add customize toolkit (#3205) * chaoyang * fix-auth * add toolkit * add order * plugin usage * fix * delete console: * Fix: Fix fullscreen preview top positioning and improve Markdown rendering logic (#3247) * 完成任务：修复全屏预览顶部固定问题，优化 Markdown 渲染逻辑 * 有问题修改 * 问题再修改 * 修正问题 * fix: plugin standalone display issue (#3254) * 4.8.15 test (#3246) * o1 config * perf: system plugin code * 调整系统插件代码。增加html 渲染安全配置。 (#3258) * perf: base64 picker * perf: list app or dataset * perf: plugin config code * 小窗适配等问题 (#3257) * 小窗适配等问题 * git问题 * 小窗剩余问题 * feat: system plugin auth and lock version (#3265) * feat: system plugin auth and lock version * update comment * 4.8.15 test (#3267) * tmp log * perf: login direct * perf: iframe html code * remove log * fix: plugin standalone display (#3277) * refactor: 页面拆分&i18n拆分 (#3281) * refactor: account组件拆成独立页面 * script: 新增i18n json文件创建脚本 * refactor: 页面i18n拆分 * i18n: add en&hant * 4.8.15 test (#3285) * tmp log * remove log * fix: watch avatar refresh * perf: i18n code * fix(plugin): use intro instead of userguide (#3290) * Universal SSO (#3292) * tmp log * remove log * feat: common oauth * readme * perf: sso provider * remove sso code * perf: refresh plugins * feat: add api dataset (#3272) * add api-dataset * fix api-dataset * fix api dataset * fix ts * perf: create collection code (#3301) * tmp log * remove log * perf: i18n change * update version doc * feat: question guide from chatId * perf: create collection code * fix: request api * fix: request api * fix: tts auth and response type (#3303) * perf: md splitter * fix: tts auth and response type * fix: api file dataset (#3307) * perf: api dataset init (#3310) * perf: collection schema * perf: api dataset init * refactor: 团队管理独立页面 (#3302) * ui: 团队管理独立页面 * 代码优化 * fix * perf: sync collection and ui check (#3314) * perf: sync collection * remove script * perf: update api server * perf: api dataset parent * perf: team ui * perf: team 18n * update team ui * perf: ui check * perf: i18n * fix: debug variables & cronjob & system plugin callback load (#3315) * fix: debug variables & cronjob & system plugin callback load * fix type * fix * fix * fix: plugin dataset quote;perf: system variables init (#3316) * fix: plugin dataset quote * perf: system variables init * perf: node templates ui;fix: dataset import ui (#3318) * fix: dataset import ui * perf: node templates ui * perf: ui refresh * feat:套餐改名和套餐跳转配置 (#3309) * fixing:except Sidebar * 去除了多余的代码 * 修正了套餐说明的代码 * 修正了误删除的show_git代码 * 修正了名字部分等代码 * 修正了问题,遗留了其他和ui讨论不一致的部分 * 4.8.15 test (#3319) * remove log * pref: bill ui * pref: bill ui * perf: log * html渲染文档 (#3270) * html渲染文档 * 文档有点小问题 * feat: doc (#3322) * 集合重训练 (#3282) * rebaser * 一点补充 * 小问题 * 其他问题修正，删除集合保留文件的参数还没找到... * reTraining * delete uesless * 删除了一行错误代码 * 集合重训练部分 * fixing * 删除console代码 * feat: navbar item config (#3326) * perf: custom navbar code;perf: retraining code;feat: api dataset and dataset api doc (#3329) * feat: api dataset and dataset api doc * perf: retraining code * perf: custom navbar code * fix: ts (#3330) * fix: ts * fix: ts * retraining ui * perf: api collection filter * perf: retrining button --------- Co-authored-by: heheer <heheer@sealos.io> Co-authored-by: Jiangween <145003935+Jiangween@users.noreply.github.com> Co-authored-by: papapatrick <109422393+Patrickill@users.noreply.github.com>
This commit is contained in:
Archer
@@ -1,11 +1,11 @@
|
||||
import React from 'react';
|
||||
import { Box, Flex, Grid, Link } from '@chakra-ui/react';
|
||||
import { Box, Flex, Grid, Link, ModalBody } from '@chakra-ui/react';
|
||||
import { useTranslation } from 'next-i18next';
|
||||
import { useSystemStore } from '@/web/common/system/useSystemStore';
|
||||
import MyModal from '@fastgpt/web/components/common/MyModal';
|
||||
|
||||
const Points = () => {
|
||||
const { t } = useTranslation();
|
||||
const { llmModelList, audioSpeechModelList, vectorModelList, whisperModel } = useSystemStore();
|
||||
|
||||
return (
|
||||
<Flex
|
||||
@@ -17,127 +17,157 @@ const Points = () => {
|
||||
<Box id="point-card" fontWeight={'bold'} fontSize={['24px', '36px']} color={'myGray.900'}>
|
||||
{t('common:support.wallet.subscription.Ai points')}
|
||||
</Box>
|
||||
<Link href="https://tiktokenizer.vercel.app/" target="_blank">
|
||||
<Link href="https://tiktokenizer.vercel.app/" target="_blank" mb={['30px', 14]}>
|
||||
{t('common:support.wallet.subscription.token_compute')}
|
||||
</Link>
|
||||
<Grid gap={6} mt={['30px', 14]} w={'100%'} color={'myGray.900'}>
|
||||
<Box
|
||||
display={['block', 'flex']}
|
||||
borderRadius={'xl'}
|
||||
borderWidth={'1px'}
|
||||
borderColor={'myGray.150'}
|
||||
bg={'rgba(255,255,255,0.9)'}
|
||||
overflow={'hidden'}
|
||||
>
|
||||
<Box
|
||||
flex={1}
|
||||
borderRightWidth={'1px'}
|
||||
borderRightColor={'myGray.150'}
|
||||
py={8}
|
||||
pl={10}
|
||||
fontSize={'md'}
|
||||
fontWeight={'bold'}
|
||||
color={'myGray.900'}
|
||||
>
|
||||
{t('common:support.wallet.subscription.ai_model')}
|
||||
</Box>
|
||||
<Box flex={4} textAlign={'center'}>
|
||||
{llmModelList?.map((item, i) => (
|
||||
<Flex key={item.model} py={4} bg={i % 2 !== 0 ? 'myGray.100' : ''}>
|
||||
<Box flex={'1 0 0'}>{item.name}</Box>
|
||||
<Box flex={'1 0 0'}>
|
||||
{item.charsPointsPrice +
|
||||
t('common:support.wallet.subscription.point') +
|
||||
' / 1000 Tokens'}
|
||||
</Box>
|
||||
</Flex>
|
||||
))}
|
||||
</Box>
|
||||
</Box>
|
||||
<Box
|
||||
display={['block', 'flex']}
|
||||
borderRadius={'xl'}
|
||||
borderWidth={'1px'}
|
||||
borderColor={'myGray.150'}
|
||||
bg={'rgba(255,255,255,0.9)'}
|
||||
overflow={'hidden'}
|
||||
>
|
||||
<Box flex={1} borderRightWidth={'1px'} borderRightColor={'myGray.150'} py={8} pl={10}>
|
||||
<Box fontSize={'md'} fontWeight={'bold'}>
|
||||
{t('common:core.ai.model.Vector Model')}
|
||||
</Box>
|
||||
<Box fontSize={'sm'} mt={1} color={'myGray.600'}>
|
||||
{t('common:core.ai.model.doc_index_and_dialog')}
|
||||
</Box>
|
||||
</Box>
|
||||
<Box flex={4} textAlign={'center'}>
|
||||
{vectorModelList?.map((item, i) => (
|
||||
<Flex key={item.model} py={4} bg={i % 2 !== 0 ? 'myGray.100' : ''}>
|
||||
<Box flex={'1 0 0'}>{item.name}</Box>
|
||||
<Box flex={'1 0 0'}>
|
||||
{item.charsPointsPrice +
|
||||
t('common:support.wallet.subscription.point') +
|
||||
' / 1000 Tokens'}
|
||||
</Box>
|
||||
</Flex>
|
||||
))}
|
||||
</Box>
|
||||
</Box>
|
||||
<Box
|
||||
display={['block', 'flex']}
|
||||
borderRadius={'xl'}
|
||||
borderWidth={'1px'}
|
||||
borderColor={'myGray.150'}
|
||||
bg={'rgba(255,255,255,0.9)'}
|
||||
overflow={'hidden'}
|
||||
>
|
||||
<Box flex={1} borderRightWidth={'1px'} borderRightColor={'myGray.150'} py={8} pl={10}>
|
||||
<Box fontSize={'md'} fontWeight={'bold'}>
|
||||
{t('common:core.app.TTS')}
|
||||
</Box>
|
||||
</Box>
|
||||
<Box flex={4} textAlign={'center'}>
|
||||
{audioSpeechModelList?.map((item, i) => (
|
||||
<Flex key={item.model} py={4} bg={i % 2 !== 0 ? 'myGray.50' : ''}>
|
||||
<Box flex={'1 0 0'}>{item.name}</Box>
|
||||
<Box flex={'1 0 0'}>
|
||||
{item.charsPointsPrice +
|
||||
t('common:support.wallet.subscription.point') +
|
||||
' / 1000' +
|
||||
t('common:unit.character')}
|
||||
</Box>
|
||||
</Flex>
|
||||
))}
|
||||
</Box>
|
||||
</Box>
|
||||
<Box
|
||||
display={['block', 'flex']}
|
||||
borderRadius={'xl'}
|
||||
borderWidth={'1px'}
|
||||
borderColor={'myGray.150'}
|
||||
bg={'rgba(255,255,255,0.9)'}
|
||||
overflow={'hidden'}
|
||||
>
|
||||
<Box flex={1} borderRightWidth={'1px'} borderRightColor={'myGray.150'} py={4} pl={10}>
|
||||
<Box fontSize={'md'} fontWeight={'bold'}>
|
||||
{t('common:core.app.Whisper')}
|
||||
</Box>
|
||||
</Box>
|
||||
<Box flex={4} textAlign={'center'} h={'100%'}>
|
||||
<Flex py={4}>
|
||||
<Box flex={'1 0 0'}>{whisperModel?.name}</Box>
|
||||
<Box flex={'1 0 0'}>
|
||||
{whisperModel?.charsPointsPrice +
|
||||
t('common:support.wallet.subscription.point') +
|
||||
' / 1000' +
|
||||
t('common:unit.minute')}
|
||||
</Box>
|
||||
</Flex>
|
||||
</Box>
|
||||
</Box>
|
||||
</Grid>
|
||||
<AiPointsTable />
|
||||
</Flex>
|
||||
);
|
||||
};
|
||||
|
||||
export default React.memo(Points);
|
||||
|
||||
export const AiPointsTable = () => {
|
||||
const { t } = useTranslation();
|
||||
const { llmModelList, audioSpeechModelList, vectorModelList, whisperModel } = useSystemStore();
|
||||
|
||||
return (
|
||||
<Grid gap={6} w={'100%'} color={'myGray.900'}>
|
||||
<Box
|
||||
display={['block', 'flex']}
|
||||
borderRadius={'xl'}
|
||||
borderWidth={'1px'}
|
||||
borderColor={'myGray.150'}
|
||||
bg={'rgba(255,255,255,0.9)'}
|
||||
overflow={'hidden'}
|
||||
>
|
||||
<Box
|
||||
flex={1}
|
||||
borderRightWidth={'1px'}
|
||||
borderRightColor={'myGray.150'}
|
||||
py={8}
|
||||
pl={10}
|
||||
fontSize={'md'}
|
||||
fontWeight={'bold'}
|
||||
color={'myGray.900'}
|
||||
>
|
||||
{t('common:support.wallet.subscription.ai_model')}
|
||||
</Box>
|
||||
<Box flex={4} textAlign={'center'}>
|
||||
{llmModelList?.map((item, i) => (
|
||||
<Flex key={item.model} py={4} bg={i % 2 !== 0 ? 'myGray.100' : ''}>
|
||||
<Box flex={'1 0 0'}>{item.name}</Box>
|
||||
<Box flex={'1 0 0'}>
|
||||
{item.charsPointsPrice +
|
||||
t('common:support.wallet.subscription.point') +
|
||||
' / 1000 Tokens'}
|
||||
</Box>
|
||||
</Flex>
|
||||
))}
|
||||
</Box>
|
||||
</Box>
|
||||
<Box
|
||||
display={['block', 'flex']}
|
||||
borderRadius={'xl'}
|
||||
borderWidth={'1px'}
|
||||
borderColor={'myGray.150'}
|
||||
bg={'rgba(255,255,255,0.9)'}
|
||||
overflow={'hidden'}
|
||||
>
|
||||
<Box flex={1} borderRightWidth={'1px'} borderRightColor={'myGray.150'} py={8} pl={10}>
|
||||
<Box fontSize={'md'} fontWeight={'bold'}>
|
||||
{t('common:core.ai.model.Vector Model')}
|
||||
</Box>
|
||||
<Box fontSize={'sm'} mt={1} color={'myGray.600'}>
|
||||
{t('common:core.ai.model.doc_index_and_dialog')}
|
||||
</Box>
|
||||
</Box>
|
||||
<Box flex={4} textAlign={'center'}>
|
||||
{vectorModelList?.map((item, i) => (
|
||||
<Flex key={item.model} py={4} bg={i % 2 !== 0 ? 'myGray.100' : ''}>
|
||||
<Box flex={'1 0 0'}>{item.name}</Box>
|
||||
<Box flex={'1 0 0'}>
|
||||
{item.charsPointsPrice +
|
||||
t('common:support.wallet.subscription.point') +
|
||||
' / 1000 Tokens'}
|
||||
</Box>
|
||||
</Flex>
|
||||
))}
|
||||
</Box>
|
||||
</Box>
|
||||
<Box
|
||||
display={['block', 'flex']}
|
||||
borderRadius={'xl'}
|
||||
borderWidth={'1px'}
|
||||
borderColor={'myGray.150'}
|
||||
bg={'rgba(255,255,255,0.9)'}
|
||||
overflow={'hidden'}
|
||||
>
|
||||
<Box flex={1} borderRightWidth={'1px'} borderRightColor={'myGray.150'} py={8} pl={10}>
|
||||
<Box fontSize={'md'} fontWeight={'bold'}>
|
||||
{t('common:core.app.TTS')}
|
||||
</Box>
|
||||
</Box>
|
||||
<Box flex={4} textAlign={'center'}>
|
||||
{audioSpeechModelList?.map((item, i) => (
|
||||
<Flex key={item.model} py={4} bg={i % 2 !== 0 ? 'myGray.50' : ''}>
|
||||
<Box flex={'1 0 0'}>{item.name}</Box>
|
||||
<Box flex={'1 0 0'}>
|
||||
{item.charsPointsPrice +
|
||||
t('common:support.wallet.subscription.point') +
|
||||
' / 1000' +
|
||||
t('common:unit.character')}
|
||||
</Box>
|
||||
</Flex>
|
||||
))}
|
||||
</Box>
|
||||
</Box>
|
||||
<Box
|
||||
display={['block', 'flex']}
|
||||
borderRadius={'xl'}
|
||||
borderWidth={'1px'}
|
||||
borderColor={'myGray.150'}
|
||||
bg={'rgba(255,255,255,0.9)'}
|
||||
overflow={'hidden'}
|
||||
>
|
||||
<Box flex={1} borderRightWidth={'1px'} borderRightColor={'myGray.150'} py={4} pl={10}>
|
||||
<Box fontSize={'md'} fontWeight={'bold'}>
|
||||
{t('common:core.app.Whisper')}
|
||||
</Box>
|
||||
</Box>
|
||||
<Box flex={4} textAlign={'center'} h={'100%'}>
|
||||
<Flex py={4}>
|
||||
<Box flex={'1 0 0'}>{whisperModel?.name}</Box>
|
||||
<Box flex={'1 0 0'}>
|
||||
{whisperModel?.charsPointsPrice +
|
||||
t('common:support.wallet.subscription.point') +
|
||||
' / 1000' +
|
||||
t('common:unit.minute')}
|
||||
</Box>
|
||||
</Flex>
|
||||
</Box>
|
||||
</Box>
|
||||
</Grid>
|
||||
);
|
||||
};
|
||||
|
||||
export const AiPointsModal = ({ onClose }: { onClose: () => void }) => {
|
||||
const { t } = useTranslation();
|
||||
|
||||
return (
|
||||
<MyModal
|
||||
isCentered
|
||||
iconSrc="/imgs/modal/bill.svg"
|
||||
title={t('common:support.wallet.subscription.Ai points')}
|
||||
isOpen
|
||||
onClose={onClose}
|
||||
w={'100%'}
|
||||
maxW={'90vw'}
|
||||
maxH={'90vh'}
|
||||
>
|
||||
<ModalBody>
|
||||
<AiPointsTable />
|
||||
</ModalBody>
|
||||
</MyModal>
|
||||
);
|
||||
};
|
||||
|
||||
@@ -44,6 +44,7 @@ const Standard = ({
|
||||
price: value.price * (selectSubMode === SubModeEnum.month ? 1 : 10),
|
||||
level: level as `${StandardSubLevelEnum}`,
|
||||
...standardSubLevelMap[level as `${StandardSubLevelEnum}`],
|
||||
label: value.name || standardSubLevelMap[level as `${StandardSubLevelEnum}`].label, // custom label
|
||||
maxTeamMember: value.maxTeamMember,
|
||||
maxAppAmount: value.maxAppAmount,
|
||||
maxDatasetAmount: value.maxDatasetAmount,
|
||||
@@ -160,7 +161,7 @@ const Standard = ({
|
||||
</Box>
|
||||
)}
|
||||
<Box fontSize={'md'} fontWeight={'500'} color={'myGray.900'}>
|
||||
{t(item.label)}
|
||||
{t(item.label as any)}
|
||||
</Box>
|
||||
<Box fontSize={['32px', '42px']} fontWeight={'bold'} color={'myGray.900'}>
|
||||
￥{item.price}
|
||||
|
||||
Reference in New Issue
Block a user