@extends('app')
@section('content')
    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>
            <b>{{ $employeeName }}</b>Monthly Salary Record
        </h1>
        <ol class="breadcrumb">
            <li><a href="#"><i class="fa fa-dashboard"></i> Home</a></li>
            <li><a href="#">HR</a></li>
            <li class="active">Employee Monthly Salary List</li>
        </ol>
    </section>

    <!-- Main content -->
    <section class="content">
        <!-- SELECT2 EXAMPLE -->
        <div class="box box-info">
            <div class="box-header with-border">
            </div>
            <!-- /.box-header -->
            <div class="box-body">
                <div class="row">
                    <div class="col-md-12">
                        <table id="employeeSalaryDatatable" class="table table-bordered table-striped">
                            <thead>
                            <tr>
                                <th>Id</th>
                                <th>Amount</th>
                                <th>Month</th>
                                <th>Year</th>
                                <th>Status</th>
                            </tr>
                            </thead>
                            <tbody>
                            @if(count($monthlyRecord) > 0)
                                @foreach($monthlyRecord as $key => $record)
                                    <tr>
                                        <td>{{ $key + 1 }}</td>
                                        <td>{{ $record->amount }}</td>
                                        <td>{{ ($record->month_id == 1) ? 'January' :
                                         (($record->month_id == 2) ? 'February' :
                                          (($record->month_id == 3) ? 'March' :
                                           (($record->month_id == 4) ? 'April' :
                                            (($record->month_id == 5) ? 'May' :
                                             (($record->month_id == 6) ? 'June' :
                                              (($record->month_id == 7) ? 'July' :
                                               (($record->month_id == 8) ? 'August' :
                                                (($record->month_id == 9) ? 'September' :
                                                 (($record->month_id == 10) ? 'October' :
                                                  (($record->month_id == 11) ? 'November' : 'December')))))))))) }}</td>
                                        <td>{{ $record->year }}</td>
                                        <td>
                                            <label class="label label-success"
                                                   style="@if( $record->status == 0) display: none; @endif">
                                                Complete
                                            </label>
                                            <label class="label label-warning"
                                                   style="@if( $record->status == 1) display: none; @endif">
                                                Due
                                            </label>
                                        </td>
                                    </tr>
                                @endforeach
                            @endif
                            </tbody>
                            <tfoot>
                            <tr>
                                <th>Id</th>
                                <th>Amount</th>
                                <th>Month</th>
                                <th>Year</th>
                                <th>Status</th>
                            </tr>
                            </tfoot>

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

    </section>

@endsection
@section('script')
    <script type="text/javascript">
        $(document).ready(function () {
            $('#employeeSalaryDatatable')
                .addClass('nowrap')
                .dataTable({
                    columnDefs: [
                        {targets: [-1, -3], className: 'dt-body-right'}
                    ]
                });

        });

    </script>
@endsection