@using Microsoft.AspNetCore.Mvc.Localization
@using System.Threading
@using gehGassi.Web.Helper
@using gehGassi.Web.Models
@using Microsoft.AspNetCore.Mvc.TagHelpers
@model gehGassi.Web.Models.CheckoutPaymentVm
@inject IViewLocalizer Localizer
@{
    var checked1 = Model.PaymentType == PaymentTypeVm.Invoice ? "checked='checked'" : "";
    var checked2 = Model.PaymentType == PaymentTypeVm.Klarna ? "checked='checked'" : "";
    var checked4 = Model.PaymentType == PaymentTypeVm.PayPal ? "checked='checked'" : "";
}
<section id="checkoutPaymentContainer">
    <div id="pageTitleAdd" style="display: none;"></div>

    <div class="form">
        @await Html.PartialAsync("_CheckoutHeader", new CheckoutHeaderVm() { Step = 3 })
        
        <h3 class="text-uppercase text-center">@Localizer["Checkout_Step_3"]</h3>

        <form cb-preventsubmit id="frmCheckoutPayment" class="" asp-controller="Shop" asp-action="CheckoutPayment" data-ajax="true" data-ajax-method="POST" data-ajax-mode="replace" data-ajax-update="#checkoutPaymentContainer">
            <input type="hidden" asp-for="PaymentType"/>
            <input type="hidden" asp-for="PaymentOnInvoice"/>
            <input type="hidden" asp-for="PayPalEnabled"/>
            <input type="hidden" asp-for="KlarnaEnabled"/>
            <div asp-validation-summary="All"></div>
            <div class="row justify-content-center">
                <div class="col-12 col-md-6 mt-2">
                    @if (Model.PaymentOnInvoice)
                    {
                        <div class="form-check mb-4">
                            <input type="radio" class="form-check-input checkout-radio" id="re" name="paymentgroup" value="@PaymentTypeVm.Invoice" @Html.Raw(checked1)/>
                            <label for="re" class="form-check-label ml-2">@Localizer["PaymentType_Invoice"]</label>
                            <img src="~/images/invoice_small_@(Thread.CurrentThread.CurrentCulture.TwoLetterISOLanguageName).png" alt="@Localizer["PaymentType_Invoice"]" style="vertical-align: middle; float: right;"/>
                        </div>
                    }
                    @if (Model.KlarnaEnabled)
                    {
                        <div class="form-check mb-4">
                            <input type="radio" class="form-check-input checkout-radio" id="cr" name="paymentgroup" value="@PaymentTypeVm.Klarna" @Html.Raw(checked2)/>
                            <label for="cr" class="form-check-label ml-2">@Localizer["PaymentType_Klarna"]</label>
                            <img src="~/images/klarna_small.png" alt="@Localizer["PaymentType_Klarna"]" style="vertical-align: middle; float: right;"/>
                        </div>
                    }
                    @if (Model.PayPalEnabled)
                    {
                        <div class="form-check mb-4">
                            <input type="radio" class="form-check-input checkout-radio" id="pp" name="paymentgroup" value="@PaymentTypeVm.PayPal" @Html.Raw(checked4)/>
                            <label for="pp" class="form-check-label ml-2">@Localizer["PaymentType_PayPal"]</label>
                            <img src="~/images/paypal_small.png" alt="@Localizer["PaymentType_PayPal"]" style="vertical-align: middle; float: right;"/>
                        </div>
                    }
                </div>
            </div>
            <div class="form-row button-row">
                <div class="col-12">
                    <div class="">
                        <button type="button" id="btnBack" class="btn btn-primary"><i class="fa fa-fw fa-arrow-left"></i> @Localizer["Button_Back"]</button>
                        <button type="button" id="btnNext" class="btn btn-primary">@Localizer["Button_Next"] <i class="fa fa-fw fa-arrow-right"></i> </button>
                    </div>
                </div>
            </div>
        </form>
    </div>

    <system-js url="~/scripts/Views/Shop/checkoutPayment.js" fresh-import="true"></system-js>
</section>