@extends('layouts.admin')

@push('styles')
<link rel="stylesheet" href="{{ asset('plugins/datatables-bs4/css/dataTables.bootstrap4.min.css') }}">
<link rel="stylesheet" href="{{ asset('plugins/datatables-responsive/css/responsive.bootstrap4.min.css') }}">
<link rel="stylesheet" href="{{ asset('plugins/datatables-buttons/css/buttons.bootstrap4.min.css') }}">
<style type="text/css">
    .btn_mt {
        margin-top: 31px;
    }
</style>
@endpush

@section('content')

<!-- Main content -->
<section class="content">
    <div class="container-fluid pt-2">

        <div class="col-md-12">
            <!-- general form elements -->
            <div class="card card-info">

                <!-- form start -->
                <form method="GET" action="{{ route('ocbonus.index') }}">
                    <div class="card-body">

                        <div class="row">

                            <div class="col-sm-2">
                                <div class="form-group">
                                    <label for="bonus_id">Oc. Bonus Type</label>

                                    <select name="bonus_id" id="bonus_id" class="form-control form-control-sm select2" value=""
                                        style="width: 100%;" required>
                                        <option value="">Select Bonus</option>

                                        <option value="1" {{ isset($bonus_id) && ($bonus_id == 1) ? 'selected' : '' }}> Eid Ul Fitr </option>

                                        <option value="2" {{ isset($bonus_id) && ($bonus_id == 2) ? 'selected' : '' }}> Eid Ul Adha </option>
                                        <option value="3" {{ isset($bonus_id) && ($bonus_id == 3) ? 'selected' : '' }}> Encourage Bonus </option>


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


                            <div class="col-sm-2">
                                <div class="form-group">
                                    <label for="department_id">Department</label>

                                    <select name="department_id" id="department_id" class="form-control form-control-sm select2" value=""
                                        style="width: 100%;">
                                        <option value="">Select Department</option>
                                        @foreach ($departments as $v)
                                        <option value="{{ $v->id }}"
                                            {{ isset($department_id) && ($department_id == $v->id) ? 'selected' : '' }}>
                                            {{ $v->department_name }}
                                        </option>
                                        @endforeach

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

                            <div class="col-sm-2">
                                <div class="form-group">
                                    <label for="designation_id">Designation</label>

                                    <select name="designation_id" id="designation_id" class="form-control form-control-sm select2" value=""
                                        style="width: 100%;">
                                        <option value="">Select Designation</option>
                                        @foreach ($designations as $v)
                                        <option value="{{ $v->id }}"
                                            {{ isset($designation_id) && ($designation_id == $v->id) ? 'selected' : '' }}>
                                            {{ $v->designation }}
                                        </option>
                                        @endforeach

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

                            <div class="col-sm-2">
                                <div class="form-group">
                                    <label for="emp_id">Employee</label>

                                    <select id="emp_id" name="emp_id" class="form-control form-control-sm select2"
                                        value="" style="width: 100%;">
                                        <option value="">Select Employee</option>
                                        @foreach ($employees as $v)
                                        <option value="{{ $v->id }}"
                                            {{ isset($emp_id) && $emp_id == $v->id ? 'selected' : '' }}>
                                            {{ $v->emp_name }}
                                        </option>
                                        @endforeach

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

                            <div class="col-sm-2">
                                <div class="form-group">
                                    <label for="emp_id">Month:</label>

                                    <select class="form-control form-control-sm" id="month" name="month" required>

                                        @php

                                        $monthNames = [
                                        ["short" => "", "full" => "Select Month"],
                                        ["short" => "01", "full" => "January"],
                                        ["short" => "02", "full" => "February"],
                                        ["short" => "03", "full" => "March"],
                                        ["short" => "04", "full" => "April"],
                                        ["short" => "05", "full" => "May"],
                                        ["short" => "06", "full" => "June"],
                                        ["short" => "07", "full" => "July"],
                                        ["short" => "08", "full" => "August"],
                                        ["short" => "09", "full" => "September"],
                                        ["short" => "10", "full" => "October"],
                                        ["short" => "11", "full" => "November"],
                                        ["short" => "12", "full" => "December"],
                                        ];

                                        @endphp

                                        @foreach ($monthNames as $mon)
                                        <option value="{{ $mon['short'] }}" {{ isset($month) && ($mon['short'] == $month) ? 'selected' : '' }}>
                                            {{ $mon['full'] }}
                                        </option>
                                        @endforeach

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

                            <div class="col-sm-2">
                                <div class="form-group">
                                    <label for="emp_id">Year:</label>

                                    <select class="form-control form-control-sm" name="year" id="year" required>
                                        @php
                                        $startYear = 2023; // Change to your desired start year
                                        $endYear = date('Y'); // Current year
                                        @endphp

                                        @for ($yer = $endYear; $yer >= $startYear; $yer--)
                                        <option value="{{ $yer }}" {{ isset($year) && ($yer == $year ) ? 'selected' : '' }}>
                                            {{ $yer }}
                                        </option>
                                        @endfor
                                    </select>

                                </div>
                            </div>

                            <div class="col-sm-2">
                                <div class="form-group">
                                    <label for="search"></label>
                                    <button type="submit" class="btn btn-info btn-sm btn_mt">Search</button>
                                    <a href="{{ route('ocbonus.index') }}"
                                        class="btn btn-secondary btn-sm btn_mt">Refresh</a>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>

        <!-- /.card -->

        <div class="row">
            <!-- left column -->
            <div class="col-md-12">
                <div class="card card-info">
                    <div class="card-header">
                        <h3 class="card-title">Bonus Sheet</h3>
                    </div>


                    <form id="employeeForm" method="POST" action="{{ route('ocbonus.update') }}">

                        @csrf

                        <input type="hidden" value="{{ $month }}" id="salary_month" name="salary_month" required>
                        <input type="hidden" value="{{ $year }}" id="salary_year" name="salary_year" required>

                        <div class="card-body" style="padding: 0 20px;display: none;">
                            <div class="table-responsive">

                                <table class="table table-stripe">
                                    <tr>
                                        <td> Pay Date: </td>
                                        <td>
                                            <input type="date" class="form-control form-control-sm" name="pay_date" value="{{ old('pay_date.0') ? old('pay_date.0') : date('Y-m-d') }}" placeholder="Pay Date.." tabindex="1" required>
                                        </td>


                                        <td>Note: </td>
                                        <td>

                                            <textarea class="form-control" id="note" name="note" rows="1" placeholder="Note"></textarea>


                                        </td>


                                    </tr>

                                </table>

                            </div>
                        </div>

                        <div class="card-body">
                            <div class="table-responsive">
                                <table class="table table-bordered table-sm">
                                    <thead>
                                        <tr>
                                            <th>SL</th>
                                            <th>Emp.ID</th>

                                            <th>Entry Date</th>
                                            <th>Month & Year</th>

                                            <th>Emp.Name</th>
                                            <th>Department</th>
                                            <th>Designation</th>
                                            <th>Mobile No</th>
                                            <th>Joining Date </th>
                                            <th>BonusType</th>
                                            <th>Gross Salary</th>
                                            <th>Bonus(%)</th>
                                            <th>Bonus Amount</th>
                                            <th>Paid Date</th>
                                            <th> Action</th>

                                        </tr>

                                    </thead>
                                    <tbody>
                                        @if ( count($empList) > 0 )
                                        @php
                                        $sl = 1;

                                        @endphp

                                        @foreach ($empList as $key => $emp)


                                        @php

                                        $dpt_id = $emp->dpt_id;
                                        $designation_id = $emp->designation_id;
                                        $entrydate = $emp->entrydate;
                                        $salary_month = $emp->salary_month;
                                        $salary_year = $emp->salary_year;
                                        $pay_date = $emp->pay_date;
                                        $note = $emp->note;
                                        $emp_id = $emp->emp_id;
                                        $gross_salary = $emp->gross_salary;
                                        $bonus_per = $emp->bonus_per;

                                        $paid_date = Helper::dateFormate($emp->paid_date);


                                        $payable_net_salary = $emp->payable_net_salary;

                                        $payable_net_amt = $emp->payable_net_amt;


                                        $dateTime = DateTime::createFromFormat('!m', $emp->salary_month);

                                        $mont = $dateTime->format('F')

                                        @endphp


                                        <tr>

                                            <td>

                                                <input type="hidden" name="salary_id[]" value="{{ $emp->id }}">
                                                <input type="hidden" name="dpt_id[]" value="{{ $emp->dpt_id }}">
                                                <input type="hidden" name="designation_id[]" value="{{ $emp->designation_id }}">


                                                {{ $sl++ }}

                                            </td>

                                            <td> {{ $emp->empID }} </td>

                                            <td> {{ Helper::dateFormate($emp->entrydate) }} </td>
                                            <td> {{ $mont }}, {{ $emp->salary_year }} </td>

                                            <td>{{ $emp->emp_name }}</td>
                                            <td>{{ $emp->department_name }}</td>
                                            <td>{{ $emp->designation }}</td>
                                            <td>{{ $emp->phone }}</td>
                                            <td>{{ Helper::dateFormate($emp->joining_date) }}</td>


                                            <td>

                                                <select name="bonus_id[]" id="bonus_id" class="form-control form-control-sm select2" style="width: 100%;" readonly required>
                                                    <option value="">Select Bonus</option>

                                                    <option value="1" {{ isset($emp->bonus_id) && ($emp->bonus_id == 1) ? 'selected' : '' }}> Eid Ul Fitr </option>

                                                    <option value="2" {{ isset($emp->bonus_id) && ($emp->bonus_id == 2) ? 'selected' : '' }}> Eid Ul Adha </option>


                                                </select>

                                            </td>



                                            <td>
                                                <input type="hidden" name="gross_salary[]" class="gross_salary" value="{{ $emp->gross_salary }}">
                                                {{ $gross_salary }}
                                            </td>



                                            <td>

                                                <input type="number" style="width:80px" name="bonus_per[]" class="form-control form-control-sm bonus_per" value="{{$bonus_per}}">

                                            </td>


                                            <td style="width: 85px;">
                                                <input type="number" style="width: 85px" value="{{$payable_net_amt}}" class="form-control form-control-sm payable_net_amt" step="any" name="payable_net_amt[]" readonly>
                                            </td>


                                            <td>
                                                <input type="date" style="width: 120px" value="{{$paid_date}}" class="form-control form-control-sm paid_date" step="any" name="paid_date[]">
                                            </td>

                                            <td style="width:100px;display: inline-block;">
                                                <button type="button" data-salaryid="{{ $emp->id }}" class="remove btn btn-danger btn-sm"> X </button>

                                                <a href="{{ route('payslip.download2', $emp->id) }}" target="_blank" class="btn btn-success btn-sm float-right">Print</a>
                                            </td>

                                        </tr>
                                        @endforeach
                                        @endif
                                    </tbody>
                                </table>
                            </div>
                            <div class="row float-right">
                                <button type="submit" class="btn btn-info mt-3 mr-3">Update</button>
                            </div>
                        </div>
                        <!-- /.card-body -->
                    </form>

                </div>
            </div>
        </div>
    </div>
