@extends('settings.layouts.master')
@section('styles')
  <link rel="stylesheet" href="{{asset('admin/plugins/select2/css/select2.min.css')}}">
  <link rel="stylesheet" href="{{asset('admin/plugins/select2-bootstrap4-theme/select2-bootstrap4.min.css')}}">
    <link rel="stylesheet" href="{{asset('admin/plugins/toastr/toastr.min.css')}}">
  <link rel="stylesheet" href="{{asset('admin/plugins/sweetalert2-theme-bootstrap-4/bootstrap-4.min.css')}}">
  <style type="text/css">
  .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: #444;
    line-height: 14px;
  }
  </style>
@endsection
@section('contents')
<div class="content-wrapper pb-0">
<div class="page-header flex-wrap">
  <h3 class="mb-0">{{$category}}</h3>
</div>
<div class="row">
  <div class="col-md-12 stretch-card grid-margin">
    <div class="card">
      <div class="card-body">
          @csrf
         
          <div class="row">
            <div class="col-md-6">
              <h3>{{$category}}</h3>
            </div>
            <div class="col-md-6">
              <button class="btn btn-success" onclick="addCompanyBank('Add')">Add {{$category}}</button>
            </div>
          </div>
          <div class="col-md-12">
             <table id="example1" class="table table-bordered table-striped">
              <thead>
              <tr>
                <th>Sno</th>
                <th>Name</th>
                <th>Description</th>
                <th>Action</th>
              </tr>
              </thead>
              <tbody>
                 @if(count($data)>0) 
                 @foreach($data as $key=>$value)
                 <tr>
                  <th>{{$key+1}}</th>
                  <th>{{$value->name}}</th>
                  <th>{{$value->description}}</th>
                  <th>
                    <button class="btn btn-info" onclick="editDetails('{{$value->id}}','{{$value->name}}','{{$value->description}}','{{$value->saturday_w1}}','{{$value->saturday_w2}}','{{$value->saturday_w3}}','{{$value->saturday_w4}}','{{$value->saturday_w5}}','{{$value->sunday_w1}}','{{$value->sunday_w2}}','{{$value->sunday_w3}}','{{$value->sunday_w4}}','{{$value->sunday_w5}}')">
                      <i class="fa fa-edit"></i>
                    </button>
                  </th>
                </tr>
                 @endforeach  
                 @else
                 <tr>
                 <th colspan="10">{{$category}} details not Found</th>
               </tr>
                 @endif
              </tbody>
              <tfoot>
              <tr>
                <th>Sno</th>
                <th>Name</th>
                <th>Description</th>
                <th>Action</th>
              </tr>
             </tfoot>
            </table>
          </div>
          </div>
      </div>
    </div>
  </div>
