@using Access.Feature.Shop.Models
@inherits Glass.Mapper.Sc.Web.Mvc.GlassView<Access.Feature.Shop.ViewModels.ProductListingViewModel>


<div class="standard-product-list ecommerce" id="ecommerce">

    <div class="standard-product-list__inner">

        @if (Model.Results != null)
    {
        foreach (var product in Model.Results.Products)
        {

            <div class="standard-product-list__item">

                @if (product.MainImage != null)
            {
                <img src="@product.MainImage.Src" class="standard-product-list__item-image" alt="@product.MainImage.Alt" />
        }
                <h3 class="standard-product-list__item-heading">@product.Name</h3>
                @if (product.Price != null)
            {
                <span class="standard-product-list__item-price">£@product.Price.Amount</span>
        }
                <p>@Html.Raw(@product.FullDescription)</p>

                <product-cart-btns :key="ecommerceCommonData.updateKey" product-id="@product.Id.ToString()" product-price="@product.Price.Amount"></product-cart-btns>
            </div>

    }




}

        <!-- this is where we get injected -->
        <div class="standard-product-list__item" v-for="item in ecommerceCommonData.moreItems" v-html="item"></div>
        <!-- this is where we get injected end -->



    </div>
    @if (Model.ShowMoreLink)
    {
        <a class="load-more-products" v-show="ecommerceCommonData.showLoadMoreBtn" v-on:click="loadMore()" href="@Model.NextPageLink">View More</a>
    }
</div>