@*
    EN: Barista Queue — Kanban-style order queue: New / In Progress / Ready columns.
    VI: Hàng đợi Barista — Bảng đơn hàng kiểu Kanban: Mới / Đang pha / Sẵn sàng.
*@
@page "/pos/cafe/barista-queue"
@layout PosLayout
@inherits PosBase

<div style="display:flex;gap:16px;padding:16px;height:100%;overflow-x:auto;">
    @* EN: Kanban columns / VI: Các cột Kanban *@
    @foreach (var column in _columns)
    {
        <div style="flex:1;min-width:280px;display:flex;flex-direction:column;gap:12px;">
            @* EN: Column header / VI: Tiêu đề cột *@
            <div style="display:flex;align-items:center;gap:8px;padding:12px 16px;background:var(--pos-bg-elevated);border-radius:var(--pos-radius);">
                <span style="width:10px;height:10px;border-radius:50%;background:@column.Color;"></span>
                <span style="font-size:15px;font-weight:600;">@column.Title</span>
                <span style="margin-left:auto;font-size:12px;color:var(--pos-text-tertiary);background:var(--pos-bg-interactive);padding:2px 8px;border-radius:6px;">
                    @_orders.Count(o => o.Status == column.Status)
                </span>
            </div>

            @* EN: Order cards / VI: Thẻ đơn hàng *@
            <div style="flex:1;display:flex;flex-direction:column;gap:8px;overflow-y:auto;">
                @foreach (var order in _orders.Where(o => o.Status == column.Status))
                {
                    <div style="background:var(--pos-bg-elevated);border-radius:var(--pos-radius);padding:16px;border-left:3px solid @column.Color;">
                        <div style="display:flex;justify-content:space-between;align-items:center;margin-bottom:8px;">
                            <span style="font-size:18px;font-weight:700;color:var(--pos-orange-primary);">#@order.Number</span>
                            <span style="font-size:11px;color:var(--pos-text-tertiary);">@order.Elapsed phút</span>
                        </div>
                        <div style="font-size:12px;color:var(--pos-text-secondary);margin-bottom:8px;">@order.Customer</div>
                        @foreach (var item in order.Items)
                        {
                            <div style="font-size:13px;color:var(--pos-text-primary);padding:2px 0;">• @item</div>
                        }
                        @if (order.Status != "ready")
                        {
                            <button style="margin-top:12px;width:100%;padding:8px;border-radius:8px;border:none;background:@column.ActionBg;color:@column.Color;font-size:13px;font-weight:600;cursor:pointer;"
                                    @onclick="() => MoveOrder(order)">
                                @column.ActionText
                            </button>
                        }
                        else
                        {
                            <button style="margin-top:12px;width:100%;padding:8px;border-radius:8px;border:none;background:rgba(34,197,94,0.15);color:var(--pos-success);font-size:13px;font-weight:600;cursor:pointer;"
                                    @onclick="() => CompleteOrder(order)">
                                Đã giao
                            </button>
                        }
                    </div>
                }
            </div>
        </div>
    }
</div>

@code {
    // EN: Column definitions / VI: Định nghĩa cột
    private readonly List<QueueColumn> _columns = new()
    {
        new("Đơn mới", "new", "#3B82F6", "Bắt đầu pha", "rgba(59,130,246,0.15)"),
        new("Đang pha", "progress", "#F59E0B", "Pha xong", "rgba(245,158,11,0.15)"),
        new("Sẵn sàng", "ready", "#22C55E", "", ""),
    };

    // EN: Demo orders / VI: Đơn hàng mẫu
    private readonly List<Order> _orders = new()
    {
        new(101, "Nguyễn Văn A", new[] { "Cà phê sữa đá x2", "Bánh mì x1" }, "new", 2),
        new(102, "Trần Thị B", new[] { "Cappuccino x1", "Croissant x1" }, "new", 5),
        new(103, "Lê Văn C", new[] { "Trà đào x1", "Sinh tố bơ x1" }, "progress", 8),
        new(104, "Phạm Thị D", new[] { "Bạc xỉu x3" }, "progress", 12),
        new(105, "Hoàng Văn E", new[] { "Latte x1" }, "ready", 15),
        new(106, "Đỗ Thị F", new[] { "Espresso x2", "Cookie x2" }, "ready", 18),
    };

    private void MoveOrder(Order order)
    {
        order.Status = order.Status == "new" ? "progress" : "ready";
    }

    private void CompleteOrder(Order order)
    {
        _orders.Remove(order);
    }

    private record QueueColumn(string Title, string Status, string Color, string ActionText, string ActionBg);
    private class Order(int number, string customer, string[] items, string status, int elapsed)
    {
        public int Number { get; set; } = number;
        public string Customer { get; set; } = customer;
        public string[] Items { get; set; } = items;
        public string Status { get; set; } = status;
        public int Elapsed { get; set; } = elapsed;
    }
}
