@page "/OffStats"

<div class="card shadow">
    <div class="card-header">
        <div class="card-title m-1">
            <div class="d-flex align-items-center justify-content-between fs-4">
                <div class="px-0 fs-3">
                    <b>Offerte</b>
                </div>
                <div class="px-2 d-flex">
                    <div class="input-group">
                        <span class="input-group-text">Da:</span>
                        <input type="datetime-local"
                               class="form-control"
                               min="@periodoLimit.Inizio.AddHours(-1).ToString("yyyy-MM-ddTHH:mm")"
                               max="@DateTime.Now.Hour.ToString("yyyy-MM-ddTHH:mm")"
                               @bind="@dtFrom" />

                        <span class="input-group-text">A:</span>
                        <input type="datetime-local"
                               class="form-control"
                               min="@periodoLimit.Inizio.ToString("yyyy-MM-ddTHH:mm")"
                               max="@DateTime.Now.Hour.ToString("yyyy-MM-ddTHH:mm")"
                               @bind="@dtTo" />

                        <button class="btn btn-sm @btnReload" @onclick="DoReload">
                            Carica <i class="fa-solid fa-arrows-rotate"></i>
                        </button>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="card-body">
        <OfferStats AllRecords="AllOfferRecords"></OfferStats>
    </div>
</div>

@* <div class="card shadow">
    <div class="card-header d-flex align-items-center justify-content-between">
        <div class="px-0">
            <div class="fw-bold fs-4">Offerte</div>
        </div>
        <div class="px-0 small d-flex">
            <div class="input-group mb-3">
                <span class="input-group-text">Da:</span>
                <input type="datetime-local"
                        class="form-control"
                        min="@periodoLimit.Inizio.AddHours(-1).ToString("yyyy-MM-ddTHH:mm")"
                        max="@DateTime.Now.Hour.ToString("yyyy-MM-ddTHH:mm")"
                        @bind="@dtFrom" />

                <span class="input-group-text">A:</span>
                <input type="datetime-local"
                        class="form-control"
                        min="@periodoLimit.Inizio.ToString("yyyy-MM-ddTHH:mm")"
                        max="@DateTime.Now.Hour.ToString("yyyy-MM-ddTHH:mm")"
                        @bind="@dtTo" />

                <button class="btn btn-sm @btnReload" @onclick="DoReload">
                    Carica <i class="fa-solid fa-arrows-rotate"></i>
                </button>
            </div>
        </div>
    </div>
    <div class="card-body">
        <div class="row px-2">
            <div class="col-2 px-2">
                <div class="card border-0 rounded-3 shadow">
                    <div class="card-header bg-primary bg-gradient bg-opacity-25 p-2 rounded">
                        <div class="d-flex align-items-center justify-content-center">
                            <span class="fw-bold text-dark fs-5">Stato offerte</span>
                        </div>
                    </div>
                </div>
                <PieChart CanvasId="pieOfferCount" PieDict="@DatasetCount" DictColorFill="@FillColors" DictColorBorder="@BorderColors" Label="# Richieste" />
            </div>
            <div class="col-2 px-2">
                <div class="card border-0 rounded-3 shadow">
                    <div class="card-header bg-primary bg-gradient bg-opacity-25 p-2 rounded">
                        <div class="d-flex align-items-center justify-content-center">
                            <span class="fw-bold text-dark fs-5">Venditori</span>
                        </div>
                    </div>
                </div>
                <PieChart CanvasId="pieDealerCount" PieDict="@DatasetDealerCount" DictColorFill="@FillDealerColors" DictColorBorder="@BorderDealerColors" Label="# Offerte" />
            </div>
            <div class="col-7 ps-5">
                <div class="row">
                    <div class="col-5">
                        <div class="card border-0 rounded-3 shadow">
                            <div class="card-header bg-primary bg-gradient bg-opacity-25 p-4 rounded">
                                <div class="d-flex align-items-center gap-2">
                                    <span class="text-primary"><i class="fa-solid fa-coins fa-2x"></i></span>
                                    <span class="fw-bold text-dark fs-5 ps-1">Margine medio:</span>
                                    <span class="text-primary fs-5 fw-semibold">@MargineMedio() %</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="row pt-3">
                    <div class="col-5">
                        <div class="card border-0 rounded-3 shadow">
                            <div class="card-header bg-primary bg-gradient bg-opacity-25 p-4 rounded">
                                <div class="d-flex align-items-center gap-2">
                                    <span class="text-primary"><i class="fa-solid fa-home fa-2x"></i></span>
                                    <span class="fw-bold text-dark fs-5 ps-1">Finestre per offerta:</span>
                                    <span class="text-primary fs-5 fw-semibold">@NumFinestreMedio()</span>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div> *@