@php
    use App\Models\Employee;
@endphp

@extends('layouts.backend.index')
@section('title', $label)

@section('content')
    <div class="card">
        <div class="card-body">
            <x-section-header action="show" :icon="$icon" :label="$label" hr-class="mb-4" />

            <h4>
                <i class="mdi mdi-calendar-today-outline text-primary"></i>
                &nbsp;{{ Common::dateFormat($payroll->years . '-' . $payroll->months . '-01', 'mmmm yyyy') }}
            </h4>


            <div class="table-responsive mt-3">
                <table class="table table-striped" id="table-detail">
                    <thead>
                        <tr>
                            <th class="text-center" style="width: 50px;">No</th>
                            <th class="text-left">Nama Karyawan</th>
                            <th class="text-right">Gaji </th>
                            <th class="text-right">Gaji Lembur</th>
                            <th class="text-right">Uang Makan</th>
                            <th class="text-right">Potongan</th>
                            <th class="text-right">Total</th>
                            <th class="text-left">Catatan</th>
                            <th class="text-right">Slip Gaji</th>

                        </tr>
                    </thead>
                    <tbody>
                        @php
                            $salary_daily = 0;
                            $salary_overtime = 0;
                            $allowance_meal = 0;
                            $salary_cuts = 0;
                            $total = 0;
                            $pph = 0;
                        @endphp
                        @foreach ($details->get() as $key => $detail)
                            <tr>
                                <td>{{ $key + 1 }}</td>
                                <td>{{ $detail->employee->name }}</td>
                                <td class="text-right">{{ number_format($detail->salary, 0, ',', '.') }}</td>
                                <td class="text-right">{{ number_format($detail->salary_overtime, 0, ',', '.') }}</td>
                                <td class="text-right">{{ number_format($detail->allowance_meal, 0, ',', '.') }}</td>
                                <td class="text-right">{{ number_format($detail->salary_cuts, 0, ',', '.') }}</td>
                                <td class="text-right" id="total-{{ $detail->employee_id }}"
                                    data-total="{{ $detail->total }}">{{ number_format($detail->total, 0, ',', '.') }}</td>
                                <td>{{$detail->notes}}
                                </td>
                                <td class="text-right"><a href="{{route('finance.payroll.pdf',$detail->encrypted_id)}}" class="btn btn-success btn-xs set-tooltip mr-1" title="Slip Gaji">
                                    <i class="mdi mdi-cash-multiple"></i></td>

                            </tr>
                            @php
                                $salary_daily += $detail->salary;
                                $salary_overtime += $detail->salary_overtime;
                                $allowance_meal += $detail->allowance_meal;
                                $salary_cuts += $detail->salary_cuts;
                                $total += $detail->total;
                                $pph += $detail->pph;
                            @endphp
                        @endforeach
                    </tbody>
                    <tfoot>
                        <tr>
                            <td colspan="2" class="text-right"><b>Total</b></td>
                            <td class="text-right"><b>{{ number_format($salary_daily, 0, '', '.') }}</b></td>
                            <td class="text-right"><b>{{ number_format($salary_overtime, 0, '', '.') }}</b>
                            </td>
                            <td class="text-right"><b>{{ number_format($allowance_meal, 0, '', '.') }}</b>
                            </td>
                            <td class="text-right"><b>{{ number_format($salary_cuts, 0, '', '.') }}</b>
                            </td>
                            <td class="text-right text-primary"><b id="grand-total" data-total="{{$total}}">{{ number_format($total, 0, '', '.') }}</b>
                            </td>
                            <td class="text-right text-primary"><b>&nbsp;</b>
                            </td>
                        </tr>
                    </tfoot>
                </table>
            </div>


        </div>
    </div>
@endsection

@push('scripts')
    <script>
        $(document).ready(function() {
            $(".nominal-mask").inputmask({
                alias: "nominal"
            })

            $(".salary-cuts").on('blur', function() {
                let data = $(this).data();
                let val = $(this).val();

                val = (val == "") ? 0 : val.replace(/\./g, "")
                let totalData = $("#total-" + data.employee).data();
                let total = totalData.total - val;

                $("#total-" + data.employee).html(moneyFormat(total));

                let sum = 0;
                $('.salary-cuts').each(function() {
                    let v = $(this).val();
                    v = (v == "") ? 0 : v.replace(/\./g, "")
                    sum += parseFloat(v);
                });

                $("#total-salary-cuts").html(moneyFormat(sum));

                let grandTotal = $("#grand-total").data();
                grandTotal = grandTotal.total - sum;
                $("#grand-total").html(moneyFormat(grandTotal));
            })
        })
    </script>
@endpush