fix(dc-tool-b): 修复滚动条问题 - 适配MainLayout固定高度

- tool-b/index.tsx: min-h-screen  h-full overflow-y-auto
- 所有Step组件添加 h-full overflow-y-auto
- 修复:MainLayout改为固定高度后,工具B底部按钮可见性问题
- 效果:页面无滚动条,内容可内部滚动
This commit is contained in:
2025-12-10 19:28:08 +08:00
parent 4b41344d78
commit a3586cdf30
4 changed files with 6 additions and 6 deletions

View File

@@ -113,7 +113,7 @@ const Step1Upload: React.FC<Step1UploadProps> = ({ state, updateState, onNext })
const canProceed = state.healthCheckResult.status === 'good';
return (
<div className="max-w-3xl mx-auto w-full space-y-8 animate-in fade-in slide-in-from-bottom-4 duration-500 mt-8">
<div className="max-w-3xl mx-auto w-full space-y-8 animate-in fade-in slide-in-from-bottom-4 duration-500 mt-8 h-full overflow-y-auto">
{/* 文件上传区域 */}
{!state.fileName ? (
<div className="border-2 border-dashed border-slate-300 rounded-xl p-12 text-center hover:border-purple-400 hover:bg-purple-50/30 transition-all cursor-pointer">

View File

@@ -80,7 +80,7 @@ const Step2Schema: React.FC<Step2SchemaProps> = ({ state, updateState, onNext, o
};
return (
<div className="max-w-5xl mx-auto w-full space-y-6 animate-in fade-in slide-in-from-right-4 duration-500 mt-4">
<div className="max-w-5xl mx-auto w-full space-y-6 animate-in fade-in slide-in-from-right-4 duration-500 mt-4 h-full overflow-y-auto">
{/* 模板选择 */}
<div className="bg-purple-50 p-6 rounded-xl border border-purple-100 grid grid-cols-2 gap-6">
<div>

View File

@@ -108,7 +108,7 @@ const Step3Processing: React.FC<Step3ProcessingProps> = ({ state, updateState, o
}, []);
return (
<div className="max-w-4xl mx-auto w-full space-y-6 animate-in fade-in slide-in-from-bottom-4 duration-500 mt-8">
<div className="max-w-4xl mx-auto w-full space-y-6 animate-in fade-in slide-in-from-bottom-4 duration-500 mt-8 h-full overflow-y-auto">
<div className="text-center">
<h3 className="text-xl font-bold text-slate-900 mb-2">...</h3>
<p className="text-sm text-slate-500">DeepSeek-V3 & Qwen-Max </p>

View File

@@ -73,7 +73,7 @@ const ToolBModule: React.FC = () => {
};
return (
<div className="min-h-screen bg-slate-50 font-sans text-slate-800 p-6">
<div className="h-full bg-slate-50 font-sans text-slate-800 p-6 overflow-y-auto">
<div className="max-w-7xl mx-auto bg-white rounded-2xl shadow-sm border border-slate-200 min-h-[800px] flex flex-col overflow-hidden">
{/* Header */}
@@ -123,8 +123,8 @@ const ToolBModule: React.FC = () => {
<StepIndicator currentStep={currentStep} />
</div>
{/* Main Content */}
<div className="flex-1 px-8 pb-8 relative overflow-hidden flex flex-col">
{/* Main Content - ⭐ 修复添加overflow-y-auto允许内部滚动 */}
<div className="flex-1 px-8 pb-8 relative overflow-y-auto flex flex-col">
{currentStep === 'upload' && (
<Step1Upload
state={state}