@page "/kasse"
@using PlanTempus.Application.Features.CashRegister.Pages
@model PlanTempus.Application.Features.CashRegister.Pages.IndexModel
@{
    ViewData["Title"] = "Kasse";
}

<!-- Sticky Header (Stats + Tabs) -->
<swp-sticky-header>
    <!-- Context Stats (changes based on active tab) -->
    <swp-header-content>
        <!-- Stats for Oversigt tab -->
        <swp-stats-row class="cols-4 active" data-for-tab="oversigt">
            <swp-stat-card>
                <swp-stat-value>12</swp-stat-value>
                <swp-stat-label localize="cash.stats.reconciliationsInPeriod">Afstemninger i periode</swp-stat-label>
            </swp-stat-card>
            <swp-stat-card class="highlight">
                <swp-stat-value>186.450 kr</swp-stat-value>
                <swp-stat-label localize="cash.stats.totalRevenue">Total omsætning</swp-stat-label>
            </swp-stat-card>
            <swp-stat-card>
                <swp-stat-value>42.340 kr</swp-stat-value>
                <swp-stat-label localize="cash.stats.cashSales">Kontantsalg</swp-stat-label>
            </swp-stat-card>
            <swp-stat-card class="warning">
                <swp-stat-value>-75 kr</swp-stat-value>
                <swp-stat-label localize="cash.stats.totalDifference">Samlet difference</swp-stat-label>
            </swp-stat-card>
        </swp-stats-row>

        <!-- Stats for Kasseafstemning tab -->
        <swp-stats-row class="cols-4" data-for-tab="afstemning">
            <swp-stat-card>
                <swp-stat-value>47</swp-stat-value>
                <swp-stat-label localize="cash.stats.transactionsToday">Transaktioner i dag</swp-stat-label>
            </swp-stat-card>
            <swp-stat-card class="highlight">
                <swp-stat-value>18.865 kr</swp-stat-value>
                <swp-stat-label localize="cash.stats.revenueToday">Omsætning i dag</swp-stat-label>
            </swp-stat-card>
            <swp-stat-card>
                <swp-stat-value>29. dec 17:45</swp-stat-value>
                <swp-stat-label localize="cash.stats.lastReconciliation">Sidste afstemning</swp-stat-label>
            </swp-stat-card>
            <swp-stat-card>
                <swp-stat-value>Anna J.</swp-stat-value>
                <swp-stat-label localize="cash.stats.openedRegister">Åbnede kassen 29. dec 09:05</swp-stat-label>
            </swp-stat-card>
        </swp-stats-row>
    </swp-header-content>

    <!-- Tab Bar -->
    <swp-tab-bar>
        <swp-tab class="active" data-tab="oversigt">
            <i class="ph ph-list-checks"></i>
            <span localize="cash.tabs.overview">Oversigt</span>
        </swp-tab>
        <swp-tab data-tab="afstemning">
            <i class="ph ph-cash-register"></i>
            <span localize="cash.tabs.reconciliation">Kasseafstemning</span>
        </swp-tab>
    </swp-tab-bar>
</swp-sticky-header>

<!-- Tab Content: Oversigt -->
<swp-tab-content data-tab="oversigt" class="active">
    <swp-page-container>
        @await Component.InvokeAsync("RegisterFilterBar")
        @await Component.InvokeAsync("ReconciliationTable")
    </swp-page-container>
</swp-tab-content>

<!-- Tab Content: Kasseafstemning -->
<swp-tab-content data-tab="afstemning">
    <swp-page-container>
        <swp-cash-grid>
            <swp-cash-column>
                @await Component.InvokeAsync("PeriodRevenue")
                @await Component.InvokeAsync("CashBalance")
                @await Component.InvokeAsync("CashDifference")
            </swp-cash-column>

            <swp-cash-column>
                @await Component.InvokeAsync("PeriodInfo")
                @await Component.InvokeAsync("ReconciliationNote")
                @await Component.InvokeAsync("CashApproval")
            </swp-cash-column>
        </swp-cash-grid>

        <swp-system-note localize="cash.systemNote">Systemet gemmer hvornår og af hvem der er godkendt – enkelt kontrolspor.</swp-system-note>
    </swp-page-container>
</swp-tab-content>