@extends('admin.app') 

@section('content')

<section class="content-header">
    <h1>Daily Attendance Report</h1>
    <ol class="breadcrumb">
        <li><a href="/admin"><i class="fa fa-dashboard"></i> Home</a></li>
        <li class="active">Daily Attendance Report</li>
    </ol>
    <br>
</section>
<section class="content">
    <div class="row">
        <!-- left column -->
        <div class="col-md-12">
            <!-- general form elements -->
            <div class="box box-primary">
                <div class="row">
                    <div class="col-md-12">
                        <form name="reports_form" id="reports_form" role="form" method="get" action="">
                            <div class="box-header">
                                
                                <div  style="float:right;">
                                    Select Date: <input type=text name="date" class="datepicker" data-date-format="yyyy-mm-dd" value='{{$date}}'>
                                </div>
                            </div>
                        </form>
                        <div class="box-body">
                            <table class="table table-bordered table-striped" style="width: 100%;">
                                <thead>
                                    <tr>
                                    <th>Name</th>
                                    <th>In time</th>
                                    <th>Out time</th>
                                    <th>Action</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach($users as $id => $user)
                                    <tr>
                                        <td class="name">{!! $user['name'] !!}</td>
                                        <td class="in_time">{!! $user['in'] !!}</td>
                                        <td class="out_time">{!! $user['out'] !!}</td>
                                        <td>
                                            <a href="/admin/attendance/{{$id}}/view/{{$date}}" class="btn btn-primary"><i class="fa fa-eye"></i> View</a>
                                        </td>
                                    </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    </div>
                <br><br>
            </div><!-- /.box -->
        </div><!--/.col (left) -->
    </div>   <!-- /.row -->
</section>

@stop

@section('styles')
            
<link rel="stylesheet" href="/assets/plugins/timepicker/bootstrap-timepicker.min.css" type='text/css'>
@stop

@section('scripts')

<script src="/assets/plugins/timepicker/bootstrap-timepicker.min.js"></script>
<script type="text/javascript">
    $(".datepicker").datepicker().on('changeDate', function (ev) {
        $( "#reports_form" ).submit();
    });
    $(document).ready(function() {
        
        $(".timepicker").timepicker({
            showMeridian: false,
            showInputs: false
        });

        $(".summary_status").on('change', function() {
            dropdown = $(this);
            var id = $(this).attr("id");
            ids = $(this).attr("id").split("_");
            $.ajax({
                type: "POST",
                url: "/admin/attendance/update_summary_status",
                data:{user_id: ids[0], salon_id: ids[1], date: "{!! $date !!}", summary_status: dropdown.val(), _token: '{{csrf_token()}}'},
                success: function(data) {

                },
                error: function(err) {
                    console.log(err);
                }
            });
        });

        $(".regularize").on('click', function() {
            button = $(this);
            var id = $(this).attr("id");
            ids = $(this).attr("id").split("_");
            $.ajax({
                type: "POST",
                url: "/admin/attendance/regularize",
                data:{user_id: ids[0], salon_id: ids[1], date: "{!! $date !!}",in_time: button.siblings("div").find("#regularize_in_time").val(), out_time: button.siblings("div").find("#regularize_out_time").val(), _token: '{{csrf_token()}}'},
                success: function(data) {
                    // $("#"+id).parent().siblings("td[class='in_time']").html($("#regularize_in_time").val());
                    // $("#"+id).parent().siblings("td[class='out_time']").html($("#regularize_out_time").val());
                    // $("#"+id).parent().siblings("td[class='working_hours']").html("9");
                    $("#"+id).remove();
                },
                error: function(err) {
                    console.log(err);
                }
            });
        });
    });

</script>
@stop