@extends('layouts.app')

@push('action')
    <li class="nav-item ms-3">
        @can('permission-create')
        <a class="btn btn-success btn-icon"  href="{{ url('new-permission') }}">
        <i class="bi bi-check-circle"></i> New </a>
        @endcan
    </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 active" aria-current="page">Permissions</li>
                </ol>
            </nav>
        </div>
        <div class="table-responsive">

            <table id="orders" class="table table-striped table-bordered" style="width:100%">
                <thead>
                <tr>
                    <th>Sl No</th>
                    <th>Permissions</th>                                       
                    <th>Action</th>
                </tr>
                </thead>
                <tbody>
                </tbody>
            </table>
        </div>
    </div>
@endsection
@push('script')
<script src="https://twitter.github.io/typeahead.js/js/handlebars.js"></script>
<script >
    //listing
    if ($("#orders").length) {
        var i = 1;
        $("#orders").DataTable({
            "processing": true,
            "lengthChange": true,
            "serverSide": true,
            "dom": '<"dt-buttons"Bf><"clear">lirtp',
            "paging": true,
            "scrollX": false,
            // "responsive":true,
            'stateSave': true,
            "autoWidth": false,
            "ajax": {
                url: "{{ route('permission.list') }}",
            },
                columns: [
                {
                    "data": "id", render: function (data, type, row, meta) {
                        return meta.row + meta.settings._iDisplayStart + 1;
                    }
                },
                { data: 'name', name: 'name', orderable: false, searchable:false },
                { data: 'action', name: 'action'},
              
            ],
            initComplete: function () {
                this.api().columns().every(function () {
                    var column = this;
                    var input = document.createElement("input");
                    $(input).appendTo($(column.footer()).empty())
                        .on('change', function () {
                            column.search($(this).val(), false, false, true).draw();
                        });
                });
            },
            "fnDrawCallback": function (oSettings) {
                $(".btn-delete").click(function () {
                    swal({
                        title: "Are you sure want to delete ?",
                        icon: "warning",
                        buttons: true,
                        dangerMode: true,
                    }).then((willDelete) => {
                        if (willDelete) {
                            var permission = $(this).data('value');
                            delete_permission(permission);
                        }
                    });
                });
            },
            buttons: [
                {
                    extend: "copy",
                    className: "btn-sm"
                },
                {
                    extend: "csv",
                    className: "btn-sm"
                },
                {
                    extend: "excel",
                    className: "btn-sm"
                },
                {
                    extend: "pdfHtml5",
                    className: "btn-sm"
                },
                {
                    extend: "print",
                    className: "btn-sm"
                },
            ]
        });
    }

    //delete
   function delete_permission(id) {
                  var urlS = "{{ url('permissions') }}/:id";
                  var url = urlS.replace(':id', id);

                  $.ajax({
                      url: url,
                      data: {
                          "_token": "{{ csrf_token() }}",
                      },
                      type: 'DELETE',
                      success: function (response) {
                          if (response) {
                              $('#orders').DataTable().ajax.reload();
                              if (response.status == 200) {
                                  swal(response.message, {
                                      icon: "success",
                                      timer: 2000,
                                  });
                              } else {
                                  swal(response.message, {
                                      icon: "error",
                                      timer: 4000,
                                  });
                              }
                          }
                      },
                      error: function (data) {
                        if (data) {
                            if (data.status == 403) {
                                swal({
                                text: 'you dont have the permission for this action ',
                                icon: "error",
                                timer: 5000,
                            });
                            } else{
                                 swal(data.message, {
                                    icon: "error",
                                    timer: 4000,
                                });
                            }
                        }
                       },
                  });

              }

          //Edit 
            function edit_permission(id)
            {
                var urlS = "{{ url('permissions') }}/:id/edit";
                var url = urlS.replace(':id', id);
                $.ajax({
                    success: function (response) {
                        if (response) {
                           window.location.href = url;
                        }

                    },
                       error: function (data) {
                         if (data) {
                             if (data.status == 403) {
                                 swal({
                                 text: 'you dont have the permission for this action ',
                                 icon: "error",
                                 timer: 5000,
                             });
                             } else{
                                  swal(data.message, {
                                     icon: "error",
                                     timer: 4000,
                                 });
                             }
                         }
                        },
                });
            }
</script>
@endpush