@extends('layouts.app')

@section('content')
<div class="pb-12">
    <div class="px-4 grid grid-cols-1 gap-4 sm:grid-cols-6">
        <div class="overflow-hidden bg-white shadow-xl col-span-1 sm:col-span-4 sm:rounded-lg">
            <div class="p-6 bg-white border-b border-gray-200 lg:p-8">
                <div class="flex items-center justify-between">
                    <div>
                        <h1 class="text-2xl font-medium text-gray-900">
                            E-Adisyon Entegrasyonu
                        </h1>
                        <p class="mt-2 leading-relaxed text-gray-500">
                            POS satışlarından e-adisyon belgeleri oluşturma ve gönderme
                        </p>
                    </div>
                    <div class="flex items-center gap-4">
                    </div>
                </div>
            </div>

            <!-- İstatistikler -->
            <div class="grid grid-cols-1 gap-6 p-6 bg-gray-50 md:grid-cols-4 lg:gap-8 lg:p-8">
                <div class="overflow-hidden bg-white shadow-sm sm:rounded-lg">
                    <div class="p-6">
                        <div class="flex items-center">
                            <div class="flex items-center bg-sky-200/60 rounded-md p-3">
                                <span class="material-symbols-rounded text-sky-400">select_all</span>
                            </div>
                            <div class="ml-5 w-0 flex-1">
                                <dl>
                                    <dt class="text-sm font-medium text-gray-500 truncate">Toplam Satış</dt>
                                    <dd class="text-lg font-semibold text-sky-400">{{ $sales->count() }}</dd>
                                </dl>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="overflow-hidden bg-white shadow-sm sm:rounded-lg">
                    <div class="p-6">
                        <div class="flex items-center">
                            <div class="flex-shrink-0 bg-teal-200/60 rounded-md p-3">
                                <svg class="h-6 w-6 text-teal-400" fill="none" stroke="currentColor"
                                    viewBox="0 0 24 24">
                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                        d="M5 13l4 4L19 7" />
                                </svg>
                            </div>
                            <div class="ml-5 w-0 flex-1">
                                <dl>
                                    <dt class="text-sm font-medium text-gray-500 truncate">Gönderildi</dt>
                                    <dd class="text-lg font-semibold text-teal-400">{{ $sales->where('eadisyon_sent',
                                        true)->count() }}</dd>
                                </dl>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="overflow-hidden bg-white shadow-sm sm:rounded-lg">
                    <div class="p-6">
                        <div class="flex items-center">
                            <div class="flex-shrink-0 bg-amber-200/60 rounded-md p-3">
                                <svg class="h-6 w-6 text-amber-400" fill="none" stroke="currentColor"
                                    viewBox="0 0 24 24">
                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                        d="M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z" />
                                </svg>
                            </div>
                            <div class="ml-5 w-0 flex-1">
                                <dl>
                                    <dt class="text-sm font-medium text-gray-500 truncate">Bekliyor</dt>
                                    <dd class="text-lg font-semibold text-yellow-400">{{ $sales->where('eadisyon_sent',
                                        false)->count() }}</dd>
                                </dl>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="overflow-hidden bg-white shadow-sm sm:rounded-lg">
                    <div class="p-6">
                        <div class="flex items-center">
                            <div class="flex-shrink-0 bg-rose-200/60 rounded-md p-3">
                                <svg class="h-6 w-6 text-rose-400" fill="none" stroke="currentColor"
                                    viewBox="0 0 24 24">
                                    <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                                        d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-3L13.732 4c-.77-1.333-2.694-1.333-3.464 0L3.34 16c-.77 1.333.192 3 1.732 3z" />
                                </svg>
                            </div>
                            <div class="ml-5 w-0 flex-1">
                                <dl>
                                    <dt class="text-sm font-medium text-gray-500 truncate">Hata</dt>
                                    <dd class="text-lg font-semibold text-red-400">{{ $failedCount }}</dd>
                                </dl>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- POS Satışları Tablosu -->
            <div class="p-6 bg-white shadow-sm sm:rounded-lg">
                <div class="flex items-center justify-between mb-6">
                    <h2 class="text-lg font-semibold text-gray-900">POS Satış Listesi</h2>
                    <div class="flex gap-2">
                        @if(isset($efiles_integration) && $efiles_integration)
                        <button onclick="sendAllPending()"
                            class="flex items-center px-4 py-2 text-sm font-bold text-white bg-stone-600 rounded hover:bg-stone-700 disabled:opacity-50"
                            {{ $sales->where('eadisyon_sent', false)->count() == 0 ? 'disabled' : '' }}>
                            <svg class="inline w-4 h-4 mr-2" fill="currentColor" viewBox="0 0 20 20">
                                <path fill-rule="evenodd"
                                    d="M10 18a8 8 0 100-16 8 8 0 000 16zm3.707-9.293a1 1 0 00-1.414-1.414L9 10.586 7.707 9.293a1 1 0 00-1.414 1.414l2 2a1 1 0 001.414 0l4-4z"
                                    clip-rule="evenodd" />
                            </svg>
                            Tümünü Gönder ({{ $sales->where('eadisyon_sent', false)->count() }})
                        </button>
                        @endif
                        <button onclick="location.reload()"
                            class="px-4 py-2 text-sm font-bold text-gray-700 bg-gray-200 rounded hover:bg-gray-300">
                            Yenile
                        </button>
                    </div>
                </div>

                @if ($sales->count() > 0)
                <div class="overflow-x-auto">
                    <table class="min-w-full divide-y divide-stone-200">
                        <thead class="bg-stone-50">
                            <tr>
                                <th
                                    class="px-6 py-3 text-xs font-medium tracking-wider text-left text-stone-500 uppercase">
                                    ID</th>
                                <th
                                    class="px-6 py-3 text-xs font-medium tracking-wider text-left text-stone-500 uppercase">
                                    Tarih</th>
                                <th
                                    class="px-6 py-3 text-xs font-medium tracking-wider text-left text-stone-500 uppercase">
                                    Tutar</th>
                                <th
                                    class="px-6 py-3 text-xs font-medium tracking-wider text-left text-stone-500 uppercase">
                                    Ürün Sayısı</th>
                                <th
                                    class="px-6 py-3 text-xs font-medium tracking-wider text-center text-stone-500 uppercase">
                                    Durum</th>
                                <th
                                    class="px-6 py-3 text-xs font-medium tracking-wider text-right text-stone-500 uppercase">
                                    İşlem</th>
                            </tr>
                        </thead>
                        <tbody class="bg-white divide-y divide-stone-200">
                            @foreach ($sales as $sale)
                            <tr class="hover:bg-gray-50">
                                <td class="px-6 py-4 text-sm font-medium text-gray-900 whitespace-nowrap">#{{ $sale->id
                                    }}</td>
                                <td class="px-6 py-4 text-sm text-gray-500 whitespace-nowrap">
                                    {{ $sale->deleted_at ? $sale->deleted_at->format('d.m.Y H:i') : '-' }}
                                </td>
                                <td class="px-6 py-4 text-sm text-gray-900 whitespace-nowrap">
                                    <span class="font-semibold">{{ number_format($sale->gross_price ?? 0, 2) }} ₺</span>
                                </td>
                                <td class="px-6 py-4 text-sm text-gray-500 whitespace-nowrap">
                                    {{ $sale->orders ? $sale->orders->count() : 0 }} ürün
                                </td>
                                <td class="px-6 py-4 whitespace-nowrap text-center">
                                    @if($sale->eadisyon_sent)
                                    <span class="material-symbols-rounded text-teal-600">done_all</span>
                                    @else
                                    <span class="material-symbols-rounded text-amber-600">hourglass_pause</span>
                                    @endif
                                </td>
                                <td class="px-6 py-4 whitespace-nowrap text-sm font-medium text-right">
                                    @if(isset($efiles_integration) && $efiles_integration)
                                    @if($sale->eadisyon_sent)
                                    <button onclick="checkStatus({{ $sale->id }})"
                                        class="text-blue-600 hover:text-blue-900 mr-3">
                                        Durum Sorgula
                                    </button>
                                    <button onclick="viewEadisyon({{ $sale->id }})"
                                        class="text-gray-600 hover:text-gray-900">
                                        Detay
                                    </button>
                                    @else
                                    <button onclick="sendSingle({{ $sale->id }}, this)"
                                        class="text-teal-600 hover:text-teal-900 mr-3 send-btn">
                                        Gönder
                                    </button>
                                    <button onclick="skipSale({{ $sale->id }})"
                                        class="text-gray-400 hover:text-gray-600">
                                        Atla
                                    </button>
                                    @endif
                                    @endif
                                </td>
                            </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>

                <!-- Pagination -->
                <div class="mt-6">
                    {{ $sales->links() }}
                </div>
                @else
                <div class="py-12 text-center">
                    <svg class="mx-auto h-12 w-12 text-gray-400" fill="none" stroke="currentColor" viewBox="0 0 24 24">
                        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
                            d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
                    </svg>
                    <h3 class="mt-2 text-sm font-medium text-gray-900">Satış bulunamadı</h3>
                    <p class="mt-1 text-sm text-gray-500">Henüz e-adisyon gönderilmeyi bekleyen satış yok.</p>
                </div>
                @endif
            </div>
        </div>
        <div class="col-span-1 sm:col-span-2">
            <!-- SİSTEM DURUMU & KONTÖR -->
            <div class="rounded-lg bg-white shadow">
                <div class="ring-1 ring-stone-300 sm:mx-0 rounded-lg">
                    <div class="grid grid-cols-2">
                        {{-- SİSTEM DURUMU --}}
                        <div class="bg-white rounded-l-lg">
                            <div
                                class="grid items-center h-full px-3 py-2 bg-gradient-to-b {{ isset($efiles_integration) && $efiles_integration ? ' from-emerald-300/40 to-emerald-100/30' : 'from-rose-300/40 to-rose-100/30' }} lg:rounded-l-lg">
                                <div class="flex items-center">
                                    <div class="flex-shrink-0">
                                        <span
                                            class="text-3xl material-symbols-rounded {{ isset($efiles_integration) && $efiles_integration ? 'text-emerald-600' : 'text-rose-600' }}">
                                            {{ isset($efiles_integration) && $efiles_integration ? 'check' : 'close' }}
                                        </span>
                                    </div>
                                    <div class="flex-1 w-0 ml-3 tracking-tight">
                                        <dl>
                                            <dd>
                                                <div
                                                    class="text-sm font-bold {{ isset($efiles_integration) && $efiles_integration ? 'text-emerald-600' : 'text-rose-600' }}">
                                                    {{ isset($efiles_integration) && $efiles_integration ?
                                                    'SERVİSLER ÇALIŞIYOR' : 'BAĞLANTI KURULAMADI' }}</div>
                                            </dd>
                                            @if (isset($efiles_integration) && $efiles_integration)
                                            <dt class="text-xs font-light truncate text-emerald-600">
                                                {{ $efiles_integration->description }}</dt>
                                            <dt class="text-xs font-light truncate text-emerald-600">
                                                {{ $efiles_integration->username }}</dt>
                                            <dt class="text-xs font-light truncate text-emerald-600">
                                                {{ substr($efiles_integration->password, 0, 3) }}*****</dt>
                                            @else
                                            <dt class="text-xs font-light text-rose-600">E-ADİSYON
                                                SERVİSLERİNE BAĞLI DEĞİLSİNİZ</dt>
                                            @endif
                                        </dl>
                                    </div>
                                </div>
                            </div>
                        </div>
                        {{-- BAKİYE DURUMU --}}
                        <div class="bg-white rounded-r-lg">
                            <div
                                class="grid items-center h-full px-3 py-3 bg-gradient-to-b from-amber-300/40 to-amber-100/30 lg:rounded-r-lg">
                                <div class="flex items-center text-right">
                                    <div class="flex-1 w-0 mr-3">
                                        <dl>
                                            <dd>
                                                <div class="text-base font-bold text-amber-600">0 KONTÖR
                                                </div>
                                            </dd>
                                            <dt class="text-xs font-light truncate text-amber-600">MEVCUT
                                                BAKİYE</dt>
                                            <dt class="text-xs font-light truncate text-amber-600">---</dt>
                                        </dl>
                                    </div>
                                    <div class="flex-shrink-0">
                                        <span class="text-3xl material-symbols-rounded text-amber-600">
                                            toll
                                        </span>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <!-- TAHMİNİ E-BELGE TÜKETİMİ -->
            <div class="rounded-lg bg-white shadow p-6 mt-4">
                <div class="flex items-center justify-between">
                    <div class="text-lg font-medium text-gray-900">HESAPLANAN E-ADİSYON TÜKETİMİ</div>
                </div>
                <div class="mt-4">
                    <div class="flex items-center">
                        <div class="flex-shrink-0">
                            <span class="text-3xl material-symbols-rounded text-amber-600">
                                receipt_long
                            </span>
                        </div>
                        <div class="ml-3">
                            <div class="text-base font-bold text-gray-900 tracking-tighter">{{
                                number_format($salesLast365Days ??
                                0, 0, ',', '.') }} ADİSYON
                            </div>
                            <div class="text-xs font-light text-gray-500">SON 365 GÜN AÇILAN ADİSYON SAYISI</div>
                        </div>
                    </div>
                    <div class="rounded-md bg-blue-50 p-4 mt-4">
                        <div class="flex">
                            <div class="shrink-0">
                                <svg viewBox="0 0 20 20" fill="currentColor" data-slot="icon" aria-hidden="true"
                                    class="size-5 text-blue-400">
                                    <path
                                        d="M18 10a8 8 0 1 1-16 0 8 8 0 0 1 16 0Zm-7-4a1 1 0 1 1-2 0 1 1 0 0 1 2 0ZM9 9a.75.75 0 0 0 0 1.5h.253a.25.25 0 0 1 .244.304l-.459 2.066A1.75 1.75 0 0 0 10.747 15H11a.75.75 0 0 0 0-1.5h-.253a.25.25 0 0 1-.244-.304l.459-2.066A1.75 1.75 0 0 0 9.253 9H9Z"
                                        clip-rule="evenodd" fill-rule="evenodd" />
                                </svg>
                            </div>
                            <div class="ml-3 flex-1 md:flex md:justify-between">
                                <p class="text-xs text-blue-700 tracking-tight">Açılan 1 Adisyon = 1 Kontör olarak
                                    ücretlendirilir. Kontörlerin kullanım süresi 365 gün
                                    olduğu
                                    için satın alım yapmadan önce işletmenizin yıllık tüketim miktarını dikkate alınız.
                                </p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            @if (isset($efiles_integration) && $efiles_integration)
            <!-- PAKET SEÇİMİ -->
            <div class="bg-white shadow sm:rounded-lg mt-4">
                <div class="px-4 py-5 sm:p-6">
                    <h3 class="text-lg font-semibold text-gray-900">PAKET SEÇİMİ</h3>
                    <div class="mt-2 max-w-lg text-sm text-gray-500">
                        <p>Son 365 günlük tüketiminize özel hesaplanmış yıllık seçeneklerden birini tercih edebilirsiniz
                        </p>
                    </div>

                    <fieldset aria-label="Pricing plans" class="relative -space-y-px rounded-md bg-white mt-4">
                        <label aria-label="Daha Az"
                            class="group flex flex-col items-center border border-stone-200 p-4 first:rounded-tl-md first:rounded-tr-md last:rounded-bl-md last:rounded-br-md focus:outline-none has-[:checked]:relative has-[:checked]:border-teal-200 has-[:checked]:bg-teal-50 md:grid md:grid-cols-3 md:pl-4 md:pr-6">
                            <span class="flex items-center gap-3 text-sm">
                                <input type="radio" name="pricing-plan" value="enterprise"
                                    class="relative size-4 appearance-none rounded-full border border-stone-300 bg-white before:absolute before:inset-1 before:rounded-full before:bg-white checked:border-teal-600 checked:bg-teal-600 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-teal-600 disabled:border-gray-300 disabled:bg-stone-100 disabled:before:bg-gray-400 forced-colors:appearance-auto forced-colors:before:hidden [&:not(:checked)]:before:hidden" />
                                <div>
                                    <span class="font-medium text-stone-900 group-has-[:checked]:text-teal-900">En
                                        az</span>
                                    <span
                                        class="text-xs tracking-tight text-stone-900/50 group-has-[:checked]:text-teal-900/50">Tahmini
                                        tüketebileceğiniz en alt değer</span>
                                </div>
                            </span>
                            <span class="ml-6 pl-1 text-sm md:ml-0 md:pl-0 md:text-right">
                                <span class="font-medium text-stone-900 group-has-[:checked]:text-teal-900">{{
                                    number_format($creditPrice * 1.05 * ($salesLast365Days * 0.9), 2, ',', '.')
                                    }}</span>
                                <span class="text-sm text-stone-800 group-has-[:checked]:text-teal-900">TRL</span>
                                <div class="mt-1 text-stone-400 text-xs group-has-[:checked]:text-teal-700/70">{{
                                    number_format($creditPrice * 1.05, 2, ',', '.') }}
                                    TRL/adet</div>
                            </span>
                            <span
                                class="ml-6 pl-1 text-sm text-stone-500 group-has-[:checked]:text-teal-700/70 md:ml-0 md:pl-0 md:text-right">+{{
                                number_format($salesLast365Days * 0.9 ??
                                0, 0, ',', '.') }} KONTÖR</span>
                        </label>
                        <label aria-label="Size Özel"
                            class="group flex flex-col items-center border border-stone-200 p-4 first:rounded-tl-md first:rounded-tr-md last:rounded-bl-md last:rounded-br-md focus:outline-none has-[:checked]:relative has-[:checked]:border-teal-200 has-[:checked]:bg-teal-50 md:grid md:grid-cols-3 md:pl-4 md:pr-6">
                            <span class="flex items-center gap-3 text-sm">
                                <input type="radio" name="pricing-plan" value="enterprise" checked
                                    class="relative size-4 appearance-none rounded-full border border-stone-300 bg-white before:absolute before:inset-1 before:rounded-full before:bg-white checked:border-teal-600 checked:bg-teal-600 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-teal-600 disabled:border-gray-300 disabled:bg-stone-100 disabled:before:bg-gray-400 forced-colors:appearance-auto forced-colors:before:hidden [&:not(:checked)]:before:hidden" />
                                <div>
                                    <span class="font-medium text-stone-900 group-has-[:checked]:text-teal-900">En
                                        uygun</span>
                                    <span
                                        class="text-xs tracking-tight text-stone-900/50 group-has-[:checked]:text-teal-900/50">Tüketiminize
                                        göre hesaplanmış optimum değer</span>
                                </div>
                            </span>
                            <span class="ml-6 pl-1 text-sm md:ml-0 md:pl-0 md:text-right">
                                <span class="font-medium text-stone-900 group-has-[:checked]:text-teal-900">{{
                                    number_format($creditPrice * ($salesLast365Days * 1.1), 2, ',', '.') }}</span>
                                <span class="text-sm text-stone-800 group-has-[:checked]:text-teal-900">TRL</span>
                                <div class="mt-1 text-stone-400 text-xs group-has-[:checked]:text-teal-700/70">{{
                                    number_format($creditPrice, 2, ',', '.') }}
                                    TRL/adet</div>
                            </span>
                            <span
                                class="ml-6 pl-1 text-sm text-stone-500 group-has-[:checked]:text-teal-700/70 md:ml-0 md:pl-0 md:text-right">+{{
                                number_format($salesLast365Days * 1.1 ??
                                0, 0, ',', '.') }} KONTÖR</span>
                        </label>
                        <label aria-label="Daha Fazla"
                            class="group flex flex-col items-center border border-stone-200 p-4 first:rounded-tl-md first:rounded-tr-md last:rounded-bl-md last:rounded-br-md focus:outline-none has-[:checked]:relative has-[:checked]:border-teal-200 has-[:checked]:bg-teal-50 md:grid md:grid-cols-3 md:pl-4 md:pr-6">
                            <span class="flex items-center gap-3 text-sm">
                                <input type="radio" name="pricing-plan" value="enterprise"
                                    class="relative size-4 appearance-none rounded-full border border-stone-300 bg-white before:absolute before:inset-1 before:rounded-full before:bg-white checked:border-teal-600 checked:bg-teal-600 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-teal-600 disabled:border-gray-300 disabled:bg-stone-100 disabled:before:bg-gray-400 forced-colors:appearance-auto forced-colors:before:hidden [&:not(:checked)]:before:hidden" />
                                <div>
                                    <span class="font-medium text-stone-900 group-has-[:checked]:text-teal-900">En
                                        çok</span>
                                    <span
                                        class="text-xs tracking-tight text-stone-900/50 group-has-[:checked]:text-teal-900/50">Tahmini
                                        tüketebileceğiniz en yüksek değer</span>
                                </div>
                            </span>
                            <span class="ml-6 pl-1 text-sm md:ml-0 md:pl-0 md:text-right">
                                <span class="font-medium text-stone-900 group-has-[:checked]:text-teal-900">{{
                                    number_format($creditPrice * 0.95 * ($salesLast365Days * 1.3), 2, ',', '.')
                                    }}</span>
                                <span class="text-sm text-stone-800 group-has-[:checked]:text-teal-900">TRL</span>
                                <div class="mt-1 text-stone-400 text-xs group-has-[:checked]:text-teal-700/70">{{
                                    number_format($creditPrice * 0.95, 2, ',', '.') }}
                                    TRL/adet</div>
                            </span>
                            <span
                                class="ml-6 pl-1 text-sm text-stone-500 group-has-[:checked]:text-teal-700/70 md:ml-0 md:pl-0 md:text-right">+{{
                                number_format($salesLast365Days * 1.3 ??
                                0, 0, ',', '.') }} KONTÖR</span>
                        </label>
                    </fieldset>

                    <div class="mt-5">
                        <button type="button" onclick="purchaseCredits()"
                            class="inline-flex items-center rounded-md bg-stone-600 px-3 py-2 text-sm font-semibold text-white shadow-sm hover:bg-stone-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-stone-500">SATIN
                            AL</button>
                    </div>
                </div>
            </div>
            @else
            <fieldset aria-label="Integrations" class="relative -space-y-px rounded-md bg-white mt-4">
                <label aria-label="Daha Az"
                    class="flex items-center justify-between border border-stone-200 p-4 first:rounded-tl-md first:rounded-tr-md last:rounded-bl-md last:rounded-br-md focus:outline-none">
                    <span class="flex items-center w-2/3 gap-3 text-sm">
                        <div class="flex items-center gap-x-3">
                            <img class="inline-block size-9" src="https://cdn.apper.com.tr/img/apper/icon-color-gib.svg"
                                alt="gib" />
                            <div class="grid">
                                <span class="font-medium text-stone-900 group-has-[:checked]:text-teal-900">GİB
                                    E-Belge</span>
                                <span
                                    class="text-xs tracking-tight text-stone-900/50 group-has-[:checked]:text-teal-900/50">
                                    E-Adisyon belgesi düzenlemek ve kontör satın alabilmek için öncelikle Workspace
                                    paneli üzerinden GİB E-Belge entegrasyonunu başlatmanız gereklidir.</span>
                            </div>
                        </div>
                    </span>
                    <span class="ml-6 pl-3 text-sm">
                        <a href="https://workspace.apper.com.tr/integrations/index" type="button"
                            class="inline-flex items-center rounded-md bg-stone-600 px-3 py-1.5 text-xs text-white shadow-sm hover:bg-stone-500 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-stone-500">ENTEGRASYONU
                            BAŞLAT</a>
                    </span>
                </label>
            </fieldset>
            @endif
        </div>
    </div>
