{% extends "base.html.twig" %}

{% block BeforeAnyCSSFile %}
    {% for file in encore_entry_css_files('select2__init') %}
        <link rel="stylesheet" href="{{ assetsBasePath~file }}">
    {% endfor %}
{% endblock %}

{% block ExtraCSSFiles %}
{% endblock %}

{% block pageLabel %}
    {{ 'Pay Invoice'|trans }}
{% endblock %}

{% block recordLength %}
{% endblock %}

{% block MainContent %}
    <span class="r__q__s" data-path="{{ path('requestHandler___accounts') }}"></span>

    {# Total amount #}
    {% set invoiceTotalAmount = invoice.getTotalAmountOfInvoice %}

    <div class="kt-portlet">
        <div class="kt-portlet__body">

            {# invoice action buttons #}
            <div class="row">
                <div class="col-xl-12 col-lg-12 col-sm-12 col-xs-12">
                    {#invoice action buttons#}
                    {% if is_granted("ROLE_ADMIN") %}
                        <a target="_blank" class="kt-nav__link"
                           href="{{ path('invoices_', {'id':invoice.getID| urlencrypt}) }}"><i
                                    class="kt-nav__link-icon flaticon-edit-1"></i><span
                                    class="kt-nav__link-text">{{ 'Edit'|trans }}</span></a>
                    {% endif %}

                    &nbsp;&nbsp;
                    {# print invoice #}

                    <a class="kt-nav__link" target="_blank"
                       href="{{ path('invoices_view', {'invoice':invoice.getID| urlencrypt , 'printResult' : 1}) }}"><i
                                class="kt-nav__link-icon flaticon-print"></i><span
                                class="kt-nav__link-text">{{ 'Print Invoice'|trans }}</span></a>

                    &nbsp;&nbsp;

                    {# print challan #}

                    <a class="kt-nav__link" target="_blank"
                       href="{{ path('print_invoice_and_challan_form', {'invoice':invoice.getID| urlencrypt, 'printResult':1}) }}"><i
                                class="kt-nav__link-icon flaticon-print"></i><span
                                class="kt-nav__link-text">{{ 'Print Challan'|trans }}</span></a>
                </div>
            </div>

            <div class="row">
                <div class="col-xl-6 col-lg-6 col-sm-12 col-xs-12">
                    <table class="table table-bordered">
                        {# invoice paid to #}
                        <tr>
                            <th>{{ 'User name' | trans }}</th>
                            <td> {{ invoice.getInvoiceGeneratedForUnregisterUsername is empty ? invoice.getInvGeneratedFor.getFName : invoice.getInvoiceGeneratedForUnregisterUsername ~ ' (Un-register user)' }}</td>
                        </tr>
                        {# invoice refernce #}
                        <tr>
                            <th>{{ 'Ref#' | trans }}</th>
                            <td> {{ invoice.getInvReference }}</td>
                        </tr>
                        {# Generation date, invoice#}
                        <tr>
                            <th>{{ 'Invoice date' | trans }}</th>
                            <td> {{ date_format( invoice.getInvGeneratedDatetime) }}</td>
                        </tr>
                        {# Invoice due date #}
                        <tr>
                            <th>{{ 'Due date' | trans }}</th>
                            <td> {{ date_format( invoice.getInvDueDate) }}</td>
                        </tr>
                    </table>
                </div>
                {# Inovoice status & Amount #}
                <div class="col-xl-6 col-lg-6 col-sm-12 col-xs-12 text-center">
                    <h3 class="kt-margin-b-10">{{ invoice.getTheInvoiceStatus }}</h3>

                    <h6>{{ 'Total Amount' | trans }} {{ invoiceTotalAmount }}</h6>
                    {#<h6>{{ 'Remaining Amount'| trans }} {{ invoice.getTheInvoiceAmountWhichIsNotPaid }} </h6>#}
                </div>
            </div>
        </div>
    </div>

    {# Pay Invoice block #}
    {# pay invoice information #}
    <div class="kt-portlet">
        {# Custom field form#}
        <form method="post" id="add__trns_as__Ex_" enctype="multipart/form-data">

            {# transaction form#}
            <div class="kt-portlet__body">
                {# pay invoice details #}
                <div class="row">

                    {# this field will have a value which we want to update. #}
                    <input type="hidden" name="trans__inv_ref" value="{{ invoice.getInvReference }}"/>
                    <input type="hidden" name="trans___iIFISDD"/>
                    <input type="hidden" value="2" name="trans___is_inc_exp"/>
                    <input type="hidden" value="1" name="get__us__fr_in"/>

                    {#                {% if invoice.getInvoiceGeneratedForUnregisterUsername is empty %}#}
                    {#                {% endif %}#}
                    {#                <td> {{ invoice.getInvoiceGeneratedForUnregisterUsername is empty ? invoice.getInvGeneratedFor.getFName : invoice.getInvoiceGeneratedForUnregisterUsername ~ ' (Un-register user)' }}</td>#}


                    {# account #}
                    <div class="col-xl-4 col-lg-6 col-md-12 col-xs-12">
                        <label class="col-form-label">{{ 'Accounts'|trans }}</label>
                        <select class="form-control kt-select2 kt-selectpicker simpleSelect2" name="trans__ac_ref">
                            {% for account in account_list %}
                                <option {{ account.getAccIsDefault()== 1? 'selected=selected':'' }}
                                        value="{{ account.id }}">{{ account.getAccName }}</option>
                            {% endfor %}
                        </select>
                    </div>

                    {# Income head #}
                    <div class="col-xl-4 col-lg-6 col-md-12 col-xs-12">
                        <label class="col-form-label">{{ 'Income head'|trans }}</label>
                        <select class="form-control kt-select2 kt-selectpicker simpleSelect2" name="trans_ac_hed_ref">
                            {% for income in income_head %}
                                <option value="{{ income.id }}">{{ income.getAhName }}</option>
                            {% endfor %}
                        </select>
                    </div>

                    {# payment method.#}
                    <div class="col-xl-4 col-lg-6 col-md-12 col-xs-12">
                        <label class="col-form-label">{{ 'Payment method'|trans }}</label>
                        <select class="form-control kt-select2 kt-selectpicker simpleSelect2" name="trans__payM__ref">
                            {% for pm in payment_method %}

                                {% if invoice.getPaymentMethod is not empty %}
                                    <option {{ pm.id == invoice.getPaymentMethod.id ? 'selected="selected"' : '' }}
                                            value="{{ pm.id }}">{{ pm.getPmType }}</option>
                                {% else %}
                                    <option {{ pm.getPmIsDefault()== 1? 'selected=selected':'' }}
                                            value="{{ pm.id }}">{{ pm.getPmType }}</option>
                                {% endif %}

                            {% endfor %}
                        </select>
                    </div>

                    {# transaction date #}
                    <div class="col-xl-4 col-lg-6 col-md-12 col-xs-12">
                        <div class="kt-portlet__head-label">
                            <label class="col-form-label">{{ 'Date'|trans }} </label>
                        </div>
                        <input type="datetime" name="tran___dt" class="form-control r__q simpleDatePicker"
                               value="{{ 'now'|date('d-M-Y') }}"/>
                    </div>

                    {# transaction amount #}
                    <div class="col-xl-4 col-lg-6 col-md-12 col-xs-12">
                        <div class="kt-portlet__head-label">
                            <label class="col-form-label">{{ 'Trans Amount'|trans }} </label>
                        </div>
                        <input type="number" name="trans__am" class="form-control r__q"
                               value="{{ invoiceTotalAmount }}"/>
                    </div>

                </div>

                {# Advance options #}
                <br>

                <div class="col-form-label">
                    <span data-toggle="collapse" data-target="#demo" class="hand-cursor">
                    <b>{{ 'Advance'|trans }}</b>
                        {# dropdown #}
                        <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" width="24px"
                             height="24px" viewBox="0 0 24 24" version="1.1" class="kt-svg-icon">
                            <g stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
                                <polygon id="Shape" points="0 0 24 0 24 24 0 24"></polygon>
                                <path d="M6.70710678,15.7071068 C6.31658249,16.0976311 5.68341751,16.0976311 5.29289322,15.7071068 C4.90236893,15.3165825 4.90236893,14.6834175 5.29289322,14.2928932 L11.2928932,8.29289322 C11.6714722,7.91431428 12.2810586,7.90106866 12.6757246,8.26284586 L18.6757246,13.7628459 C19.0828436,14.1360383 19.1103465,14.7686056 18.7371541,15.1757246 C18.3639617,15.5828436 17.7313944,15.6103465 17.3242754,15.2371541 L12.0300757,10.3841378 L6.70710678,15.7071068 Z"
                                      id="Path-94" fill="#000000" fill-rule="nonzero"
                                      transform="translate(12.000003, 11.999999) rotate(-180.000000) translate(-12.000003, -11.999999) "></path>
                            </g>
                        </svg>
                    </span>
                </div>

                {# form where to write text.#}
                <div class="collapse row" id="demo">
                    {# transaction reference #}
                    <div class="col-xl-4 col-lg-6 col-md-6 col-xs-12">
                        <div class="kt-portlet__head-label">
                            <label class="col-form-label">{{ 'Trans Reference'|trans }} </label>
                        </div>
                        <input type="text" name="tran___ref" class="form-control r__q"/>
                    </div>

                    {# upload document #}
                    <div class="col-xl-4 col-lg-6 col-md-6 col-xs-12">
                        <div class="kt-portlet__head-label">
                            <label class="col-form-label">{{ 'Trans Document'|trans }} </label>
                        </div>
                        <input type="file" name="trans__fi" class="form-control r__q"/>
                    </div>

                    {# notes #}
                    <div class="col-xl-4 col-lg-6 col-md-6 col-xs-12">
                        <div class="kt-portlet__head-label">
                            <label class="col-form-label">{{ 'Admin / Staff Notes'|trans }} </label>
                        </div>
                        <input type="text" name="tran___n_t" class="form-control"
                               value="{{ invoice.getInvUserNotes }}"/>
                    </div>
                </div>

            </div>


            {# submit button #}
            <div class="kt-portlet__foot">
                <div class="kt-form__actions">

                    {% if invoice.getTheInvoiceStatus == 'paid' or invoice.getTheInvoiceStatus == 'Paid' %}
                        <h5>{{ 'This Invoice has been paid' | trans }}</h5>
                    {% else %}
                        <button type="submit" class="btn-primary btn" data-ref="add__trns_as__Ex_"
                                data-target="s__tran__">
                            {{ 'Pay Invoice'|trans }}
                        </button>
                    {% endif %}


                </div>
            </div>

        </form>
    </div>



{% endblock %}

{% block ExtraJsFIles %}
    {% for file in encore_entry_js_files('accounts') %}
        <script src="{{ assetsBasePath ~ file }}" type="text/javascript"></script>{% endfor %}
{% endblock %}