</div>
<div class="modal modal-add fade show" id="add-modal-made" aria-modal="true" role="dialog" style="padding-right: 17px; display: none;">
    <div class="modal-dialog">
      <div class="modal-content">
        <div class="modal-header">
          <h4 class="modal-title">{{$category}} <span id="type"></span></h4>
          <button type="button" class="close" data-dismiss="modal" aria-label="Close">
           <span aria-hidden="true">×</span>
          </button>
        </div>
        <div class="modal-body">
        <form id="modal-add-form" action="{{ route('save_weekend_policy') }}" method="post" >
          @csrf
          <div class="form-group">
            <input type="hidden" name="listId" id="listId" value="">
        
            <label for="recipient-name" class="control-label mb-10">{{$category}} Name *:</label>
            <input type="text" class="form-control all-clean"  name="name" id="name" value="{{old('name')}}" placeholder="Please Enter name" required>
          </div>
          <div class="form-group">
            <label for="recipient-name" class="control-label mb-10">Description :</label>
            <input type="text" class="form-control all-clean"  name="description"  id="description"  value="{{old('description')}}" placeholder="Please Enter description" required>
          </div>
          
          <div class="row">
            <div class="col-md-6">
              <div class="row">
                <div class="col-md-12">
                  <center><h6>Saturday</h6></center>
                </div>
                <div class="col-md-6">
                  Week 1
                </div>
                <div class="col-md-6">
                  <select name="saturday_w1" id="saturday_w1" class="form-control">
                    <option value="">Select </option>
                    <option value="Off">Off</option>
                    <option value="Working">Working</option>
                    <option value="Half Day">Half Day</option>
                    <option value="Rest Day">Rest Day</option>
                  </select>
                </div>
                <div class="col-md-6">
                  Week 2
                </div>
                <div class="col-md-6">
                  <select name="saturday_w2" id="saturday_w2" class="form-control">
                    <option value="">Select </option>
                    <option value="Off">Off</option>
                    <option value="Working">Working</option>
                    <option value="Half Day">Half Day</option>
                    <option value="Rest Day">Rest Day</option>
                  </select>
                </div>
                <div class="col-md-6">
                  Week 3
                </div>
                <div class="col-md-6">
                  <select name="saturday_w3" id="saturday_w3" class="form-control">
                    <option value="">Select </option>
                    <option value="Off">Off</option>
                    <option value="Working">Working</option>
                    <option value="Half Day">Half Day</option>
                    <option value="Rest Day">Rest Day</option>
                  </select>
                </div>
                <div class="col-md-6">
                  Week 4
                </div>
                <div class="col-md-6">
                  <select name="saturday_w4" id="saturday_w4" class="form-control">
                    <option value="">Select </option>
                    <option value="Off">Off</option>
                    <option value="Working">Working</option>
                    <option value="Half Day">Half Day</option>
                    <option value="Rest Day">Rest Day</option>
                  </select>
                </div>
                <div class="col-md-6">
                  Week 5
                </div>
                <div class="col-md-6">
                  <select name="saturday_w5" id="saturday_w5" class="form-control">
                    <option value="">Select </option>
                    <option value="Off">Off</option>
                    <option value="Working">Working</option>
                    <option value="Half Day">Half Day</option>
                    <option value="Rest Day">Rest Day</option>
                  </select>
                </div>

              </div>
            </div>
            <div class="col-md-6">
              <div class="row">
                <div class="col-md-12">
                  <center><h6>Sunday</h6></center>
                </div>
                <div class="col-md-6">
                  Week 1
                </div>
                <div class="col-md-6">
                  <select name="sunday_w1" id="sunday_w1" class="form-control">
                    <option value="">Select </option>
                    <option value="Off">Off</option>
                    <option value="Working">Working</option>
                    <option value="Half Day">Half Day</option>
                    <option value="Rest Day">Rest Day</option>
                  </select>
                </div>
                <div class="col-md-6">
                  Week 2
                </div>
                <div class="col-md-6">
                  <select name="sunday_w2" id="sunday_w2" class="form-control">
                    <option value="">Select </option>
                    <option value="Off">Off</option>
                    <option value="Working">Working</option>
                    <option value="Half Day">Half Day</option>
                    <option value="Rest Day">Rest Day</option>
                  </select>
                </div>
                <div class="col-md-6">
                  Week 3
                </div>
                <div class="col-md-6">
                  <select name="sunday_w3" id="sunday_w3" class="form-control">
                    <option value="">Select </option>
                    <option value="Off">Off</option>
                    <option value="Working">Working</option>
                    <option value="Half Day">Half Day</option>
                    <option value="Rest Day">Rest Day</option>
                  </select>
                </div>
                <div class="col-md-6">
                  Week 4
                </div>
                <div class="col-md-6">
                  <select name="sunday_w4" id="sunday_w4" class="form-control">
                    <option value="">Select </option>
                    <option value="Off">Off</option>
                    <option value="Working">Working</option>
                    <option value="Half Day">Half Day</option>
                    <option value="Rest Day">Rest Day</option>
                  </select>
                </div>
                <div class="col-md-6">
                  Week 5
                </div>
                <div class="col-md-6">
                  <select name="sunday_w5" id="sunday_w5" class="form-control">
                    <option value="">Select </option>
                    <option value="Off">Off</option>
                    <option value="Working">Working</option>
                    <option value="Half Day">Half Day</option>
                    <option value="Rest Day">Rest Day</option>
                  </select>
                </div>

              </div>
            </div>
          </div>
          
           
        </form>
        </div>
        <div class="modal-footer justify-content-between">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
          <button type="button" class="btn btn-primary" onclick="$('#modal-add-form').submit()"><span id="bank-button" >Save</span></button>
        </div>
      </div>
    </div>
  </div>  
