@extends('layouts.main')
@section('content')
<!--begin::Card-->
<div class="card card-custom">
    <div class="card-header">
        <div class="card-title">
            <span class="card-icon">
                <i class="flaticon-event-calendar-symbol text-primary"></i>
            </span>
            <h3 class="card-label">Time sheet for <span class="text-warning">{{ isset($schedule->name) ? $schedule->name : ''}}</span></h3>
        </div>
        
        <div class="card-toolbar">
            <!--begin::Button-->
            <a  href="javascript:;" onclick="openModalAndShow('{{ route('schedule.schedulelist.modal',[$team->id,'path'=>'timecard']) }}')" class="btn btn-warning font-weight-bolder btn-sm">
            <i class="flaticon-calendar-with-a-clock-time-tools"></i> Change Week</a>
            <!--end::Button-->
        </div>
        
    </div>
    <div class="card-body">
        <!--begin: Datatable-->
        <div class="table-responsive">
        <table class="table table-bordered table-hover table-checkable " id="datatable">
            <thead>
                <tr>
                    <th>Names</th>
                    <th>Monday <br><span class="text-success">{{$mondayDate}}</span></th>
                    <th>Tuesday <br><span class="text-success">{{$tuesdayDate}}</span></th>
                    <th>Wednesday <br><span class="text-success">{{$wedDate}}</span></th>
                    <th>Thursday <br><span class="text-success">{{$thursDate}}</span></th>
                    <th>Friday <br><span class="text-success">{{$friDate}}</span></th>
                    <th>Saturday <br><span class="text-success">{{$saturdayDate}}</span></th>
                    <th>Sunday <br><span class="text-success">{{$sundayDate}}</span></th>
                </tr>
            </thead>
            <tbody>
                @if (!empty($profiles))
                    @foreach ($profiles as $profile)

                    <tr>
                        <td>
                            <span class="text-dark-75 font-weight-bold line-height-sm d-block pb-2">{{ $profile->profile_first_name}} {{$profile->profile_last_name}}</span>
                            <span class="text-muted text-hover-primary">{{ isset($profile->profileDesignation->career_path) ? $profile->profileDesignation->career_path : ''}}</span>
                           
                        </td>
                        <td>
                            
                                @if ($profile->scheduleDetails[$mondayDate]['shiftId'] !='')
                                    <p style="color: {{$profile->scheduleDetails[$mondayDate]['color']}}">{{ ucwords($profile->scheduleDetails[$mondayDate]['shift_name']) }}</p>
                                @else
                                    <p class="text-dark-50">{{ $profile->scheduleDetails[$mondayDate]['shift_name'] }}</p>
                                @endif

                                @if ($profile->timeCardDetails[$mondayDate] != '')
                                    <ul class="list-unstyled">
                                        <li class="text-success">IN: <span class="text-secondary font-weight-bold">{{$common->get_db_time($profile->timeCardDetails[$mondayDate]['time_in'])}}</span></li>
                                        <li class="text-danger">OUT: <span class="text-secondary font-weight-bold">{{$common->get_db_time($profile->timeCardDetails[$mondayDate]['time_out'])}}</span></li>
                                        <li class="text-primary font-size-lg">TOTAL: <span class="text-secondary font-weight-bolder">{{$profile->timeCardDetails[$mondayDate]['tot_hours']}}</span></li>
                                    </ul>
                                @endif
                                @if($profile->scheduleOffDetails[$mondayDate] == 1)
                                <a href="javascript:" class="btn btn-md btn-text-success btn-icon-success btn-hover-bg-light "><i class="far fa-calendar-check"></i> Timeoff</a>
                                @endif
                            
                        </td>
                        <td>
                            
                                @if ($profile->scheduleDetails[$tuesdayDate]['shiftId'] !='')
                                    <p style="color: {{$profile->scheduleDetails[$tuesdayDate]['color']}}">{{ ucwords($profile->scheduleDetails[$tuesdayDate]['shift_name']) }}</p>
                                @else
                                    <p class="text-dark-50">{{ $profile->scheduleDetails[$tuesdayDate]['shift_name'] }}</p>
                                @endif

                                @if ($profile->timeCardDetails[$tuesdayDate] != '')
                                    <ul class="list-unstyled">
                                        <li class="text-success">IN: <span class="text-secondary font-weight-bold">{{$common->get_db_time($profile->timeCardDetails[$tuesdayDate]['time_in'])}}</span></li>
                                        <li class="text-danger">OUT: <span class="text-secondary font-weight-bold">{{$common->get_db_time($profile->timeCardDetails[$tuesdayDate]['time_out'])}}</span></li>
                                        <li class="text-primary font-size-lg">TOTAL: <span class="text-secondary font-weight-bolder">{{$profile->timeCardDetails[$tuesdayDate]['tot_hours']}}</span></li>
                                    </ul>
                                @endif
                                @if($profile->scheduleOffDetails[$tuesdayDate] == 1)
                                <a href="javascript:" class="btn btn-md btn-text-success btn-icon-success btn-hover-bg-light "><i class="far fa-calendar-check"></i> Timeoff</a>
                                @endif
                            
                        </td>
                        <td>
                             
                                @if ($profile->scheduleDetails[$wedDate]['shiftId'] !='')
                                    <p style="color: {{$profile->scheduleDetails[$wedDate]['color']}}">{{ ucwords($profile->scheduleDetails[$wedDate]['shift_name']) }}</p>
                                @else
                                    <p class="text-dark-50">{{ $profile->scheduleDetails[$wedDate]['shift_name'] }}</p>
                                @endif

                                @if ($profile->timeCardDetails[$wedDate] != '')
                                    <ul class="list-unstyled">
                                        <li class="text-success">IN: <span class="text-secondary font-weight-bold">{{$common->get_db_time($profile->timeCardDetails[$wedDate]['time_in'])}}</span></li>
                                        <li class="text-danger">OUT: <span class="text-secondary font-weight-bold">{{$common->get_db_time($profile->timeCardDetails[$wedDate]['time_out'])}}</span></li>
                                        <li class="text-primary font-size-lg">TOTAL: <span class="text-secondary font-weight-bolder">{{$profile->timeCardDetails[$wedDate]['tot_hours']}}</span></li>
                                    </ul>
                                @endif
                                @if($profile->scheduleOffDetails[$wedDate] == 1)
                                <a href="javascript:" class="btn btn-md btn-text-success btn-icon-success btn-hover-bg-light "><i class="far fa-calendar-check"></i> Timeoff</a>
                                @endif
                            
                        </td>
                        <td>
                             
                                @if ($profile->scheduleDetails[$thursDate]['shiftId'] !='')
                                    <p style="color: {{$profile->scheduleDetails[$thursDate]['color']}}">{{ ucwords($profile->scheduleDetails[$thursDate]['shift_name']) }}</p>
                                @else
                                    <p class="text-dark-50">{{ $profile->scheduleDetails[$thursDate]['shift_name'] }}</p>
                                @endif

                                @if ($profile->timeCardDetails[$thursDate] != '')
                                    <ul class="list-unstyled">
                                        <li class="text-success">IN: <span class="text-secondary font-weight-bold">{{$common->get_db_time($profile->timeCardDetails[$thursDate]['time_in'])}}</span></li>
                                        <li class="text-danger">OUT: <span class="text-secondary font-weight-bold">{{$common->get_db_time($profile->timeCardDetails[$thursDate]['time_out'])}}</span></li>
                                        <li class="text-primary font-size-lg">TOTAL: <span class="text-secondary font-weight-bolder">{{$profile->timeCardDetails[$thursDate]['tot_hours']}}</span></li>
                                    </ul>
                                @endif
                                @if($profile->scheduleOffDetails[$thursDate] == 1)
                                <a href="javascript:" class="btn btn-md btn-text-success btn-icon-success btn-hover-bg-light "><i class="far fa-calendar-check"></i> Timeoff</a>
                                @endif
                            
                        </td>
                        <td>
                            
                                @if ($profile->scheduleDetails[$friDate]['shiftId'] !='')
                                    <p style="color: {{$profile->scheduleDetails[$friDate]['color']}}">{{ ucwords($profile->scheduleDetails[$friDate]['shift_name']) }}</p>
                                @else
                                    <p class="text-dark-50">{{ $profile->scheduleDetails[$friDate]['shift_name'] }}</p>
                                @endif

                                @if ($profile->timeCardDetails[$friDate] != '')
                                    <ul class="list-unstyled">
                                        <li class="text-success">IN: <span class="text-secondary font-weight-bold">{{$common->get_db_time($profile->timeCardDetails[$friDate]['time_in'])}}</span></li>
                                        <li class="text-danger">OUT: <span class="text-secondary font-weight-bold">{{$common->get_db_time($profile->timeCardDetails[$friDate]['time_out'])}}</span></li>
                                        <li class="text-primary font-size-lg">TOTAL: <span class="text-secondary font-weight-bolder">{{$profile->timeCardDetails[$friDate]['tot_hours']}}</span></li>
                                    </ul>
                                @endif
                                @if($profile->scheduleOffDetails[$friDate] == 1)
                                <a href="javascript:" class="btn btn-md btn-text-success btn-icon-success btn-hover-bg-light "><i class="far fa-calendar-check"></i> Timeoff</a>
                                @endif
                            
                        </td>
                        <td>
                            
                                @if ($profile->scheduleDetails[$saturdayDate]['shiftId'] !='')
                                    <p style="color: {{$profile->scheduleDetails[$saturdayDate]['color']}}">{{ ucwords($profile->scheduleDetails[$saturdayDate]['shift_name']) }}</p>
                                @else
                                    <p class="text-dark-50">{{ $profile->scheduleDetails[$saturdayDate]['shift_name'] }}</p>
                                @endif

                                @if ($profile->timeCardDetails[$saturdayDate] != '')
                                    <ul class="list-unstyled">
                                        <li class="text-success">IN: <span class="text-secondary font-weight-bold">{{$common->get_db_time($profile->timeCardDetails[$saturdayDate]['time_in'])}}</span></li>
                                        <li class="text-danger">OUT: <span class="text-secondary font-weight-bold">{{$common->get_db_time($profile->timeCardDetails[$saturdayDate]['time_out'])}}</span></li>
                                        <li class="text-primary font-size-lg">TOTAL: <span class="text-secondary font-weight-bolder">{{$profile->timeCardDetails[$saturdayDate]['tot_hours']}}</span></li>
                                    </ul>
                                @endif
                                @if($profile->scheduleOffDetails[$saturdayDate] == 1)
                                <a href="javascript:" class="btn btn-md btn-text-success btn-icon-success btn-hover-bg-light "><i class="far fa-calendar-check"></i> Timeoff</a>
                                @endif
                            
                        </td>
                        <td>
                                                          

                                @if ($profile->scheduleDetails[$sundayDate]['shiftId'] !='')
                                    <p style="color: {{$profile->scheduleDetails[$sundayDate]['color']}}">{{ ucwords($profile->scheduleDetails[$sundayDate]['shift_name']) }}</p>
                                @else
                                    <p class="text-dark-50">{{ $profile->scheduleDetails[$sundayDate]['shift_name'] }}</p>
                                @endif

                                @if ($profile->timeCardDetails[$sundayDate] != '')
                                    <ul class="list-unstyled">
                                        <li class="text-success">IN: <span class="text-secondary font-weight-bold">{{$common->get_db_time($profile->timeCardDetails[$sundayDate]['time_in'])}}</span></li>
                                        <li class="text-danger">OUT: <span class="text-secondary font-weight-bold">{{$common->get_db_time($profile->timeCardDetails[$sundayDate]['time_out'])}}</span></li>
                                        <li class="text-primary font-size-lg">TOTAL: <span class="text-secondary font-weight-bolder">{{$profile->timeCardDetails[$sundayDate]['tot_hours']}}</span></li>
                                    </ul>
                                @endif
                                @if($profile->scheduleOffDetails[$sundayDate] == 1)
                                <a href="javascript:" class="btn btn-md btn-text-success btn-icon-success btn-hover-bg-light "><i class="far fa-calendar-check"></i> Timeoff</a>
                                @endif
                            
                        </td>
                    </tr>
                    @endforeach
                @endif
            </tbody>
        </table>
        </div>
        <!--end: Datatable-->

        <div class="card card-custom card-fit card-border mt-15">
            <div class="card-header">
                <div class="card-title">
                    <span class="card-icon">
                        <i class="flaticon-time text-primary"></i>
                    </span>
                    <h3 class="card-label">Shifts Legend</h3>
                </div>
                <!-- <div class="card-toolbar">
                    <a href="#" class="btn btn-sm btn-primary font-weight-bold">
                    <i class="flaticon2-gear"></i>Settings</a>
                </div> -->
            </div>
            <div class="card-body pt-2">
                <ul>
                    @foreach ($shifts as $shift)
                        <li class="font-size-h6"><span class="btn btn-icon btn-xs mr-2 mb-2" style="background-color: {{$shift->color}}"></span>{{ucwords($shift->name)}}  (<span class="text-success">{{$shift->start}}</span>)</li>
                    @endforeach
                </ul>
            </div>
        </div>
       
    </div>
