@extends('layouts.app')

@section('content')

<div class="page-content">
    <!-- start page title -->
    <div class="page-title-box">
        <div class="container-fluid">
            <div class="row align-items-center">
                <div class="col-sm-6">
                    <div class="page-title">
                        <h4>User Unblock</h4>
                        <ol class="breadcrumb m-0">
                            <li class="breadcrumb-item"><a href="{{url('/')}}">Home</a></li>
                            <li class="breadcrumb-item active">User Unblock</li>
                        </ol>
                    </div>
                </div>                
            </div>
        </div>
    </div>
    <!-- end page title -->
    <div class="container-fluid">
        <div class="page-content-wrapper">
            <div class="row">
                <div class="col-xl-12">
                    <div class="card">
                        <div class="card-body">
                            <div class="row" id="datatable_wrapper">
                                <div class="col-md-12">
                                </div>
                                <div class="col-md-4" >
                                    <div>
                                        <form data-action="{{url('/')}}/users/unblock_user_action" method="POST" enctype="multipart/form-data" id="unblock-user-form">
                                            <div class="form-group">
                                                <label for="exampleInputEmail1">User Id</label>
                                                <input type="tel" class="form-control" id="user_id" name='user_id' required>
                                                <div id="userIdError" class="invalid-feedback"></div>
                                            </div>
                                            <div class="form-group mt-3">
                                                <label for="app_name">App Name</label>
                                                <select class="form-control" id="app_name" name='app_name' required>
                                                    <option value='' selected>----Select App Name----</option>
                                                    <option value='1118'>1118 Second Lyne</option>
                                                    <option value='1121'>1121 Text Main</option>
                                                    <option value='1232'>1232 WiFi Green</option>
                                                    <option value='1294'>1294 Business Line</option>
                                                </select>
                                            </div>
                                            <div class="form-group mt-3">
                                                <div id="error_message"></div>
                                            </div>
                                            <button type="submit" class="btn btn-primary mt-4" id="searching" name="searching">Search</button>
                                        </form>

                                    </div>
                                </div>
                            </div>
                        </div>
                    </div><!--end card-->
                </div>



            </div>


        </div>


    </div> <!-- container-fluid -->
</div>
<!-- End Page-content -->

</div>
<!-- end main content-->

@endsection


@section('scripts')

<script>
    $(document).ready(function () {

        var form = '#unblock-user-form';
        document.getElementById("unblock-user-form").reset();

        $(form).on('submit', function (event) {
            event.preventDefault();
            $('#error_message').html('');
            $('#searching').html('Please Wait...');
            var url = $(this).attr('data-action');

            $.ajax({
                url: url,
                method: 'POST',
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                },
                data: new FormData(this),
                contentType: false,
                cache: false,
                processData: false,
                success: function (response) {

                    if (response.code == 200) {
                        $('#error_message').html("<span class='text-success'>" + response.success + '</span>');
                        document.getElementById("unblock-user-form").reset();
                    } else {
                        $('#error_message').html("<span class='text-danger'>" + response.success + '</span>');
                    }
                    $('#searching').html('Search');

                    setTimeout(function () {
                        $('#error_message').html("");
                    }, 5000);
                },
                error: function (response) {
                    $('#searching').html('Search');
                }
            });
        });

    });
</script>
@endsection