{% sw_extends '@Storefront/storefront/page/checkout/finish/finish-details.html.twig' %}

{% block page_checkout_finish_content %}
    {{ parent() }}

    {% if config('GjuceCreditTransferByQrcodeSW6.config.paymentMethods') is not empty && page.order.transactions.last.paymentMethodId in config('GjuceCreditTransferByQrcodeSW6.config.paymentMethods') %}
        {% set refText = config('GjuceCreditTransferByQrcodeSW6.config.referenceText') %}

        {% set refCode = config('GjuceCreditTransferByQrcodeSW6.config.referenceCode') ? config('GjuceCreditTransferByQrcodeSW6.config.referenceCode') : config('GjuceCreditTransferByQrcodeSW6.config.referenceText') %}

        {% set refTextValue = refText | replace({'%customer%': page.order.orderCustomer.customerNumber, '%order%': page.order.orderNumber }) %}

        {% set refCodeValue = refCode | replace({'%customer%': page.order.orderCustomer.customerNumber, '%order%': page.order.orderNumber }) %}

        {% set options = {
            iban: config('GjuceCreditTransferByQrcodeSW6.config.iban') | spaceless,
            bic: config('GjuceCreditTransferByQrcodeSW6.config.bic') | spaceless,
            recipient: config('GjuceCreditTransferByQrcodeSW6.config.name'),
            reference: refCodeValue,
            amount: page.order.price.rawTotal,
            currency: context.currency.isoCode,
        } %}

        <div class="card">
            <div class="card-body">
                <div class="card-title">{{ 'gjEpcQrCode.header' | trans }}</div>

                <div class="row mb-5">
                    <div class="col-md">
                        <p>
                            {{ 'gjEpcQrCode.intro' | trans }}
                        </p>

                        <p>
                            <strong>{{ 'gjEpcQrCode.recipient' | trans }}:</strong>
                            {{ config('GjuceCreditTransferByQrcodeSW6.config.name') }}<br>
                            <strong>{{ 'gjEpcQrCode.iban' | trans }}:</strong>
                            {{ config('GjuceCreditTransferByQrcodeSW6.config.iban') }}<br>
                            <strong>{{ 'gjEpcQrCode.bic' | trans }}:</strong>
                            {{ config('GjuceCreditTransferByQrcodeSW6.config.bic') }}<br>
                            <strong>{{ 'gjEpcQrCode.reference' | trans }}:</strong>
                            {{ refTextValue }}<br>
                            <strong>{{ 'gjEpcQrCode.amount' | trans }}:</strong>
                            {{ page.order.price.rawTotal | currency }}
                        </p>

                        <p>
                            {{ 'gjEpcQrCode.notice' | trans }}
                        </p>
                    </div>

                    <div class="col-md">
                        <div class="text-md-right" data-gj-epc-qr-code="true" data-gj-epc-qr-code-options='{{ options | json_encode }}'>
                            <div class="spinner-border text-primary" role="status"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>

    {% endif %}
{% endblock %}