35 lines
896 B
TypeScript
35 lines
896 B
TypeScript
import type { AuthCaptchaChallenge } from '../../services/authService';
|
|
|
|
type CaptchaChallengeFieldProps = {
|
|
challenge: AuthCaptchaChallenge | null;
|
|
answer: string;
|
|
onAnswerChange: (value: string) => void;
|
|
};
|
|
|
|
export function CaptchaChallengeField({
|
|
challenge,
|
|
answer,
|
|
onAnswerChange,
|
|
}: CaptchaChallengeFieldProps) {
|
|
if (!challenge) {
|
|
return null;
|
|
}
|
|
|
|
return (
|
|
<div className="platform-banner platform-banner--info grid gap-3">
|
|
<div className="text-sm leading-6">{challenge.promptText}</div>
|
|
<img
|
|
src={challenge.imageDataUrl}
|
|
alt="图形验证码"
|
|
className="platform-subpanel h-14 w-40 rounded-2xl object-cover"
|
|
/>
|
|
<input
|
|
className="platform-input h-11"
|
|
value={answer}
|
|
placeholder="输入图形验证码"
|
|
onChange={(event) => onAnswerChange(event.target.value)}
|
|
/>
|
|
</div>
|
|
);
|
|
}
|