Untitled

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Login Absensi</title>

    <meta name="_token" content="{!! csrf_token() !!}">

    <link rel="stylesheet" href="{{ URL::asset('v/bootstrap/dist/css/bootstrap.min.css') }}">
    <link rel="stylesheet" href="{{ URL::asset('v/datatables/datatables.min.css') }}">
    <link rel="stylesheet" href="{{ URL::asset('v/font-awesome/css/font-awesome.min.css') }}">
    <link rel="stylesheet" href="{{ URL::asset('css/main.css') }}">

    <script type="text/javascript" src="{{ URL::asset('v/jquery/jquery-3.3.1.min.js') }}"></script>
    <script type="text/javascript" src="{{ URL::asset('v/datatables/datatables.min.js') }}"></script>
    <script type="text/javascript" src="{{ URL::asset('v/bootstrap/dist/js/bootstrap.min.js') }}"></script>
</head>
<body>
    <div class="container-fluid h-100">

        <div class="row h-100 justify-content-center align-items-center">
            <div class="login-box col-md-4 col-sm-12 mt-5 mx-2 p-4">
                <h3 class="text-center">Absensi Online</h3>
                <h6 class="text-center text-muted">Silakan Login ke Akun Absensi</h6>

                <div id="alert"></div>

                <label for="username">Username</label>
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text rounded-0" id="basic-addon1"><i class="fa fa-user"></i></span>
                    </div>
                    <input type="text" class="form-control rounded-0" name="username" id="username" aria-label="username">
                </div>

                <label for="username">Password</label>
                <div class="input-group mb-3">
                    <div class="input-group-prepend">
                        <span class="input-group-text rounded-0" id="basic-addon1"><i class="fa fa-lock"></i></span>
                    </div>
                    <input type="password" class="form-control rounded-0" name="password" id="password" aria-label="password">
                </div>

                <button class="btn btn-primary rounded-0 w-100" id="login">Login</button>

            </div>
        </div>

    </div>

    <script>
        $().ready(function() {
            $('button#login').click(function(e) {
                e.preventDefault();

                var username = $('input#username').val();
                var password = $('input#password').val();

                if (username !== '' && password !== '') {
                    $('#alert').html('<div class="alert alert-danger my-3">Form tidak boleh kosong!</div>');
                }
                else {

                    $.ajaxSetup({
                        headers: {
                            'X-CSRF-TOKEN': $('meta[name="_token"]').attr('content')
                        }
                    })
                    $.ajax({
                        url: '/user/login',
                        type: 'POST',
                        data: {
                            'username': username,
                            'password': password
                        },
                        success: function(res) {
                            if (res.status == 'success') window.location.reload();

                            $('#alert').html('<div class="alert "' + res.alertType + ' my-3">' + res.alertText + '</div>');
                        }
                    })

                }

            })
        })
    </script>

</body>
</html>