@extends('layouts.app')

@section('headScripts')

@endsection

@section('content')

    {{--İŞLEV ÇUBUĞU--}}
    <header class="bg-gradient-to-b from-stone-100 to-white shadow tracking-tight">
        <div class="lg:divide-y lg:divide-gray-200">
            <nav class="hidden lg:flex divide-x" aria-label="Global">
                <div class="bg-gradient-to-b from-stone-600 to-stone-500 ps-2.5 pe-4 py-1.5 text-sm text-stone-50 shadow-sm rounded-e-2xl">{{ $company->name }}</div>
                <a href="#" type="button" class="px-3.5 py-1.5 text-sm text-stone-500 hover:bg-stone-100 transition-all">İletişim</a>
                <a href="#" type="button" class="px-3.5 py-1.5 text-sm text-stone-500 hover:bg-stone-100 transition-all">Teklif</a>
                <a href="#" type="button" class="px-3.5 py-1.5 text-sm text-stone-500 hover:bg-stone-100 transition-all">Ayarlar</a>
            </nav>
        </div>
    </header>

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

                    {{--BREADCRUMB--}}
                    <nav class="flex py-2" aria-label="Breadcrumb">
                        <ol role="list" class="flex uppercase items-center space-x-4">
                            <li>
                                <div>
                                    <a href="{{ route('dashboard') }}" class="text-stone-400 hover:text-stone-500">
                                        <svg class="h-5 w-5 flex-shrink-0" viewBox="0 0 20 20" fill="currentColor" aria-hidden="true">
                                            <path fill-rule="evenodd"
                                                  d="M9.293 2.293a1 1 0 011.414 0l7 7A1 1 0 0117 11h-1v6a1 1 0 01-1 1h-2a1 1 0 01-1-1v-3a1 1 0 00-1-1H9a1 1 0 00-1 1v3a1 1 0 01-1 1H5a1 1 0 01-1-1v-6H3a1 1 0 01-.707-1.707l7-7z"
                                                  clip-rule="evenodd"/>
                                        </svg>
                                        <span class="sr-only">Home</span>
                                    </a>
                                </div>
                            </li>
                            <li>
                                <div class="flex items-center">
                                    <svg class="h-5 w-5 flex-shrink-0 text-stone-300" fill="currentColor" viewBox="0 0 20 20" aria-hidden="true">
                                        <path d="M5.555 17.776l8-16 .894.448-8 16-.894-.448z"/>
                                    </svg>
                                    <a href="{{ route('companies.index') }}" class="ml-4 text-sm font-medium text-stone-500 hover:text-stone-700">İŞLETMELER</a>
                                </div>
                            </li>
                            <li>
                                <div class="flex items-center">
                                    <svg class="h-5 w-5 flex-shrink-0 text-stone-300" fill="currentColor" viewBox="0 0 20 20" aria-hidden="true">
                                        <path d="M5.555 17.776l8-16 .894.448-8 16-.894-.448z"/>
                                    </svg>
                                    <a href="#" class="ml-4 text-sm font-medium text-stone-500 hover:text-stone-700" aria-current="page">{{ $company->name }}</a>
                                </div>
                            </li>
                        </ol>
                    </nav>

                    <div class="grid gap-4 lg:col-start-1 lg:col-end-3">
                        {{--SAYFA BAŞLIĞI--}}
                        <div class="overflow-hidden rounded-lg bg-white ring-1 ring-stone-300 shadow">
                            <h2 class="sr-only" id="profile-overview-title">Profile Overview</h2>
                            <div class="bg-white p-6">
                                <div class="sm:flex sm:items-center sm:justify-between">
                                    <div class="sm:flex sm:space-x-5">
                                        <div class="flex-shrink-0 rounded-full pattern-charlie-emerald">
                                            <span class="inline-flex h-20 w-20 items-center justify-center rounded-full bg-stone-50 ring-1 ring-stone-200">
                                                @if( $company->shortname )
                                                    <span class="text-3xl font-medium leading-none text-stone-600">{{ $company->shortname }}</span>
                                                @else
                                                    <span class="text-3xl font-medium leading-none text-stone-600">{{ \Illuminate\Support\Str::limit($company->name, 3, '') }}</span>
                                                @endif
                                            </span>
                                        </div>
                                        <div class="mt-4 text-center sm:mt-0 sm:pt-1 sm:text-left w-full">
                                            <p class="text-sm font-medium text-emerald-600">İşletme</p>
                                            <p class="text-xl truncate uppercase font-bold text-gray-900 sm:text-2xl">{{ $company->name }}</p>
                                        </div>
                                    </div>
                                    <div class="mt-5 flex gap-3 justify-center sm:mt-0">

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

                        @if(!is_null($deals) && count($deals) > 0)
                            <div class="p-4 bg-white ring-1 ring-stone-300 rounded-lg shadow">
                                <h2 class="flex items-center text-lg font-jbmono-bold leading-6 text-stone-700 mb-4">
                                    <span class="material-symbols-rounded mr-1">
                                        stylus_note
                                    </span>
                                    ANLAŞMALAR
                                </h2>
                                @livewire('deals', ['deals' => $deals, 'filter' => $company->id])

                            </div>
                        @endif
                        @if(!is_null($offers) && count($offers) > 0)
                            <div class="p-4 bg-white ring-1 ring-stone-300 rounded-lg shadow">
                                <h2 class="flex items-center text-lg font-jbmono-bold leading-6 text-stone-700 mb-4">
                                    <span class="material-symbols-rounded mr-1">
                                        article
                                    </span>
                                    TEKLİFLER
                                </h2>
                                @livewire('offer-status', ['offers' => $offers, 'filter' => $company->id])
                            </div>
                        @endif

                        @if(!is_null($opportunities) && count($opportunities) > 0)
                            <div class="p-4 bg-white ring-1 ring-stone-300 rounded-lg shadow">
                                <h2 class="flex items-center text-lg font-jbmono-bold leading-6 text-stone-700 mb-4">
                                    <span class="material-symbols-rounded mr-1">
                                        hov
                                    </span>
                                    İLETİŞİMLER
                                </h2>
                                @livewire('opportunities', ['opportunities' => $opportunities, 'filter' => $company->id])
                            </div>
                        @endif

                    </div>

                    {{--SAĞ PANEL--}}
                    <div class="p-4 grid grid-cols-1 gap-4 shadow bg-white ring-1 ring-stone-400/20 sm:mx-0 sm:rounded-lg lg:col-start-3">
                        {{--OTOMATİK EPOSTA--}}
                        <div>
                            <h2 class="flex items-center text-lg font-jbmono-bold leading-6 text-stone-700">
                                <span class="material-symbols-rounded mr-1">
                                    mail
                                </span>
                                Otomatik E-posta
                            </h2>
                            <div class="rounded-md bg-stone-50 pattern-charlie-brown ring-1 ring-inset ring-stone-200 p-4 mt-2 sm:flex sm:items-start sm:justify-between">
                                <div class="sm:flex sm:items-start">
                                <span class="material-symbols-rounded mr-1">
                                    update
                                </span>
                                    <div class="mt-3 sm:mt-0 sm:ml-4">
                                        <div class="text-lg font-medium text-stone-900">30 gün</div>
                                        <div class="mt-1 text-sm text-stone-600 sm:flex sm:items-center tracking-tight">
                                            <div>İşletmenin bakiyesi varsa ve son tahsilatın üzerinden 30 gün geçmiş ise otomatik bakiye hatırlatma epostası gönderiliyor.</div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>

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

@endsection

@section('scripts')

@endsection