</div>

<!-- Success/Error Modal -->
<div id="resultModal" class="hidden fixed inset-0 bg-gray-600 bg-opacity-50 overflow-y-auto h-full w-full z-50">
    <div class="relative top-20 mx-auto p-5 border w-96 shadow-lg rounded-md bg-white">
        <div class="mt-3 text-center">
            <div id="modalIcon" class="mx-auto flex items-center justify-center h-12 w-12 rounded-full">
                <!-- Icon will be inserted here -->
            </div>
            <h3 id="modalTitle" class="text-lg leading-6 font-medium text-gray-900 mt-2"></h3>
            <div id="modalMessage" class="mt-2 px-7 py-3 text-sm text-gray-500"></div>
            <div class="items-center px-4 py-3">
                <button id="modalClose"
                    class="px-4 py-2 bg-blue-500 text-white text-base font-medium rounded-md w-full shadow-sm hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-300">
                    Tamam
                </button>
            </div>
        </div>
    </div>
</div>

<script>
    let isProcessing = false;

// Kontör satın alma işlemi
async function purchaseCredits() {
    if (isProcessing) {
        alert('Başka bir işlem devam ediyor. Lütfen bekleyin...');
        return;
    }

    // Seçili paketİ bul
    const selectedPlan = document.querySelector('input[name="pricing-plan"]:checked');

    if (!selectedPlan) {
        alert('Lütfen bir paket seçiniz.');
        return;
    }

    // Seçili paketin label'ını bul (paket bilgileri için)
    const selectedLabel = selectedPlan.closest('label');
    const planName = selectedLabel.querySelector('span.font-medium')?.textContent?.trim() || 'Standart Paket';

    // Fiyat ve kontör bilgisini çek
    const priceText = selectedLabel.querySelectorAll('span.font-medium')[1]?.textContent?.trim() || '0';
    const creditText = selectedLabel.querySelector('span.text-stone-500')?.textContent?.trim() || '0 KONTÖR';

    // Sayısal değerleri çıkar
    const paymentAmount = parseFloat(priceText.replace('.', '').replace(',', '.')) || 0;
    const creditAmount = parseInt(creditText.replace('+', '').replace(' KONTÖR', '').replace('.', '')) || 0;

    if (paymentAmount <= 0 || creditAmount <= 0) {
        alert('Paket bilgileri alınamadı. Lütfen sayfayı yenileyin.');
        return;
    }

    isProcessing = true;

    const originalButtonText = event.target.innerHTML;
    event.target.disabled = true;
    event.target.innerHTML = '⏳ Hazırlanıyor...';

    try {
        // Ödeme başlatma isteği gönder
        const response = await fetch('/pay/initiate', {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                'X-CSRF-TOKEN': '{{ csrf_token() }}'
            },
            body: JSON.stringify({
                payment_amount: paymentAmount,
                credit_amount: creditAmount,
                package_type: planName
            })
        });

        const data = await response.json();

        if (data.success) {
            // Yeni sekmede ödeme sayfasını aç
            window.open(data.data.iframe_url, '_blank');

            showModal('success', 'Ödeme Sayfası Açıldı',
                'Ödeme işleminizi tamamlayınız.<br><small class="text-gray-500">Sipariş No: ' + data.data.merchant_oid + '</small>');
        } else {
            showModal('error', 'Hata!', data.message || 'Ödeme başlatılamadı.');
        }
    } catch (error) {
        console.error('Error:', error);
        showModal('error', 'Bağlantı Hatası', 'Sunucuya bağlanırken bir hata oluştu: ' + error.message);
    } finally {
        isProcessing = false;
        event.target.disabled = false;
        event.target.innerHTML = originalButtonText;
    }
}