</div>
<!--end::Card-->
@endsection
@section('sub_header')
<div class="subheader py-2 py-lg-6 subheader-transparent" id="kt_subheader">
    <div class="container d-flex align-items-center justify-content-between flex-wrap flex-sm-nowrap">
        <!--begin::Info-->
        <div class="d-flex align-items-center flex-wrap mr-1">
            <!--begin::Page Heading-->
            <div class="d-flex align-items-baseline flex-wrap mr-5">
                <!--begin::Page Title-->
                <h5 class="text-dark font-weight-bold my-1 mr-5">Hours worked for <span class="text-info">{{$team->team_name}}</span></h5>
                <!--end::Page Title-->
                <!--begin::Breadcrumb-->
                <ul class="breadcrumb breadcrumb-transparent breadcrumb-dot font-weight-bold p-0 my-2 font-size-sm">
                    <li class="breadcrumb-item text-muted">
                        <a href="" class="text-muted">List</a>
                    </li>
                </ul>
                <!--end::Breadcrumb-->
            </div>
            <!--end::Page Heading-->
        </div>
        @if ($loggedUserDetails['guard'] == 'user')
        <div class="d-flex align-items-center">
            <!--begin::Actions-->
            <a href="javascript:;" onclick="openModalAndShow('{{ route('schedule.team.modal',['path'=>'timecard']) }}')" class="btn btn-light-info font-weight-bolder btn-sm"><i class="flaticon-network"></i> Change Team</a>
            <!--end::Actions-->
        </div>
        @endif
    </div>
