提示框UI
All checks were successful
Gitea Actions Demo / Explore-Gitea-Actions (push) Successful in 2m4s

This commit is contained in:
Song367 2026-03-12 18:03:12 +08:00
parent c357ea9b2a
commit 1c6918e6fd

View File

@ -387,6 +387,8 @@ export default function App() {
// Conversion Settings States
const [showSettingsModal, setShowSettingsModal] = useState(false);
const [showCreationGuardModal, setShowCreationGuardModal] = useState(false);
const [creationGuardMessage, setCreationGuardMessage] = useState('');
const [conversionWorldview, setConversionWorldview] = useState(() => localStorage.getItem('scriptflow_conversion_worldview') || '');
const [conversionOutline, setConversionOutline] = useState(() => localStorage.getItem('scriptflow_conversion_outline') || '');
const [conversionCharacterProfiles, setConversionCharacterProfiles] = useState(() => localStorage.getItem('scriptflow_conversion_characterProfiles') || '');
@ -1015,8 +1017,7 @@ ${script}`;
// Validation: Require Story Outline and Worldview Settings
if (!creationOutline.trim() || !creationWorldview.trim()) {
alert('\u8bf7\u5148\u5728\u201c\u5267\u60c5\u80cc\u666f\u201d\u4e2d\u586b\u5199\u201c\u6545\u4e8b\u5927\u7eb2\u201d\u548c\u201c\u4e16\u754c\u89c2\u8bbe\u5b9a\u201d\u540e\u518d\u6267\u884c\u751f\u6210\u3002');
setShowSettingsModal(true);
showCreationBackgroundGuard('\u8bf7\u5148\u5728\u300c\u5267\u60c5\u80cc\u666f\u300d\u4e2d\u586b\u5199\u300c\u6545\u4e8b\u5927\u7eb2\u300d\u548c\u300c\u4e16\u754c\u89c2\u8bbe\u5b9a\u300d\uff0c\u518d\u5f00\u59cb\u751f\u6210\u5267\u672c\u3002');
return;
}
@ -1071,8 +1072,7 @@ ${script}`;
const handleGenerateAll = async () => {
// Validation: Require Story Outline and Worldview Settings
if (!creationOutline.trim() || !creationWorldview.trim()) {
alert('\u8bf7\u5148\u5728\u201c\u5267\u60c5\u80cc\u666f\u201d\u4e2d\u586b\u5199\u201c\u6545\u4e8b\u5927\u7eb2\u201d\u548c\u201c\u4e16\u754c\u89c2\u8bbe\u5b9a\u201d\u540e\u518d\u6267\u884c\u6279\u91cf\u751f\u6210\u3002');
setShowSettingsModal(true);
showCreationBackgroundGuard('\u8bf7\u5148\u5728\u300c\u5267\u60c5\u80cc\u666f\u300d\u4e2d\u586b\u5199\u300c\u6545\u4e8b\u5927\u7eb2\u300d\u548c\u300c\u4e16\u754c\u89c2\u8bbe\u5b9a\u300d\uff0c\u518d\u6267\u884c\u6279\u91cf\u751f\u6210\u3002');
return;
}
@ -1161,6 +1161,11 @@ ${script}`;
setIsCreationCharacterProfilesEditing(value);
};
const showCreationBackgroundGuard = (message: string) => {
setCreationGuardMessage(message);
setShowCreationGuardModal(true);
};
const handleShowFinalizedCreation = () => {
const finalizedPages = creationPages.filter(p => p.selectedScriptIndex !== null);
@ -2545,6 +2550,54 @@ ${script}`;
</div>
)}
</div>
{/* Creation Guard Modal */}
<AnimatePresence>
{showCreationGuardModal && (
<div className="fixed inset-0 z-50 flex items-center justify-center p-4 bg-black/45 backdrop-blur-md">
<motion.div
initial={{ opacity: 0, y: 18, scale: 0.96 }}
animate={{ opacity: 1, y: 0, scale: 1 }}
exit={{ opacity: 0, y: 18, scale: 0.96 }}
className="w-full max-w-md overflow-hidden rounded-[30px] border border-white/60 bg-[linear-gradient(165deg,rgba(255,255,255,0.97),rgba(247,250,255,0.95))] shadow-[0_28px_80px_rgba(15,23,42,0.28)]"
>
<div className="relative p-6">
<div className="pointer-events-none absolute -right-10 -top-10 h-40 w-40 rounded-full bg-[#0071E3]/10 blur-2xl" />
<div className="relative flex items-start gap-3">
<div className="mt-0.5 flex h-11 w-11 items-center justify-center rounded-2xl bg-[#0071E3] text-white shadow-lg shadow-blue-500/25">
<Sparkles size={18} />
</div>
<div className="flex-1">
<p className="text-[11px] font-bold uppercase tracking-[0.2em] text-[#0071E3]">Creation Notice</p>
<h3 className="mt-1 text-[22px] font-semibold leading-tight text-[#1D1D1F]">{'\u4fe1\u606f\u4e0d\u5b8c\u6574'}</h3>
<p className="mt-3 whitespace-pre-wrap text-[14px] leading-7 text-[#4A4A4F]">{creationGuardMessage}</p>
</div>
</div>
<div className="mt-6 grid grid-cols-2 gap-3">
<button
type="button"
onClick={() => {
setShowCreationGuardModal(false);
setShowSettingsModal(true);
}}
className="rounded-2xl bg-[#0071E3] px-4 py-3 text-sm font-bold text-white shadow-lg shadow-blue-500/20 transition-all hover:-translate-y-0.5 hover:bg-[#0077ED]"
>
{'\u53bb\u586b\u5199\u5267\u60c5\u80cc\u666f'}
</button>
<button
type="button"
onClick={() => setShowCreationGuardModal(false)}
className="rounded-2xl border border-[#D2D2D7] bg-white px-4 py-3 text-sm font-bold text-[#1D1D1F] transition-all hover:bg-[#F5F5F7]"
>
{'\u6211\u77e5\u9053\u4e86'}
</button>
</div>
</div>
</motion.div>
</div>
)}
</AnimatePresence>
{/* Creation Settings Modal */}
<AnimatePresence>
{showSettingsModal && (