@extends('app')
@section('content')
    <!-- Content Header (Page header) -->
    <section class="content-header">
        <h1>
            <b>{{ $employeeName }}</b> 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 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>Payment Id</th>
                                <th>Payment Amount</th>
                                <th>Date</th>
                            </tr>
                            </thead>
                            <tbody>
                            @if(count($paymentRecord) > 0)
                                @foreach($paymentRecord as $key => $record)
                                    <tr>
                                        <td>{{ $record->payment_id }}</td>
                                        <td>{{ $record->payment_amount }}</td>
                                        <td>{{ $record->payment_date }}</td>
                                    </tr>
                                @endforeach
                            @endif
                            </tbody>
                            <tfoot>
                            <tr>
                                <th>Payment Id</th>
                                <th>Payment Amount</th>
                                <th>Date</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