@extends('layouts.default', ['appTopMenu' => true])

@push('scripts')
<style type="text/css">
.cl_appication
{
  color: blue;
}
.cl_appication:hover
{
  cursor: pointer;
}

</style>
<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>
<script src="/assets/plugins/datatables.net-buttons-bs5/js/buttons.bootstrap5.min.js"></script>
<script src="/assets/plugins/datatables.net-buttons/js/buttons.colVis.min.js"></script>
<script src="/assets/plugins/datatables.net-buttons/js/buttons.flash.min.js"></script>
<script src="/assets/plugins/datatables.net-buttons/js/buttons.html5.min.js"></script>
<script src="/assets/plugins/datatables.net-buttons/js/buttons.print.min.js"></script>
<script src="/assets/plugins/pdfmake/build/pdfmake.min.js"></script>
<script src="/assets/plugins/pdfmake/build/vfs_fonts.js"></script>
<script src="/assets/plugins/jszip/dist/jszip.min.js"></script>
<link rel="stylesheet" href="{{ asset('css/jquery-ui.css')}}" />
<script src="{{ asset('js/jquery-ui.js') }}"></script>

<script src="{{ asset('js/bootstrap-datetimepicker.js')}}"></script>
    <script src="{{ asset('js/bootstrap-datetimepicker.fr.js') }}"></script>
    <script src="/assets/plugins/sweetalert/dist/sweetalert.min.js"></script>
    
<link href="/assets/plugins/select2/dist/css/select2.min.css" rel="stylesheet" />
<script src="/assets/plugins/select2/dist/js/select2.min.js" defer></script>    
<style type="text/css">
  .ui-front {
    z-index: 9999;
}
</style>
@endpush

@section('content') 
<div class="container">
<form action="report-mediator-dates" method="post">
@csrf
<div class="card m-5">
    <div class="card-header bg-dark ">
    Mediation Dates Report - Between Dates
    </div>
    <div class="card-body">

        
     
    
    <div class="row mb-15px">
        <div class="col-md-3">
            <label class="form-label col-form-label" for="mediator_name_label"><b>Mediator Name</b></label>
            <select name="mediator_name" id="mediator_name" class="form-select form-select-sm" aria-label="mediator_name_label">
                <option value="">Choose...</option>
                @foreach($list_of_mediator as $advocate)
                <option value="{{ $advocate->advocate_id }}" {{ old('mediator_name') == $advocate->advocate_id ? 'selected' : ''}} >{{ $advocate->title.' '.$advocate->user_name }}</option>
                @endforeach
            </select>                                                

            @error('mediator_name')
            <span class="invalid-feedback d-inline" role="alert">
                <strong>{{ $message }}</strong>
            </span>
            @enderror
        </div>
    </div>
                    <div class="row mb-15px">

                        <div class="col-md-3">
                            <label for="anr_no" class="form-label col-form-label">ANR No.</label>
                            <input type="number" name="anr_no" id="anr_no" class="form-control form-control-sm @error('anr_no') is-invalid @enderror" value="{{old('anr_no')}}">
                            @error('anr_no')
                            <span class="invalid-feedback d-inline" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                            @enderror
                        </div>
                                                <div class="col-md-3">
                            <label for="anr_year" class="form-label col-form-label">ANR Year</label>
                            <select name="anr_year" id='anr_year' class="form-select form-select-sm @error('anr_no') is-invalid @enderror">
                                <option value="">Select</option>
                                @for($i=$year;$i>=1930;$i--)
                                <option value="{{$i}}" @if( $i ==old('anr_year')) {{'selected'}}  @endif>{{$i}}</option>
                                @endfor
                            </select>
                            @error('anr_year')
                            <span class="invalid-feedback d-inline" role="alert">
                                <strong>{{ $message }}</strong>
                            </span>
                            @enderror
                        </div>
                    </div>
        
        
    <div class="row mb-15px">        
        <div class="col-md-3">
        <label class="form-label col-form-label" for="txt_frmdate"><b>From Date</b></label>
        <input type="text" name="txt_frmdate" id="txt_frmdate" value="{{old('txt_frmdate',$txt_frmdate)}}" class="form-control form-control-sm dtp" placeholder="Date" autocomplete="off">
            @error('txt_frmdate')
            <span class="invalid-feedback d-inline" role="alert">
                <strong>{{ $message }}</strong>
            </span>
            @enderror        </div>
        <div class="col-md-3">
        <label class="form-label col-form-label" for="txt_todate"><b>To Date</b></label>
        <input type="text" name="txt_todate" id="txt_todate" value="{{old('txt_todate', $txt_todate)}}" class="form-control form-control-sm dtp" placeholder="Date" autocomplete="off">
            @error('txt_todate')
            <span class="invalid-feedback d-inline" role="alert">
                <strong>{{ $message }}</strong>
            </span>
            @enderror
        </div>
    </div>
            <div class="row mb-15px">
        <div class="col-md-3 ">
        
        <input type="submit" name="btn_submit" id="btn_submit" value="Submit" class="btn btn-primary btn-sm"/>
        </div>
            </div>
</div>

</div>
</div>

</form>


@if(isset($list))

<div class="card mb-5" >
    <div class="title_print card-header bg-dark ">
    Mediation Dates from {{$txt_frmdate}} to {{$txt_todate}}
    </div>
    <div class="card-body">

    
        <div class=''></div>    
<table id="data-table-combine" class="table table-striped table-bordered align-middle">
  <thead>
    <tr>
     <th data-orderable="false">S.No.</th>
     <th>Mediator Name</th>
     <th>Hearing Dates</th>
      <th>Total</th>
    </tr>
  </thead>
  <tbody>
         @foreach($list as $val)
   <tr>
       <td>
           {{ $sno++ }}
       </td>
       <td>
           {{ $val->title }} - {{ $val->user_name }}
       </td>
       <td>
           {{ $val->hearing_dates }}
       </td>
       <td>
           {{ $val->total }}
       </td>
   </tr>
   @endforeach
  </tbody>
    </table>
    </div>
</div>

@endif


</div>

@endsection


@push('scripts')
<script>
  
    $(document).ready(function(){
      $("#mediator_name").select2();
    $(".dtp").datetimepicker({
        format:'dd-mm-yyyy',
        minView: 2, 
        pickTime: false, 
        language: 'pt-BR',
        autoclose: true, 
       
    });

    var title = function () {
                        return $('.title_print').html(); };                   
var options = {
    dom: '<"dataTables_wrapper dt-bootstrap"<"row"<"col-xl-7 d-block d-sm-flex d-xl-block justify-content-center"<"d-block d-lg-inline-flex me-0 me-md-3"l><"d-block d-lg-inline-flex"B>><"col-xl-5 d-flex d-xl-block justify-content-center"fr>>t<"row"<"col-md-5"i><"col-md-7"p>>>',
    buttons: [
      { title: title, extend: 'copy', className: 'btn-sm' },
      { title: title, extend: 'csv', className: 'btn-sm' },
      { title: title, extend: 'excel', className: 'btn-sm' },
      { title: title, extend: 'pdf', className: 'btn-sm' },
      { title: title, extend: 'print', className: 'btn-sm' }
    ],

    responsive: true,
    colReorder: true,
    keys: true,
    rowReorder: true,
    select: true
  };

  if ($(window).width() <= 767) {
    options.rowReorder = false;
    options.colReorder = false;
  }
  $('#data-table-combine').DataTable(options);

});
    </script>
    
    @endpush