@model Nop.Plugin.Misc.FruitBankPlugin.Areas.Admin.Models.PreorderDetailModel
@using FruitBank.Common.Enums

@{
    ViewBag.PageTitle = $"Előrendelés #{Model.PreorderId}";
    Layout = "~/Plugins/Misc.FruitBankPlugin/Areas/Admin/Views/_FruitBankAdminLayout.cshtml";

    var statusClass = Model.Status switch
    {
        PreorderStatus.Confirmed          => "po-status-confirmed",
        PreorderStatus.PartiallyFulfilled => "po-status-partial",
        PreorderStatus.Cancelled          => "po-status-cancelled",
        _                                 => "po-status-pending"
    };

    var statusLabel = Model.Status switch
    {
        PreorderStatus.Confirmed          => "Megerősítve",
        PreorderStatus.PartiallyFulfilled => "Részben teljesítve",
        PreorderStatus.Cancelled          => "Törölve",
        _                                 => "Függőben"
    };
}

@Html.AntiForgeryToken()

<style>
.po-status-pending   { background:#fff3cd; color:#856404; border-radius:6px; padding:4px 12px; font-weight:700; display:inline-block; }
.po-status-confirmed { background:#d4edda; color:#155724; border-radius:6px; padding:4px 12px; font-weight:700; display:inline-block; }
.po-status-partial   { background:#fff8ee; color:#c87500; border-radius:6px; padding:4px 12px; font-weight:700; display:inline-block; }
.po-status-cancelled { background:#f8d7da; color:#721c24; border-radius:6px; padding:4px 12px; font-weight:700; display:inline-block; }

.po-meta-card { background:#fff; border:1px solid #dde8da; border-radius:8px; padding:16px 20px; margin-bottom:20px; }
.po-meta-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:16px; }
.po-meta-item .label { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; color:#6b7c6e; margin-bottom:4px; }
.po-meta-item .value { font-size:15px; color:#1a3c22; font-weight:600; }

.item-fulfilled  { background:#eaf7ee; }
.item-partial    { background:#fffbf0; }
.item-dropped    { background:#fdf0f0; color:#888; }
.item-pending    { }

.qty-bar-wrap  { width:100px; display:inline-block; vertical-align:middle; }
.qty-bar       { height:6px; background:#dde8da; border-radius:3px; overflow:hidden; display:inline-block; width:100%; }
.qty-bar-fill  { height:100%; border-radius:3px; }
</style>

<!-- Back link -->
<a href="/Admin/Preorders" class="btn btn-default btn-sm mb-3">
    <i class="fas fa-arrow-left"></i> Vissza a listához
</a>

<div class="content-header clearfix">
    <h1 class="float-left">
        <i class="fas fa-calendar-plus" style="color:#2d7a3a;"></i>
        Előrendelés <strong>#@Model.PreorderId</strong>
        <span class="@statusClass ml-2">@statusLabel</span>
    </h1>
    <div class="float-right">
        @if (Model.OrderId.HasValue)
        {
            <a href="/Admin/Order/Edit/@Model.OrderId" class="btn btn-success btn-sm" target="_blank">
                <i class="fas fa-external-link-alt"></i> Rendelés #@Model.OrderId
            </a>
        }
        @if (Model.Status == PreorderStatus.Pending)
        {
            <button id="cancelBtn" class="btn btn-danger btn-sm ml-2">
                <i class="fas fa-times"></i> Visszavonás
            </button>
        }
    </div>
</div>

<section class="content">
    <div class="container-fluid">

        <!-- ── Meta cards ──────────────────────────────────────────────────── -->
        <div class="po-meta-card">
            <div class="po-meta-grid">
                <div class="po-meta-item">
                    <div class="label">Ügyfél</div>
                    <div class="value">
                        <a href="/Admin/Customer/Edit/@Model.CustomerId">@Model.CustomerName</a>
                    </div>
                    <small class="text-muted">@Model.CustomerEmail</small>
                </div>
                <div class="po-meta-item">
                    <div class="label">Kért szállítási időpont</div>
                    <div class="value"><i class="fas fa-calendar-day text-muted mr-1"></i>@Model.DateOfReceipt</div>
                </div>
                <div class="po-meta-item">
                    <div class="label">Leadva</div>
                    <div class="value">@Model.CreatedOnUtc</div>
                </div>
                <div class="po-meta-item">
                    <div class="label">Utoljára frissítve</div>
                    <div class="value">@Model.UpdatedOnUtc</div>
                </div>
                @if (!string.IsNullOrWhiteSpace(Model.CustomerNote))
                {
                    <div class="po-meta-item" style="grid-column:1/-1;">
                        <div class="label">Ügyfél megjegyzése</div>
                        <div class="value" style="font-weight:400;font-size:14px;color:#444;">@Model.CustomerNote</div>
                    </div>
                }
            </div>
        </div>

        <!-- ── Items table ─────────────────────────────────────────────────── -->
        <div class="card card-default">
            <div class="card-header">
                <strong>Tételek (@Model.Items.Count)</strong>
                @{
                    var fulfilled = Model.Items.Count(i => i.Status == PreorderItemStatus.Fulfilled);
                    var partial   = Model.Items.Count(i => i.Status == PreorderItemStatus.PartiallyFulfilled);
                    var dropped   = Model.Items.Count(i => i.Status == PreorderItemStatus.Dropped);
                    var pending   = Model.Items.Count(i => i.Status == PreorderItemStatus.Pending);
                }
                <span class="ml-2 text-muted" style="font-size:13px;">
                    @if (fulfilled > 0)  { <span class="badge badge-success">@fulfilled teljesítve</span> }
                    @if (partial  > 0)  { <span class="badge badge-warning ml-1">@partial részben</span> }
                    @if (dropped  > 0)  { <span class="badge badge-danger ml-1">@dropped ejtve</span> }
                    @if (pending  > 0)  { <span class="badge badge-secondary ml-1">@pending függőben</span> }
                </span>
            </div>
            <div class="card-body p-0">
                <table class="table table-bordered table-hover table-sm m-0">
                    <thead>
                        <tr>
                            <th>Termék</th>
                            <th width="80" class="text-center">Kérve</th>
                            <th width="80" class="text-center">Teljesítve</th>
                            <th width="160">Teljesítés</th>
                            <th width="130" class="text-right">Egységár</th>
                            <th width="130" class="text-right">Becsült ár</th>
                            <th width="110" class="text-center">Állapot</th>
                        </tr>
                    </thead>
                    <tbody>
                        @foreach (var item in Model.Items)
                        {
                            var rowClass = item.Status switch
                            {
                                PreorderItemStatus.Fulfilled          => "item-fulfilled",
                                PreorderItemStatus.PartiallyFulfilled => "item-partial",
                                PreorderItemStatus.Dropped            => "item-dropped",
                                _                                     => "item-pending"
                            };
                            var pct = item.RequestedQuantity > 0
                                ? (int)Math.Round((double)item.FulfilledQuantity / item.RequestedQuantity * 100)
                                : 0;
                            var barColor = pct == 100 ? "#2d7a3a" : pct > 0 ? "#f4a236" : "#dc3545";
                            var estimatedPrice = item.IsMeasurable
                                ? "—"
                                : (item.UnitPriceInclTax * item.FulfilledQuantity).ToString("N0") + " Ft";
                            var unitPrice = item.IsMeasurable ? "súlymérés" : item.UnitPriceInclTax.ToString("N0") + " Ft";

                            <tr class="@rowClass">
                                <td>
                                    <a href="/Admin/Product/Edit/@item.ProductId" target="_blank">@item.ProductName</a>
                                    @if (item.IsMeasurable)
                                    {
                                        <span class="badge badge-light ml-1" title="Súlymérést igényel">⚖️</span>
                                    }
                                </td>
                                <td class="text-center">@item.RequestedQuantity db</td>
                                <td class="text-center">
                                    <strong>@item.FulfilledQuantity db</strong>
                                </td>
                                <td>
                                    <div class="qty-bar-wrap">
                                        <div class="qty-bar">
                                            <div class="qty-bar-fill" style="width:@pct%;background:@barColor;"></div>
                                        </div>
                                    </div>
                                    <small class="ml-1">@pct%</small>
                                </td>
                                <td class="text-right">@unitPrice</td>
                                <td class="text-right">@estimatedPrice</td>
                                <td class="text-center">
                                    <span class="po-status-@item.Status.ToString().ToLower()" style="font-size:11px;padding:2px 6px;">
                                        @item.StatusLabel
                                    </span>
                                </td>
                            </tr>
                        }
                    </tbody>
                    @{
                        var totalEstimated = Model.Items
                            .Where(i => !i.IsMeasurable && (i.Status == PreorderItemStatus.Fulfilled || i.Status == PreorderItemStatus.PartiallyFulfilled))
                            .Sum(i => i.UnitPriceInclTax * i.FulfilledQuantity);
                    }
                    <tfoot>
                        <tr>
                            <td colspan="5" class="text-right"><strong>Becsült összeg:</strong></td>
                            <td class="text-right"><strong>@totalEstimated.ToString("N0") Ft</strong></td>
                            <td></td>
                        </tr>
                    </tfoot>
                </table>
            </div>
        </div>

    </div>
</section>

@if (Model.Status == PreorderStatus.Pending)
{
    <script>
    $(function () {
        $('#cancelBtn').click(function () {
            if (!confirm('Biztosan visszavonod ezt az előrendelést? Ez a művelet nem visszafordítható.')) return;
            $.ajax({
                url  : '/Admin/Preorders/Cancel/@Model.PreorderId',
                type : 'POST',
                data : { __RequestVerificationToken: $('input[name="__RequestVerificationToken"]').val() },
                success: function (res) {
                    if (res.success) {
                        location.href = '/Admin/Preorders';
                    } else {
                        alert('Hiba: ' + (res.error || 'Ismeretlen hiba'));
                    }
                }
            });
        });
    });
    </script>
}