@extends('backEnd.layouts.master')
@section('title', 'Analytics — ' . $landingPage->name)

@section('content')
<div class="container-fluid py-3">
    <div class="d-flex justify-content-between align-items-start mb-3 flex-wrap gap-2">
        <div>
            <h4 class="fw-bold mb-1">Landing Analytics</h4>
            <div class="text-muted small">{{ $landingPage->name }} · /lp/{{ $landingPage->slug }}</div>
        </div>
        <div class="d-flex gap-2 flex-wrap">
            <a href="{{ $landingPage->public_url }}" target="_blank" class="btn btn-outline-primary btn-sm"><i class="fas fa-eye me-1"></i> View LP</a>
            <a href="{{ route('admin.landing-page.index') }}" class="btn btn-outline-secondary btn-sm">Back</a>
        </div>
    </div>

    <div class="row g-3 mb-3">
        <div class="col-md-3 col-6">
            <div class="card border-0 shadow-sm h-100"><div class="card-body">
                <div class="text-muted small">Total Visits</div>
                <div class="fs-3 fw-bold text-primary">{{ number_format($stats['visits']) }}</div>
            </div></div>
        </div>
        <div class="col-md-3 col-6">
            <div class="card border-0 shadow-sm h-100"><div class="card-body">
                <div class="text-muted small">FB Ads Traffic</div>
                <div class="fs-3 fw-bold" style="color:#1877f2">{{ number_format($stats['fbVisits']) }}</div>
                <div class="small text-muted">fbclid / utm_source=facebook</div>
            </div></div>
        </div>
        <div class="col-md-3 col-6">
            <div class="card border-0 shadow-sm h-100"><div class="card-body">
                <div class="text-muted small">Orders</div>
                <div class="fs-3 fw-bold text-success">{{ number_format($stats['orders']) }}</div>
                <div class="small text-muted">Conv: {{ $stats['conversion'] }}% · FB conv: {{ $stats['fbConversion'] }}%</div>
            </div></div>
        </div>
        <div class="col-md-3 col-6">
            <div class="card border-0 shadow-sm h-100"><div class="card-body">
                <div class="text-muted small">Revenue</div>
                <div class="fs-3 fw-bold text-success">৳{{ number_format($stats['revenue'], 0) }}</div>
            </div></div>
        </div>
    </div>

    <div class="alert {{ ($pixelConfigured && $capiEnabled) ? 'alert-success' : 'alert-warning' }} py-2 small mb-3">
        @if($pixelConfigured && $capiEnabled)
            <i class="fab fa-facebook me-1"></i> Site-wide Pixel + CAPI ON — Events Manager-এ ViewContent/Purchase দেখতে পাবেন (Test Events tab দিয়ে verify করুন)।
        @else
            <strong>Setup incomplete:</strong>
            @if(!$pixelConfigured) Pixel ID missing. @endif
            @if(!$capiEnabled) CAPI OFF. @endif
            <a href="{{ route('admin.social.ads', ['tab' => 'integrations']) }}">Ad Management → Integrations</a>
        @endif
    </div>

    <div class="row g-3">
        <div class="col-lg-5">
            <div class="card border-0 shadow-sm">
                <div class="card-header bg-white fw-bold"><i class="fab fa-facebook me-2 text-primary"></i> FB Ads Tracking URL</div>
                <div class="card-body">
                    <p class="small text-muted">Facebook Ads-এ এই URL ব্যবহার করুন। Visitor + order automatically track হবে।</p>
                    <div class="input-group input-group-sm mb-2">
                        <input type="text" class="form-control" id="fbTrackingUrl" readonly value="{{ $trackingUrl }}">
                        <button type="button" class="btn btn-primary" onclick="navigator.clipboard.writeText(document.getElementById('fbTrackingUrl').value);this.textContent='Copied'">Copy</button>
                    </div>
                    <div class="small text-muted">
                        Ads Manager-এ dynamic: <code>utm_campaign=&#123;&#123;campaign.name&#125;&#125;</code>,
                        <code>utm_content=&#123;&#123;ad.name&#125;&#125;</code>
                    </div>
                    <hr>
                    <div class="small">
                        <strong>Pixel + CAPI:</strong> <a href="{{ route('admin.social.ads', ['tab' => 'integrations']) }}">Ad Management → Integrations</a> এ Facebook Pixel &amp; CAPI ON থাকলে
                        ViewContent (visit) ও Purchase (order) event যাবে।
                    </div>
                </div>
            </div>
        </div>
        <div class="col-lg-7">
            <div class="card border-0 shadow-sm">
                <div class="card-header bg-white fw-bold">Campaign Breakdown (UTM)</div>
                <div class="card-body p-0">
                    <table class="table table-sm mb-0">
                        <thead class="table-light"><tr><th>Campaign</th><th class="text-end">Visits</th><th class="text-end">FB</th></tr></thead>
                        <tbody>
                            @forelse($campaigns as $row)
                            <tr>
                                <td>{{ $row['campaign'] }}</td>
                                <td class="text-end">{{ number_format($row['visits']) }}</td>
                                <td class="text-end">{{ number_format($row['fb_visits']) }}</td>
                            </tr>
                            @empty
                            <tr><td colspan="3" class="text-center text-muted py-4">No UTM campaign data yet. Use tracking URL in FB ads.</td></tr>
                            @endforelse
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>

    <div class="card border-0 shadow-sm mt-3">
        <div class="card-header bg-white fw-bold">Recent Orders from this Landing Page</div>
        <div class="card-body p-0">
            <table class="table table-sm mb-0">
                <thead class="table-light"><tr><th>Invoice</th><th>Customer</th><th>Amount</th><th>Source</th><th>Date</th></tr></thead>
                <tbody>
                    @forelse($orders as $order)
                    <tr>
                        <td><a href="{{ route('admin.orders.show', $order->id) }}">{{ $order->invoice_id }}</a></td>
                        <td>{{ $order->customer_name }}<br><small class="text-muted">{{ $order->customer_phone }}</small></td>
                        <td>৳{{ number_format($order->amount) }}</td>
                        <td><small>{{ $order->utm_source }}</small></td>
                        <td><small>{{ $order->created_at->format('d M, h:i A') }}</small></td>
                    </tr>
                    @empty
                    <tr><td colspan="5" class="text-center text-muted py-4">No orders yet from this landing page.</td></tr>
                    @endforelse
                </tbody>
            </table>
        </div>
    </div>
</div>
@endsection