<commit_before>{% extends 'hqwebapp/base_paginated_crud.html' %}
{% load i18n %}
{% load hq_shared_tags %}

{% block js %}{{ block.super }}
    <script type="text/javascript" src="{% static 'accounting/ko/accounting.payment_method_handler.js' %}"></script>
    <script type="text/javascript" src="https://js.stripe.com/v2/"></script>
{% endblock %}

{% block js-paginated %}
    <script type="text/javascript">
        Stripe.setPublishableKey('{{ stripe_public_key }}');

        var bulkPaymentHandler = new PaymentMethodHandler(
            {{ payment_error_messages|JSON }},
            "{% trans "Submit Payment" %}",
            "bulk-payment-form"
        );
        var paymentHandler = new PaymentMethodHandler(
            {{ payment_error_messages|JSON }},
            "{% trans "Submit Payment" %}",
            "payment-form"
        );

        {% if stripe_cards %}
            var stripe_cards = {{ stripe_cards|JSON }};
            bulkPaymentHandler.loadCards(stripe_cards);
            paymentHandler.loadCards(stripe_cards);
        {% endif %}

        $(function () {
            ko.applyBindings(bulkPaymentHandler, $('#bulkPaymentModal').get(0));
            ko.applyBindings(paymentHandler, $('#paymentModal').get(0));
        });

        $('#bulkPaymentBtn').click(function () {
            bulkPaymentHandler.costItem(new TotalCostItem({
                totalBalance: paginatedListModel.totalDue()
            }));
            bulkPaymentHandler.reset();
        });

        paginatedListModel.totalDue = ko.computed(function() {
            var totalBalance = 0;
            var paginatedList = paginatedListModel.paginatedList();
            for (var i = 0; i < paginatedList.length; i++) {
                totalBalance += parseFloat(new Invoice({
                    paginatedItem: paginatedList[i],
                    paginatedList: paginatedListModel
                }).balance());
            }
            return totalBalance;
        });
        paginatedListModel.displayTotalDue = ko.computed(function() {
            return "$" + paginatedListModel.totalDue().toFixed(2);
        });
        paginatedListModel.showUnpaidBills = ko.observable(true);
        paginatedListModel.showAllBills = ko.computed(function () {
            return ! paginatedListModel.showUnpaidBills();
        });
        paginatedListModel.toggleUnpaidBills = function () {
            paginatedListModel.showUnpaidBills(!paginatedListModel.showUnpaidBills());
            paginatedListModel.currentPage(1);
            paginatedListModel.refreshList();
        };

        paginatedListModel.getAdditionalData = function () {
            var additional_data = {
                'show_unpaid': paginatedListModel.showUnpaidBills()
            };
            if (window.location.href.split('?').length > 2) {
                additional_data['show_hidden'] = _(window.location.href.split('?')[1].split('&')).contains('show_hidden=true');
            }
            return additional_data;
        };
        paginatedListModel.initRow = function (rowElems, paginatedItem) {
            var paymentButton = $(rowElems).find('.payment-button');
            if (paymentButton) {
                paymentButton.click(function (e) {
                    paymentHandler.costItem(new Invoice({
                        paginatedItem: paginatedItem,
                        paginatedList: paginatedListModel
                    }));
                    paymentHandler.reset();
                    e.preventDefault();
                });
            }
            $(".hide-while-loading").removeAttr("hidden");
        };
    </script>
{% endblock %}

{% block paginated_list_top %}
    {% if request|toggle_enabled:"BULK_PAYMENTS" %}
    <div id="currentBalanceSection">
        <h2>{% trans 'Current Balance' %}</h2>
        <p>
            {% trans 'Total Due:' %}
            <span class="hide-while-loading" hidden="true" data-bind="text: displayTotalDue"></span>
        </p>
        {% if not is_ops_user_but_not_admin %}
        <p class="hide-while-loading" hidden="true" data-bind="visible: totalDue">
            <button type="button"
                    class="btn btn-success"
                    data-toggle="modal"
                    data-target="#bulkPaymentModal"
                    id="bulkPaymentBtn">
                {% trans 'Pay with Credit Card' %}
            </button>
        </p>
        {% else %}
        <span class="label">
            <i class="icon-info-sign"></i>
            {% trans "Not Billing Admin, Can't Make Payment" %}
        </span>
        {% endif %}
    </div>
    {% endif %}
    <h2>{% trans 'Billing Statements' %} <span data-bind="visible: showUnpaidBills">({% trans 'Unpaid' %})</span></h2>
    <p>
        <button type="button"
                class="btn btn-primary"<commit_msg>show zero due when page is loaded and there are no unpaid invoices<commit_after>{% extends 'hqwebapp/base_paginated_crud.html' %}
{% load i18n %}
{% load hq_shared_tags %}