// Single sale send
async function sendSingle(saleId, button) {
    if (isProcessing) {
        alert('Başka bir işlem devam ediyor. Lütfen bekleyin...');
        return;
    }

    const originalText = button.innerHTML;
    button.disabled = true;
    button.innerHTML = '⏳ Gönderiliyor...';

    try {
        isProcessing = true;
        // Use MYSOFT API endpoint
        const response = await fetch('/eadisyon/send-mysoft/' + saleId, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                'X-CSRF-TOKEN': '{{ csrf_token() }}'
            },
            body: JSON.stringify({})
        });

        const data = await response.json();

        if (data.success) {
            showModal('success', 'Başarılı!', 'E-adisyon başarıyla gönderildi.<br><br><small class="text-gray-500">ETTN: ' + (data.ettn || 'N/A') + '</small>');
            setTimeout(() => location.reload(), 2000);
        } else {
            showModal('error', 'Hata!', data.error || data.message || 'Bilinmeyen hata');
            button.disabled = false;
            button.innerHTML = originalText;
        }
    } catch (error) {
        console.error('Error:', error);
        showModal('error', 'Bağlantı Hatası', 'Sunucuya bağlanırken bir hata oluştu: ' + error.message);
        button.disabled = false;
        button.innerHTML = originalText;
    } finally {
        isProcessing = false;
    }
}

