@page "/superadmin/subscriptions"
@layout SuperAdminLayout
@inherits SuperAdminBase
@inject SuperAdminApiService Api
@using WebClientTpos.Client.Services

<PageTitle>Gói đăng ký — aPOS Super Admin</PageTitle>

<div class="sa-topbar">
    <div class="sa-topbar__left">
        <h1 class="sa-topbar__title">Quản lý gói đăng ký</h1>
        <p class="sa-topbar__subtitle">Cấu hình các gói dịch vụ cho doanh nghiệp</p>
    </div>
</div>

<div class="sa-content">
    @if (_plans.Any())
    {
        <div style="display:grid;grid-template-columns:repeat(auto-fit, minmax(280px, 1fr));gap:20px;">
            @foreach (var plan in _plans)
            {
                <div class="sa-panel" style="overflow:visible;">
                    <div class="sa-panel__body" style="display:flex;flex-direction:column;gap:16px;">
                        @* Header *@
                        <div style="display:flex;align-items:center;justify-content:space-between;">
                            <div>
                                <div style="font-size:18px;font-weight:800;color:var(--sa-text-primary);">@plan.Name</div>
                                <div style="font-size:12px;color:var(--sa-text-tertiary);">@plan.Slug</div>
                            </div>
                            <span class="sa-badge @(plan.IsActive ? "sa-badge--success" : "sa-badge--neutral")">
                                @(plan.IsActive ? "Đang hoạt động" : "Tắt")
                            </span>
                        </div>

                        @* Description *@
                        <p style="font-size:13px;color:var(--sa-text-secondary);margin:0;">@plan.Description</p>

                        @* Pricing *@
                        <div style="padding:16px;background:var(--sa-bg-interactive);border-radius:8px;">
                            @if (plan.PriceMonthly > 0)
                            {
                                <div style="font-size:24px;font-weight:800;color:var(--sa-blue-light);">
                                    @plan.PriceMonthly.ToString("N0")đ
                                    <span style="font-size:13px;font-weight:400;color:var(--sa-text-tertiary);">/tháng</span>
                                </div>
                                @if (plan.PriceYearly.HasValue && plan.PriceYearly > 0)
                                {
                                    <div style="font-size:13px;color:var(--sa-text-tertiary);margin-top:4px;">
                                        @(plan.PriceYearly.Value.ToString("N0"))đ/năm (tiết kiệm @(((1 - plan.PriceYearly.Value / (plan.PriceMonthly * 12)) * 100).ToString("N0"))%)
                                    </div>
                                }
                            }
                            else if (plan.Name == "Enterprise")
                            {
                                <div style="font-size:24px;font-weight:800;color:var(--sa-blue-light);">Liên hệ</div>
                                <div style="font-size:13px;color:var(--sa-text-tertiary);margin-top:4px;">Tùy chỉnh theo nhu cầu</div>
                            }
                            else
                            {
                                <div style="font-size:24px;font-weight:800;color:var(--sa-success);">Miễn phí</div>
                            }
                        </div>

                        @* Limits *@
                        <div style="display:flex;flex-direction:column;gap:8px;">
                            <div style="display:flex;justify-content:space-between;font-size:13px;">
                                <span style="color:var(--sa-text-tertiary);">Cửa hàng tối đa</span>
                                <span style="color:var(--sa-text-primary);font-weight:600;">@(plan.MaxShops >= 999 ? "Không giới hạn" : plan.MaxShops.ToString())</span>
                            </div>
                            <div style="display:flex;justify-content:space-between;font-size:13px;">
                                <span style="color:var(--sa-text-tertiary);">Nhân viên tối đa</span>
                                <span style="color:var(--sa-text-primary);font-weight:600;">@(plan.MaxStaff >= 999 ? "Không giới hạn" : plan.MaxStaff.ToString())</span>
                            </div>
                            <div style="display:flex;justify-content:space-between;font-size:13px;">
                                <span style="color:var(--sa-text-tertiary);">Sản phẩm tối đa</span>
                                <span style="color:var(--sa-text-primary);font-weight:600;">@(plan.MaxProducts >= 99999 ? "Không giới hạn" : plan.MaxProducts.ToString("N0"))</span>
                            </div>
                            <div style="display:flex;justify-content:space-between;font-size:13px;">
                                <span style="color:var(--sa-text-tertiary);">Doanh nghiệp sử dụng</span>
                                <span style="color:var(--sa-text-primary);font-weight:600;">@plan.MerchantCount</span>
                            </div>
                        </div>
                    </div>
                </div>
            }
        </div>
    }
    else
    {
        <div class="sa-panel">
            <div class="sa-empty">
                <p>Đang tải gói đăng ký...</p>
            </div>
        </div>
    }
</div>

@code {
    private List<SuperAdminApiService.SubscriptionPlanDto> _plans = new();

    protected override async Task OnInitializedAsync()
    {
        await base.OnInitializedAsync();
        _plans = await Api.GetPlansAsync();
    }
}
