@extends('layouts.app')
@section('urlContent')
    @php
        if ($customer->headOffice) {
            $firmName = $customer->headOffice->office_name;
        } else {
            $firmName = $customer->branch->headOffice->office_name;
        }
    @endphp
@section('content')
    <div class="container-app">
        <ol class="orderedList mt-4 text-sm leading-6 lg:col-span-7 xl:col-span-8 w-full">
            @foreach ($demands as $demand)
                <li class="meetRow relative flex space-x-6 bg-theme_secondary_black rounded-3xl p-4 xl:p-6 mt-4">
                    @if ($demand?->tickets?->user->user_departman?->customer_user->roles[0]->name == 'Company')
                        <img src="{{ $demand?->tickets?->user->user_departman->customer_user->headOffice ? getCdnFile($demand?->tickets?->user->user_departman->customer_user->headOffice->office_logo) : getCdnFile($demand?->tickets?->user->branch->headOffice->office_logo) }}"
                            alt="" class="h-14 w-14 rounded-full object-cover cursor-pointer showImage">
                    @elseif ($demand?->tickets?->user->user_departman?->customer_user->roles[0]->name == 'Branch')
                        <img src="{{ $demand?->tickets?->user->user_departman->customer_user->branch ? getCdnFile($demand?->tickets?->user->user_departman->customer_user->branch->headOffice->office_logo) : getCdnFile($demand?->tickets?->user->branch->headOffice->office_logo) }}"
                            alt="" class="h-14 w-14 rounded-full object-cover cursor-pointer showImage">
                    @endif
                    <a href="{{ route('operation.appvoredDemandPersonels', ['customer' => $customer->id, 'department' => $department->id, 'demand' => $demand->id, 'date' => $date]) }}"
                        class="w-full">
                        <div class="flex-auto">
                            <h3 class="pr-10 font-semibold text-gray-300 xl:pr-0">
                                {{ $demand->tickets->user->user_departman->name }}</h3>
                            <dl class="mt-2 flex flex-col text-gray-400 3xl:flex-row">
                                <div class="flex items-start space-x-3">
                                    <dt class="mt-0.5"><span class="sr-only">Date</span><svg class="h-5 w-5 fill-gray-400"
                                            xmlns="http://www.w3.org/2000/svg" viewBox="0 0 20 20" fill="currentColor"
                                            aria-hidden="true">
                                            <path class="fill-gray-300" fill-rule="evenodd"
                                                d="M5.75 2a.75.75 0 01.75.75V4h7V2.75a.75.75 0 011.5 0V4h.25A2.75 2.75 0 0118 6.75v8.5A2.75 2.75 0 0115.25 18H4.75A2.75 2.75 0 012 15.25v-8.5A2.75 2.75 0 014.75 4H5V2.75A.75.75 0 015.75 2zm-1 5.5c-.69 0-1.25.56-1.25 1.25v6.5c0 .69.56 1.25 1.25 1.25h10.5c.69 0 1.25-.56 1.25-1.25v-6.5c0-.69-.56-1.25-1.25-1.25H4.75z"
                                                clip-rule="evenodd"></path>
                                        </svg></dt>
                                    <dd><time class="text-gray-300"
                                            datetime="{{ \Carbon\Carbon::parse($demand?->tickets?->date)->isoFormat('D MMMM Y') }}">{{ \Carbon\Carbon::parse($demand?->tickets?->date)->isoFormat('D MMMM Y') }}
                                            Saat {{ date('H:i', strtotime($demand->hour)) }}
                                        </time>
                                    </dd>
                                </div>
                                <div
                                    class="mt-2 flex items-center space-x-3 3xl:mt-0 3xl:ml-3.5 3xl:border-l 3xl:border-gray-400 3xl:border-opacity-50 3xl:pl-3.5">
                                    <dt class="card-list-icon-area"><span class="sr-only">Adres</span><svg
                                            class="fill-gray-300" xmlns="http://www.w3.org/2000/svg" height="1em"
                                            viewBox="0 0 448 512">
                                            <path
                                                d="M224 256A128 128 0 1 0 224 0a128 128 0 1 0 0 256zm-45.7 48C79.8 304 0 383.8 0 482.3C0 498.7 13.3 512 29.7 512H418.3c16.4 0 29.7-13.3 29.7-29.7C448 383.8 368.2 304 269.7 304H178.3z">
                                            </path>
                                        </svg></dt>
                                    <dd class="text-gray-300">{{ $demand->quantity }}
                                        {{ $demand->categories->title }}</dd>
                            </dl>
                        </div>
                    </a>
                    <div class="flex gap-4 items-center text-gray-300 capitalize">
                        @php
                            if ($customer->headOffice) {
                                $securityMail = $customer->headOffice->security_mail;
                            } else {
                                $securityMail = $customer->branch->security_mail;
                            }
                        @endphp
                        <button data-add-service="{{ $demand->id }}" data-service="{{ $demand->service_unit }}"
                            class="button-3 bg-yellow-600 whitespace-nowrap">
                            <i class="fa-solid fa-bus"></i>
                            Servis Ekle
                        </button>
                        @if ($securityMail)
                            <form method="POST" action="{{ route('operation.sendMail', ['demand' => $demand->id]) }}"
                                onsubmit="showLoading()">
                                @csrf
                                <button class="button-3 bg-lime-700">
                                    <i class="fa-solid fa-share"></i>
                                    Paylaş
                                </button>
                            </form>
                        @endif
                    </div>
                </li>
            @endforeach
        </ol>
    </div>
    <x-popup-modal id="servicePopup">
        <x-slot name="message">Servis Ekleyin</x-slot>
        <x-slot name="content">
            <form action="{{ route('operation.serviceCreate') }}" method="POST" onsubmit="showLoading()">
                @csrf
                <div class="flex flex-col gap-4">
                    <input type="hidden" name="demand_id" id="demand_id" value="">
                    <label class="text-gray-300 font-medium text-left">
                        Servis Adedi Giriniz
                    </label>
                    <input class="input-2" type="number" name="service_unit" id="serviceUnit">
                </div>
                <div class="flex justify-center items-center gap-4 mt-4">
                    <button type="button" data-modal-hide="servicePopup"
                        class="closePopupModal inline-flex justify-center gap-2 items-center w-32 p-2 rounded text-gray-300 focus:ring-red-900 focus:ring-4 font-semibold bg-red-700">
                        <i class="fa-solid fa-xmark"></i>
                        Vazgeç
                    </button>
                    <button
                        class="inline-flex justify-center gap-2 items-center w-32 p-2 rounded text-gray-300 focus:ring-green-900 focus:ring-4 font-semibold bg-green-700">
                        <i class="fa-solid fa-check"></i>
                        Onayla
                    </button>
                </div>
            </form>
        </x-slot>
    </x-popup-modal>
    @if ($errors->any())
        @include('components.error-modal-second')
    @endif
    @if (session('error'))
        @include('components.error-modal')
    @endif
    @if (session('success'))
        @include('components.success-modal')
    @endif
    @include('components.showImage')
@endsection
@section('javascript')
    <script>
        $('[data-add-service]').click(function() {
            var demandId = $(this).data('add-service');
            var serviceUnit = $(this).data('service');
            $('#serviceUnit').val(serviceUnit);
            $('#demand_id').val(demandId);
            $('#servicePopup').show();
        });
    </script>
@endsection