// Send all pending sales
async function sendAllPending() {
    if (isProcessing) {
        alert('Başka bir işlem devam ediyor. Lütfen bekleyin...');
        return;
    }

    if (!confirm('Tüm bekleyen e-adisyonlar gönderilecek. Devam etmek istiyor musunuz?')) {
        return;
    }

    isProcessing = true;
    let successCount = 0;
    let failCount = 0;

    const buttons = document.querySelectorAll('.send-btn');

    for (const button of buttons) {
        const saleId = button.getAttribute('onclick').match(/sendSingle\((\d+)/)[1];

        try {
            // Use MYSOFT API endpoint
            const response = await fetch('/eadisyon/send-mysoft/' + saleId, {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json',
                    'X-CSRF-TOKEN': '{{ csrf_token() }}'
                },
                body: JSON.stringify({})
            });

            const data = await response.json();

            if (data.success) {
                successCount++;
                button.parentElement.innerHTML = '<span class="text-teal-600">✓ Gönderildi</span>';
            } else {
                failCount++;
                console.error('Failed to send sale ' + saleId + ':', data.error || data.message);
            }
        } catch (error) {
            failCount++;
            console.error('Error sending sale ' + saleId + ':', error);
        }

        // Small delay between requests
        await new Promise(resolve => setTimeout(resolve, 500));
    }

    isProcessing = false;
    showModal('info', 'İşlem Tamamlandı',
        'Toplam: ' + buttons.length + ' satış<br>' +
        '✓ Başarılı: ' + successCount + '<br>' +
        '✗ Başarısız: ' + failCount
    );
}

