@using Microsoft.eShopOnContainers.WebMVC.Models

@model IEnumerable<Microsoft.eShopOnContainers.WebMVC.Models.Order>

@{
    ViewData["Title"] = "My Orders";
}

<div class="esh-orders">
    @Html.Partial("_Header", new Header() { Controller = "Catalog", Text = "Back to catalog" })

    <div class="container">
        <article class="esh-orders-titles row">
            <section class="esh-orders-title col-xs-2">Order number</section>
            <section class="esh-orders-title col-xs-4">Date</section>
            <section class="esh-orders-title col-xs-2">Total</section>
            <section class="esh-orders-title col-xs-2">Status</section>
            <section class="esh-orders-title col-xs-2"></section>
        </article>

        @foreach (var item in Model)
        {
            <article class="esh-orders-items row">
                <section class="esh-orders-item col-xs-2">@Html.DisplayFor(modelItem => item.OrderNumber)</section>
                <section class="esh-orders-item col-xs-4">@Html.DisplayFor(modelItem => item.Date)</section>
                <section class="esh-orders-item col-xs-2">$ @Html.DisplayFor(modelItem => item.Total)</section>
                <section class="esh-orders-item col-xs-2">@Html.DisplayFor(modelItem => item.Status)</section>
                <section class="esh-orders-item esh-orders-item--hover col-xs-2">
                    <a class="esh-orders-link" asp-controller="Order" asp-action="Detail" asp-route-orderId="@item.OrderNumber">Detail</a>
                </section>
            </article>
        }
    </div>
</div>