@extends('layouts.app')

@section('content')

<div class="">

    @include('components.notification')

    <main>
        <div class="w-full px-4 pb-60">
            <div
                class="grid items-start max-w-2xl grid-cols-1 grid-rows-1 gap-4 mx-auto lg:mx-0 lg:max-w-none lg:grid-cols-3">

                <div class="gap-4 lg:col-span-2 lg:row-span-2 lg:row-end-2">
                    {{--SAYFA İŞLEMLERİ--}}
                    <div
                        class="p-4 mx-auto bg-white shadow ring-1 ring-stone-300 sm:mx-0 sm:rounded-lg lg:col-span-2 lg:row-span-2 lg:row-end-2">
                        <div class="grid grid-cols-1 gap-5 sm:grid-cols-2 lg:grid-cols-3">
                            <!-- MÜŞTERİLER -->
                            <div
                                class="overflow-hidden transition-all bg-white rounded-lg shadow ring-1 ring-emerald-200 hover:ring-emerald-400 hover:shadow-xl">
                                <div class="p-5 transition-all bg-emerald-100/40 hover:bg-emerald-100 hover:shadow-2xl">
                                    <div class="flex items-center">
                                        <div class="flex-shrink-0">
                                            <span class="text-4xl material-symbols-rounded text-emerald-600">
                                                store
                                            </span>
                                        </div>
                                        <a href="{{ route('companies.clients') }}" class="flex-1 w-0 ml-5">
                                            <dl>
                                                <dt class="text-sm font-medium truncate text-emerald-600">{{
                                                    $count_clients }}</dt>
                                                <dd>
                                                    <div class="text-xl font-bold text-emerald-600">MÜŞTERİLER</div>
                                                </dd>
                                            </dl>
                                        </a>
                                    </div>
                                </div>
                                <div
                                    class="px-5 py-3 transition-all bg-emerald-50 hover:bg-emerald-100 hover:shadow-2xl">
                                    @include('sideovers.new-client')
                                </div>
                            </div>
                            <!-- TEDARİKÇİLER -->
                            <div
                                class="overflow-hidden transition-all bg-white rounded-lg shadow ring-1 ring-amber-200 hover:ring-amber-400 hover:shadow-xl">
                                <div class="p-5 transition-all bg-amber-100/40 hover:bg-amber-100 hover:shadow-2xl">
                                    <div class="flex items-center">
                                        <div class="flex-shrink-0">
                                            <span class="text-4xl material-symbols-rounded text-amber-600">
                                                help_clinic
                                            </span>
                                        </div>
                                        <a href="{{ route('companies.suppliers') }}" class="flex-1 w-0 ml-5">
                                            <dl>
                                                <dt class="text-sm font-medium truncate text-amber-600">{{
                                                    $count_suppliers }}</dt>
                                                <dd>
                                                    <div class="text-xl font-bold text-amber-600">TEDARİKÇİLER</div>
                                                </dd>
                                            </dl>
                                        </a>
                                    </div>
                                </div>
                                <div class="px-5 py-3 transition-all bg-amber-50 hover:bg-amber-100 hover:shadow-2xl">
                                    @include('sideovers.new-supplier')
                                </div>
                            </div>
                            <!-- KİŞİLER -->
                            <div
                                class="overflow-hidden transition-all rounded-lg shadow ring-1 ring-slate-200 hover:ring-slate-400 hover:shadow-xl">
                                <div class="p-5 transition-all bg-slate-100/40 hover:bg-slate-100 hover:shadow-2xl">
                                    <div class="flex items-center">
                                        <div class="flex-shrink-0">
                                            <span class="text-4xl material-symbols-rounded text-slate-600">
                                                person
                                            </span>
                                        </div>
                                        <a href="" class="flex-1 w-0 ml-5">
                                            <dl>
                                                <dt class="text-sm font-medium truncate text-slate-600">0</dt>
                                                <dd>
                                                    <div class="text-xl font-bold text-slate-600">KİŞİLER
                                                        <span class="text-xs font-normal text-slate-400">YAKINDA</span>
                                                    </div>
                                                </dd>
                                            </dl>
                                        </a>
                                    </div>
                                </div>
                                <div class="px-5 py-3 transition-all bg-slate-50 hover:bg-slate-100 hover:shadow-2xl">
                                    <div class="text-sm">
                                        <a href="#" class="font-medium text-slate-600">+ Yeni Oluştur</a>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                    {{--YENİ EKLENEN HESAPLAR--}}
                    <div class="p-4 mt-4 bg-white rounded-lg shadow ring-1 ring-stone-300">
                        <h2 class="flex items-center mb-3 text-lg leading-6 font-jbmono-bold text-stone-700">
                            <span class="mr-1 material-symbols-rounded">
                                apartment
                            </span>
                            Son Eklenen İşletmeler
                        </h2>
                        <div class="grid grid-cols-2 gap-5 lg:grid-cols-4">
                            <ul class="flex gap-2">
                                @foreach($last_companies as $company)
                                <li
                                    class="text-xs tracking-tight transition-all rounded-lg bg-slate-100/40 max-w-48 hover:bg-slate-100 hover:shadow-2xl ring-1 ring-slate-200">
                                    <a href="{{ route('companies.show', $company->slug) }}"
                                        class="flex items-center justify-between flex-1 px-2 truncate">
                                        <div class="flex-1 truncate py-1.5 mr-3">
                                            <p class="font-medium text-gray-900 uppercase truncate">{{ $company->name }}
                                            </p>
                                        </div>
                                        <div class="flex-shrink-0 font-bold">
                                            <p>{{ number_format($company->getCompanyBalance(), 0, ',', '.') }}<span
                                                    class="pl-0.5">₺</span></p>
                                        </div>
                                    </a>
                                </li>
                                @endforeach
                            </ul>
                        </div>
                    </div>

                    {{--BAKİYESİ OLANLAR--}}
                    @if(count($clients) > 0 || count($suppliers) > 0)
                    <div class="p-4 mt-4 bg-white rounded-lg shadow ring-1 ring-stone-300">
                        <h2 class="flex items-center mb-2 text-lg leading-6 font-jbmono-bold text-stone-700">
                            <span class="mr-1 material-symbols-rounded">
                                receipt_long
                            </span>
                            Bakiyesi Olanlar
                        </h2>
                        <div class="grid grid-cols-1 sm:grid-cols-2 gap-x-8">
                            <ul role="list" class="divide-y divide-gray-100">
                                <h2 class="my-2 font-medium leading-6 text-md text-emerald-600">Müşteriler</h2>
                                @foreach($clients as $client)
                                <a href="{{ route('companies.show', $client->slug) }}"
                                    class="flex items-center justify-start py-2 transition-all gap-x-4 hover:bg-stone-50 hover:ring-1 hover:ring-stone-200 hover:px-2 hover:-mx-2 hover:shadow hover:rounded-xl">
                                    <div class="flex-none">
                                        <span
                                            class="inline-flex items-center justify-center w-10 h-10 rounded-full bg-emerald-50 ring-1 ring-emerald-100">
                                            <span class="font-bold text-emerald-500">{{ mb_substr($client->name, 0, 3,
                                                'UTF-8') }}</span>
                                        </span>
                                    </div>
                                    <div class="min-w-0 grow">
                                        <div class="flex items-start gap-x-3">
                                            <p class="text-sm font-semibold leading-6 text-gray-900 uppercase truncate">
                                                {{ $client->name }}</p>
                                        </div>
                                        <div class="text-xs leading-5 text-gray-500 gap-y-2">
                                            @if($client->getCompanyLastPaidDate($client->id) == null &&
                                            $client->getCompanyLastInvoiceDate($client->id) > 10)
                                            <div class="flex items-center text-xs whitespace-nowrap text-rose-400">
                                                <span
                                                    class="text-sm material-symbols-rounded text-rose-400">priority_high</span>
                                                <p class="text-rose-400">hiç tahsilat yapılmadı</p>
                                            </div>
                                            @endif
                                            @if($client->getCompanyLastPaidDate($client->id) > 30)
                                            <div class="flex items-center text-xs whitespace-nowrap text-amber-400">
                                                <span
                                                    class="text-sm material-symbols-rounded text-amber-400">priority_high</span>
                                                <p class="text-amber-400">geciken tahsilat</p>
                                            </div>
                                            @endif
                                            @if($client->hasInvoiceAddress() == 0)
                                            <div class="flex items-center text-xs whitespace-nowrap text-stone-400">
                                                <span
                                                    class="text-sm material-symbols-rounded text-stone-400">priority_high</span>
                                                <p class="text-stone-400">fatura adresi yok</p>
                                            </div>
                                            @endif
                                        </div>
                                    </div>
                                    <div class="items-center flex-none">
                                        <p class="font-semibold text-gray-900 sm:block">
                                            {{ number_format($client->getCompanyBalance(), 2, ',', '.') }}<span
                                                class="pl-0.5">₺</span>
                                        </p>
                                    </div>
                                </a>
                                @endforeach
                            </ul>
                            <ul role="list" class="divide-y divide-gray-100">
                                <h2 class="my-2 font-medium leading-6 text-md text-amber-600">Tedarikçiler</h2>
                                @foreach($suppliers as $supplier)
                                <a href="{{ route('companies.show', $supplier->slug) }}"
                                    class="flex items-center justify-start py-2 transition-all gap-x-4 hover:bg-stone-50 hover:ring-1 hover:ring-stone-100 hover:px-2 hover:-mx-2 hover:shadow hover:rounded-xl">
                                    <div class="flex-none">
                                        <span
                                            class="inline-flex items-center justify-center w-10 h-10 rounded-full bg-amber-50 ring-1 ring-amber-100">
                                            <span class="font-bold text-amber-500">{{ mb_substr($supplier->name, 0, 3,
                                                'UTF-8') }}</span>
                                        </span>
                                    </div>
                                    <div class="min-w-0 grow">
                                        <div class="flex items-start gap-x-3">
                                            <p class="text-sm font-semibold leading-6 text-gray-900 uppercase truncate">
                                                {{ $supplier->name }}</p>
                                        </div>
                                        <div class="text-xs leading-5 text-gray-500 gap-x-2">
                                            @if($supplier->getCompanyLastPaidDate($supplier->id) == null &&
                                            $supplier->getCompanyLastInvoiceDate($supplier->id) > 10)
                                            <div class="flex items-center text-xs whitespace-nowrap text-rose-400">
                                                <span
                                                    class="text-sm material-symbols-rounded text-rose-400">priority_high</span>
                                                <p class="text-rose-400">hiç ödeme yapılmadı</p>
                                            </div>
                                            @endif
                                            @if($supplier->getCompanyLastPaidDate($supplier->id) > 30)
                                            <div class="flex items-center text-xs whitespace-nowrap text-amber-400">
                                                <span
                                                    class="text-sm material-symbols-rounded text-amber-400">priority_high</span>
                                                <p class="text-amber-400">geciken ödeme</p>
                                            </div>
                                            @endif
                                            @if($supplier->hasInvoiceAddress() == 0)
                                            <div class="flex items-center text-xs whitespace-nowrap text-stone-400">
                                                <span
                                                    class="text-sm material-symbols-rounded text-stone-400">priority_high</span>
                                                <p class="text-stone-400">fatura adresi yok</p>
                                            </div>
                                            @endif
                                        </div>
                                    </div>
                                    <div class="items-center flex-none">
                                        <p class="font-semibold text-gray-900 sm:block">
                                            {{ number_format($supplier->getCompanyBalance(), 2, ',', '.') }}<span
                                                class="pl-0.5">₺</span>
                                        </p>
                                    </div>
                                </a>
                                @endforeach
                            </ul>
                        </div>
                    </div>
                    @else
                    <div class="p-4 mt-4 rounded-md bg-blue-50 ring-1 ring-blue-300">
                        <div class="flex">
                            <div class="flex-shrink-0">
                                <svg class="w-5 h-5 text-blue-400" viewBox="0 0 20 20" fill="currentColor"
                                    aria-hidden="true">
                                    <path fill-rule="evenodd"
                                        d="M18 10a8 8 0 11-16 0 8 8 0 0116 0zm-7-4a1 1 0 11-2 0 1 1 0 012 0zM9 9a.75.75 0 000 1.5h.253a.25.25 0 01.244.304l-.459 2.066A1.75 1.75 0 0010.747 15H11a.75.75 0 000-1.5h-.253a.25.25 0 01-.244-.304l.459-2.066A1.75 1.75 0 009.253 9H9z"
                                        clip-rule="evenodd" />
                                </svg>
                            </div>
                            <div class="flex-1 ml-3 md:flex md:justify-between">
                                <p class="text-sm text-blue-700">Bakiyesi olan işletme bulunmuyor.</p>
                                <p class="mt-3 text-sm md:ml-6 md:mt-0">
                                </p>
                            </div>
                        </div>
                    </div>
                    @endif
                </div>

                {{--BU GUN - AKTIVITELER--}}
                <div class="p-4 bg-white shadow ring-1 ring-stone-400/20 sm:mx-0 sm:rounded-lg lg:col-start-3">
                    <!-- Activity feed -->
                    <h2 class="flex items-center text-lg leading-6 font-jbmono-bold text-stone-700">
                        <span class="mr-1 material-symbols-rounded">
                            bolt
                        </span>
                        Aktiviteler
                    </h2>
                    <ul role="list" class="mt-6 space-y-6">

                        @forelse($companies_activity as $activity)
                        @if($activity->type == 'new' || 'update')
                        <li class="relative flex gap-x-4">
                            @if(!$loop->last)
                            <div class="absolute top-0 left-0 flex justify-center w-6 -bottom-6">
                                <div class="w-px bg-gray-200"></div>
                            </div>
                            @endif
                            <div class="relative flex items-center justify-center flex-none w-6 h-6 bg-white">
                                <div class="h-1.5 w-1.5 rounded-full bg-gray-100 ring-1 ring-gray-300"></div>
                            </div>
                            <p class="flex-auto py-0.5 text-xs leading-5 text-gray-500">
                                <span class="font-medium text-gray-900">{{ $activity->user->name }}</span>
                                <br>{{ $activity->content }}
                            </p>
                            <time datetime="2023-01-23T10:32"
                                class="flex-none py-0.5 text-xs leading-5 text-gray-500">{{
                                $activity->created_at->diffForHumans() }}
                            </time>
                        </li>
                        @elseif($activity->type == 'action')
                        <li class="relative flex gap-x-4">
                            @if(!$loop->last)
                            <div class="absolute top-0 left-0 flex justify-center w-6 -bottom-6">
                                <div class="w-px bg-gray-200"></div>
                            </div>
                            @endif
                            <img src="https://images.unsplash.com/photo-1550525811-e5869dd03032?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=facearea&facepad=2&w=256&h=256&q=80"
                                alt="" class="relative flex-none w-6 h-6 mt-3 rounded-full bg-gray-50">
                            <div class="flex-auto p-3 rounded-md bg-stone-50 ring-1 ring-inset ring-gray-200">
                                <div class="flex justify-between gap-x-4">
                                    <div class="py-0.5 text-xs leading-5 text-gray-500">
                                        <span class="font-medium text-gray-900">{{ $activity->user->name }}</span>
                                        {{ $activity->content }}
                                    </div>
                                    <time datetime="2023-01-23T15:56"
                                        class="flex-none py-0.5 text-xs leading-5 text-gray-500">{{
                                        $activity->created_at->diffForHumans() }}
                                    </time>
                                </div>
                                <p class="text-sm leading-6 text-gray-500">{{ $activity->content }}</p>
                                <p class="text-xs leading-6 text-gray-400">#{{ $activity->company->name }}</p>
                            </div>
                        </li>
                        @elseif($activity->type == 'income')
                        <li class="relative flex gap-x-4">
                            @if(!$loop->last)
                            <div class="absolute top-0 left-0 flex justify-center w-6 -bottom-6">
                                <div class="w-px bg-gray-200"></div>
                            </div>
                            @endif
                            <div class="relative flex items-center justify-center flex-none w-6 h-6 bg-white">
                                <svg class="w-6 h-6 text-emerald-600" viewBox="0 0 24 24" fill="currentColor"
                                    aria-hidden="true">
                                    <path fill-rule="evenodd"
                                        d="M2.25 12c0-5.385 4.365-9.75 9.75-9.75s9.75 4.365 9.75 9.75-4.365 9.75-9.75 9.75S2.25 17.385 2.25 12zm13.36-1.814a.75.75 0 10-1.22-.872l-3.236 4.53L9.53 12.22a.75.75 0 00-1.06 1.06l2.25 2.25a.75.75 0 001.14-.094l3.75-5.25z"
                                        clip-rule="evenodd" />
                                </svg>
                            </div>
                            <p class="flex-auto py-0.5 text-xs leading-5 text-gray-500">
                                <span class="font-medium text-gray-900">{{ $activity->company->name }}</span>
                                {{ $activity->content }}
                            </p>
                            <time datetime="2023-01-24T09:20"
                                class="flex-none py-0.5 text-xs leading-5 text-gray-500">{{
                                $activity->created_at->diffForHumans() }}
                            </time>
                        </li>
                        @endif
                        @empty
                        @include('components.empty-plant', [
                        'title' => 'Henüz aktivite yok',
                        'content' => ''
                        ])
                        @endforelse

                    </ul>
                </div>

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

@endsection