@extends('layouts.auth')

@section('title', '用户登录')

@push('styles')
<link rel="stylesheet" href="{{ asset('CmsProUi/component/pear/css/pear.css') }}">
<link rel="stylesheet" href="{{ asset('CmsProUi/font-awesome/4.7.0/css/font-awesome.min.css') }}">
<link rel="stylesheet" href="{{ asset('Admin/css/admin.css') }}">
<link rel="stylesheet" href="{{ asset('Admin/css/variables.css') }}">
<link rel="stylesheet" href="{{ asset('Admin/css/reset.css') }}">
<link rel="stylesheet" href="{{ asset('Admin/css/other/login.css') }}">
@endpush

@section('content')
<div class="login-page">
    <div class="layui-row">
        <div class="layui-col-sm6 login-bg">
            <img class="login-bg-img" src="{{ asset('Admin/images/banner.png') }}" alt="">
        </div>
        <div class="layui-col-sm6 login-form">
            <div class="layui-form" lay-filter="form-submit">
                <div class="form-center">
                    <div class="form-center-box">
                        <div class="top-log-title">
                            <img class="top-log" src="{{ asset('Admin/images/logo.png') }}" alt="CMSPRO">
                            <span>用户中心</span>
                        </div>
                        <div class="top-desc">用户管理终端</div>
                        @if($errors->any())
                        <div style="margin-top: 15px; padding: 10px; background: #fef0f0; border: 1px solid #fbc4c4; border-radius: 4px; color: #f56c6c; font-size: 13px;">
                            {{ $errors->first() }}
                        </div>
                        @endif
                        @if(session('error'))
                        <div style="margin-top: 15px; padding: 10px; background: #fef0f0; border: 1px solid #fbc4c4; border-radius: 4px; color: #f56c6c; font-size: 13px;">
                            {{ session('error') }}
                        </div>
                        @endif
                        <div style="margin-top: 30px;">
                            <form method="POST" action="{{ url('/user/login') }}">
                                @csrf
                                <div class="layui-form-item">
                                    <div class="layui-input-wrap">
                                        <div class="layui-input-prefix">
                                            <i class="layui-icon layui-icon-username"></i>
                                        </div>
                                        <input name="username" lay-verify="required" placeholder="账号/邮箱/手机号" autocomplete="off" class="layui-input" lay-reqText="账号不能为空" value="{{ old('username') }}">
                                    </div>
                                </div>
                                <div class="layui-form-item">
                                    <div class="layui-input-wrap">
                                        <div class="layui-input-prefix">
                                            <i class="layui-icon layui-icon-password"></i>
                                        </div>
                                        <input type="password" name="password" value="" lay-verify="required" placeholder="密码" autocomplete="off" class="layui-input" lay-affix="eye" lay-reqText="密码不能为空">
                                    </div>
                                </div>
                                <div class="login-btn">
                                    <button id="loginButton" type="submit" lay-submit lay-filter="login" class="layui-btn login">登录</button>
                                </div>
                                <div style="display: flex; justify-content: space-between; margin-top: 12px; font-size: 13px;">
                                    <span><a href="{{ url('/user/forgot-password') }}" style="color: #999;">忘记密码？</a></span>
                                    <span>还没有账号？<a href="{{ url('/user/register') }}" style="color: #16b777;">立即注册</a></span>
                                </div>
                            </form>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection

@push('scripts')
<script src="{{ asset('CmsProUi/component/layui/layui.js') }}"></script>
<script src="{{ asset('CmsProUi/component/pear/pear.js') }}"></script>
<script>
layui.use(['toast', 'form', 'jquery', 'button', 'popup'], function() {
    var toast = layui.toast;
    var form = layui.form;
    var $ = layui.jquery;
    var button = layui.button;

    $(document).keypress(function(e) {
        if (e.which == 13) {
            $("#loginButton").click();
        }
    });
});
</script>
@endpush
