+
}
+ title="Ant Design"
+ subTitle={'Ant Design is the most influential web design specification in Xihu district'}
+ initialValues={{
+ autoLogin: true,
+ }}
+ actions={[
+ 'Login with :',
+
,
+
,
+
,
+ ]}
+ onFinish={async (values) => {
+ await handleSubmit(values as API.LoginParams);
+ }}
+ >
+
+
+
+
+
+ {status === 'error' && loginType === 'account' && (
+
+ )}
+ {type === 'account' && (
+ <>
+
,
+ }}
+ placeholder={'Username: admin or user'}
+ rules={[
+ {
+ required: true,
+ message: 'Please input your username!',
+ },
+ ]}
+ />
+
,
+ }}
+ placeholder={'Password: ant.design'}
+ rules={[
+ {
+ required: true,
+ message: 'Please input your password!',
+ },
+ ]}
+ />
+ >
+ )}
+
+ {status === 'error' && loginType === 'mobile' &&
}
+ {type === 'mobile' && (
+ <>
+
,
+ }}
+ name="mobile"
+ placeholder={'Phone Number'}
+ rules={[
+ {
+ required: true,
+ message: 'Please input your phone number!',
+ },
+ {
+ pattern: /^1\d{10}$/,
+ message: 'Phone number is invalid!',
+ },
+ ]}
+ />
+
,
+ }}
+ captchaProps={{
+ size: 'large',
+ }}
+ placeholder={'Verification Code'}
+ captchaTextRender={(timing, count) => {
+ if (timing) {
+ return `${count} ${'sec(s)'}`;
+ }
+ return 'Get Code';
+ }}
+ name="captcha"
+ rules={[
+ {
+ required: true,
+ message: 'Please input verification code!',
+ },
+ ]}
+ onGetCaptcha={async (phone) => {
+ const result = await getFakeCaptcha({
+ phone,
+ });
+ if (result === false) {
+ return;
+ }
+ message.success('获取验证码成功!验证码为:1234');
+ }}
+ />
+ >
+ )}
+
+
+