<div class="row">
    <div class="container">
        <ol class="breadcrumb">
            <li><a href="#">اداره الموظفين</a></li>
            <li class="active">حضور الموظفين</li>
        </ol>
        <div class="panel panel-default panel-m">
            <!-- Default panel contents -->
            <div class="panel-heading">
                <h3 class="panel-title">حضور الموظفين</h3>
                <a href="{$youtubes[175]->url}" target="_blank" class="hidden-print"><img
                        src="../views/default/assets/img/youtube.png" class="pull-left" alt="Youtube"
                        style="width: 2%;"></a>
            </div>
            <div class="panel-body">
                <form class="form-inline hidden-print" method="post" action="?do=show">
                    <div class="form-group">
                        <label class="sr-only">التاريخ</label>
                        <input type="text" class="form-control awdatepicker" autocomplete="off"
                            data-date-format="yyyy-mm-dd" name="date" id="date" value="{$date}" readonly>
                    </div>

                    <label for="txtSearch"></label>

                    <button type="submit" class="btn btn-primary">بحث</button>
                </form>
                <hr />

                {if isset($employees)}
                <br />
                <table class="table table-black dataTableClass">
                    <thead>
                        <tr>
                            <th>#</th>
                            <th>الموظف</th>
                            <th>وقت الحضور</th>
                            <th>وقت الانصراف</th>
                        </tr>
                    </thead>
                    <tbody>
                        {assign var=i value=1}
                        {foreach $employees as $emp}
                        <tr>
                            <td>{$i}</td>
                            <td>{$emp->employeeName}</td>
                            <td><input type="time" name="attend_time{$i}" data-type="attend"
                                    class="form-control updateTime" data-empid="{$emp->employeeId}" value="{$emp->attendanceData[0]->attendanceTime}" /></td>
                            <td><input type="time" name="departure_time{$i}" data-type="depart"
                                    class="form-control updateTime" data-empid="{$emp->employeeId}" value="{$emp->attendanceData[0]->departureTime}" /></td>
                        </tr>
                        {assign var=i value=$i+1}
                        {/foreach}

                </table>
                {/if}

            </div>
        </div>
    </div>
</div>

{literal}
<script>
    $('.updateTime').on('change', function () {
        var value = $(this).val();
        var type = $(this).data('type');
        var empid = $(this).data('empid');
        var date = $('#date').val();
        $.post('?do=addTime', { value: value, type: type, date: date, empid: empid }, function (data) {
            console.log(data);
        });
    });
</script>
{/literal}