@extends('layouts.app')

@push('action')
    <li class="nav-item ms-3">
        <button type="button" id="btn-update" onclick="submit_form()" class="btn btn-success btn-icon" data-id="{{$permission['id']}}" >
        <i class="bi bi-check-circle"></i>Submit</button>
    </li>
@endpush

@section('contents')
    <div class="content ">
        <div class="mb-4">
            <nav style="--bs-breadcrumb-divider: '>';" aria-label="breadcrumb">
                <ol class="breadcrumb">
                    <li class="breadcrumb-item">
                        <a href="{{url('dashboard')}}">
                            <i class="bi bi-globe2 small me-2"></i> Dashboard
                        </a>
                    </li>
                    <li class="breadcrumb-item">
                        <a href="{{url('permissions')}}">
                            <i class="bi bi-globe2 small me-2"></i> Permissions
                        </a>
                    </li>
                    <li class="breadcrumb-item active" aria-current="page">Permission Edit</li>
                </ol>
            </nav>
        </div>
           <form class="form-label-left input_mask"  action="{{url('permissions').'/'.$permission['id']}}" name="frm" id="frm"
                 data-parsley-validate="" enctype="multipart/form-data">
               @csrf
               @method('PUT')
               <div class="form-group row" id="form-up_permission">
                   <label class="col-form-label col-md-3 col-sm-3 "> Permission</label>
                   <div class="mb-4">
                       <div class="col-md-3 col-sm-3 ">
                           <input type="text" class="form-control pwd " placeholder="Permission" id="up_permission" value="{{$permission['name'] ?? null}}" name="up_permission" required="">
                           <span style="color: red" class="help-block"></span>
                       </div>
                   </div>                  
               </div>
           </form>
    </div>
@endsection
@push('script')
<script >
    function submit_form() {
        var id = $("#btn-update").data('id');
        var url = $("#frm").attr('action');
        $.ajax({
            url: url,
            data: {
                "_token": '{{ csrf_token() }}',
                "permission": $('#up_permission').val(),
            },
            type: 'PUT',
            success: function (response) {
                if (response.status == 200) {
                    swal(response.message, {
                        icon: "success",
                        timer: 2000,
                    });
                    window.location.href="{{url('permissions')}}"
                } else {
                    swal(response.message, {
                        icon: "error",
                        timer: 2000,
                    });
                }
            },  error: function (error){
                    if (error.status === 422) {
                        var data = error.responseJSON.errors;
                        for (let i in data) {
                            showValidationErrors(i, data[i][0])
                        }
                    }
                }
        });
    }
    function showValidationErrors(name, error)
    {
        var input = $("#"+ name);
        input.addClass('is-invalid');
        var group = $("#form-up_permission");

        group.addClass('has-error');
        group.find('.help-block').text(error);
    } 
</script>
@endpush