请你帮我设计一个登录页面:用户操作步骤: 1. 用户打开应用,进入登录页面 2. 用户在页面上看到一个输入框,用于输入手机号码 3. 输入框下方有两个按钮:"获取验证码"和"密码登录",默认显示"获取验证码" 4. 如果用户选择"获取验证码",点击按钮后,向用户手机发送6位数字验证码,同时按钮变为倒计时状态"60秒后重发" 5. 用户输入收到的验证码,点击登录按钮 6. 如果验证码正确,则登录成功进入应用主界面;如果验证码错误,则弹出错误提示,要求用户重新输入 7. 如果用户选择"密码登录",点击按钮后,输入框下方显示密码输入框 8. 用户输入正确的手机号和密码,点击登录按钮 9. 如果手机号和密码匹配,则登录成功进入应用主界面;如果不匹配,则弹出错误提示,要求用户重新输入 10. 在登录表单下方,提供"忘记密码"、"注册新账号"等快捷入口 11. 同时提供微信、QQ等第三方登录方式,点击相应图标即可跳转到第三方授权页面 12. 第三方授权成功后,直接登录进入应用主界面;授权失败则返回登录页面,提示用户重新操作 13. 如果用户输入的手机号码未注册,则在点击登录按钮后,弹出提示框:"该手机号码未注册,是否立即注册?" 14. 提示框有两个按钮:"立即注册"和"取消"。用户点击"立即注册",提示框消失,页面底部弹出输入验证码的蒙版 15. 用户点击蒙版上的"发送验证码",向手机号发送6位数字验证码,按钮变为倒计时状态"60秒后重发" 16. 用户收到短信验证码后,在蒙版上输入该6位验证码,点击"立即注册"按钮 17. 如果验证码正确,则自动创建一个新账号,并提示用户"注册成功,请设置您的账号密码"。若验证码错误,则提示用户"验证码有误,请重新输入" 18. 注册成功后,自动跳转到设置密码页面,引导用户完成密码设置,然后自动登录到APP主页 界面元素: 返回按钮 • 应用Logo • 手机号码输入框 • 获取验证码按钮 • 密码登录按钮 • 密码输入框 • 登录按钮 • 忘记密码入口 • 注册新账号入口 • 第三方登录图标微信 • 错误提示 • 客服图标 • 登录方式切换图标 • 登录加载框 • 备案信息 • 未注册手机号提示弹框 • 验证码输入蒙版 • 发送验证码按钮(验证码蒙版上) • 立即注册按钮(验证码蒙版上) • 注册成功提示 | A shadcn/ui and v0 generation - v0