@extends('layouts.master')

@section('page-css')
@endsection
@section('breadcrumbs')
<ol class="breadcrumb page-breadcrumb">
    @foreach($breadcrumbs as $dataBread)
    <li class="breadcrumb-item {{@$dataBread['active'] == true ? 'active' : ''}}">
        @if(@$dataBread['url'])
        <a href="{{@$dataBread['url']}}">{{$dataBread['name']}}</a>
        @else
        {{$dataBread['name']}}
        @endif
    </li>
    @endforeach
</ol>
@endsection
@section('content')
<div class="subheader">
    <h1 class="subheader-title">
        {{$title}}
    </h1>
</div>
<div class="row">
    <div class="col-lg-12">
        <div id="panel-4" class="panel">
            <div class="panel-container show">
                <div class="panel-content">
                    <div id="toolbar">
                        <button id="btn-add" class="btn btn-primary">
                            <i class="fal fa-plus"></i> Tambah Data
                        </button>
                    </div>

                    <table class="table w-100" 
                    data-search="true"
                    data-toggle="table"
                    data-pagination="true"
                    data-toolbar="#toolbar"
                    data-show-refresh="false"
                    data-url="{{route($route.'.grid')}}"
                    data-ajax-options='{"xhrFields": {"withCredentials": true}}'
                    data-sort-name="ids"
                    data-sort-order="desc"
                    data-page-size="10"
                    data-id-field="id"
                    id="grid-data">
                      <thead class="bg-primary-light text-primary">
                        <tr>
                          <th data-field="action">#</th>
                          <th data-field="no">No</th>
                          <th data-field="name">Name</th>
                          <th data-field="username">Username/NPSN</th>
                          <th data-field="email">Email</th>
                          <th data-field="created_at">Created At</th>
                        </tr>
                      </thead>
                      <tbody></tbody>
                  </table>
                    <!-- datatable end -->
                </div>
            </div>
        </div>
    </div>
</div>

@endsection
@section('page-js')
<script type="text/javascript">
    $("#grid-data").on("click", ".forcelogin", function() {
        var base_url = $(this).attr('data-href');
        var id = $(this).attr('data-id');
        swal({
             title: "Force Login!",
             text: "Apa anda yakin ingin login sebagai akun ini ?",
             type: "warning",
             showCancelButton: true,
             confirmButtonColor: "#3F7D58",
             confirmButtonText: "Ya Masuk Sekarang",
             cancelButtonText: "Tidak",
             closeOnConfirm: true,
             closeOnCancel: true
         },
         function(isConfirm) {
            if(isConfirm){
              
              request = $.ajax({
                  url: base_url,
                  type: "GET",
                  xhrFields: {
                    withCredentials: true
                }
              });

              // Callback handler that will be called on success
              request.done(function(response, textStatus, jqXHR){
                  console.log(response);
                  toastr.success("Berhasil Login", 'Berhasil!', {positionClass: 'toast-bottom-right', containerId: 'toast-bottom-right'});
                  window.location.href = '{{url("/dashboard")}}';
                  history.pushState(null, null, location.href);
                  window.onpopstate = function () {
                      history.go(1);
                  };
              });

              // Callback handler that will be called on failure
              request.fail(function (jqXHR, textStatus, errorThrown){
                  toastr.error(
                      "Gagal "+textStatus, errorThrown
                  );
              });
            }
         }); 
        return false;
    });
$("#grid-data").on("click", ".remove_data", function() {
var base_url = $(this).attr('data-href');
var id = $(this).attr('data-id');
    swal({
         title: "Hapus Data!",
         text: "Apa anda yakin ingin menghapus data ini ?",
         type: "warning",
         showCancelButton: true,
         confirmButtonColor: "#DD6B55",
         confirmButtonText: "Ya Hapus Sekarang",
         cancelButtonText: "Tidak",
         closeOnConfirm: true,
         closeOnCancel: true
     },
     function(isConfirm) {
        if(isConfirm){
          
          request = $.ajax({
              url: base_url,
              type: "GET",
              xhrFields: {
                    withCredentials: true
                }
          });

          // Callback handler that will be called on success
          request.done(function(response, textStatus, jqXHR){
              console.log(response);
              toastr.success("Berhasil Menhapus Data", 'Berhasil!', {positionClass: 'toast-bottom-right', containerId: 'toast-bottom-right'});
              $('#grid-data').bootstrapTable('refresh');
          });

          // Callback handler that will be called on failure
          request.fail(function (jqXHR, textStatus, errorThrown){
              toastr.error(
                  "Gagal "+textStatus, errorThrown
              );
          });
        }
     }); 
    return false;
});
</script>
@endsection