@endsection
@section('scripts')
<script src='https://cdn.jsdelivr.net/npm/fullcalendar@6.0.0/index.global.min.js'></script>
<script src="{{asset('admin/plugins/select2/js/select2.full.min.js')}}"></script>
<!-- Toastr -->
<script src="{{asset('admin/plugins/sweetalert2/sweetalert2.min.js')}}"></script>
<script src="{{asset('admin/plugins/toastr/toastr.min.js')}}"></script>
<script type="text/javascript">
  function addCompanyBank(type) {
    $('#listId').val('');
    $('#name').val('');
    $('#description').val('');
    $('#saturday_w1').val('Rest Day');
    $('#saturday_w2').val('Rest Day');
    $('#saturday_w3').val('Rest Day');
    $('#saturday_w4').val('Rest Day');
    $('#saturday_w5').val('Rest Day');
    $('#sunday_w1').val('Rest Day');
    $('#sunday_w2').val('Rest Day');
    $('#sunday_w3').val('Rest Day');
    $('#sunday_w4').val('Rest Day');
    $('#sunday_w5').val('Rest Day');
    
    $('#bank-button').html('Add');
    $('#add-modal-made').modal('toggle');

  }
  $('.select2').select2();

  $(document).ready(function(){

 });
  
  function addBankBranch(type) {

    $('#bank-button').html(type);
    $('#type').html(type);
    $('#add-modal-made').modal('toggle');

  }
  function editDetails(id,name,description,saturday_w1,saturday_w2,saturday_w3,saturday_w4,saturday_w5,sunday_w1,sunday_w2,sunday_w3,sunday_w4,sunday_w5) {
   
    $('#listId').val(id);
    $('#name').val(name);
    $('#description').val(description);

    $('#saturday_w1').val(saturday_w1);
    $('#saturday_w2').val(saturday_w2);
    $('#saturday_w3').val(saturday_w3);
    $('#saturday_w4').val(saturday_w4);
    $('#saturday_w5').val(saturday_w5);
    $('#sunday_w1').val(sunday_w1);
    $('#sunday_w2').val(sunday_w2);
    $('#sunday_w3').val(sunday_w3);
    $('#sunday_w4').val(sunday_w4);
    $('#sunday_w5').val(sunday_w5);

    $('#bank-button').html('Edit');
    $('#add-modal-made').modal('toggle');
  }
 
  function getListBox(){

    var list_box = $('#list_box').val();
    console.log(list_box);
    reqUrl = "{{route('ifsc_save')}}";
    $('.global-loader').css('display','block');
        $.ajax({
          type: "get",
          url: reqUrl,
          data: {'list_box':list_box},
          dataType: "json",
          headers: {
              'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
          },
          beforeSend: function() {
          },
          complete: function() {
          },
          success: function(response) {
            $('#list_value').html(response.success);
            $('.global-loader').css('display','none');
              // console.log(response);
          }
        });
  }
  function callSaveMessage(message){
    var Toast = Swal.mixin({
      toast: true,
      position: 'top-end',
      showConfirmButton: false,
      timer: 3000
    });
    Toast.fire({
        icon: 'success',
        title: message
    })
    $('.global-loader').css('display','none');
  }
</script>
@endsection