</section>
<!-- /.content -->
@endsection


@push('scripts')


<!--     <script src="{{ asset('plugins/datatables/jquery.dataTables.min.js') }}"></script>
    <script src="{{ asset('plugins/datatables-bs4/js/dataTables.bootstrap4.min.js') }}"></script>
    <script src="{{ asset('plugins/datatables-responsive/js/dataTables.responsive.min.js') }}"></script>

    <script src="{{ asset('plugins/datatables-responsive/js/responsive.bootstrap4.min.js') }}"></script>
    <script src="{{ asset('plugins/datatables-buttons/js/dataTables.buttons.min.js') }}"></script>
    <script src="{{ asset('plugins/datatables-buttons/js/buttons.bootstrap4.min.js') }}"></script>
    <script src="{{ asset('plugins/jszip/jszip.min.js') }}"></script>
    <script src="{{ asset('plugins/pdfmake/pdfmake.min.js') }}"></script>
    <script src="{{ asset('plugins/pdfmake/vfs_fonts.js') }}"></script>
    <script src="{{ asset('plugins/datatables-buttons/js/buttons.html5.min.js') }}"></script>
    <script src="{{ asset('plugins/datatables-buttons/js/buttons.print.min.js') }}"></script>
    <script src="{{ asset('plugins/datatables-buttons/js/buttons.colVis.min.js') }}"></script> -->


