kimai2/templates/invoice/index.html.twig

{% extends 'base.html.twig' %}
{% import "macros/widgets.html.twig" as widgets %}
{% import "macros/datatables.html.twig" as tables %}
{% import "macros/toolbar.html.twig" as toolbar %}
{% import "invoice/actions.html.twig" as actions %}

{% set columns = {
    'date': {'class': 'alwaysVisible w-min', 'orderBy': false},
    'project': {'class': 'hidden-xs hidden-sm', 'orderBy': false},
    'description': {'class': 'hidden-xs hidden-sm hidden', 'orderBy': false},
    'user': {'class': 'hidden-xs hidden-sm w-min', 'orderBy': false},
    'unit_price': {'class': 'hidden-xs text-right w-min', 'orderBy': false},
    'amount': {'class': 'text-right w-min', 'orderBy': false},
    'duration': {'class': 'hidden-xs text-right w-min', 'orderBy': false},
    'total_rate': {'class': 'text-right alwaysVisible w-min', 'orderBy': false},
} %}

{% set tableName = 'invoice' %}

{% block page_title %}{{ 'invoices'|trans }}{% endblock %}
{% block page_actions %}{{ actions.invoices('index') }}{% endblock %}

{% block main_before %}
    {{ tables.data_table_column_modal(tableName, columns) }}
{% endblock %}

