feat: add experience button in model detail side sheet to jump to playground with model preset

This commit is contained in:
xiezhouwei 2026-06-19 10:17:00 +08:00
parent 189f314734
commit 977e9e8bf5
2 changed files with 27 additions and 2 deletions

View File

@ -18,8 +18,9 @@ For commercial licensing, please contact support@quantumnous.com
*/ */
import React, { useState, useEffect } from 'react'; import React, { useState, useEffect } from 'react';
import { useNavigate } from 'react-router-dom';
import { SideSheet, Typography, Button } from '@douyinfe/semi-ui'; import { SideSheet, Typography, Button } from '@douyinfe/semi-ui';
import { IconClose } from '@douyinfe/semi-icons'; import { IconClose, IconPlayCircle } from '@douyinfe/semi-icons';
import { API } from '../../../../helpers'; import { API } from '../../../../helpers';
import { useIsMobile } from '../../../../hooks/common/useIsMobile'; import { useIsMobile } from '../../../../hooks/common/useIsMobile';
@ -65,6 +66,15 @@ const ModelDetailSideSheet = ({
channelVideoPriceMap = {}, channelVideoPriceMap = {},
}) => { }) => {
const isMobile = useIsMobile(); const isMobile = useIsMobile();
const navigate = useNavigate();
const handleExperience = () => {
const modelName = modelData?.model_name;
if (modelName) {
navigate(`/console/playground?model=${encodeURIComponent(modelName)}`);
}
};
/** /**
* channel_id -> 单测/运营展示 DTO打开详情时按需拉取不并入 /pricing * channel_id -> 单测/运营展示 DTO打开详情时按需拉取不并入 /pricing
*/ */
@ -121,7 +131,18 @@ const ModelDetailSideSheet = ({
<SideSheet <SideSheet
placement='right' placement='right'
title={ title={
<ModelHeader modelData={modelData} vendorsMap={vendorsMap} t={t} /> <div className='flex items-center justify-between w-full'>
<ModelHeader modelData={modelData} vendorsMap={vendorsMap} t={t} />
<Button
icon={<IconPlayCircle />}
theme='solid'
type='primary'
size='small'
onClick={handleExperience}
>
{t('体验')}
</Button>
</div>
} }
bodyStyle={{ bodyStyle={{
padding: '0', padding: '0',

View File

@ -588,6 +588,10 @@ const Playground = () => {
if (searchParams.get('expired')) { if (searchParams.get('expired')) {
Toast.warning(t('登录过期,请重新登录!')); Toast.warning(t('登录过期,请重新登录!'));
} }
const modelParam = searchParams.get('model');
if (modelParam) {
handleInputChange('model', modelParam);
}
}, [searchParams, t]); }, [searchParams, t]);
// Playground isMobile useIsMobile Hook // Playground isMobile useIsMobile Hook