@extends('layouts.app')

@section('content')

<div class="">
    <main>

        <div class="px-4 py-4 mx-auto sm:px-6 lg:px-8">

            {{-- BREADCRUMB --}}
            <nav class="flex pb-4" aria-label="Breadcrumb">
                <ol role="list" class="flex items-center space-x-4 uppercase">
                    <li>
                        <div>
                            <a href="{{ route('dashboard') }}" class="text-stone-400 hover:text-stone-500">
                                <svg class="flex-shrink-0 w-5 h-5" 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="flex-shrink-0 w-5 h-5 text-stone-500" 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">HESAPLAR</a>
                        </div>
                    </li>
                    <li>
                        <div class="flex items-center">
                            <svg class="flex-shrink-0 w-5 h-5 text-stone-500" 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.show', $invoice->company->slug) }}"
                                class="ml-4 text-sm font-medium text-stone-500 hover:text-stone-700"
                                aria-current="page">{{ $invoice->company->name }}</a>
                        </div>
                    </li>
                    <li>
                        <div class="flex items-center">
                            <svg class="flex-shrink-0 w-5 h-5 text-stone-500" 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">{{ $invoice->note }}</a>
                        </div>
                    </li>
                </ol>
            </nav>

            <div
                class="grid items-start grid-cols-1 grid-rows-1 mx-auto gap-x-8 gap-y-8 lg:mx-0 lg:max-w-none lg:grid-cols-3">

                <!-- SIDEBAR -->
                <div class="grid gap-y-4 lg:col-start-3 lg:row-end-1">

                    <div
                        class="flex flex-wrap items-center gap-2 p-4 bg-white rounded-lg shadow-sm ring-1 ring-stone-300">
                        {{-- YAZDIR --}}
                        <button onclick="printInvoice()" type="button"
                            class="inline-flex items-center px-4 py-2 text-xs font-semibold tracking-widest text-white uppercase transition duration-150 ease-in-out border border-transparent rounded-md bg-stone-800 hover:bg-stone-700 hover:ring-2 hover:ring-amber-400 hover:ring-offset-2 focus:bg-stone-700 active:bg-stone-900 focus:outline-none focus:ring-2 focus:ring-amber-500 focus:ring-offset-2">
                            YAZDIR
                        </button>
                        <x-a-black href="#" click="" type="button" ring="amber">
                            DÜZENLE
                        </x-a-black>
                        @include('modals.cancel', [
                        'title' => 'EFİŞ OLUŞTURULACAK',
                        'subtitle' => 'FİŞ silme işlemi geri alınamaz. Devam etmek istiyor musunuz?',
                        'route' => route('invoices.destroy', $invoice->id),
                        'button' => 'BELGEYİ SİL',
                        'cancel' => 'HAYIR, GERİ DÖN',
                        'confirm' => 'EVET, SİL'
                        ])
                    </div>

                    {{-- FİŞ BİLGİLERİ --}}
                    <div class="bg-white rounded-lg shadow-sm ring-1 ring-stone-300">
                        <dl class="flex flex-wrap">
                            <div class="flex-auto p-6">
                                <dt class="text-lg font-semibold text-stone-900">FİŞ BİLGİLERİ</dt>
                                <dd class="grid gap-1 mt-2 text-left text-stone-500 justify-items-start">
                                    <div class="flex flex-wrap items-center font-medium text-stone-900 gap-x-3">
                                        <label for="date"
                                            class="block text-sm font-medium leading-6 uppercase text-stone-500">İŞLETME</label>
                                        <span>{{ $invoice->company->name }}</span>
                                    </div>
                                    <div class="flex flex-wrap items-center font-medium text-stone-900 gap-x-3">
                                        <label for="date" class="block text-sm font-medium leading-6 text-stone-500">FİŞ
                                            TARİHİ</label>
                                        <span>{{ date('d.m.Y', strtotime($invoice->date)) }}</span>
                                    </div>
                                    <div class="flex flex-wrap items-center font-medium text-stone-900 gap-x-3">
                                        <label for="number"
                                            class="block text-sm font-medium leading-6 text-stone-500">FİŞ NO:</label>
                                        <span>{{ $invoice->number }}</span>
                                    </div>
                                    <div class="flex flex-wrap items-center font-medium text-stone-900 gap-x-3">
                                        <label for=""
                                            class="block text-sm font-medium leading-6 text-stone-500">ÖZELLEŞTİRME
                                            NO:</label>
                                        <span>TR.1.2</span>
                                    </div>
                                    <div class="flex flex-wrap items-center font-medium text-stone-900 gap-x-3">
                                        <label for=""
                                            class="block text-sm font-medium leading-6 text-stone-500">SENARYO:</label>
                                        <span>TEMELFİŞ</span>
                                    </div>
                                    <div class="flex flex-wrap items-center font-medium text-stone-900 gap-x-3">
                                        <label for="type" class="block text-sm font-medium leading-6 text-stone-500">FİŞ
                                            TİPİ:</label>
                                        <span>{{ $invoice->type }}</span>
                                    </div>
                                    <div class="flex flex-wrap items-center font-medium text-stone-900 gap-x-3">
                                        <label for="currency"
                                            class="block text-sm font-medium leading-6 text-stone-500">PARA
                                            BİRİMİ:</label>
                                        <span>{{ $invoice->currency }}</span>
                                    </div>
                                    @if($invoice->currency != 'TRL')
                                    <div class="flex flex-wrap items-center font-medium text-stone-900 gap-x-3">
                                        <label for="currency"
                                            class="block text-sm font-medium leading-6 text-stone-500">DÖVİZ
                                            KURU:</label>
                                        <span>{{ $invoice->ex_rate }} TRL</span>
                                    </div>
                                    @endif
                                    <div class="flex flex-wrap items-center font-medium text-stone-900 gap-x-3">
                                        <label for="" class="block text-sm font-medium leading-6 text-stone-500">FİŞ
                                            ALT TİPİ:</label>
                                        <span>-</span>
                                    </div>
                                    @if ($invoice->uuid != null)
                                    <div class="flex flex-wrap items-center font-medium text-stone-900 gap-x-3">
                                        <label for=""
                                            class="block text-sm font-medium leading-6 text-stone-500">UUID:</label>
                                        <span>{{ $invoice->uuid }}</span>
                                    </div>
                                    @endif
                                    @if ($invoice->belgeOid != null)
                                    <div class="flex flex-wrap items-center font-medium text-stone-900 gap-x-3">
                                        <label for=""
                                            class="block text-sm font-medium leading-6 text-stone-500">OID:</label>
                                        <span>{{ $invoice->belgeOid }}</span>
                                    </div>
                                    @endif
                                </dd>
                            </div>
                        </dl>
                    </div>

                    {{-- AKTİVİTELER --}}
                    <div class="bg-white rounded-lg shadow-sm ring-1 ring-stone-300">
                        <div class="p-6">
                            <div>
                                <h2 class="flex items-center text-lg leading-6 font-jbmono-bold text-stone-700">
                                    <span class="mr-1 material-symbols-rounded">
                                        history
                                    </span>
                                    Düzenleme Geçmişi
                                </h2>
                                <ul role="list" class="mt-6 space-y-6">
                                    <li class="relative flex gap-x-4">
                                        <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-stone-100 ring-1 ring-stone-300">
                                            </div>
                                        </div>
                                        <p class="flex-auto py-0.5 text-xs leading-5 text-stone-500">
                                            <span class="font-medium text-stone-900">{{ $invoice->user->name }}</span>
                                            <br>Belgeyi oluşturdu.
                                        </p>
                                        @if($invoice->created_at)
                                        <time datetime="{{ $invoice->created_at->toDateTimeString() }}"
                                            class="flex-none py-0.5 text-xs leading-5 text-stone-500">{{
                                            $invoice->created_at->diffForHumans() }}
                                        </time>
                                        @endif
                                    </li>
                                </ul>
                            </div>
                        </div>
                    </div>

                </div>

                <!-- FİŞ İÇERİĞİ -->
                <div id="invoice"
                    class="px-4 py-8 -mx-4 bg-white shadow-sm ring-1 ring-stone-300 sm:mx-0 sm:rounded-lg sm:px-8 sm:pb-14 lg:col-span-2 lg:row-span-2 lg:row-end-2 xl:px-16 xl:pb-20 xl:pt-16">

                    @if($invoice->type == 'sales_receipt')
                    <h2 class="text-2xl font-black leading-6 text-emerald-600">SATIŞ FİŞİ</h2>
                    @elseif($invoice->type == 'purchase_receipt')
                    <h2 class="text-2xl font-black leading-6 text-rose-600">ALIŞ FİŞİ</h2>
                    @endif
                    @if($invoice->deleted_at != null)
                    <div class="p-4 mt-4 border-l-4 border-rose-400 bg-rose-50 rounded-r-xl">
                        <div class="flex">
                            <div class="flex-shrink-0">
                                <svg class="w-5 h-5 text-rose-400" viewBox="0 0 20 20" fill="currentColor"
                                    aria-hidden="true">
                                    <path fill-rule="evenodd"
                                        d="M8.485 2.495c.673-1.167 2.357-1.167 3.03 0l6.28 10.875c.673 1.167-.17 2.625-1.516 2.625H3.72c-1.347 0-2.189-1.458-1.515-2.625L8.485 2.495zM10 5a.75.75 0 01.75.75v3.5a.75.75 0 01-1.5 0v-3.5A.75.75 0 0110 5zm0 9a1 1 0 100-2 1 1 0 000 2z"
                                        clip-rule="evenodd" />
                                </svg>
                            </div>
                            <div class="ml-3">
                                <p class="text-sm text-rose-700">
                                    Bu belge {{ $invoice->deleted_at->diffForHumans() }} silindi.
                                </p>
                            </div>
                        </div>
                    </div>
                    @endif
                    <dl class="grid grid-cols-1 mt-6 text-sm leading-6 sm:grid-cols-2">
                        <div class="pt-6 mt-6 border-t border-gray-900/5 sm:pr-4">
                            <dt class="text-lg font-bold text-stone-400">DÜZENLEYEN</dt>
                            @if($invoice->type == 'sales_receipt')
                            <dd class="mt-2 text-gray-500 uppercase">
                                <span class="font-medium text-gray-900">{{ $invoice_address->title }}</span>
                                <p class="text-sm leading-6 text-gray-500">
                                    {{ $invoice_address->line_1 }} {{ $invoice_address->line_2 }}</p>
                                <p class="text-sm leading-6 text-gray-500">
                                    {{ $invoice_address->district}}{{ $invoice_address->city != "" ?
                                    '/'.$invoice_address->city :
                                    ""}}{{
                                    $invoice_address->country != "" ? '/'.$invoice_address->country : "" }}{{
                                    $invoice_address->zip != "" ? ' -
                                    PK.'.$invoice_address->zip : "" }}</p>
                                <p class="text-sm leading-6 text-gray-500">
                                    {{ $invoice_address->tax_office != "" ? 'VD.'. $invoice_address->tax_office : ""
                                    }}{{
                                    $invoice_address->vat_number != "" ? ' - VN.'. $invoice_address->vat_number : ""}}
                                </p>
                            </dd>
                            @else
                            @if($customer_address)
                            <dd class="mt-2 text-gray-500 uppercase">
                                <span class="font-medium text-gray-900">{{ $customer_address->title }}</span>
                                <p class="text-sm leading-6 text-gray-500">
                                    {{ $customer_address->line_1 }} {{ $customer_address->line_2 }}</p>
                                <p class="text-sm leading-6 text-gray-500">
                                    {{ $customer_address->district}}{{ $customer_address->city != "" ?
                                    '/'.$customer_address->city :
                                    ""}}{{
                                    $customer_address->country != "" ? '/'.$customer_address->country : "" }}{{
                                    $customer_address->zip !=
                                    "" ? ' -
                                    PK.'.$customer_address->zip : "" }}</p>
                                <p class="text-sm leading-6 text-gray-500">
                                    {{ $customer_address->tax_office != "" ? 'VD.'. $customer_address->tax_office
                                    : "" }}{{
                                    $customer_address->vat_number !=
                                    "" ? ' - VN.'. $customer_address->vat_number : ""}}</p>
                            </dd>
                            @else
                            <dd class="mt-2 text-gray-500 uppercase">
                                <span class="font-medium text-gray-900">{{ $invoice->company->name }}</span>
                            </dd>
                            @endif
                            @endif
                        </div>
                        <div class="mt-8 sm:mt-6 sm:border-t sm:border-gray-900/5 sm:pl-4 sm:pt-6">
                            <dt class="text-lg font-bold text-stone-400">ALICI</dt>
                            @if($invoice->type == 'sales_receipt')
                            @if ($customer_address)
                            <dd class="mt-2 text-gray-500 uppercase">
                                <span class="font-medium text-gray-900">{{ $customer_address->title }}</span>
                                <p class="text-sm leading-6 text-gray-500">
                                    {{ $customer_address->line_1 }} {{ $customer_address->line_2 }}</p>
                                <p class="text-sm leading-6 text-gray-500">
                                    {{ $customer_address->district}}{{ $customer_address->city != "" ?
                                    '/'.$customer_address->city :
                                    ""}}{{
                                    $customer_address->country != "" ? '/'.$customer_address->country : "" }}{{
                                    $customer_address->zip != "" ? ' -
                                    PK.'.$customer_address->zip : "" }}</p>
                                <p class="text-sm leading-6 text-gray-500">
                                    {{ $customer_address->tax_office != "" ? 'VD.'. $customer_address->tax_office : ""
                                    }}{{
                                    $customer_address->vat_number != "" ? ' - VN.'. $customer_address->vat_number : ""}}
                                </p>
                            </dd>
                            @else
                            <dd class="mt-2 text-gray-500 uppercase">
                                <span class="font-medium text-gray-900">{{ $invoice->company->name }}</span>
                            </dd>
                            @endif
                            @else
                            <dd class="mt-2 text-gray-500 uppercase">
                                <span class="font-medium text-gray-900">{{ $invoice_address->title }}</span>
                                <p class="text-sm leading-6 text-gray-500">
                                    {{ $invoice_address->line_1 }} {{ $invoice_address->line_2 }}</p>
                                <p class="text-sm leading-6 text-gray-500">
                                    {{ $invoice_address->district}}{{ $invoice_address->city != "" ?
                                    '/'.$invoice_address->city :
                                    ""}}{{
                                    $invoice_address->country != "" ? '/'.$invoice_address->country : "" }}{{
                                    $invoice_address->zip != "" ? ' -
                                    PK.'.$invoice_address->zip : "" }}</p>
                                <p class="text-sm leading-6 text-gray-500">
                                    {{ $invoice_address->tax_office != "" ? 'VD.'. $invoice_address->tax_office : ""
                                    }}{{
                                    $invoice_address->vat_number != "" ? ' - VN.'. $invoice_address->vat_number : ""}}
                                </p>
                            </dd>
                            @endif
                        </div>
                    </dl>

                    {{-- FİŞ İÇERİĞİ --}}
                    @if ($invoice->type == 'sales_receipt' || $invoice->type == 'purchase_receipt')
                    @include('invoice._partials.receipt-content')
                    @elseif ($invoice->type == 'received' || $invoice->type == 'paid')
                    @include('invoice._partials.bill-content')
                    @endif

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

@endsection

@section('scripts')
<style>
    @media print {

        /* Hide everything except the invoice */
        body * {
            visibility: hidden;
        }

        #invoice,
        #invoice * {
            visibility: visible;
        }

        /* Position the invoice for printing */
        #invoice {
            position: absolute;
            left: 0;
            top: 0;
            width: 100% !important;
            max-width: none !important;
            margin: 0 !important;
            padding: 20px !important;
            box-shadow: none !important;
            border: none !important;
            border-radius: 0 !important;
        }

        /* Remove background colors and borders for print */
        #invoice {
            background: white !important;
            color: black !important;
        }

        /* Ensure proper page breaks */
        #invoice {
            page-break-inside: avoid;
        }

        /* Hide any buttons or interactive elements */
        button,
        .btn,
        .no-print {
            display: none !important;
        }

        /* Improve typography for print */
        #invoice h1,
        #invoice h2,
        #invoice h3 {
            color: black !important;
        }

        /* Ensure tables print well */
        #invoice table {
            width: 100% !important;
            border-collapse: collapse !important;
        }

        #invoice th,
        #invoice td {
            border: 1px solid #000 !important;
            padding: 8px !important;
        }

        /* Remove unnecessary spacing */
        #invoice .ring-1,
        #invoice .ring-stone-300,
        #invoice .shadow-sm {
            box-shadow: none !important;
            border: none !important;
        }

        /* Page setup */
        @page {
            size: A4;
            margin: 1cm;
        }
    }
</style>

<script>
    function printInvoice() {
        console.log('Print function called'); // Debug için
        // Biraz bekleme süresi ekle
        setTimeout(function() {
            window.print();
        }, 100);
    }

    // Sayfa yüklendiğinde fonksiyonun tanımlı olduğunu kontrol et
    document.addEventListener('DOMContentLoaded', function() {
        console.log('Print function available:', typeof printInvoice);
    });
</script>
@endsection

@section('outerScripts')
@endsection