// Check status
async function checkStatus(saleId) {
    alert('Durum sorgulama özelliği yakında eklenecek. Sale ID: ' + saleId);
}

// View eadisyon details
async function viewEadisyon(saleId) {
    alert('Detay görüntüleme özelliği yakında eklenecek. Sale ID: ' + saleId);
}

// Skip sale
async function skipSale(saleId) {
    if (confirm('Bu satışı atlamak istediğinize emin misiniz?')) {
        alert('Atma özelliği yakında eklenecek. Sale ID: ' + saleId);
    }
}

// Show result modal
function showModal(type, title, message) {
    const modal = document.getElementById('resultModal');
    const iconDiv = document.getElementById('modalIcon');
    const modalTitle = document.getElementById('modalTitle');
    const modalMessage = document.getElementById('modalMessage');

    let icon = '';
    if (type === 'success') {
        icon = '<svg class="h-6 w-6 text-teal-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M5 13l4 4L19 7"/></svg>';
    } else if (type === 'error') {
        icon = '<svg class="h-6 w-6 text-red-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"/></svg>';
    } else {
        icon = '<svg class="h-6 w-6 text-blue-600" fill="none" stroke="currentColor" viewBox="0 0 24 24"><path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M13 16h-1v-4h-1m1-4h.01M21 12a9 9 0 11-18 0 9 9 0 0118 0z"/></svg>';
    }

    iconDiv.innerHTML = icon;
    modalTitle.textContent = title;
    modalMessage.innerHTML = message;
    modal.classList.remove('hidden');

    document.getElementById('modalClose').onclick = () => {
        modal.classList.add('hidden');
    };
}
</script>
@endsection