📊 Subscription Frontend - Plan & Taslak

📅 Tarih: 2025-12-02 | 🎯 Özellik: Frontend subscription plans + Direkt checkout

🎯 Gereksinimler

1. Frontend Subscription Plans Sayfası

Kullanıcılar subscription planlarını görebilmeli ve seçebilmeli.

  • URL: /subscriptions veya /plans
  • Tüm aktif planları listele
  • Aylık ve yıllık fiyatları göster
  • Özellikler (features) listesi

2. Aylık/Yıllık Toggle

Kullanıcı fiyatlandırma döngüsünü seçebilmeli.

  • Toggle butonu (Monthly ↔ Yearly)
  • Yıllık seçildiğinde indirim vurgusu
  • Fiyatlar dinamik olarak değişmeli

3. Sepet Bypass - Direkt Checkout

Subscription satın alımı sepete eklenmeden direkt checkout'a gitmeli.

  • ❌ Sepete ekleme YOK
  • ✅ "Satın Al" → Direkt checkout sayfası
  • ✅ Tek subscription bir seferde
  • ✅ Billing cycle (monthly/yearly) bilgisi taşınmalı

🎨 UI Mockup - Pricing Cards

Aylık
Yıllık (2 Ay Bedava!)
Başlangıç
₺299/ay
  • ✓ 10 Ürün
  • ✓ 50 Sipariş/ay
  • ✓ Temel Destek
  • ✓ 5 GB Depolama
En Popüler
Profesyonel
₺799/ay
  • ✓ Sınırsız Ürün
  • ✓ Sınırsız Sipariş
  • ✓ Öncelikli Destek
  • ✓ 50 GB Depolama
  • ✓ Gelişmiş Analitik
Kurumsal
₺1,999/ay
  • ✓ Sınırsız Her Şey
  • ✓ API Erişimi
  • ✓ Özel Destek
  • ✓ 200 GB Depolama
  • ✓ Özel Entegrasyon

🔄 Kullanıcı Akışı

1
Subscription Plans Sayfası
Kullanıcı /subscriptions sayfasına girer
↓
2
Billing Cycle Seçimi
Aylık/Yıllık toggle ile fiyatları görür
↓
3
"Satın Al" Butonu
Plan + Billing cycle bilgisiyle checkout'a yönlendirilir
↓
4
Checkout Sayfası
Sadece fatura adresi (subscription = dijital, kargo yok)
↓
5
Ödeme & Aktivasyon
Ödeme tamamlanır, subscription aktif olur

⚙️ Teknik Implementasyon

1. Route Oluşturma

// routes/web.php
Route::get('/subscriptions', [SubscriptionController::class, 'index'])
    ->name('subscriptions.index');

Route::get('/subscriptions/checkout/{plan}/{cycle}', [SubscriptionController::class, 'checkout'])
    ->name('subscriptions.checkout');

2. Controller/Livewire Component

Seçenek A: Livewire Component (Önerilen)

// Modules/Subscription/app/Http/Livewire/Front/SubscriptionPlansComponent.php

class SubscriptionPlansComponent extends Component
{
    public $billingCycle = 'monthly'; // monthly | yearly
    public $plans;

    public function mount() {
        $this->plans = SubscriptionPlan::where('is_active', true)
            ->where('is_public', true)
            ->orderBy('sort_order')
            ->get();
    }

    public function buyNow($planId) {
        return redirect()->route('subscriptions.checkout', [
            'plan' => $planId,
            'cycle' => $this->billingCycle
        ]);
    }
}

3. Checkout Entegrasyonu

Subscription checkout'u için özel bir route ve controller metodu:

// SubscriptionController::checkout()

public function checkout($planId, $cycle)
{
    $plan = SubscriptionPlan::findOrFail($planId);
    
    // Fiyat hesapla
    $price = $cycle === 'yearly' ? $plan->price_yearly : $plan->price_monthly;
    
    // Session'a kaydet (Cart yerine)
    session()->put('subscription_checkout', [
        'plan_id' => $plan->subscription_plan_id,
        'billing_cycle' => $cycle,
        'price' => $price
    ]);
    
    return redirect()->route('checkout.subscription');
}

4. Blade View Yapısı

Ana Sayfa: resources/views/subscriptions/index.blade.php

  • Pricing cards grid
  • Billing cycle toggle (Alpine.js)
  • Livewire component
  • Responsive design (Tailwind)

📋 Implementasyon Adımları

  1. Route oluştur
    • GET /subscriptions → Plans listesi
    • GET /subscriptions/checkout/{plan}/{cycle} → Checkout
  2. Livewire Component
    • SubscriptionPlansComponent oluştur
    • billingCycle state yönetimi
    • buyNow() metodu
  3. Blade View
    • Pricing cards layout (Tailwind + Alpine.js)
    • Toggle butonu (billingCycle değiştir)
    • Fiyat hesaplama (dinamik)
  4. Checkout Entegrasyonu
    • SubscriptionController::checkout() metodu
    • Session'a subscription bilgisi kaydet
    • CheckoutPage'e yönlendir
  5. CheckoutPage Güncellemesi
    • Session'dan subscription bilgisi oku
    • Normal cart yerine subscription göster
    • Sadece fatura adresi (requiresShipping = false)
  6. Test
    • Plan seçimi → Checkout → Ödeme flow'u
    • Aylık/Yıllık fiyat değişimi
    • Checkout'ta teslimat gizli mi?

⚠️ Önemli Notlar

Cart vs Subscription Checkout

Shop Products: Cart → Checkout

Subscription: Session → Checkout (Cart bypass)

İki farklı flow olacak. CheckoutPage her ikisini de desteklemeli.

Pricing Display

Aylık ve yıllık fiyatlar price_monthly ve price_yearly fieldlarından gelir.

Yıllık seçildiğinde indirim vurgusu göster (örn: "2 Ay Bedava!").

RequiresShipping

Subscription her zaman dijital → requiresShipping = false

Checkout'ta teslimat adresi gizli, sadece fatura görünür.