@extends('employee.employee-layouts.master')

@section('content')
    <div class="container-fluid">
        <div class="row">
            <div class="col-md-12">
                <div class="card card-success mb-2">
                    {{-- <div class="card-header bg-primary text-white">
                        <h4 class="card-title mb-0">{{ __('Attendance') }}</h4>
                    </div> --}}
                    <div class="card-body row">
                        <div class="col-lg-6">
                            <div class="card card-success mb-2">
                                <div class="card-header bg-primary text-white">
                                    <h4 class="card-title mb-0">{{ __('File Shareing Reports') }}</h4>
                                </div>
                                <div class="card-body">

                                    <ul class="list-group">
                                        <a href='/sending/files'
                                            class="list-group-item d-flex justify-content-between align-items-center list-group-item-action">
                                            Sent Files
                                            <span class="badge badge-primary badge-pill">{{ $send_file }}</span>
                                        </a>
                                        <a href="/receiving/files"
                                            class="list-group-item d-flex justify-content-between align-items-center list-group-item-action">
                                            Recieved Files
                                            <span class="badge badge-primary badge-pill">{{ $recieve_file }}</span>
                                        </a>



                                    </ul>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-6">
                            <div class="card card-success mb-2">
                                <div class="card-header bg-primary text-white">
                                    <h4 class="card-title mb-0">{{ __('Tasks') }}</h4>
                                </div>
                                <div class="card-body">

                                    <ul class="list-group">
                                        <a href="/employee/tasks"
                                            class="list-group-item d-flex justify-content-between align-items-center list-group-item-action">
                                            In Progress
                                            <span
                                                class="badge badge-primary badge-pill">{{ Auth::user()->tasks->where('status', 'inprogress')->count() }}</span>
                                        </a>
                                        <a href="/employee/tasks"
                                            class="list-group-item d-flex justify-content-between align-items-center list-group-item-action">
                                            To Do
                                            <span
                                                class="badge badge-primary badge-pill">{{ Auth::user()->tasks->where('status', 'todo')->count() }}</span>
                                        </a>
                                        <a href="/employee/tasks"
                                            class="list-group-item d-flex justify-content-between align-items-center list-group-item-action">
                                            Complete
                                            <span
                                                class="badge badge-primary badge-pill">{{ Auth::user()->tasks->where('status', 'finished')->count() }}</span>
                                        </a>
                                    </ul>
                                </div>
                            </div>
                        </div>


                        <div class="col-lg-12">
                            <div class="card card-success mb-2">
                                <div class="card-header bg-primary text-white">
                                    <h4 class="card-title mb-0">{{ __('Latest Reports') }}</h4>
                                </div>
                                <div class="card-body">

                                    <ul class="list-group">
                                        @forelse($latest_reports as $report)
                                            <a href="{{ route('employee.report.download', $report->id) }}"
                                                class="list-group-item d-flex justify-content-between align-items-center list-group-item-action">
                                                {{ $report->title }}
                                                <span class="badge badge-primary badge-pill">{{ $report->submit_year }},
                                                    {{ getMonth($report->submit_month) }}</span>
                                            </a>
                                        @empty
                                        @endforelse


                                    </ul>
                                </div>
                            </div>
                        </div>

                        <div class="col-lg-12">
                            <div class="card card-success mb-2">
                                <div class="card-header bg-primary text-white">
                                    <h4 class="card-title mb-0">{{ __('Event Calendar') }}</h4>
                                </div>
                                <div class="card-body">

                                    <div class="container">

                                        <div id='calendar'></div>
                                    </div>


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


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


        </div>
    </div>
@endsection

@push('style')
    {{-- /* This styles belongs to Calenndar */ --}}
    <style>
        .fc-content {
            background: #607fd7 !important;
            color: #fff;
            border-color: #6c757d !important
        }
        
        .fc-content {
          white-space: normal !important;
          align-items: normal !important;
        }

        .fc-title {
            font-size: 14px;
        }

        @media (max-width: 575.98px) {

            .m-text {
                font-size: 1.5rem;
            }

            h2 {
                font-size: 1.5rem;
            }
        }
    </style>
@endpush
@push('script')
    {{-- This js belongs to Calendar --}}

    <script>
        'use strict'
        $(document).ready(function() {

            var SITEURL = "{{ url('/') }}";

            $.ajaxSetup({
                headers: {
                    'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
                }
            });


            var calendar = $('#calendar').fullCalendar({
                editable: true,
                events: SITEURL + "/employee/fullcalender",
                displayEventTime: false,
                editable: false,
                eventRender: function(event, element, view) {
                    if (event.allDay === 'true') {
                        event.allDay = true;
                    } else {
                        event.allDay = false;
                    }
                },
                selectable: false,
                selectHelper: true,

            });

        });



        function displayMessage(message) {
            toastr.success(message, 'Event');
            location.reload();
        }
    </script>
@endpush