{% block main %}

    {% if is_granted('create_invoice') %}
        {% embed '@AdminLTE/Widgets/box-widget.html.twig' %}
            {% import "macros/search.html.twig" as search %}
            {% form_theme form '@AdminLTE/layout/form-theme-horizontal.html.twig' %}
            {% block box_title %}{{ 'invoice.filter'|trans }}{% endblock %}
            {% block box_before %}{{ form_start(form) }}{% endblock %}
            {% block box_body %}
                {{ form_errors(form) }}
                {% if form.searchTerm is defined %}
                    {{ form_row(form.searchTerm, {'row_attr': {'class': 'invoice_search_form_row_searchTerm'}}) }}
                {% endif %}
                {{ form_row(form.daterange, {'row_attr': {'class': 'invoice_search_form_row_daterange'}}) }}
                {{ form_row(form.customers, {'row_attr': {'class': 'invoice_search_form_row_customers'}}) }}
                {{ form_row(form.projects, {'row_attr': {'class': 'invoice_search_form_row_projects'}}) }}
                {% if form.activities is defined %}
                    {{ form_row(form.activities, {'row_attr': {'class': 'invoice_search_form_row_activities'}}) }}
                {% endif %}
                {% if form.tags is defined %}
                    {{ form_row(form.tags, {'row_attr': {'class': 'invoice_search_form_row_tags'}}) }}
                {% endif %}
                {% if form.users is defined %}
                    {{ form_row(form.users, {'row_attr': {'class': 'invoice_search_form_row_users'}}) }}
                {% endif %}
                {% if form.teams is defined %}
                    {{ form_row(form.teams, {'row_attr': {'class': 'invoice_search_form_row_teams'}}) }}
                {% endif %}
                {% if form.exported is defined %}
                    {{ form_row(form.exported, {'row_attr': {'class': 'invoice_search_form_row_exported'}}) }}
                {% endif %}
                {{ form_row(form.template, {'row_attr': {'class': 'invoice_search_form_row_template'}}) }}
                {% if form.markAsExported is defined %}
                    {{ form_row(form.markAsExported, {'row_attr': {'class': 'invoice_search_form_row_markAsExported'}}) }}
                {% endif %}
            {% endblock %}
            {% block box_footer%}
                {{ search.searchButton(form) }}
            {% endblock %}
            {% block box_after %}{{ form_end(form) }}{% endblock %}
        {% endembed %}
    {% else %}
        {{ widgets.callout('danger', 'http_error_403.suggestion'|trans({}, 'exceptions')) }}
    {% endif %}

    {% set totalDuration = 0 %}
    {% set totalRates = {} %}

    {% if searched %}
        {% set showEmpty = true %}
        {% for model in models %}
            {% if showEmpty %}
                {% set showEmpty = model.calculator is empty or model.calculator.entries is empty %}
            {% endif %}
            {% set totalDuration = totalDuration + model.calculator.timeWorked %}
            {% set customerCurrency = model.customer.currency %}
            {% if totalRates[customerCurrency] is not defined %}
                {% set totalRates = totalRates|merge({(customerCurrency): 0.00}) %}
            {% endif %}
            {% set totalRates = totalRates|merge({(customerCurrency): totalRates[customerCurrency] + model.calculator.total}) %}
        {% endfor %}
        {% if showEmpty %}
            {{ widgets.nothing_found() }}
        {% endif %}
    {% endif %}

    {% if models|length > 0 %}
        {% embed '@AdminLTE/Widgets/box-widget.html.twig' %}
            {% import "macros/widgets.html.twig" as widgets %}
            {% import '@AdminLTE/Macros/buttons.html.twig' as button %}
            {% block box_title %}
                {{ 'button.preview'|trans }}: {{ 'invoices'|trans }}
                {{ widgets.label(totalDuration|duration, 'gray') }}
                {% for totalCurrency, totalRate in totalRates %}
                    {{ widgets.label(totalRate|money(totalCurrency), 'gray') }}
                {% endfor %}
            {% endblock %}
            {% block box_body_class %}no-padding{% endblock %}
            {% block box_footer %}
                <a href="#" onclick="return saveAllInvoices(this);" class="btn btn-success" id="create_all_invoices">
                    {{ 'action.save_all'|trans }}
                </a>
            {% endblock %}
            {% block box_body %}
                <table class="table table-hover dataTable">
                    <thead>
                        <tr>
                            <th>{{ 'label.customer'|trans }}</th>
                            <th class="w-min text-center actions"></th>
                            <th class="w-min text-right hidden-xs">{{ 'label.duration'|trans }}</th>
                            <th class="w-min text-right hidden-xs">{{ 'label.total_rate'|trans }}</th>
                        </tr>
                    </thead>
                    <tbody>
                        {% for model in models %}
                            {% set isDecimal = model.template.decimalDuration|default(false) %}
                            {% set currency = model.currency %}
                            <tr>
                                <td>
                                    {% if is_granted('view', model.customer) %}
                                        <a class="link-black" href="{{ path('customer_details', {id: model.customer.id}) }}">{{ widgets.label_customer(model.customer) }}</a>
                                    {% else %}
                                        {{ widgets.label_customer(model.customer) }}
                                    {% endif %}
                                </td>
                                <td class="w-min text-center">
                                    {{ widgets.action_button('print', {'url': '#', 'onclick': 'return singleInvoice(this, true)', 'title': 'button.preview'|trans, 'target': '_blank', 'class': 'btn btn-sm', 'attr': {'data-customer': model.customer.id, 'data-template': model.template.id, 'data-href': path('invoice_preview', {'customer': model.customer.id, 'token': csrf_token('invoice.preview')})}}) }}
                                    {{ widgets.action_button('save', {'url': '#', 'onclick': 'return singleInvoice(this, false)', 'title': 'action.save'|trans, 'class': 'btn btn-sm', 'attr': {'data-customer': model.customer.id, 'data-template': model.template.id, 'data-href': path('invoice_create', {'customer': model.customer.id, 'template': model.template.id, 'token': csrf_token('invoice.create')})}}, 'success') }}
                                </td>
                                <td class="w-min text-right hidden-xs">
                                    {{ model.calculator.timeWorked|duration(isDecimal) }}
                                </td>
                                <td class="w-min text-right hidden-xs">
                                    <span title="{{ 'label.vat'|trans }}: {{ model.calculator.tax|money(currency) }}" data-toggle="tooltip">{{ model.calculator.total|money(currency) }}</span>
                                </td>
                            </tr>
                        {% endfor %}
                    </tbody>
                </table>
            {% endblock %}
        {% endembed %}

        {% for model in models %}
            {% set isEmptyModel = model.calculator is empty or model.calculator.entries is empty %}
            {% if not isEmptyModel %}
                {% set customer = model.query.customers[0] %}
                {% set isDecimal = model.template.decimalDuration|default(false) %}
                {% set entries = model.calculator.entries %}
                {% set currency = model.currency %}

                {% embed '@AdminLTE/Widgets/box-widget.html.twig' %}
                    {% import "macros/widgets.html.twig" as widgets %}
                    {% import "macros/datatables.html.twig" as tables %}
                    {% block box_title %}
                        <span id="invoice_preview_details_{{ customer.id }}">{{ widgets.label_customer(customer) }}</span>
                        {{ widgets.label(model.calculator.timeWorked|duration, 'gray') }}
                        {{ widgets.label(model.calculator.total|money(currency), 'gray') }}
                    {% endblock %}
                    {% block box_body_class %}invoice-preview-box no-padding{% endblock %}
                    {% block box_body %}
                        {{ tables.datatable_header(tableName, columns, model.query, {'boxClass': ''}) }}
                        {% set itemsAmount = entries|length %}
                        {% if limit_preview %}
                            {% set entries = entries|slice(0, 100) %}
                        {% endif %}
                        {% for entry in entries %}
                            {% set amount = entry.amount %}
                            {% set duration = entry.duration|duration(isDecimal) %}
                            {% set rate = 0 %}
                            {% if entry.fixedRate is not null %}
                                {% set rate = entry.fixedRate %}
                            {% elseif entry.hourlyRate is not null %}
                                {% set rate = entry.hourlyRate %}
                            {% endif %}
                            <tr>
                                <td class="{{ tables.data_table_column_class(tableName, columns, 'date') }}">{{ entry.begin|date_short }}</td>
                                <td class="{{ tables.data_table_column_class(tableName, columns, 'project') }}">
                                    {% if is_granted('view', entry.project) %}
                                        <a class="link-black" href="{{ path('project_details', {id: entry.project.id}) }}">{{ widgets.label_project(entry.project) }}</a>
                                    {% else %}
                                        {{ widgets.label_project(entry.project) }}
                                    {% endif %}
                                    {% if entry.activity is not null %}
                                    <br>
                                    <small>
                                        {% if is_granted('view', entry.activity) %}
                                            <a class="link-black" href="{{ path('activity_details', {id: entry.activity.id}) }}">{{ widgets.label_activity(entry.activity) }}</a>
                                        {% else %}
                                            {{ widgets.label_activity(entry.activity) }}
                                        {% endif %}
                                    </small>
                                    {% endif %}
                                </td>
                                <td class="{{ tables.data_table_column_class(tableName, columns, 'description') }} timesheet-description">
                                    {% if entry.description is not empty %}
                                        {{ entry.description|desc2html }}
                                    {% endif %}
                                </td>
                                <td class="{{ tables.data_table_column_class(tableName, columns, 'user') }}">{{ widgets.label_user(entry.user) }}</td>
                                <td class="{{ tables.data_table_column_class(tableName, columns, 'unit_price') }}">{{ rate|money(currency) }}</td>
                                <td class="{{ tables.data_table_column_class(tableName, columns, 'amount') }}">{{ amount }}</td>
                                <td class="{{ tables.data_table_column_class(tableName, columns, 'duration') }}" data-duration="{{ entry.duration }}">{{ duration }}</td>
                                <td class="{{ tables.data_table_column_class(tableName, columns, 'total_rate') }}">{{ entry.rate|money(currency) }}</td>
                            </tr>
                        {% endfor %}
                        {% if limit_preview and itemsAmount > 100 %}
                            <tr class="warning">
                                <td colspan="8">&raquo; {{ 'preview.skipped_rows'|trans({'%rows%': (itemsAmount - 100)}) }}</td>
                            </tr>
                        {% endif %}
                        <tr class="summary">
                            <td class="{{ tables.data_table_column_class(tableName, columns, 'date') }}"></td>
                            <td class="{{ tables.data_table_column_class(tableName, columns, 'project') }}"></td>
                            <td class="{{ tables.data_table_column_class(tableName, columns, 'description') }}"></td>
                            <td class="{{ tables.data_table_column_class(tableName, columns, 'user') }}"></td>
                            <td class="{{ tables.data_table_column_class(tableName, columns, 'unit_price') }}"></td>
                            <td class="{{ tables.data_table_column_class(tableName, columns, 'amount') }}"></td>
                            <td class="{{ tables.data_table_column_class(tableName, columns, 'duration') }}">{{ model.calculator.timeWorked|duration(isDecimal) }}</td>
                            <td class="{{ tables.data_table_column_class(tableName, columns, 'total_rate') }}">{{ model.calculator.total|money(currency) }}</td>
                        </tr>
                        {{ tables.data_table_footer(entries) }}
                    {% endblock %}
                {% endembed %}
            {% endif %}
        {% endfor %}

    {% endif %}