</div>
@endsection
@section('theam_css')
<link href="{{ $common->getTheamUrl('assets/plugins/custom/datatables/datatables.bundle.css') }}" rel="stylesheet" type="text/css" />

@endsection
@section('page_css')
<style>
    .same-line{display: flex; align-items: center;}
    .same-line button{margin-left: 5px;}
    .dataTable td{padding: 13px 5px !important; }
</style>

@endsection
@section('js_file')
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.29.1/moment.min.js" integrity="sha512-qTXRIMyZIFb8iQcfjXWCO8+M5Tbc38Qi5WzdPOYZHIlZpzBHG3L3by84BBBOiRGiEb7KKtAOAs5qYdUiZiQNNQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="{{ $common->getTheamUrl('assets/plugins/custom/datatables/datatables.bundle.js') }}"></script>
@endsection
@section('page_js')
    <script>
        var ajax_datatable_list = null;
        var tableName = $('#datatable');
        $(document).ready(function(){

            initializeDatatable(); 
            @if(Session::has('success'))
                toastr.success("{{Session::get('success')}}");
            @endif 
            @if(Session::has('error'))
                toastr.error("{{Session::get('error')}}");
            @endif 
            

            $(document).on('submit', '#schedule-select-form', function(e){
                e.preventDefault();
                var scheduleId = $('#schedule_id').val();
                if(scheduleId!=''){
                  window.location = $(this).attr('action')+'/?schedule_id='+scheduleId;
                }else{
                  $('#schedule_id').addClass('is-invalid');
                  $('#schedule_id').closest('.form-group').find('.invalid-feedback').html('Please select Team!')
                }
            });
            
        })
        function initializeDatatable() {
            if (ajax_datatable_list) {
                ajax_datatable_list.destroy();
            }

            ajax_datatable_list = tableName.DataTable({                
                'scrollX': true,
                'scrollCollapse': true,   
                'paging': true,
                'lengthChange': false,
                'searching': true,
                'ordering': false,
                'pageLength' : datatablePageLength,                            
            });

            
            return ajax_datatable_list;
        }
               
    </script>
@endsection