toggle cutoff line only in quick preview
This commit is contained in:
@@ -31,6 +31,8 @@ import {
|
||||
Server,
|
||||
AlertCircle,
|
||||
Info,
|
||||
Eye,
|
||||
EyeOff,
|
||||
X
|
||||
} from 'lucide-react';
|
||||
|
||||
@@ -239,6 +241,7 @@ export default function App() {
|
||||
// --- Simulation State (Workspace) ---
|
||||
const [cervicalRotation, setCervicalRotation] = useState(14.5);
|
||||
const [transitionWidth, setTransitionWidth] = useState(90);
|
||||
const [showPreviewCutoffLine, setShowPreviewCutoffLine] = useState(true);
|
||||
const [isSimulating, setIsSimulating] = useState(restoredDeformationJob?.job.status === 'running');
|
||||
const [progress, setProgress] = useState(restoredDeformationJob ? progressFromJob(restoredDeformationJob.job, restoredDeformationJob.progress) : 0);
|
||||
const [toastMessage, setToastMessage] = useState("");
|
||||
@@ -665,7 +668,8 @@ export default function App() {
|
||||
headers: { 'Content-Type': 'application/json' },
|
||||
body: JSON.stringify({
|
||||
inputDir: selectedInputDir,
|
||||
angleDegrees: cervicalRotation
|
||||
angleDegrees: cervicalRotation,
|
||||
showCutoffLine: showPreviewCutoffLine
|
||||
}),
|
||||
signal: controller.signal
|
||||
});
|
||||
@@ -688,7 +692,7 @@ export default function App() {
|
||||
controller.abort();
|
||||
window.clearTimeout(timer);
|
||||
};
|
||||
}, [currentPage, selectedInputDir, cervicalRotation]);
|
||||
}, [currentPage, selectedInputDir, cervicalRotation, showPreviewCutoffLine]);
|
||||
|
||||
const handleRunSimulation = async () => {
|
||||
if (isSimulating) return;
|
||||
@@ -901,6 +905,17 @@ export default function App() {
|
||||
<div className="flex justify-between text-xs font-bold mb-2 text-slate-600"><span>过渡平滑宽度</span><span className="text-blue-600 font-mono">{transitionWidth}</span></div>
|
||||
<input type="range" min="50" max="160" step="10" value={transitionWidth} onChange={e => setTransitionWidth(parseInt(e.target.value, 10))} className="w-full h-1.5 bg-slate-100 rounded-lg appearance-none cursor-pointer accent-blue-600 opacity-80 hover:opacity-100 transition-opacity" />
|
||||
</div>
|
||||
<button
|
||||
onClick={() => setShowPreviewCutoffLine(value => !value)}
|
||||
className={`w-full py-2.5 rounded-xl text-xs font-black transition-all flex items-center justify-center gap-2 border ${
|
||||
showPreviewCutoffLine
|
||||
? 'bg-yellow-50 text-yellow-700 border-yellow-200 hover:bg-yellow-100'
|
||||
: 'bg-slate-50 text-slate-500 border-slate-200 hover:bg-slate-100'
|
||||
}`}
|
||||
>
|
||||
{showPreviewCutoffLine ? <Eye size={14} /> : <EyeOff size={14} />}
|
||||
{showPreviewCutoffLine ? '隐藏预览分界线' : '显示预览分界线'}
|
||||
</button>
|
||||
</div>
|
||||
|
||||
<div>
|
||||
|
||||
Reference in New Issue
Block a user