@model OrderDetailsModel
@inject SeoSettings seoSettings
@inject IPageHeadBuilder pagebuilder
@inject IWorkContext workContext
@{
    var supportRtl = workContext.WorkingLanguage.Rtl;

    if (!Model.PrintMode)
    {
        Layout = "_SingleColumn";
    }
    else
    {
        Layout = "_Print";
    }

    //title
    pagebuilder.AddTitleParts(Loc["Title.OrderDetails"]);
}
@if (Model.PrintMode)
{
    <script>
        document.addEventListener("DOMContentLoaded", function () {
            window.print();
        });
    </script>
}
<div class="page order-details-page mb-3">
    @if (!Model.PrintMode)
    {
        <h1 class="generalTitle h2">@Loc["Order.OrderInformation"]</h1>
        <div asp-validation-summary="All"></div>

        <div class="btn-group btn-group-sm">
            <a href="@Url.RouteUrl("PrintOrderDetails", new { orderId = Model.Id })" target="_blank" class="btn btn-outline-secondary print-order-button">@Loc["Order.Print"]</a>

            @if (!Model.PdfInvoiceDisabled)
            {
                <a href="@Url.RouteUrl("GetOrderPdfInvoice", new { orderId = Model.Id })" class="btn btn-outline-secondary pdf-invoice-button">@Loc["Order.GetPDFInvoice"]</a>
            }

            @if (Model.ShowAddOrderNote)
            {
                <a @@click="$bvModal.show('ModalAddOrderNote')" class="btn btn-outline-secondary">@Loc["Order.AddOrderNote"]</a>

                var notemodel = new AddOrderNoteModel();
                notemodel.OrderId = Model.Id;

                <partial name="Partials/AddOrderNote" model="@notemodel"/>
            }
        </div>
    }

    @if (Model.UserCanCancelUnpaidOrder)
    {
        <a href="@Url.RouteUrl("CancelOrder", new { orderId = Model.Id })" class="btn btn-danger btn-sm cancel-unpaid-order-button float-right" onclick="return confirm('@Loc["Admin.Common.AreYouSure"]');">@Loc["Order.CancelOrder"]</a>
    }
    @await Component.InvokeAsync("Widget", new { widgetZone = "orderdetails_page_top", additionalData = Model.Id })

    <div class="order-details-area mt-3">
        <div class="card">
            <div class="card-body">
                <div class="form-row">
                    <div class="col-lg-4 col-md-6 col-12 order-info">
                        <ul class="order-overview px-0">
                            <li class="title">
                                <h5 class="order-number h4">
                                    <span class="d-flex"><strong>@Loc["Order.Order#"]</strong><strong>@Model.OrderNumber</strong></span>
                                </h5>
                            </li>
                            @if (!string.IsNullOrEmpty(Model.OrderCode))
                            {
                                <li class="order-code d-flex">
                                    <span class="mx-1">@Loc["Order.OrderCode"]:</span><span>@Model.OrderCode</span>
                                </li>
                            }
                            <li class="order-date d-flex">
                                @if (supportRtl)
                                {
                                    <span class="mx-1">@Loc["Order.OrderDate"]:</span>
                                    <span>@Convert.ToDateTime(Model.CreatedOn).ToString("yyyy, MMMM ,dddd")</span>
                                }
                                else
                                {
                                    <span class="mx-1">@Loc["Order.OrderDate"]:</span>
                                    <span>@Model.CreatedOn.ToString("D")</span>
                                }
                            </li>
                            <li class="order-status d-flex">
                                <span class="mx-1">@Loc["Order.OrderStatus"]:</span><span>@Model.OrderStatus</span>
                            </li>
                            <li class="order-total d-flex">
                                <span class="mx-1">@Loc["Order.OrderTotal"]:</span><span class="h5 mb-0"><strong>@Model.OrderTotal</strong></span>
                            </li>
                            @await Component.InvokeAsync("Widget", new { widgetZone = "orderdetails_page_overview", additionalData = Model.Id })
                        </ul>
                    </div>
                    <div class="col-lg-4 col-md-6 col-12 billing">
                        <ul class="billing-info px-0">
                            <li class="title">
                                <h5 class="generalTitle">@Loc["Order.BillingAddress"]</h5>
                            </li>
                            <li class="name">
                                @Model.BillingAddress.FirstName @Model.BillingAddress.LastName
                            </li>
                            <li class="email">
                                @Loc["Order.Email"]: @Model.BillingAddress.Email
                            </li>
                            @if (Model.BillingAddress.PhoneEnabled)
                            {
                                <li class="phone">
                                    @Loc["Order.Phone"]: @Model.BillingAddress.PhoneNumber
                                </li>
                            }
                            @if (Model.BillingAddress.FaxEnabled)
                            {
                                <li class="fax">
                                    @Loc["Order.Fax"]: @Model.BillingAddress.FaxNumber
                                </li>
                            }
                            @if (Model.BillingAddress.CompanyEnabled && !String.IsNullOrEmpty(Model.BillingAddress.Company))
                            {
                                <li class="company">
                                    @Model.BillingAddress.Company
                                </li>
                            }
                            @if (Model.BillingAddress.VatNumberEnabled && !String.IsNullOrEmpty(Model.BillingAddress.VatNumber))
                            {
                                <li class="company">
                                    @Model.BillingAddress.VatNumber
                                </li>
                            }
                            @if (Model.BillingAddress.StreetAddressEnabled)
                            {
                                <li class="address1">
                                    @Model.BillingAddress.Address1
                                </li>
                            }
                            @if (Model.BillingAddress.StreetAddress2Enabled && !String.IsNullOrEmpty(Model.BillingAddress.Address2))
                            {
                                <li class="address2">
                                    @Model.BillingAddress.Address2
                                </li>
                            }
                            @if (Model.BillingAddress.CityEnabled ||
                            Model.BillingAddress.StateProvinceEnabled ||
                            Model.BillingAddress.ZipPostalCodeEnabled)
                            {
                                <li class="city-state-zip">
                                    @if (Model.BillingAddress.CityEnabled)
                                    {
                                        @Model.BillingAddress.City
                                    }
                                    @if (Model.BillingAddress.CityEnabled && (Model.BillingAddress.StateProvinceEnabled || Model.BillingAddress.ZipPostalCodeEnabled))
                                    {
                                        <text>, </text>
                                    }
                                    @if (Model.BillingAddress.StateProvinceEnabled)
                                    {
                                        @Model.BillingAddress.StateProvinceName
                                    }
                                    @if (Model.BillingAddress.ZipPostalCodeEnabled)
                                    {
                                        <text> </text> @Model.BillingAddress.ZipPostalCode
                                    }
                                </li>
                            }
                            @if (Model.BillingAddress.CountryEnabled && !String.IsNullOrEmpty(Model.BillingAddress.CountryName))
                            {
                                <li class="country">
                                    @Model.BillingAddress.CountryName
                                </li>
                            }
                            @if (!String.IsNullOrEmpty(Model.VatNumber))
                            {
                                <li class="vat">
                                    <span class="label">
                                        @Loc["Order.VATNumber"]
                                    </span>
                                    <span class="value">
                                        @Model.VatNumber
                                    </span>
                                </li>
                            }
                            @if (!String.IsNullOrEmpty(Model.BillingAddress.FormattedCustomAddressAttributes))
                            {
                                <li class="custom-attributes-view">
                                    @Html.Raw(Model.BillingAddress.FormattedCustomAddressAttributes)
                                </li>
                            }
                            @if (!String.IsNullOrEmpty(Model.PaymentMethod))
                            {
                                <li class="title">
                                    <h5 class="generalMarginSupporter generalTitle">@Loc["Order.Payment"]</h5>
                                </li>
                                <li class="payment-method">
                                    <span class="label">
                                        @Loc["Order.Payment.Method"]:
                                    </span>
                                    <span class="value">
                                        @Model.PaymentMethod
                                    </span>
                                </li>
                                if (!Model.PrintMode)
                                {
                                    <li class="payment-method-status">
                                        <span class="label">
                                            @Loc["Order.Payment.Status"]:
                                        </span>
                                        <span class="value">
                                            @Model.PaymentMethodStatus
                                        </span>
                                    </li>
                                }
                                if (!Model.PrintMode && Model.CanRePostProcessPayment)
                                {
                                    <li class="repost">
                                        <form asp-route="OrderDetails" method="post">
                                            <input type="hidden" name="orderId" value="@Model.Id" />
                                            <input type="submit" asp-action="RePostPayment" name="repost-payment" value="@Loc["Order.RetryPayment"]" class="btn btn-secondary re-order-button" />
                                            <p class="hint">
                                                <em>@Loc["Order.RetryPayment.Hint"]</em>
                                            </p>
                                        </form>
                                    </li>
                                }
                            }
                            @if (Model.CustomValues != null)
                            {
                                foreach (var item in Model.CustomValues)
                                {
                                    <li class="custom-value">
                                        <span class="label">
                                            @item.Key:
                                        </span>
                                        <span class="value">
                                            @(item.Value != null ? item.Value.ToString() : "")
                                        </span>
                                    </li>
                                }
                            }
                        </ul>
                    </div>
                    @if (Model.IsShippable)
                    {
                        <div class="col-lg-4 col-md-6 col-12 shipping">
                            <ul class="shipping-info px-0">
                                <li class="title">
                                    <h5 class="generalTitle">@(Model.PickUpInStore ? Loc["Order.PickupAddress"] : Loc["Order.ShippingAddress"])</h5>
                                </li>
                                @if (!Model.PickUpInStore)
                                {
                                    <li class="name">
                                        @Model.ShippingAddress.FirstName @Model.ShippingAddress.LastName
                                    </li>
                                    <li class="email">
                                        @Loc["Order.Email"]: @Model.ShippingAddress.Email
                                    </li>
                                    if (Model.ShippingAddress.PhoneEnabled)
                                    {
                                        <li class="phone">
                                            @Loc["Order.Phone"]: @Model.ShippingAddress.PhoneNumber
                                        </li>
                                    }
                                    if (Model.ShippingAddress.FaxEnabled)
                                    {
                                        <li class="fax">
                                            @Loc["Order.Fax"]: @Model.ShippingAddress.FaxNumber
                                        </li>
                                    }
                                    if (Model.ShippingAddress.CompanyEnabled && !String.IsNullOrEmpty(Model.ShippingAddress.Company))
                                    {
                                        <li class="company">
                                            @Model.ShippingAddress.Company
                                        </li>
                                    }
                                    if (Model.ShippingAddress.StreetAddressEnabled)
                                    {
                                        <li class="address1">
                                            @Model.ShippingAddress.Address1
                                        </li>
                                    }
                                    if (Model.ShippingAddress.StreetAddress2Enabled && !String.IsNullOrEmpty(Model.ShippingAddress.Address2))
                                    {
                                        <li class="address2">
                                            @Model.ShippingAddress.Address2
                                        </li>
                                    }
                                    if (Model.ShippingAddress.CityEnabled ||
                                        Model.ShippingAddress.StateProvinceEnabled ||
                                        Model.ShippingAddress.ZipPostalCodeEnabled)
                                    {
                                        <li class="city-state-zip">
                                            @if (Model.ShippingAddress.CityEnabled)
                                            {
                                                @Model.ShippingAddress.City
                                            }
                                            @if (Model.ShippingAddress.CityEnabled && (Model.ShippingAddress.StateProvinceEnabled || Model.ShippingAddress.ZipPostalCodeEnabled))
                                            {
                                                <text>, </text>
                                            }
                                            @if (Model.ShippingAddress.StateProvinceEnabled)
                                            {
                                                @Model.ShippingAddress.StateProvinceName
                                            }
                                            @if (Model.ShippingAddress.ZipPostalCodeEnabled)
                                            {
                                                <text> </text> @Model.ShippingAddress.ZipPostalCode
                                            }
                                        </li>
                                    }
                                    if (Model.ShippingAddress.CountryEnabled && !String.IsNullOrEmpty(Model.ShippingAddress.CountryName))
                                    {
                                        <li class="country">
                                            @Model.ShippingAddress.CountryName
                                        </li>
                                    }
                                    if (!String.IsNullOrEmpty(Model.ShippingAddress.FormattedCustomAddressAttributes))
                                    {
                                        <li class="custom-attributes-view">
                                            @Html.Raw(Model.ShippingAddress.FormattedCustomAddressAttributes)
                                        </li>
                                    }
                                }
                                else
                                {
                                    if (!string.IsNullOrEmpty(Model.PickupAddress.Address1))
                                    {
                                        <li class="address1">
                                            @Model.PickupAddress.Address1
                                        </li>
                                    }
                                    if (!string.IsNullOrEmpty(Model.PickupAddress.City) || !string.IsNullOrEmpty(Model.PickupAddress.ZipPostalCode))
                                    {
                                        <li class="city-state-zip">
                                            @if (!string.IsNullOrEmpty(Model.PickupAddress.City))
                                            {
                                                @Model.PickupAddress.City
                                            }
                                            @if (!string.IsNullOrEmpty(Model.PickupAddress.ZipPostalCode))
                                            {
                                                <text>,</text>
                                                @Model.PickupAddress.ZipPostalCode
                                            }
                                        </li>
                                    }
                                    if (!string.IsNullOrEmpty(Model.PickupAddress.CountryName))
                                    {
                                        <li class="country">
                                            @Model.PickupAddress.CountryName
                                        </li>
                                    }
                                }
                                <li class="title">
                                    <h5 class="generalMarginSupporter generalTitle">@Loc["Order.Shipping"]</h5>
                                </li>
                                <li class="shipping-method">
                                    <span class="label">
                                        @Loc["Order.Shipping.Name"]:
                                    </span>
                                    <span class="value">
                                        @Model.ShippingMethod
                                    </span>
                                    @if (!string.IsNullOrEmpty(Model.ShippingAdditionDescription))
                                    {
                                        <div> @Html.Raw(Model.ShippingAdditionDescription)</div>
                                    }

                                </li>
                                @if (!Model.PrintMode && !Model.PickUpInStore)
                                {
                                    <li class="shipping-status">
                                        <span class="label">
                                            @Loc["Order.Shipping.Status"]:
                                        </span>
                                        <span class="value">
                                            @Model.ShippingStatus
                                        </span>
                                    </li>
                                }
                            </ul>
                        </div>
                    }
                </div>
            </div>
        </div>
    </div>

    @if (Model.Items.Any())
    {
        @await Component.InvokeAsync("Widget", new { widgetZone = "orderdetails_page_beforeproducts", additionalData = Model.Id })
        <div class="products mt-3 shopping-cart-page">
            <div>
                <div class="col-12 px-0">
                    <div class="row">
                        <div class="col-xl-8 col-12 cart-out-container">
                            <h5 class="generalTitle">@Loc["Order.Product(s)"]</h5>
                            <div class="shopping-cart-container">
                                <div id="order-details" class="table-responsive">
                                    <table class="table">
                                        <thead role="rowgroup">
                                            <tr role="row">
                                                <th role="columnheader" class="text-center"><div>@Loc["Order.Product(s).Picture"]</div></th>
                                                <th role="columnheader" class="text-center"><div>@Loc["Order.Product(s).Name"]</div></th>
                                                <th role="columnheader" class="text-center"><div>@Loc["Order.Product(s).Price"]</div></th>
                                                <th role="columnheader" class="text-center"><div>@Loc["Order.Product(s).Quantity"]</div></th>
                                                <th role="columnheader" class="text-center"><div>@Loc["Order.Product(s).Total"]</div></th>
                                            </tr>
                                        </thead>
                                        <tbody role="rowgroup">
                                            @foreach (var item in Model.Items)
                                            {
                                                <tr role="row">
                                                    <td class="text-center">
                                                        <div>
                                                            <a href="@Url.RouteUrl("Product", new { SeName = item.ProductSeName })">
                                                                <img alt="@item.Picture.AlternateText" src="@item.Picture.ImageUrl" title="@item.Picture.Title" />
                                                            </a>
                                                        </div>
                                                    </td>
                                                    <td class="text-center">
                                                        <div>
                                                            @if (!Model.PrintMode)
                                                            {
                                                                <em><a href="@Url.RouteUrl("Product", new { SeName = item.ProductSeName })">@item.ProductName</a></em>}
                                                            else
                                                            {
                                                                @item.ProductName
                                                            }
                                                            @if (Model.ShowSku)
                                                            {
                                                                <div class="sku w-100 text-center text-md-left">@item.Sku</div>
                                                            }
                                                            @if (!string.IsNullOrEmpty(item.AttributeInfo))
                                                            {
                                                                <div class="attributes">@Html.Raw(item.AttributeInfo)</div>
                                                            }
                                                            @if (!string.IsNullOrEmpty(item.RentalInfo))
                                                            {
                                                                <div class="rental-info">@Html.Raw(item.RentalInfo)</div>
                                                            }
                                                            @if (!String.IsNullOrEmpty(item.DownloadId))
                                                            {
                                                                <div class="download"><a href="@Url.RouteUrl("GetDownload", new { orderItemId = item.OrderItemGuid })">@Loc["DownloadableProducts.Fields.Download"]</a></div>
                                                            }
                                                            @if (!String.IsNullOrEmpty(item.LicenseId))
                                                            {
                                                                <div class="download license">
                                                                    <a href="@Url.RouteUrl("GetLicense", new {orderItemId = item.OrderItemGuid})">@Loc["DownloadableProducts.Fields.DownloadLicense"]</a>
                                                                </div>
                                                            }
                                                            @await Component.InvokeAsync("Widget", new { widgetZone = "orderdetails_product_line", additionalData = item.Id })
                                                        </div>
                                                    </td>
                                                    <td class="text-center">
                                                        <div>
                                                            <span class="product-unit-price price">@item.UnitPrice</span>
                                                            @if (item.UnitPriceWithoutDiscountValue != item.UnitPriceValue && item.UnitPriceWithoutDiscountValue > 0)
                                                            {
                                                                <div class="text-center">
                                                                    <del class="small text-danger">(@item.UnitPriceWithoutDiscount)</del>
                                                                </div>
                                                            }
                                                        </div>
                                                    </td>
                                                    <td class="text-center">
                                                        <div>
                                                            <span class="d-inline-block d-xl-none mr-1">@Loc["shoppingcart.quantity"]:</span> @item.Quantity
                                                        </div>
                                                    </td>
                                                    <td class="text-center">
                                                        <div>
                                                            <span class="product-subtotal price prod-total">@item.SubTotal</span>
                                                            @if (!string.IsNullOrEmpty(item.Discount))
                                                            {
                                                                <div class="discount text-success text-center"><span>@Loc["ShoppingCart.Discount"]: </span><span>@item.Discount</span></div>
                                                            }
                                                        </div>
                                                    </td>
                                                </tr>
                                            }
                                        </tbody>
                                    </table>
                                </div>
                            </div>
                        </div>
                        <div class="col-lg-4 col-12 totals">
                            <div class="totals-inner">
                                <div class="total-info table-responsive px-0">
                                    <table class="table table-hover">
                                        <tbody>
                                            <tr>
                                                <td class="cart-total-left">
                                                    <label>@Loc["Order.SubTotal"]:</label>
                                                </td>
                                                <td class="cart-total-right text-right">
                                                    <span>@Model.OrderSubtotal</span>
                                                </td>
                                            </tr>
                                            @if (!string.IsNullOrEmpty(Model.OrderSubTotalDiscount))
                                            {
                                                <tr>
                                                    <td class="cart-total-left">
                                                        <label>@Loc["Order.SubTotalDiscount"]:</label>
                                                    </td>
                                                    <td class="cart-total-right text-right">
                                                        <span>@Model.OrderSubTotalDiscount</span>
                                                    </td>
                                                </tr>
                                            }
                                            @if (Model.IsShippable)
                                            {
                                                <tr>
                                                    <td class="cart-total-left">
                                                        <label>@Loc["Order.Shipping"]:</label>
                                                    </td>
                                                    <td class="cart-total-right text-right">
                                                        <span>@Model.OrderShipping</span>
                                                    </td>
                                                </tr>
                                            }
                                            @if (!string.IsNullOrEmpty(Model.PaymentMethodAdditionalFee))
                                            {
                                                <tr>
                                                    <td class="cart-total-left">
                                                        <label>@Loc["Order.PaymentMethodAdditionalFee"]:</label>
                                                    </td>
                                                    <td class="cart-total-right text-right">
                                                        <span>@Model.PaymentMethodAdditionalFee</span>
                                                    </td>
                                                </tr>
                                            }
                                            @if (Model.DisplayTaxRates && Model.TaxRates.Any())
                                            {
                                                foreach (var taxRate in Model.TaxRates)
                                                {
                                                    <tr>
                                                        <td class="cart-total-left">
                                                            <label>@string.Format(Loc["Order.TaxRateLine"], taxRate.Rate):</label>
                                                        </td>
                                                        <td class="cart-total-right text-right">
                                                            <span>@taxRate.Value</span>
                                                        </td>
                                                    </tr>
                                                }
                                            }
                                            @if (Model.DisplayTax)
                                            {
                                                <tr>
                                                    <td class="cart-total-left">
                                                        <label>@Loc["Order.Tax"]:</label>
                                                    </td>
                                                    <td class="cart-total-right text-right">
                                                        <span>@Model.Tax</span>
                                                    </td>
                                                </tr>
                                            }
                                            @if (!string.IsNullOrEmpty(Model.OrderTotalDiscount))
                                            {
                                                <tr>
                                                    <td class="cart-total-left">
                                                        <label>@Loc["Order.TotalDiscount"]:</label>
                                                    </td>
                                                    <td class="cart-total-right text-right">
                                                        <span>@Model.OrderTotalDiscount</span>
                                                    </td>
                                                </tr>
                                            }
                                            @if (Model.GiftVouchers.Any())
                                            {
                                                foreach (var gc in Model.GiftVouchers)
                                                {
                                                    <tr>
                                                        <td class="cart-total-left">
                                                            <label>@string.Format(Loc["Order.GiftVoucherInfo"], gc.CouponCode):</label>
                                                        </td>
                                                        <td class="cart-total-right text-right">
                                                            <span>@gc.Amount</span>
                                                        </td>
                                                    </tr>
                                                }
                                            }
                                            @if (Model.RedeemedLoyaltyPoints > 0)
                                            {
                                                <tr>
                                                    <td class="cart-total-left">
                                                        <label>@string.Format(Loc["Order.LoyaltyPoints"], Model.RedeemedLoyaltyPoints):</label>
                                                    </td>
                                                    <td class="cart-total-right text-right">
                                                        <span>@Model.RedeemedLoyaltyPointsAmount</span>
                                                    </td>
                                                </tr>
                                            }
                                            <tr>
                                                <td class="cart-total-left">
                                                    <label>@Loc["Order.OrderTotal"]:</label>
                                                </td>
                                                <td class="cart-total-right text-right">
                                                    <span><strong>@Model.OrderTotal</strong></span>
                                                </td>
                                            </tr>
                                        </tbody>
                                    </table>
                                </div>
                                <div class="d-inline-flex w-100 justify-content-between flex-wrap">
                                    @if (!String.IsNullOrEmpty(Model.CheckoutAttributeInfo))
                                    {
                                        <div class="selected-checkout-attributes">
                                            @Html.Raw(Model.CheckoutAttributeInfo)
                                        </div>
                                    }
                                    @if (!Model.PrintMode)
                                    {
                                        <div class="actions">
                                            @if (Model.IsReOrderAllowed)
                                            {
                                                <input type="button" value="@Loc["Order.Reorder"]" class="btn btn-outline-info re-order-button" onclick="location = ('@Url.RouteUrl("ReOrder", new { orderId = Model.Id })    ')" />
                                            }
                                            @if (Model.IsMerchandiseReturnAllowed)
                                            {
                                                <input type="button" value="@Loc["Order.ReturnItems"]" class="btn btn-outline-info return-items-button" onclick="location = ('@Url.RouteUrl("MerchandiseReturn", new { orderId = Model.Id })    ')" />
                                            }
                                        </div>
                                    }
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        @await Component.InvokeAsync("Widget", new { widgetZone = "orderdetails_page_afterproducts", additionalData = Model.Id })
    }
    else
    {
        <script>var mix = {}</script>
    }
    @if (!Model.PrintMode)
    {
        if (Model.Shipments.Any())
        {
            <div class="shipments px-0">
                <h5><strong>@Loc["Order.Shipments"]</strong></h5>
                <div class="col-12 px-1">
                    <table class="table table-hover">
                        <colgroup>
                            <col />
                        </colgroup>
                        <thead class="table-inverse">
                            <tr>
                                <th>
                                    <div class="row">
                                        <div class="shipment-id col-md-2 col-sm-12">
                                            @Loc["Order.Shipments.ID"]
                                        </div>
                                        <div class="tracking-number col-sm-2 d-none d-md-block">
                                            @Loc["Order.Shipments.TrackingNumber"]
                                        </div>
                                        <div class="shipping-date col-sm-3 d-none d-md-block">
                                            @Loc["Order.Shipments.ShippedDate"]
                                        </div>
                                        <div class="delivery-date col-sm-3 d-none d-md-block">
                                            @Loc["Order.Shipments.DeliveryDate"]
                                        </div>
                                        <div class="view-details col-sm-2 d-none d-md-block">
                                            @Loc["Order.Shipments.ViewDetails"]
                                        </div>
                                    </div>
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach (var item in Model.Shipments)
                            {
                                <tr>
                                    <td>
                                        <div class="row">
                                            <div class="shipment-id col-md-2 col-sm-12">
                                                <strong class="d-lg-none">@Loc["Order.Shipments.ID"]: </strong>
                                                <span>@item.ShipmentNumber.ToString()</span>
                                            </div>
                                            <div class="tracking-number col-md-2 col-sm-12">
                                                <strong class="d-lg-none">@Loc["Order.Shipments.TrackingNumber"]: </strong>
                                                @item.TrackingNumber
                                            </div>
                                            <div class="shipped-date col-md-3 col-sm-12">
                                                <div class="d-flex">
                                                    @if (item.ShippedDate.HasValue)
                                                    {
                                                        if (supportRtl)
                                                        {
                                                            <strong class="mx-1 d-lg-none">@Loc["Order.Shipments.ShippedDate"]:</strong>
                                                            <span>@Convert.ToDateTime(item.ShippedDate.Value).ToString("yyyy, MMMM ,dddd")</span>
                                                        }
                                                        else
                                                        {
                                                            <strong class="mx-1 d-lg-none">@Loc["Order.Shipments.ShippedDate"]:</strong>
                                                            <span>@item.ShippedDate.Value.ToString("D")</span>
                                                        }
                                                    }
                                                    else
                                                    {
                                                        <strong class="d-lg-none">@Loc["Order.Shipments.ShippedDate"]: </strong>
                                                        <span>@Loc["Order.Shipments.ShippedDate.NotYet"]</span>
                                                    }
                                                </div>
                                            </div>
                                            <div class="delivery-date col-md-3 col-sm-12">
                                                <div class="d-fle">
                                                    @if (item.DeliveryDate.HasValue)
                                                    {
                                                        if (supportRtl)
                                                        {
                                                            <strong class="mx-1 d-lg-none">@Loc["Order.Shipments.OrderDate"]:</strong>
                                                            <span>@Convert.ToDateTime(item.DeliveryDate.Value).ToString("yyyy, MMMM ,dddd")</span>
                                                        }
                                                        else
                                                        {
                                                            <strong class="mx-1 d-lg-none">@Loc["Order.Shipments.OrderDate"]:</strong>
                                                            <span>@item.DeliveryDate.Value.ToString("D")</span>
                                                        }
                                                    }
                                                    else
                                                    {
                                                        <span class="d-lg-none">@Loc["Order.Shipments.ViewDetails"]</span>
                                                        <span>@Loc["Order.Shipments.DeliveryDate.NotYet"]</span>
                                                    }
                                                </div>
                                            </div>
                                            <div class="view-details col-md-2 col-sm-12">
                                                <a class="btn btn-sm btn-secondary" href="@Url.RouteUrl("ShipmentDetails", new { shipmentId = item.Id })" title="@Loc["Order.Shipments.ViewDetails"]">@Loc["Order.Shipments.ViewDetails"]</a>
                                            </div>
                                        </div>
                                    </td>
                                </tr>
                            }
                        </tbody>
                    </table>
                </div>
            </div>
        }
    }
    @if (!Model.PrintMode)
    {
        if (Model.OrderNotes.Any())
        {
            <div class="order-notes">
                <h5>
                    @Loc["Order.Notes"]
                </h5>
                <div class="table-responsive">
                    <table class="table table-hover data-table">
                        <colgroup>
                            <col />
                            <col />
                        </colgroup>
                        <thead class="table-inverse">
                            <tr class="row mx-0">
                                <th class="created-on col-4">
                                    @Loc["Order.Notes.CreatedOn"]
                                </th>
                                <th class="note col-8">
                                    @Loc["Order.Notes.Note"]
                                </th>
                            </tr>
                        </thead>
                        <tbody>
                            @foreach (var item in Model.OrderNotes)
                            {
                                <tr class="row mx-0">
                                    <td class="created-on col-4">
                                        @item.CreatedOn.ToString()
                                    </td>
                                    <td class="note col-8">
                                        @Html.Raw(item.Note)
                                        @if (item.HasDownload)
                                        {
                                            <p class="download">
                                                <a href="@Url.RouteUrl("GetOrderNoteFile", new { ordernoteid = item.Id })">@Loc["Order.Notes.Download"]</a>
                                            </p>
                                        }
                                    </td>
                                </tr>
                            }
                        </tbody>
                    </table>
                </div>
            </div>
        }
    }
    @await Component.InvokeAsync("Widget", new { widgetZone = "orderdetails_page_bottom", additionalData = Model.Id })
</div>