@extends('layouts.app')

@section('title', 'Subscription Management - ' . $website->name)

@section('content')
<div class="container-fluid">
    <!-- Success/Error Messages -->
    @if(session('success'))
        <div class="alert alert-success alert-dismissible fade show" role="alert">
            <i class="bi bi-check-circle me-2"></i>{{ session('success') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    @endif

    @if(session('error'))
        <div class="alert alert-danger alert-dismissible fade show" role="alert">
            <i class="bi bi-exclamation-triangle me-2"></i>{{ session('error') }}
            <button type="button" class="btn-close" data-bs-dismiss="alert"></button>
        </div>
    @endif

    <!-- Header -->
    <div class="row mb-4">
        <div class="col-12">
            <div class="d-flex justify-content-between align-items-center">
                <div>
                    <h1 class="h3 mb-0">
                        <i class="bi bi-arrow-repeat text-primary me-2"></i>
                        Subscription Management
                    </h1>
                    <p class="text-muted mb-0">Manage customer subscriptions and recurring bookings</p>
                </div>
            </div>
        </div>
    </div>

    <!-- Statistics Cards -->
    <div class="row mb-4">
        <div class="col-md-3 mb-3">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center">
                        <div>
                            <p class="text-muted mb-1 small">Total Subscriptions</p>
                            <h3 class="mb-0">{{ number_format($stats['total']) }}</h3>
                        </div>
                        <div class="bg-primary bg-opacity-10 p-3 rounded">
                            <i class="bi bi-people text-primary" style="font-size: 1.5rem;"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-3 mb-3">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center">
                        <div>
                            <p class="text-muted mb-1 small">Active</p>
                            <h3 class="mb-0 text-success">{{ number_format($stats['active']) }}</h3>
                        </div>
                        <div class="bg-success bg-opacity-10 p-3 rounded">
                            <i class="bi bi-check-circle text-success" style="font-size: 1.5rem;"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-3 mb-3">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center">
                        <div>
                            <p class="text-muted mb-1 small">On Trial</p>
                            <h3 class="mb-0 text-info">{{ number_format($stats['on_trial']) }}</h3>
                        </div>
                        <div class="bg-info bg-opacity-10 p-3 rounded">
                            <i class="bi bi-gift text-info" style="font-size: 1.5rem;"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <div class="col-md-3 mb-3">
            <div class="card border-0 shadow-sm h-100">
                <div class="card-body">
                    <div class="d-flex justify-content-between align-items-center">
                        <div>
                            <p class="text-muted mb-1 small">Monthly Revenue</p>
                            <h3 class="mb-0 text-primary">RM {{ number_format($stats['revenue_this_month'], 2) }}</h3>
                        </div>
                        <div class="bg-primary bg-opacity-10 p-3 rounded">
                            <i class="bi bi-currency-dollar text-primary" style="font-size: 1.5rem;"></i>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>

    <!-- Filters and Search -->
    <div class="card mb-4">
        <div class="card-body">
            <form action="{{ route('booking.subscriptions.index', $website) }}" method="GET" class="row g-3">
                <div class="col-md-3">
                    <label class="form-label">Search Customer</label>
                    <input type="text" class="form-control" name="search" value="{{ request('search') }}" placeholder="Name or email...">
                </div>
                <div class="col-md-2">
                    <label class="form-label">Status</label>
                    <select class="form-select" name="status">
                        <option value="">All Status</option>
                        <option value="pending" {{ request('status') == 'pending' ? 'selected' : '' }}>Pending</option>
                        <option value="active" {{ request('status') == 'active' ? 'selected' : '' }}>Active</option>
                        <option value="cancelled" {{ request('status') == 'cancelled' ? 'selected' : '' }}>Cancelled</option>
                        <option value="expired" {{ request('status') == 'expired' ? 'selected' : '' }}>Expired</option>
                        <option value="paused" {{ request('status') == 'paused' ? 'selected' : '' }}>Paused</option>
                    </select>
                </div>
                <div class="col-md-3">
                    <label class="form-label">Resource</label>
                    <select class="form-select" name="resource_id">
                        <option value="">All Resources</option>
                        @foreach($resources as $resource)
                            <option value="{{ $resource->id }}" {{ request('resource_id') == $resource->id ? 'selected' : '' }}>
                                {{ $resource->name }}
                            </option>
                        @endforeach
                    </select>
                </div>
                <div class="col-md-2">
                    <label class="form-label">Trial</label>
                    <select class="form-select" name="trial">
                        <option value="">All</option>
                        <option value="active" {{ request('trial') == 'active' ? 'selected' : '' }}>Active Trial</option>
                        <option value="ended" {{ request('trial') == 'ended' ? 'selected' : '' }}>Trial Ended</option>
                    </select>
                </div>
                <div class="col-md-2">
                    <label class="form-label">&nbsp;</label>
                    <div class="d-flex gap-2">
                        <button type="submit" class="btn btn-primary flex-fill">
                            <i class="bi bi-funnel me-1"></i> Filter
                        </button>
                        <a href="{{ route('booking.subscriptions.index', $website) }}" class="btn btn-outline-secondary">
                            <i class="bi bi-x"></i>
                        </a>
                    </div>
                </div>
            </form>
        </div>
    </div>

    <!-- Subscriptions Table -->
    <div class="card">
        <div class="card-body">
            @if($subscriptions->count() > 0)
                <div class="table-responsive">
                    <table class="table table-hover align-middle">
                        <thead class="table-light">
                            <tr>
                                <th>Customer</th>
                                <th>Resource</th>
                                <th>Package</th>
                                <th>Price</th>
                                <th>Status</th>
                                <th>Period</th>
                                <th>Credits</th>
                                <th>Created</th>
                                <th>Actions</th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach($subscriptions as $subscription)
                                <tr>
                                    <td>
                                        <div>
                                            <strong>{{ $subscription->customer->name }}</strong>
                                            <br>
                                            <small class="text-muted">{{ $subscription->customer->email }}</small>
                                        </div>
                                    </td>
                                    <td>{{ $subscription->bookingResource->name }}</td>
                                    <td>
                                        {{ $subscription->package->name }}
                                        @if($subscription->on_trial && $subscription->trial_ends_at && $subscription->trial_ends_at->isFuture())
                                            <br><span class="badge bg-info">On Trial</span>
                                        @endif
                                    </td>
                                    <td>
                                        <strong>RM {{ number_format($subscription->subscription_price, 2) }}</strong>
                                        <br>
                                        <small class="text-muted">{{ $subscription->package->billing_period_display }}</small>
                                    </td>
                                    <td>
                                        <span class="badge bg-{{ $subscription->status_badge }}">
                                            {{ ucfirst($subscription->status) }}
                                        </span>
                                    </td>
                                    <td>
                                        @if($subscription->current_period_end)
                                            <small>
                                                {{ $subscription->current_period_start->format('M d') }} -
                                                {{ $subscription->current_period_end->format('M d, Y') }}
                                                <br>
                                                @if($subscription->days_remaining !== null)
                                                    <span class="text-{{ $subscription->days_remaining < 7 ? 'danger' : 'muted' }}">
                                                        {{ $subscription->days_remaining }} days left
                                                    </span>
                                                @endif
                                            </small>
                                        @else
                                            <small class="text-muted">N/A</small>
                                        @endif
                                    </td>
                                    <td>
                                        @if($subscription->credits_remaining)
                                            <span class="badge bg-{{ $subscription->credits_remaining > 0 ? 'success' : 'warning' }}">
                                                {{ $subscription->credits_remaining }} / {{ $subscription->package->booking_credits ?? '∞' }}
                                            </span>
                                        @elseif($subscription->package->max_bookings_per_period)
                                            <span class="badge bg-info">
                                                {{ $subscription->bookings_this_period }} / {{ $subscription->package->max_bookings_per_period }}
                                            </span>
                                        @else
                                            <small class="text-muted">Unlimited</small>
                                        @endif
                                    </td>
                                    <td>
                                        <small>{{ $subscription->created_at->format('M d, Y') }}</small>
                                    </td>
                                    <td>
                                        <div class="btn-group">
                                            <a href="{{ route('booking.subscriptions.show', [$website, $subscription]) }}" class="btn btn-sm btn-outline-primary">
                                                <i class="bi bi-eye"></i>
                                            </a>
                                            <button type="button" class="btn btn-sm btn-outline-secondary dropdown-toggle dropdown-toggle-split" data-bs-toggle="dropdown">
                                                <span class="visually-hidden">Toggle Dropdown</span>
                                            </button>
                                            <ul class="dropdown-menu">
                                                @if($subscription->status === 'pending')
                                                    <li>
                                                        <form action="{{ route('booking.subscriptions.activate', [$website, $subscription]) }}" method="POST" class="d-inline">
                                                            @csrf
                                                            <button type="submit" class="dropdown-item text-success">
                                                                <i class="bi bi-check-circle me-2"></i>Activate
                                                            </button>
                                                        </form>
                                                    </li>
                                                @endif
                                                @if($subscription->status === 'active')
                                                    <li>
                                                        <form action="{{ route('booking.subscriptions.pause', [$website, $subscription]) }}" method="POST" class="d-inline">
                                                            @csrf
                                                            <button type="submit" class="dropdown-item">
                                                                <i class="bi bi-pause-circle me-2"></i>Pause
                                                            </button>
                                                        </form>
                                                    </li>
                                                @endif
                                                @if($subscription->status === 'paused')
                                                    <li>
                                                        <form action="{{ route('booking.subscriptions.resume', [$website, $subscription]) }}" method="POST" class="d-inline">
                                                            @csrf
                                                            <button type="submit" class="dropdown-item text-info">
                                                                <i class="bi bi-play-circle me-2"></i>Resume
                                                            </button>
                                                        </form>
                                                    </li>
                                                @endif
                                                @if(in_array($subscription->status, ['active', 'pending', 'paused']))
                                                    <li><hr class="dropdown-divider"></li>
                                                    <li>
                                                        <a href="#" class="dropdown-item" data-bs-toggle="modal" data-bs-target="#cancelModal{{ $subscription->id }}">
                                                            <i class="bi bi-x-circle me-2"></i>Cancel Subscription
                                                        </a>
                                                    </li>
                                                @endif
                                                @if($subscription->credits_remaining !== null || $subscription->bookings_this_period > 0)
                                                    <li><hr class="dropdown-divider"></li>
                                                    <li>
                                                        <form action="{{ route('booking.subscriptions.reset-credits', [$website, $subscription]) }}" method="POST" class="d-inline">
                                                            @csrf
                                                            <button type="submit" class="dropdown-item" onclick="return confirm('Reset credits for this subscription?')">
                                                                <i class="bi bi-arrow-clockwise me-2"></i>Reset Credits
                                                            </button>
                                                        </form>
                                                    </li>
                                                @endif
                                            </ul>
                                        </div>

                                        <!-- Cancel Modal -->
                                        <div class="modal fade" id="cancelModal{{ $subscription->id }}" tabindex="-1">
                                            <div class="modal-dialog">
                                                <div class="modal-content">
                                                    <div class="modal-header">
                                                        <h5 class="modal-title">Cancel Subscription</h5>
                                                        <button type="button" class="btn-close" data-bs-dismiss="modal"></button>
                                                    </div>
                                                    <form action="{{ route('booking.subscriptions.cancel', [$website, $subscription]) }}" method="POST">
                                                        @csrf
                                                        <div class="modal-body">
                                                            <p>Are you sure you want to cancel this subscription?</p>
                                                            <div class="mb-3">
                                                                <label class="form-label">Cancellation Reason (Optional)</label>
                                                                <textarea class="form-control" name="cancel_reason" rows="3" placeholder="Enter reason for cancellation..."></textarea>
                                                            </div>
                                                        </div>
                                                        <div class="modal-footer">
                                                            <button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
                                                            <button type="submit" class="btn btn-danger">Cancel Subscription</button>
                                                        </div>
                                                    </form>
                                                </div>
                                            </div>
                                        </div>
                                    </td>
                                </tr>
                            @endforeach
                        </tbody>
                    </table>
                </div>

                <!-- Pagination -->
                <div class="d-flex justify-content-between align-items-center mt-3">
                    <div class="text-muted">
                        Showing {{ $subscriptions->firstItem() }} to {{ $subscriptions->lastItem() }} of {{ $subscriptions->total() }} subscriptions
                    </div>
                    {{ $subscriptions->links() }}
                </div>
            @else
                <div class="text-center py-5">
                    <i class="bi bi-inbox display-1 text-muted"></i>
                    <h4 class="mt-4">No Subscriptions Found</h4>
                    <p class="text-muted">No customer subscriptions match your current filters.</p>
                    @if(request()->hasAny(['status', 'resource_id', 'search', 'trial']))
                        <a href="{{ route('booking.subscriptions.index', $website) }}" class="btn btn-outline-primary mt-2">
                            Clear Filters
                        </a>
                    @endif
                </div>
            @endif
        </div>
    </div>
</div>
@endsection