功能说明

使用手机号码和验证码登录运营后台

原型页面

image.pngimage.png

流程图

验证码登录 - 图3

表单字段

字段 类型 内容 默认值 提示文案 是否必填 格式限制 说明
手机号码 数字框 请输入手机号 11位数字 手机号码即管理员账号
验证码 数字框 请输入验证码 4位数字 1、验证码不需要保存至数据库
2、5分钟后过期失效

交互说明

交互 说明
【密码登录】 点击切换至『密码登录』页面
【获取验证码】
1. 点击后系统发送验证码至登录的手机号码
1. 重新获取倒计时,倒计时60s
1. 60秒后,显示【重新获取】按钮,点击后系统重新发送验证码
【登录】
1. 当账号或验证码为空,按钮禁用,
1. 当账号和验证码都不为空,按钮可点击,
1. 点击按钮,进行有效性验证
1. 登录失败时,会进行提示
1. 登录成功后进入『系统首页』

提示说明

image.png

操作 场景 提示类型 提示文本
【登录】 输入错误的手机号码 Toast 请输入正确手机号
输入未注册的账号 Toast 账号不存在
输入错误的密码 Toast 密码错误
输入账号被禁用 Toast 账号已禁用
输入账号已注册 Toast 账号已存在
登录成功 Toast 登录成功
【获取验证码】 点击获取验证码之后 文本提示 验证码已发送,5分钟内有效
文本提示 重新获取59s(倒计时)

通知说明

操作 场景 通知类型 业务端 通知规则 消息标题 消息内容
登录 登录成功 站内通知 运营后台
短信 用户手机
邮箱 用户邮箱
PUSH消息 APP
消息盒子 APP
消息通知 公众号