@extends('layouts.app')
@section('title', 'Leaves')
@section('content')
<div class="container page-content">
    <div class="row page-col">
        <div class="col-12">
            <h1 class="font-weight-bold typography-4 mb-0">Leaves</h1>
        </div>
    </div>
    <div class="row justify-content-center page-col">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <div class="row justify-content-between align-items-center">
                        <div class="col text-start">
                            <h1 class="font-weight-semibold typography-2 mb-0">{{ __('Leave Entitlements') }}</h1>
                        </div>
                        @if (!$user_leaves->isEmpty())
                            <div class="col text-end">
                                 <a class="btn btn-purple btn-custom" href="{{ route('leave-application-add-new') }}" role="button">Apply</a>
                            </div>
                        @endif
                    </div>
                    @if (Auth::user()->isDepartmentHead() || Auth::user()->isTeamLead() || Auth::user()->allowToViewAllLeaves())
                    <div class="row">
                        <div class="col-12 mt-3 mt-md-0">
                            <a class="btn btn-link" href="{{ route('view-member-leave-balance') }}" role="button">View Members Leave Balance</a>
                        </div>
                    </div>
                    @endif
                </div>
                <div class="card-body">
                    @if ($user_leaves->isEmpty())
                        <h4 class="typography-2 font-weight-semibold text-grey text-center mb-0">- N/A -</h4>
                    @else
                        <div class="table-responsive">
                            <table class="table valign-child-middle sortable">
                                <thead class="table-light">
                                    <tr>
                                        <th>Leave Name</th>
                                        <th></th>
                                        <th>Entitlement (Days)</th>
                                        <th>Used (Days)</th>
                                        <th>Balance (Days)</th>
                                        <th>Expired On</th>
                                    </tr>
                                </thead>
                                <tbody>
                                    @foreach ($user_leaves as $index => $user_leave)
                                        <tr>
                                            <td>
                                                <span class="fw-bold">{{ $user_leave->leave_name }}</span>
                                            </td>
                                            <td>
                                                @if( $user_leave->leave_name == 'Compassionate Leave' )
                                                    <span class="fa-layers fa-fw fs-3 me-2" data-bs-toggle="tooltip" data-bs-placement="right" data-bs-html="true" title="{{ $user_leave->description }}">
                                                        <i class="fas fa-circle text-main"></i>
                                                        <i class="fas fa-info fa-inverse text-white" data-fa-transform="shrink-8"></i>
                                                    </span>
                                                @elseif( $user_leave->leave_name == 'Annual Leave' )
                                                    <span class="fa-layers fa-fw fs-3 me-2" data-bs-toggle="tooltip" data-bs-placement="right" data-bs-html="true" title="{{ $user_leave->description }}">
                                                        <i class="fas fa-circle text-main"></i>
                                                        <i class="fas fa-info fa-inverse text-white" data-fa-transform="shrink-8"></i>
                                                    </span>
                                                @endif
                                            </td>
                                            <td>{{ $user_leave->total_entitlement }}</td>
                                            <td>{{ $user_leave->total_used }}</td>
                                            <td class="{{ $user_leave->balance == '-' ? '' : ( $user_leave->balance > 0 ? 'text-success ' : 'text-danger ' )}}fw-bold">
                                                {{ $user_leave->balance }}
                                            </td>
                                            <td>{{ $user_leave->expired_date }}</td>
                                        </tr>
                                    @endforeach
                                </tbody>
                            </table>
                        </div>
                    @endif
                </div>
            </div>
        </div>
    </div><!-- Leave Entitlements -->
    <div class="row justify-content-center page-col">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <div class="row justify-content-between align-items-center">
                        <div class="col-md-6 col-12">
                            <h1 class="font-weight-semibold typography-2 my-2">{{ __('Leave Applications') }}</h1>
                        </div>
                        @if($allow_multi_select)
                            <div class="col-md-6 col-12 text-md-end text-start">
                                <button class="me-1 btn btn-success btn-multi-select-leave text-white d-none" name="acknowledge" value="leave-acknowledge-all" id="leave-acknowledge-button" data-url="{{ route('leave-application-multi-selection') }}" data-type="leave">Acknowledge All</button>
                                <button class="me-1 btn btn-success btn-multi-select-leave text-white d-none" name="approve" value="leave-approve-all" id="leave-approve-button" data-url="{{ route('leave-application-multi-selection') }}" data-type="leave">Approve All</button>
                            </div>
                        @endif
                    </div>
                </div>
                <div class="card-body">
                    @include('public.table.leave-applications')
                </div>
                <div class="row justify-content-between align-items-center mt-3">
                    <div class="col text-center">
                         <a class="btn btn-outline-dark btn-custom" href="{{ route('leave-application-show-all') }}" role="button">Show History</a>
                    </div>
                </div>
            </div>
        </div>
    </div><!-- Leave Applications -->
    <div class="row justify-content-center page-col">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <div class="row justify-content-between align-items-center">
                        <div class="col-md-6 col-12">
                            <h1 class="font-weight-semibold typography-2 my-2">{{ __('Cancel Leave Applications') }}</h1>
                        </div>
                        @if($allow_multi_select)
                            <div class="col-md-6 col-12 text-md-end text-start">
                                <button class="me-1 btn btn-success btn-multi-select-leave text-white d-none" name="acknowledge" value="cancel-leave-acknowledge-all" id="cancel-acknowledge-button" data-url="{{ route('multi-selection-cancel-leave') }}" data-type="cancel-leave">Acknowledge All</button>
                                <button class="me-1 btn btn-success btn-multi-select-leave text-white d-none" name="approve" value="cancel-leave-approve-all" id="cancel-approve-button" data-url="{{ route('multi-selection-cancel-leave') }}" data-type="cancel-leave">Approve All</button>
                            </div>
                        @endif
                    </div>
                </div>
                <div class="card-body">
                    @include('public.table.cancel-leave-applications')
                </div>
                <div class="row justify-content-between align-items-center mt-3">
                    <div class="col text-center">
                         <a class="btn btn-outline-dark btn-custom" href="{{ route('show-all-cancel-leave') }}" role="button">Show History</a>
                    </div>
                </div>
            </div>
        </div>
    </div><!-- Cancel Leave Applications -->
    <div class="row justify-content-center page-col">
        <div class="col-12">
            <div class="card">
                <div class="card-header">
                    <div class="row justify-content-between align-items-center">
                        <div class="col-md-6 col-12">
                            <h1 class="font-weight-semibold typography-2 my-2">{{ __('Replacement Leave Applications') }}</h1>
                        </div>
                        <div class="col-md-6 col-12 text-md-end text-start">
                            @if($allow_multi_select)
                                <button class="me-1 btn btn-success btn-multi-select-leave text-white d-none" name="acknowledge" value="replacement-leave-acknowledge-all" id="replace-acknowledge-button" data-url="{{ route('replace-leave-application-multi-selection') }}" data-type="replacement-leave">Acknowledge All</button>
                                <button class="me-1 btn btn-success btn-multi-select-leave text-white d-none" name="approve" value="replacement-leave-approve-all" id="replace-approve-button" data-url="{{ route('replace-leave-application-multi-selection') }}" data-type="replacement-leave">Approve All</button>
                            @endif
                                <a class="btn btn-purple btn-custom" href="{{ route('replace-leave-application-add-new') }}" role="button">Apply</a>
                        </div>
                    </div>
                </div>
                <div class="card-body">
                    @include('public.table.replacement-leave-applications')
                </div>
                <div class="row justify-content-between align-items-center mt-3">
                    <div class="col text-center">
                         <a class="btn btn-outline-dark btn-custom" href="{{ route('replace-leave-application-show-all') }}" role="button">Show History</a>
                    </div>
                </div>
            </div>
        </div>
    </div><!-- Replacement Leave Applications -->
</div>

@push('js')
<script type="text/javascript">
    $(document).ready(function(){
        @if(app('request')->input('cancel') == '1')
            onCancelSuccess();
        @endif
        @if(app('request')->input('reject') == '1')
            onRejectSuccess();
        @endif
        @if(app('request')->input('replacement-cancel') == '1')
            onReplacementCancelSuccess();
        @endif
        @if(app('request')->input('replacement-reject') == '1')
            onReplacementRejectSuccess();
        @endif
    });

    function onCancelSuccess(){
        Swal.fire(
          'Cancelled!',
          'The leave application has been cancelled.',
          'success'
        )
    }

    function onRejectSuccess(){
        Swal.fire(
          'Rejected!',
          'The leave application has been rejected.',
          'success'
        )
    }

    function onReplacementCancelSuccess(){
        Swal.fire(
          'Cancelled!',
          'The replacement leave application has been cancelled.',
          'success'
        )
    }

    function onReplacementRejectSuccess(){
        Swal.fire(
          'Rejected!',
          'The replacement leave application has been rejected.',
          'success'
        )
    }
</script>
@endpush
@endsection