@extends('layouts.app')

@section('content')
    @include('layouts.headers.header-content')
    
    <div class="container-fluid mt--6">
      <div class="row">
        <div class="col">
          <div class="card">
            <!-- Card header -->
            <div class="card-header border-0">
              <h3 class="mb-0">{{ $current_page }}</h3>
              <div class="d-flex flex-row-reverse">
              <a class="btn btn-md btn-primary justify-content-end text-white modal_add" ><i class="fas fa-plus"></i> Tambah</a>
                </div>
            </div>
         
            @if ($message = Session::get('sukses'))
            <div class="alert alert-success alert-dismissible fade show" role="alert">
    <span class="alert-inner--icon"><i class="ni ni-like-2"></i></span>
    <span class="alert-inner--text"><strong>{{ $message }}</strong> </span>
    <button type="button" class="close" data-dismiss="alert" aria-label="Close">
        <span aria-hidden="true">&times;</span>
    </button>
</div>
    @endif
        
    @if ($message = Session::get('error'))
            <div class="alert alert-danger alert-dismissible fade show" role="alert">
    <span class="alert-inner--icon"><i class="ni ni-like-2"></i></span>
    <span class="alert-inner--text"><strong>{{ $message }}</strong> </span>
    <button type="button" class="close" data-dismiss="alert" aria-label="Close">
        <span aria-hidden="true">&times;</span>
    </button>
</div>
    @endif
           
            <!-- Light table -->
            <div class="table-responsive">
              <table class="table align-items-center table-flush" id="table_data">
                <thead class="thead-light">
                  <tr>
                    <th scope="col" class="sort" data-sort="name">Nomor</th>
                    <th scope="col" class="sort" data-sort="budget">Nama Divisi</th>
                    <th scope="col"> Action</th>
                  </tr>
                </thead>
                <tbody class="list">

                @foreach($divisi as $i)
                  <tr>
                    <th scope="row">
                      <div class="media align-items-center">
                      
                        <div class="media-body">
                          <span class="name mb-0 text-sm">{{ $loop->iteration }}</span>
                        </div>
                      </div>
                    </th>
                    <td class="budget">
                    {{ $i->nama_divisi }}
                    </td>
                    
                    <td class="text-right">
                   
                          <a data-id="{{ $i->id }}" href="#" data-toggle="tooltip" data-placement="top" title="Edit"   class=" modal_edit text-right btn btn-md btn-outline-success"><i class="fas fa-edit  text-right"></i> </a>
                          <a data-toggle="tooltip" data-placement="top" title="Hapus" onclick="return confirm('Divisi ini akan di delete ... ?')" href="{{ route('divisi.hapus',$i->id) }}" class=" text-right btn btn-md btn-outline-danger"><i class="fas fa-trash"></i> </a>
                    
                    </td>
                  </tr>     
                  @endforeach
                  
                </tbody>
              </table>
            </div>
            <!-- Card footer -->
           
          </div>
        </div>
      </div>
</div>

@include('admin.divisi.modal_add')
@include('admin.divisi.modal_edit')

        @include('layouts.footers.auth')
    </div>
@endsection

@push('js')
    <script src="{{ asset('argon') }}/vendor/chart.js/dist/Chart.min.js"></script>
    
    <script src="{{ asset('argon') }}/vendor/chart.js/dist/Chart.extension.js"></script>
    <script>

$(document).ready(function () {
    $('#table_data').DataTable();
    $('[data-toggle="tooltip"]').tooltip();
});
        $(".modal_add").click(function(e){

            e.preventDefault();

            $("#modal_add").modal('show');
        })

        $(".modal_edit").click(function(e){

e.preventDefault();

$("#modal_edit").modal('show');
var id = $(this).attr('data-id');
// console.log(id_jenis);  
            $.ajaxSetup({
                  headers: {
                      'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                  }
              })
            $.ajax({
                url:"{{ secure_url('get_divisi') }}",
                method:"post",
                data:{id:id},
                success:function(data){

                    var obj = JSON.parse(data);
                    // console.log(obj);

                    $("[name=nama_divisi]").val(obj.nama_divisi);
                    $("[name=id]").val(obj.id);


                }


            })

})
        
        </script>
@endpush