@extends('admin.layout.master')
@section('custom_style')
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.css">
@endsection
@section('home')

    <div class="card">
        <div class="card-header d-flex justify-content-between align-items-center">
            <div>
                <h5 class="font-weight-bold mb-0">early list</h5>
            </div>
            <div>
                <a href="{{route('early.create')}}" class="btn btn-sm btn-primary">Add early</a>
            </div>
        </div>
        <div class="card-body">
            <form id="filterform" class="d-flex flex-wrap" action="{{route('early.filter')}}" method="GET">
                <div class="col-12 col-md-4 mb-3 px-1">
                    <label for="">Employee code</label>
                    <input value="{{request('emp_code')}}" class="form-control" type="number" name="emp_code">
                </div>
                <div class="col-12 col-md-4 mb-3 px-1">
                    <label for="">Department</label>
                    <select class="form-control" name="department" id="">
                        <option disable selected value="">Select Dept.</option>

                        @foreach ($departments as $d)
                            <option
                                {{request('department') == $d->id ? 'selected' : ''}}
                                value="{{$d->id}}">{{$d->name}}</option>
                        @endforeach

                    </select>
                </div>
                <div class="col-12 col-md-4 mb-3 px-1">
                    <label for="">Approve Status</label>
                    <select class="form-control" name="approve_status" id="">
                        <option disable selected value="">--Select--</option>
                        <option {{request('approve_status') == 2 ? 'selected' : ''}} value="1">Approved</option>
                        <option {{request('approve_status') == 3 ? 'selected' : ''}} value="2">Rejected</option>
                        <option {{request('approve_status') == 1 ? 'selected' : ''}} value="3">Pending</option>
                    </select>
                </div>
                <div class="col-12 col-md-4 mb-3 px-1">
                    <label for="">From Date</label>
                    <input value="{{request('from_date')}}" class="form-control" type="date" name="from_date">
                </div>
                <div class="col-12 col-md-4 mb-3 px-1">
                    <label for="">To Date</label>
                    <input value="{{request('to_date')}}" class="form-control" type="date" name="to_date">
                </div>


                <div class="col-12 col-md-3 mb-3 px-1">
                    <button type="submit" class="btn w-100 btn-primary mt-4">Search</button>
                </div>
                <div class="col-12 col-md-1 mb-3 px-1">
                    <button class="empty btn w-100 btn-warning mt-4" type="button">Reset</button>
                </div>
            </form>
            <div>
                <table class="table table-hover table-bordered mt-3">
                    <thead class="thead-dark">
                    <tr>
                        <th>Emp Name</th>
                        <th>Emp Code</th>
                        <th>Dept.</th>
                        <th>early Date</th>
                        <th>Out Time</th>
                        <th>Purpose</th>
                        <th>Policy</th>
                        <th>Status</th>
                        <th>Action</th>
                    </tr>
                    </thead>
                    <tbody>
                    @if(!empty($earlys))
                        @foreach ($earlys as $l)
                            <tr>
                                <td>{{$l->empinfo->emp_name}}</td>
                                <td>{{$l->empinfo->emp_code}}</td>
                                <td>{{$l->empinfo->fetch_department->name}}</td>
                                <td>{{$l->date}}</td>
                                <td>{{$l->expected_out_time}}</td>
                                <td>{{$l->purpose}}</td>
                                <td>{{$l->fetch_policy_type->name}}</td>
                                <td>
                              <span class="{{
                                      $l->approve_status == 2 ? 'badge badge-success' :
                                      ($l->approve_status == 3 ? 'badge badge-danger' :

                                      ($l->approve_status == 1 ? 'badge badge-warning' : 'badge badge-secondary'

                                      ))
                                      }} px-2 py-1">

                                  {{   $l->approve_status == 2 ? 'Approved' :
                                      ($l->approve_status == 3 ? 'rejected' :
                                      ($l->approve_status == 1 ? 'pending' : 'unknown'
                                      ) )}}

                                  </span>
                                </td>
                                <td>
                                    @if ($l->approve_status == 1)
                                        @include('admin.mapping_blade.mapping', ['approve_status' => $l->approve_status, 'approvals' =>$l->approvals,'action_id'=>5,'cost_center_id'=>1,'item_id'=>$l->id,'model_name'=>"App\\\Models\\\Payroll\\\EarlyLate\\\PayEarlyLeave"])

                                        <button title="Reject early" type="button" data-toggle="tooltip"
                                                data-placement="top"
                                                onclick="earlyreject({{$l->id}})" class="btn btn-danger mr-1">
                                            <i class='bx bx-x'></i></button>

                                        @if(!($l->approvals && count($l->approvals->where('admin_id',active_user()))>0))
                                            <a target="_blank" title="Edit early" data-toggle="tooltip"
                                               data-placement="top"
                                               href="{{route('early.edit',[$l->id])}}" class="btn btn-primary mr-1">
                                                <i class="fadeIn animated bx bx-edit-alt"></i>
                                            </a>
                                        @endif
                                    @endif
                                    @if ($l->approve_status == 1 || $l->approve_status == 3)
                                        <a href="{{route('early.delete',['id'=>$l->id])}}" title="Delete"
                                           data-toggle="tooltip"
                                           onclick="return confirm('Early Leave Will Delete Permanently. Are You Sure?')"
                                           class="btn btn-danger btn-sm"><i class="fas fa-trash"></i></a>
                                    @endif
                                </td>
                            </tr>
                        @endforeach
                    @endif
                    </tbody>
                </table>
            </div>
        </div>
    </div>
@endsection


@section('script')
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-confirm/3.3.2/jquery-confirm.min.js"></script>

    <script>
        $(function () {
            $('[data-toggle="tooltip"]').tooltip()
        })

        // early aoorove start
        function earlyapprove(id) {
            $.confirm({
                title: 'Are you sure?',
                content: 'If you click approve then this early will on approve state',
                type: 'green',
                typeAnimated: true,
                buttons: {
                    tryAgain: {
                        text: 'Approve',
                        btnClass: 'btn-green',
                        action: function () {
                            window.location.href = '{{ route('early.approve') }}/' + id;
                        }
                    },
                    close: function () {
                    }
                }
            });
        }

        // early approve end


        // early reject start
        function earlyreject(id) {
            $.confirm({
                title: 'Are you sure?',
                content: 'If you click reject then this early will on reject state',
                type: 'red',
                typeAnimated: true,
                buttons: {
                    tryAgain: {
                        text: 'Reject',
                        btnClass: 'btn-red',
                        action: function () {
                            window.location.href = '{{ route('early.reject') }}/' + id;
                        }
                    },
                    close: function () {
                    }
                }
            });
        }

        // early reject end
        $(".empty").click(function () {

            $(this).closest('form').find("input[type=number], input[type=date], select").val("");
        });
    </script>

@endsection