@extends('layouts.default', ['appTopMenu' => true])
@section('title', 'Dashboard')
@push('scripts')
<!-- <link href="/assets/plugins/datatables.net-bs5/css/dataTables.bootstrap5.min.css" rel="stylesheet" />
<link href="/assets/plugins/datatables.net-responsive-bs5/css/responsive.bootstrap5.min.css" rel="stylesheet" />
<script src="/assets/js/jquery-3.3.1.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.js"></script>
<script src="/assets/plugins/datatables.net/js/jquery.dataTables.min.js" defer></script>
<script src="/assets/plugins/datatables.net-bs5/js/dataTables.bootstrap5.min.js" defer></script>
<script src="/assets/plugins/datatables.net-responsive/js/dataTables.responsive.min.js" defer></script>
<script src="/assets/plugins/datatables.net-responsive-bs5/js/responsive.bootstrap5.min.js" defer></script> -->

<link href="/assets/plugins/datatables.net-bs5/css/dataTables.bootstrap5.min.css" rel="stylesheet" />
<link href="/assets/plugins/datatables.net-responsive-bs5/css/responsive.bootstrap5.min.css" rel="stylesheet" />
<link href="/assets/plugins/datatables.net-buttons-bs5/css/buttons.bootstrap5.min.css" rel="stylesheet" />
<link href="/assets/plugins/datatables.net-colreorder-bs5/css/colReorder.bootstrap5.min.css" rel="stylesheet" />
<link href="/assets/plugins/datatables.net-keytable-bs5/css/keyTable.bootstrap5.min.css" rel="stylesheet" />
<link href="/assets/plugins/datatables.net-rowreorder-bs5/css/rowReorder.bootstrap5.min.css" rel="stylesheet" />
<link href="/assets/plugins/datatables.net-select-bs5/css/select.bootstrap5.min.css" rel="stylesheet" />

<script src="/assets/plugins/datatables.net/js/jquery.dataTables.min.js"></script>
<script src="/assets/plugins/datatables.net-bs5/js/dataTables.bootstrap5.min.js"></script>
<script src="/assets/plugins/datatables.net-responsive/js/dataTables.responsive.min.js"></script>
<script src="/assets/plugins/datatables.net-responsive-bs5/js/responsive.bootstrap5.min.js"></script>
<script src="/assets/plugins/datatables.net-colreorder/js/dataTables.colReorder.min.js"></script>
<script src="/assets/plugins/datatables.net-colreorder-bs5/js/colReorder.bootstrap5.min.js"></script>
<script src="/assets/plugins/datatables.net-keytable/js/dataTables.keyTable.min.js"></script>
<script src="/assets/plugins/datatables.net-keytable-bs5/js/keyTable.bootstrap5.min.js"></script>
<script src="/assets/plugins/datatables.net-rowreorder/js/dataTables.rowReorder.min.js"></script>
<script src="/assets/plugins/datatables.net-rowreorder-bs5/js/rowReorder.bootstrap5.min.js"></script>
<script src="/assets/plugins/datatables.net-select/js/dataTables.select.min.js"></script>
<script src="/assets/plugins/datatables.net-select-bs5/js/select.bootstrap5.min.js"></script>
<script src="/assets/plugins/datatables.net-buttons/js/dataTables.buttons.min.js"></script>
@endpush

@section('content')

@if(!empty($user_post))
@if(count($user_post)>0)
@foreach($user_post as $item) 
<section class="mb-4">
<h1 class="page-header p-2">Dashboard <small><strong>{{$item->name}}</strong>, {{$item->post_name}}</small></h1>
@if(!empty($notesheet))
@if(count($notesheet)>0) 
<div class="row  p-2">
<div class="col-12 md-6">
<div class="accordion" id="accordion">
<div class="accordion-item border-1">
<div class="accordion-header" id="heading1">
<button class="accordion-button bg-white text-nowrap text-black px-3 py-10px pointer-cursor collapsed" type="button" data-bs-toggle="collapse" data-bs-target="#collapse1" aria-expanded="false">
<div class="col-10">
<i class="fa fa-circle fa-fw text-blue me-2 fs-8px"></i> Notesheets.
</div>
<div class="col-1"><strong>{{ count($notesheet)==0 ? '' : count($notesheet) }}</strong></div>
</button>
</div>
<div id="collapse1" class="accordion-collapse collapse" data-bs-parent="#accordion" style="">
<div class="accordion-body bg-gray-100">

<div class="panel panel-inverse">

  <div class="panel-body">
<div class="row"><div class="col-sm-12">
<table width="100%" id="data-table-default" class="table table-striped table-bordered align-middle">
<thead>
<tr>
<th width="1%" data-orderable="false"></th>
    <th>ANR NO.</th>
    <th>Applicant Name</th>
    <th>Category</th>
    <th>Notesheet</th>
    <th></th>
</tr>
</thead>
<tbody>

@foreach($notesheet as $item1) 
<tr>
<td class="text-center">{{$loop->iteration}}</td>
<td>{{$item1->anr_no}} / {{$item1->anr_year}}</td>
<td>{{$item1->applicant}}</td>
<td>{{$item1->category}}</td>
<td>
  @if($item1->file_name != '')
  <a class="btn {{($item1->category=='Mediation' ? 'btn-danger' : 'btn-primary')}}" type="button" href="\forwardNotesheet\{{$item1->notesheet_id}}">View & Forward</a>
@endif
</td>

<td></td>
</tr>
@endforeach
</tbody>
</table>
</div></div></div></div>

</div>
</div>
</div>
@endif
@endif
</div>
</div>
</div>

</section>
@endforeach
@endif
@endif
@endsection
@push('scripts')
<script>
    $(document).ready(function(){
  // $("#datepicker").datepicker({
  //   todayHighlight: true,
  //   // inline: true
  // });
});
</script>
@endpush
@push('scripts')
 <script>
$(document).ready(function(){
   $('#data-table-default').DataTable({    responsive: true,
    "fnRowCallback" : function(nRow, aData, iDisplayIndex){
      var oSettings = this.fnSettings ();
                $("td:first", nRow).html(oSettings._iDisplayStart+iDisplayIndex +1);
               return nRow;
            },
    });
});
</script>
@endpush