@extends('layout.app')
@section('title')
    {{ __('بيانات البرنامج') }}
@stop


@section('css')
    <link rel="stylesheet" type="text/css" href="{{ asset('app-assets/fonts/font-awesome/css/font-awesome.min.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('app-assets/vendors/css/extensions/jstree.min.css') }}">
    <!-- BEGIN: Page CSS-->
    <link rel="stylesheet" type="text/css" href="{{ asset('app-assets/css-rtl/core/menu/menu-types/vertical-menu.css') }}">
    <link rel="stylesheet" type="text/css"
        href="{{ asset('app-assets/css-rtl/plugins/extensions/ext-component-tree.css') }}">
    <link rel="stylesheet" type="text/css" href="{{ asset('app-assets/css-rtl/pages/app-file-manager.css') }}">
    <!-- END: Page CSS-->
@endsection

@section('content')

    <div class="content-wrapper">

        <div class="content-body">
            <!-- users edit start -->
            <section class="app-user-edit">
                {{-- <x-alert /> --}}
                <!-- users edit account form start -->

                <div class="card">
                    <div class="card-body invoice-padding pb-0">
                        <!-- Header starts -->
                        <div class="invoice-spacing mt-0">
                            <div class="row flex justify-content-between mb-3">
                                <div class="logo-wrapper col-md-6 col-sm-6">
                                    <h3 class="text-primary invoice-logo">بيانات البرنامج</h3>

                                </div>
                                @if (count($activity->images) != 0 && count($activity->tools) != 0 && count($activity->studyPlans) != 0)
                                    <div class="logo-wrapper col-md-6 text-md-right col-sm-6">
                                        <a href="{{ route('activities.pdf', $activity->id) }}" class="btn btn-primary"
                                            target="__blank">تصدير PDF</a>
                                    </div>
                                @endif

                            </div>
                            <div class="row">
                                <div class="col-md-5 mt-50">
                                    <div class="row">
                                        <div class="col-6">
                                            <h4 class="mb-2">اسم البرنامج:</h4>
                                        </div>
                                        <div class="col-6">
                                            <p class="card-text mb-25">{{ $activity->name }}</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-5 mt-50">
                                    <div class="row">
                                        <div class="col-6">
                                            <h4 class="mb-2">مستوى البرنامج:</h4>
                                        </div>
                                        <div class="col-6">
                                            <p class="card-text mb-25"><i data-feather="star"></i>
                                                {{ $activity->level ?? 'لم يتم التقييم' }}</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-2">
                                    @if ($activity->status == 1)
                                        <h4 class="mb-2 badge badge-pill badge-light-success"
                                            style="font-size: 16px; padding: 10px 20px;">مستمر</h4>
                                    @elseif(Carbon\Carbon::now()->format('Y-m-d') < $activity->start_date)
                                        <h4 class="mb-2 badge badge-pill badge-light-primary"
                                            style="font-size: 16px; padding: 10px 20px;">قادم</h4>
                                    @elseif (Carbon\Carbon::now()->format('Y-m-d') >= $activity->start_date &&
                                            Carbon\Carbon::now()->format('Y-m-d') <= $activity->end_date)
                                        <h4 class="mb-2 badge badge-pill badge-light-warning"
                                            style="font-size: 16px; padding: 10px 20px;">قائم</h4>
                                    @elseif (Carbon\Carbon::now()->format('Y-m-d') > $activity->end_date && $activity->is_active == 1)
                                        <h4 class="mb-2 badge badge-pill badge-light-success"
                                            style="font-size: 16px; padding: 10px 20px;">منفذ</h4>
                                    @elseif (Carbon\Carbon::now()->format('Y-m-d') > $activity->end_date && $activity->is_active == 0)
                                        <h4 class="mb-2 badge badge-pill badge-light-danger"
                                            style="font-size: 16px; padding: 10px 20px;">لم ينفذ</h4>
                                    @elseif (Carbon\Carbon::now()->format('Y-m-d') > $activity->end_date && $activity->is_active == 2)
                                        <h4 class="mb-2 badge badge-pill badge-light-secondary"
                                            style="font-size: 16px; padding: 10px 20px;">منتهي</h4>
                                    @endif
                                </div>
                                {{-- <div class="col-md-4 mt-50">
                                        <div class="row">
                                            <div class="col-6">
                                                <h4 class="mb-2">العام الدراسي:</h4>
                                            </div>
                                            <div class="col-6">
                                                <p class="card-text mb-25">{{ $activity->year->school_year ?? 'لم يحدد' }}</p>
                                            </div>
                                        </div>
                                    </div> --}}
                                <div class="col-md-4 mt-50">
                                    <div class="row">
                                        <div class="col-6">
                                            <h4 class="mb-2">المستهدفون:</h4>
                                        </div>
                                        <div class="col-6">
                                            <p class="card-text mb-25">{{ $activity->targeted->name ?? 'لم يحدد' }}</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-4 mt-50">
                                    <div class="row">
                                        <div class="col-8">
                                            <h4 class="mb-2">عدد المستهدفون:</h4>
                                        </div>
                                        <div class="col-4">
                                            <p class="card-text mb-25">{{ $activity->targeted_num ?? 'لم يحدد' }}</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6 mt-50">
                                    <div class="row">
                                        <div class="col-4">
                                            <h4 class="mb-2">تاريخ البداية:</h4>
                                        </div>
                                        <div class="col-8">
                                            <p class="card-text mb-25">
                                                {{ Alkoumi\LaravelHijriDate\Hijri::Date('Y/m/d', Carbon\Carbon::parse($activity->start_date)->format('d-m-Y')) }}
                                            </p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6 mt-50">
                                    <div class="row">
                                        <div class="col-4">
                                            <h4 class="mb-2">تاريخ النهاية:</h4>
                                        </div>
                                        <div class="col-8">
                                            <p class="card-text mb-25">
                                                {{ Alkoumi\LaravelHijriDate\Hijri::Date('Y/m/d', Carbon\Carbon::parse($activity->end_date)->format('d-m-Y')) }}
                                            </p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6 mt-50">
                                    <div class="row">
                                        <div class="col-4">
                                            <h4 class="mb-2">المجال:</h4>
                                        </div>
                                        <div class="col-8">
                                            <p class="card-text mb-25">
                                                {{ $activity->detailedTarget->generalObjective->department->name ?? 'لم يتم اختيار المجال' }}
                                            </p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6 mt-50">
                                    <div class="row">
                                        <div class="col-4">
                                            <h4 class="mb-2">الهدف العام:</h4>
                                        </div>
                                        <div class="col-8">
                                            <p class="card-text mb-25">
                                                {{ $activity->detailedTarget->generalObjective->name ?? 'لم يتم اختيار الهدف العام' }}
                                            </p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6 mt-50">
                                    <div class="row">
                                        <div class="col-4">
                                            <h4 class="mb-2">الهدف التفصيلي:</h4>
                                        </div>
                                        <div class="col-8">
                                            <p class="card-text mb-25">{{ $activity->detailedTarget->name ?? '-------' }}
                                            </p>
                                        </div>
                                    </div>
                                </div>
                                <div class="col-md-6 mt-50">
                                    <div class="row">
                                        <div class="col-4">
                                            <h4 class="mb-2">المنفذ:</h4>
                                        </div>
                                        <div class="col-8">
                                            <p class="card-text mb-25">{{ $activity->user->name }}</p>
                                        </div>
                                    </div>
                                </div>
                            </div>

                        </div>
                        <!-- Header ends -->
                    </div>

                    <hr class="invoice-spacing" />

                    <div class="card-body invoice-padding pb-50 pt-50">
                        <!-- Header starts -->
                        <div class="d-flex justify-content-between flex-md-row flex-column invoice-spacing mt-0">
                            <div>
                                <div class="logo-wrapper">
                                    <h3 class="text-primary invoice-logo">الخطة التنفيذية</h3>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- Invoice Description starts -->
                    <div class="table-responsive mb-2">
                        <table class="table">
                            <thead>
                                <tr>
                                    <th class="py-1">اسم الفقرة</th>
                                    <th class="py-1">التاريخ</th>
                                    <th class="py-1">الوقت</th>
                                    <th class="py-1">المنفذ</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse ($activity->studyPlans as $item)
                                    <tr @if ($loop->last) class="border-bottom" @endif>
                                        <td class="py-1">
                                            <p class="card-text font-weight-bold mb-25">{{ $item->name }}</p>
                                        </td>
                                        <td class="py-1">
                                            <span
                                                class="font-weight-bold">{{ Alkoumi\LaravelHijriDate\Hijri::Date('Y/m/d', $item->date) }}</span>
                                        </td>
                                        <td class="py-1">
                                            <span class="font-weight-bold">{{ $item->from_time }}</span>
                                        </td>
                                        <td class="py-1">
                                            <span class="font-weight-bold">{{ $item->teamWork->name }}</span>
                                        </td>
                                    </tr>
                                @empty
                                    <tr class="border-bottom">
                                        <td colspan="11" class="text-center"> لم يتم وضع الخطة</td>
                                    </tr>
                                @endforelse

                            </tbody>
                        </table>
                    </div>

                    <hr class="invoice-spacing" />

                    <div class="card-body invoice-padding pb-50 pt-50">
                        <!-- Header starts -->
                        <div class="d-flex justify-content-between flex-md-row flex-column invoice-spacing mt-0">
                            <div>
                                <div class="logo-wrapper">
                                    <h3 class="text-primary invoice-logo">الادوات والمتطلبات</h3>
                                </div>
                            </div>
                        </div>
                    </div>
                    <!-- Invoice Description starts -->
                    <div class="table-responsive mb-2">
                        <table class="table">
                            <thead>
                                <tr>
                                    <th class="py-1">الاداة</th>
                                    <th class="py-1">الكمية</th>
                                </tr>
                            </thead>
                            <tbody>
                                @forelse ($activity->tools as $item)
                                    <tr @if ($loop->last) class="border-bottom" @endif>
                                        <td class="py-1">
                                            <p class="card-text font-weight-bold mb-25">{{ $item->name }}</p>
                                        </td>

                                        <td class="py-1">
                                            <span class="font-weight-bold">{{ $item->quentity }}</span>
                                        </td>
                                    </tr>
                                @empty
                                    <tr class="border-bottom">
                                        <td colspan="11" class="text-center"> لا يوجد</td>
                                    </tr>
                                @endforelse
                            </tbody>
                        </table>
                    </div>

                    @if (count($activity->images) != 0)
                        <hr class="invoice-spacing" />

                        <div class="card-body invoice-padding pb-1 pt-50">
                            <!-- Header starts -->
                            <div class="d-flex justify-content-between flex-md-row flex-column invoice-spacing mt-0 pb-1">
                                <div>
                                    <div class="logo-wrapper">
                                        <h3 class="text-primary invoice-logo">صور وفعاليات البرنامج</h3>
                                    </div>
                                </div>
                            </div>

                            <div class="row">
                                @forelse($activity->images as $value)
                                    <div class="col-md-6 col-xl-6" id="{{ $value->image }}">
                                        <div class="card border-0 text-white">
                                            <img class="card-img" src="{{ asset('storage/activities/' . $value->image) }}"
                                                alt="Card image">

                                        </div>
                                    </div>
                                @empty
                                @endforelse

                            </div>
                        </div>
                    @endif

                </div>

                @if (count($activity->files) != 0)

                    <div class="card">
                        <div class="card-header">
                            <div class="d-flex justify-content-between flex-md-row flex-column invoice-spacing mt-0">
                                <div>
                                    <div class="logo-wrapper">
                                        <h3 class="text-primary invoice-logo">الملفات</h3>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="card-body invoice-padding pb-50 pt-50">
                            <!-- drives area starts-->
                            <div class="row">
                                @foreach ($activity->files as $file)
                                    <div class="col-lg-2 col-md-4 col-12">
                                        <a href="{{ asset('storage/' . $file->file) }}" target="_blank">
                                            <div class="card shadow-none border cursor-pointer"
                                                style="text-align: center;">
                                                <div class="card-body">
                                                    <img src="{{ asset('app-assets/images/icons/file-icons/pdf.png') }}"
                                                        alt="google drive" height="38">
                                                    <div class="my-1">
                                                        <h5>{{ $file->name }}</h5>
                                                    </div>
                                                </div>
                                            </div>
                                        </a>
                                    </div>
                                @endforeach
                            </div>
                            <!-- drives area ends-->
                        </div>


                    </div>
                @endif

                </form>
            </section>
            <!-- users edit ends -->

        </div>
    </div>
@endsection


@section('js')

    <script src="{{ asset('app-assets/js/scripts/pages/app-file-manager.js') }}"></script>

    <script src="{{ asset('app-assets/vendors/js/extensions/jstree.min.js') }}"></script>
@stop