@extends('layouts.default')
@section('header-links')
    @include('accounts.payrole.header')
@endsection
@section('title','Approval Timesheet')
@section('content')
@section('new_button')

<a href="{{ url('payrole/timesheet/create') }}" class="btn btn-info btn-Rcircle-iconic waves-effect waves-light"  data-toggle="tooltip" title="Create Timesheet"><i class="material-icons left">add</i> {{ __('Timesheet') }}</a>
@endsection
<style type="text/css">
.schTbHead-Text {
    margin-bottom: 10px !important;
    top: 10px;
    position: relative;
}
.schTbHead-Text h4 {
    margin: 0 0px;
    position: relative;
    color: #0c6dff;
    top: -7px;
}
</style>

<div class="row">
  <div class="col-md-12">
      {{ Form::selectGroup('employee_id','Employee', $customers, null, ['data-live-search'=>'true']) }}
      {{ csrf_field() }}
      <input type="hidden" name="day1" id="day1" value="">
      <input type="hidden" name="presentWeekNumber" id="presentWeekNumber" value="">
      <input type="hidden" name="presentYear" id="presentYear" value="">
      <input type="hidden" name="actual_week" id="actual_week" value="">
      <input type="hidden" name="actual_year" id="actual_year" value="">
      
      <div class="col-lg-12 col-md-12 text-center">
        <div class="schTbHead-Text">
          <button class="schTbHead-TextBtn"  type="button" id="previousWeek"> <i class="material-icons"> keyboard_arrow_left </i> </button>
          <h4   class="presentWeek"  id="presentWeek" style="line-height: 50px;"></h4>
          <button class="schTbHead-TextBtn pl-0"  type="button" id="nextWeek"> <i class="material-icons"> keyboard_arrow_right </i> </button>
        </div>
      </div>
  </div>
</div>

<div class="View-TimeSheet">
    <div class="emp_timesheet mt-3 ">
        <table class="table table-bordered " id="tbl-timesheet" >
            <thead>
                <tr>
                    <th> Name </th>
                    <th> Hours </th>
                    <th class="day1">-</th>
                    <th class="day2">-</th>
                    <th class="day3">-</th>
                    <th class="day4">-</th>
                    <th class="day5">-</th>
                    <th class="day6">-</th>
                    <th class="day7">-</th>
                    <th> Client Timesheet </th>
                    <th>Billable</th>
                    <th>Action</th>
                </tr>
          	</thead>
            <tbody class="scheduleTable">

            </tbody>
        </table>
    </div>
    <div id="loader" class="text-center" style="display: none"><img src="{{ url('acs/custom/images/loader.gif') }}" class="span-loader-img"></div>
</div>

<script src="{!! url('js/sortable/moment.js') !!}"></script>
<script type="text/javascript">
$(document).ready(function(){
  // Year Display 
  var d = new Date();
  dd = d.getDate();
  var mm = d.getMonth()+1;
  var year = d.getFullYear(); 
  // Current Week Of The Month  Done By Danda Satish
  window.onload = lastdateInit;
  function lastdateInit(){
      $('#loader').show();
      var weekNumber_1  = moment().startOf('isoweek').week();
      document.getElementById("presentWeekNumber").value = weekNumber_1;

      var year = moment().format('YYYY');
      var actual = moment().format('W');
      
      var startOfWeek = moment().startOf('isoweek').toDate();
      var tue = moment(startOfWeek).add(1,'days').toDate(); 
      var wed = moment(startOfWeek).add(2,'days').toDate(); 
      var thu = moment(startOfWeek).add(3,'days').toDate(); 
      var fri = moment(startOfWeek).add(4,'days').toDate(); 
      var sat = moment(startOfWeek).add(5,'days').toDate(); 
      var endOfWeek = moment().endOf('isoweek').toDate();
   
  
      var monDay = moment(startOfWeek).format("DD-MMM-YY");
      var tueDay = moment(tue).format("DD-MMM-YY");
      var wedDay = moment(wed).format("DD-MMM-YY");
      var thuDay = moment(thu).format("DD-MMM-YY");
      var friDay = moment(fri).format("DD-MMM-YY");
      var satDay = moment(sat).format("DD-MMM-YY");
      var sunDay = moment(endOfWeek).format("DD-MMM-YY");
      var emp_id    = $('#employee_id').val();
      $('#tbl-timesheet tbody').html('');
      
      $.ajax({
        url:'