diff --git a/web/src/features/auth/RegisterPage.tsx b/web/src/features/auth/RegisterPage.tsx index 60d357c1..7888ea45 100644 --- a/web/src/features/auth/RegisterPage.tsx +++ b/web/src/features/auth/RegisterPage.tsx @@ -1,4 +1,4 @@ -import { useRef, useState } from 'react'; +import { useEffect, useRef, useState } from 'react'; import { Link, Navigate, useNavigate } from 'react-router-dom'; @@ -33,9 +33,18 @@ export function RegisterPage() { const [agreed, setAgreed] = useState(false); const [submitting, setSubmitting] = useState(false); const [error, setError] = useState(''); + const [legalDocument, setLegalDocument] = useState<'terms' | 'privacy' | null>(null); + const legalDialogRef = useRef(null); const verifiedRef = useRef<{ key: string; response: string } | null>(null); const submitRef = useRef(false); + useEffect(() => { + const dialog = legalDialogRef.current; + if (!dialog) return; + if (legalDocument && !dialog.open) dialog.showModal(); + if (!legalDocument && dialog.open) dialog.close(); + }, [legalDocument]); + if (!tenant) return ; const minPasswordLength = tenant.passwordPolicy?.minLength ?? 8; // The deployed file endpoint is pinned to the IM API host; the web host serves @@ -146,7 +155,7 @@ export function RegisterPage() { autoComplete="new-password" maxLength={tenant.passwordPolicy?.maxLength} /> + setLegalDocument(null)} + className="m-auto h-[min(88dvh,800px)] w-[min(92vw,800px)] overflow-hidden rounded-md border border-border-panel bg-white p-0 shadow-xl backdrop:bg-black/50" + aria-label={legalDocument === 'privacy' ? '隐私政策' : '用户条款'} + > +
+
+

{legalDocument === 'privacy' ? '隐私政策' : '用户条款'}

+ +
+ {legalDocument &&