@extends('admin.template-admin')
@section('title',$title)
@section('head')
<link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/v/bs5/dt-1.13.1/datatables.min.css"/>

@endsection
@section('content')
<div class="container-fluid flex-grow-1 container-p-y">
    <div class="row">
        <div class="col-lg-12 mb-4 order-0">
          
            <div class="card">
              <div class="d-flex align-items-end">
                  <div class="card-body">
                    <div class="float-end">
                      <a href="{{route('admin.team.anggota.create',['id'=>$team->id])}}" class="btn btn-primary btn-sm">Tambah Anggota</a>
                    </div>
                    <h5 class="card-title text-primary">{{$title}}</h5>
                    <p class="mb-4">Manajemen {{$title}}</p>
                  </div>
              </div>
            </div>

            
            
          </div>
    </div>
    <div class="card">
        <div class="card-body">
            <div class="table-responsive">
              <table class="table table-sm">
                <thead>
                  <tr>
                    <th style="width: 10px"></th>
                    <th>Nama</th>
                    <th>NIP</th>
                    <th>Pangkat</th>
                    <th>Jabatan</th>
                    <th>Peran</th>
                    <th></th>
                  </tr>
                </thead>
                <tbody>
                  @foreach ($anggotas as $no => $anggota)
                      <tr class="data{{$anggota->id}}">
                          <td> {{$no+1}} </td>
                          <td>{{$anggota->nama}}</td>
                          <td>{{$anggota->nip}}</td>
                          <td>{{$anggota->pangkat}}</td>
                          <td>{{$anggota->jabatan}}</td>
                          <td>
                            <select onchange="peran(this, '{{$anggota->anggota_id}}')" class="form-control-sm">
                              <option value="">Pilih Peran</option>
                              @foreach ($perans as $peran)
                                  <option value="{{$peran}}" {{$anggota->peran == $peran ? 'selected' : ''}}>{{$peran}}</option>
                              @endforeach
                            </select>
                          </td>
                          <td>
                            <a class="btn btn-danger btn-sm" href="#" onclick="hapus('{{route('admin.team.anggota.delete',['id'=>$team->id,'anggota_id'=>$anggota->anggota_id])}}', 'data{{$anggota->id}}', 'Hapus {{$title}} ?')" >Hapus</a>
                          </td>
                      </tr>
                  @endforeach
                </tbody>
              </table>
            </div>
        </div>
    </div>
    
</div>
@endsection

@section('script')
<script src="{{asset('js/delete.js')}}"></script>
<script>
  function peran(val, anggota_id){
    var peran = val.value;
    if (peran != '') {
      $.ajaxSetup({
          headers: {
              'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
          }
      });
      $.ajax({
          url: '{{route("admin.team.anggota.peran",["id"=> $team->id])}}',
          type: 'PUT',
          dataType: "JSON",
          data: {"peran": peran, "anggota_id": anggota_id},
          success: function (response) {
              console.log(response)
              if (response.kode = '00') {
                  Swal.fire( response.swal.title, response.swal.message, response.swal.icon)
              } else {
                  Swal.fire("Kesalahan Jaringan, Coba beberapa saat lagi", {
                      icon: "error",
                  });
                  console.log(response.message);
              }
          },
          error: function (xhr) {
              Swal.fire( xhr.responseJSON.swal.title, xhr.responseJSON.swal.message, xhr.responseJSON.swal.icon)
          }
      });      
    }
  }
</script>
@endsection