{% endblock %}

{% block javascripts %}
    {{ parent() }}
    {% set formId = form.vars.attr.id %}
    {% set formSelector = 'form#' ~ formId %}

    <script type="text/javascript">

        function singleInvoice(link, preview)
        {
            const formPlugin = kimai.getPlugin('form');
            const overwrites = {'customers[]': link.dataset['customer'], 'template': link.dataset['template']};
            const uri = formPlugin.convertFormDataToQueryString(document.getElementById('{{ formId }}'), overwrites);
            const invoiceUrl = link.dataset['href'] + '?' + uri;

            if (!preview) {
                link.classList.toggle('disabled');
                link.href = 'javascript: void(0)';

                document.location = invoiceUrl;
                return false;
            }

            link.href = invoiceUrl;

            return true;
        }

        function saveAllInvoices(link)
        {
            const formPlugin = kimai.getPlugin('form');
            const uri = formPlugin.convertFormDataToQueryString(document.getElementById('{{ formId }}'));

            link.classList.toggle('disabled');
            link.href = 'javascript: void(0)';

            document.location = '{{ path('invoice') }}?token={{ csrf_token('invoice.create') }}&createInvoice=true&' + uri;

            return false;
        }

        document.addEventListener('kimai.initialized', function() {
            KimaiReloadPageWidget.create('kimai.systemConfigUpdate', true);

            {% if models|length > 0 %}
            jQuery('body').on('change', '#{{ form.template.vars.id }}', function(event) {
                document.getElementById('{{ form.vars.attr.id }}').submit();
            });
            {% endif %}
        });

    </script>
{% endblock %}