{% block js %}{{ block.super }}
    <script type="text/javascript" src="{% static 'accounting/ko/accounting.payment_method_handler.js' %}"></script>
    <script type="text/javascript" src="https://js.stripe.com/v2/"></script>
{% endblock %}

{% block js-paginated %}
    <script type="text/javascript">
        Stripe.setPublishableKey('{{ stripe_public_key }}');

        var bulkPaymentHandler = new PaymentMethodHandler(
            {{ payment_error_messages|JSON }},
            "{% trans "Submit Payment" %}",
            "bulk-payment-form"
        );
        var paymentHandler = new PaymentMethodHandler(
            {{ payment_error_messages|JSON }},
            "{% trans "Submit Payment" %}",
            "payment-form"
        );

        {% if stripe_cards %}
            var stripe_cards = {{ stripe_cards|JSON }};
            bulkPaymentHandler.loadCards(stripe_cards);
            paymentHandler.loadCards(stripe_cards);
        {% endif %}

        $(function () {
            ko.applyBindings(bulkPaymentHandler, $('#bulkPaymentModal').get(0));
            ko.applyBindings(paymentHandler, $('#paymentModal').get(0));
        });

        $('#bulkPaymentBtn').click(function () {
            bulkPaymentHandler.costItem(new TotalCostItem({
                totalBalance: paginatedListModel.totalDue()
            }));
            bulkPaymentHandler.reset();
        });

        paginatedListModel.totalDue = ko.computed(function() {
            var totalBalance = 0;
            var paginatedList = paginatedListModel.paginatedList();
            for (var i = 0; i < paginatedList.length; i++) {
                totalBalance += parseFloat(new Invoice({
                    paginatedItem: paginatedList[i],
                    paginatedList: paginatedListModel
                }).balance());
            }
            return totalBalance;
        });
        paginatedListModel.displayTotalDue = ko.computed(function() {
            return "$" + paginatedListModel.totalDue().toFixed(2);
        });
        paginatedListModel.showUnpaidBills = ko.observable(true);
        paginatedListModel.showAllBills = ko.computed(function () {
            return ! paginatedListModel.showUnpaidBills();
        });
        paginatedListModel.toggleUnpaidBills = function () {
            paginatedListModel.showUnpaidBills(!paginatedListModel.showUnpaidBills());
            paginatedListModel.currentPage(1);
            paginatedListModel.refreshList();
        };

        paginatedListModel.getAdditionalData = function () {
            var additional_data = {
                'show_unpaid': paginatedListModel.showUnpaidBills()
            };
            if (window.location.href.split('?').length > 2) {
                additional_data['show_hidden'] = _(window.location.href.split('?')[1].split('&')).contains('show_hidden=true');
            }
            return additional_data;
        };
        paginatedListModel.initRow = function (rowElems, paginatedItem) {
            var paymentButton = $(rowElems).find('.payment-button');
            if (paymentButton) {
                paymentButton.click(function (e) {
                    paymentHandler.costItem(new Invoice({
                        paginatedItem: paginatedItem,
                        paginatedList: paginatedListModel
                    }));
                    paymentHandler.reset();
                    e.preventDefault();
                });
            }
        };
    </script>
{% endblock %}

{% block paginated_list_top %}
    {% if request|toggle_enabled:"BULK_PAYMENTS" %}
    <div id="currentBalanceSection">
        <h2>{% trans 'Current Balance' %}</h2>
        <p>
            {% trans 'Total Due:' %}
            <span data-bind="text: displayTotalDue, visible: hasInitialLoadFinished"></span>
        </p>
        {% if not is_ops_user_but_not_admin %}
        <p data-bind="visible: hasInitialLoadFinished() && totalDue()">
            <button type="button"
                    class="btn btn-success"
                    data-toggle="modal"
                    data-target="#bulkPaymentModal"
                    id="bulkPaymentBtn">
                {% trans 'Pay with Credit Card' %}
            </button>
        </p>
        {% else %}
        <span class="label">
            <i class="icon-info-sign"></i>
            {% trans "Not Billing Admin, Can't Make Payment" %}
        </span>
        {% endif %}
    </div>
    {% endif %}
    <h2>{% trans 'Billing Statements' %} <span data-bind="visible: showUnpaidBills">({% trans 'Unpaid' %})</span></h2>
    <p>
        <button type="button"
                class="btn btn-primary"
{'fraction_non_alphanumeric': 0.13514353819048605, 'fraction_numerical': 0.0031091304798424708, 'mean_word_length': 2.015625, 'pattern_counts': {'":': 0, '<': 61, '<?xml version=': 0, '>': 59, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '2650524', 'n_tokens_mistral': 2741, 'n_tokens_neox': 2585, 'n_words': 433}