提示框UI
All checks were successful
Gitea Actions Demo / Explore-Gitea-Actions (push) Successful in 2m4s
All checks were successful
Gitea Actions Demo / Explore-Gitea-Actions (push) Successful in 2m4s
This commit is contained in:
parent
c357ea9b2a
commit
1c6918e6fd
61
src/App.tsx
61
src/App.tsx
@ -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 && (
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user