1．选择合适的框架，渲染出如上图所示的登录视图，视图有样式即可，可使用BootStrap或layUI去布局实现（10分）
2．正确显示出验证码（10分）
3．验证码要求无杂点、无干扰线，4位纯数字（10分）
4．实例化VUE对象，绑定可操作区域（10分）
5．获取到输入的用户名、密码、验证码的值，发送Ajax请求（10分）
6．控制器对登录信息做表单验证（10分）
7．控制器对登录信息做有效验证，无刷新返回并给出提示（10分）
8．如果账号或密码输入错误3次，锁定5分钟不可再登录（10分）
9．登录成功后使用session驱动进行存储（10分）
10．增加一个记住用户名的功能，如果用户在登录时选择了此项，则下次打开浏览器用户名文本框中有默认的值（10分）

HTML页面：

管理登录

---

---

---

---

控制器代码：

<?php

namespace App\Http\Controllers\Admin;

use App\Http\Controllers\Controller;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Validator;

class LoginController extends Controller
{

public function index()  
{

    $username = session('username');  
    return view('admin.login.index', compact('username'));  
}

public function login(Request $request)  
{  
    $loginExpire = session('loginExpire');  
    if($loginExpire) {  
        if($loginExpire > time()) {  
            $errMsg = '您还被封禁状态，剩余时间' . ($loginExpire - time()) .  '秒';  
            return response()->json(\['status' => 0, 'msg' =>  $errMsg\], 201);  
        }  
    }

    $validate = Validator::make($request->post(), \[  
       'username' => 'required',  
       'password' => 'required',  
       'code' => 'required|captcha',  
    \], \[  
        'username.required' => '用户名密码不能为空',  
        'password.required' => '用户名密码不能为空',  
        'code.required' => '验证不能为空',  
        'code.captcha' => '验证错误',  
    \]);

    if($validate->fails()) {  
        return response()->json(\['status' => 0, 'msg' => $validate->errors()->all()\[0\]\], 201);  
    }

    $bool = auth()->attempt(\['username' => $request->post('username'), 'password' => $request->post('password')\]);

    if($bool) {  
       //dd(auth()->user());  
        session()->forget(\['adminLogins', 'loginExpire'\]);  
        session(\['username' => auth()->user()->username\]);  
        return response()->json(\['status' => 1, 'msg' => '登录成功'\]);  
    } else {  
        session()->increment('adminLogins');  
        $nums = session('adminLogins');  
        if( $nums>= 3) {  
            session(\['loginExpire' => time() + 300\]);  
        }

        return response()->json(\['status' => 0, 'msg' => '用户名密码错误'\]);  
    }  
}  

}

路由：

Route::get('login', [App\Http\Controllers\Admin\LoginController::class, 'index']);
Route::post('login', [App\Http\Controllers\Admin\LoginController::class, 'login']);