<script src="{{ asset('plugins/select2/js/select2.full.min.js') }}"></script>
<script src="{{ asset('plugins/moment/moment.min.js') }}"></script>
<script src="{{ asset('plugins/inputmask/jquery.inputmask.min.js') }}"></script>

@if(isset($month) && !empty($month) && isset($year) && !empty($year) )
<script type="text/javascript">
    function toggleDisable() {

        const selectEleMonth = document.getElementById('month');
        const selectEleYear = document.getElementById('year');
        selectEleMonth.disabled = !selectEleMonth.disabled;
        selectEleYear.disabled = !selectEleYear.disabled;
    }

    //toggleDisable();
</script>
@endif


<script type="text/javascript">
    // Function to calculate net salary
    function calculateNetSalary($row) {

        var gross_salary = parseFloat($row.find('.gross_salary').val()) || 0;
        var bonus_per = parseFloat($row.find('.bonus_per').val()) || 0;


        var payable_net_amt = (gross_salary * bonus_per) / 100;

        $row.find('.payable_net_amt').val(Math.round(Number(payable_net_amt.toFixed(2))));


        return true;


    }



    $(function() {

        //Initialize Select2 Elements
        // $('.select2').select2();
        $('.myselect2').select2();

        //Initialize Select2 Elements
        $('.select2bs4').select2({
            theme: 'bootstrap4'
        });


        $("#department_id").change(function() {

            if ($(this).val()) {

                let department_id = $(this).val();

                let route = "{{ route('emp.deptemp') }}";

                $("#designation_id").html('');

                $.get(route, {
                        department_id: department_id
                    })
                    .done(function(data) {

                        if (data) {

                            $("#designation_id").html(data);

                        }

                    });

            }

        });


        $("#designation_id").change(function() {

            if ($(this).val()) {

                let designation_id = $(this).val();

                let route = "{{ route('emp.disemp') }}";

                $("#emp_id").html('');

                $.get(route, {
                        designation_id: designation_id
                    })
                    .done(function(data) {

                        if (data) {

                            $("#emp_id").html(data);

                        }

                    });

            }

        });


        $(".remove").on("click", function() {

            let sel = this;

            if (confirm("Are you sure you want to remove this record?")) {

                if ($(sel).data('salaryid')) {

                    let salaryid = $(sel).data('salaryid');

                    let route = "{{route('ocbonus.destroy')}}";

                    $.get(route, {
                            salaryid: salaryid
                        })
                        .done(function(data) {

                            $(sel).closest('tr').remove();


                        });



                }

            }
        });

        $("#month, #year").change(function() {

            var month = $("#month").val();
            var year = $("#year").val();

            $("#salary_month").val(month);
            $("#salary_year").val(year);

        });


        $(document).on('select2:open', () => {
            document.querySelector('.select2-search__field').focus();
        });


        $(".absent").click(function() {

            $(this).select();
            $(this).focus();

        });



        $(".bonus_per").on("keyup", function() {

            var $row = $(this).closest('tr');

            calculateNetSalary($row);


        });




    });
</script>
@endpush