mirror of
https://github.com/massbug/judge4c.git
synced 2025-05-18 07:16:34 +00:00
refactor(app): 优化 AI编辑器测试页布局
- 使用 flex 布局实现页面高度自适应 - 将测试用例展示区域高度设置为屏幕高度的 1/3 - DiffEditor 容器占据剩余的 2/3 屏幕高度
This commit is contained in:
parent
faf6a60821
commit
a89864e70e
@ -18,22 +18,22 @@ export default function TestAiEditorPage() {
|
|||||||
};
|
};
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="container mx-auto p-4">
|
<div className="flex flex-col h-screen mx-auto p-4">
|
||||||
<h1 className="text-2xl font-bold mb-4">AI 编辑器测试页</h1>
|
{/* 测试用例展示区域 - 固定高度1/3 */}
|
||||||
|
<div className="mb-6 h-1/3">
|
||||||
{/* 测试用例展示 */}
|
|
||||||
<div className="mb-6">
|
|
||||||
<h2 className="text-xl font-semibold mb-2">测试用例</h2>
|
<h2 className="text-xl font-semibold mb-2">测试用例</h2>
|
||||||
<pre className="bg-muted p-4 rounded-md overflow-x-auto">
|
<pre className="bg-muted p-4 rounded-md overflow-x-auto">
|
||||||
{testInput.code}
|
{testInput.code}
|
||||||
</pre>
|
</pre>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
{/* 测试组件 */}
|
{/* DiffEditor容器 - 占据剩余2/3高度 */}
|
||||||
|
<div className="flex-grow">
|
||||||
<AIProblemEditor
|
<AIProblemEditor
|
||||||
initialCode={testInput.code}
|
initialCode={testInput.code}
|
||||||
problemId={testInput.problemId}
|
problemId={testInput.problemId}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
Loading…
Reference in New Issue
Block a user