{% import "macros/widgets.html.twig" as widgets %}
{% import "macros/datatables.html.twig" as tables %}
{% extends 'export/layout.html.twig' %}

{% block document_title %}{{ 'export.title'|trans }}{% endblock %}

{% set showRateBudget = false %}
{% set showTimeBudget = false %}
{% for budget in budgets %}
    {% if budget.money_left > 0 %}
        {% set showRateBudget = true %}
    {% endif %}
    {% if budget.time_left > 0 %}
        {% set showTimeBudget = true %}
    {% endif %}
{% endfor %}

{% set decimal = decimal|default(false) %}
{% set columnTitles = {} %}
{% set columns = {
    'date': true,
    'username': false,
    'customer': true,
    'project': true,
    'activity': true,
    'description': false,
    'exported': false,
    'tags': false,
} %}

{% for id, field in timesheetMetaFields %}
    {% set columns = columns|merge({ ('t_' ~ field.name): true}) %}
    {% set columnTitles = columnTitles|merge({ ('t_' ~ field.name): (field.label)}) %}
{% endfor %}
{% for id, field in customerMetaFields %}
    {% set columns = columns|merge({ ('c_' ~ field.name): true}) %}
    {% set columnTitles = columnTitles|merge({ ('c_' ~ field.name): (field.label)}) %}
{% endfor %}
{% for id, field in projectMetaFields %}
    {% set columns = columns|merge({ ('p_' ~ field.name): true}) %}
    {% set columnTitles = columnTitles|merge({ ('p_' ~ field.name): (field.label)}) %}
{% endfor %}
{% for id, field in activityMetaFields %}
    {% set columns = columns|merge({ ('a_' ~ field.name): true}) %}
    {% set columnTitles = columnTitles|merge({ ('a_' ~ field.name): (field.label)}) %}
{% endfor %}
{% for id, field in userPreferences %}
    {% set columns = columns|merge({ ('u_' ~ field.name): true}) %}
    {% set columnTitles = columnTitles|merge({ ('u_' ~ field.name): (field.label)}) %}
{% endfor %}

{% set columns = columns|merge({
    'hourlyRate': false,
    'fixedRate': false,
    'duration': 'label.duration',
    'rate_internal': 'label.rate_internal',
    'rate': 'label.rate',
}) %}

{% block javascripts %}
    <script type="text/javascript">
        let initialized = false;

        window.addEventListener('load', function() {
            let config = KimaiCookies.get('kimai_html_export');
            if (config !== undefined && config !== null) {
                console.log(config);
                for (const key in config) {
                    let elName = key;
                    let checked = config[key];
                    let el = document.getElementById(elName);
                    if (el === undefined || el === null) {
                        el = document.getElementById('records-column-' + elName);
                        if (el === undefined || el === null) {
                            continue;
                        }
                    }
                    if (checked !== el.checked) {
                        el.click();
                    }
                }
            }
            initialized = true;
        });

        function saveVisibility()
        {
            if (!initialized) {
                return;
            }

            const form = document.getElementsByTagName('form')[0];
            let settings = {};
            for (let checkbox of form.querySelectorAll('input[type=checkbox]')) {
                settings[checkbox.getAttribute('name')] = checkbox.checked;
            }
            KimaiCookies.set('kimai_html_export', settings, {expires: 365, SameSite: 'Strict'});
        }
        document.getElementById('summary-by-activities').addEventListener('click', function(event) {
            document.getElementById('summary-project').style.display = event.target.checked ? 'none' : 'table';
            document.getElementById('summary-activity').style.display = event.target.checked ? 'table' : 'none';
            saveVisibility();
        });
        document.getElementById('summary-show').addEventListener('click', function(event) {
            document.getElementById('export-summary').style.display = event.target.checked ? 'block' : 'none';
            saveVisibility();
        });
        {% if showTimeBudget %}
        document.getElementById('summary-timeBudget').addEventListener('click', function(event) {
            var cells = document.getElementsByClassName('export-timeBudget');
            for (var columnCell of cells) {
                columnCell.style.display = event.target.checked ? 'table-cell' : 'none';
            }
            saveVisibility();
        });
        {% endif %}
        {% if showRateBudget %}
        document.getElementById('summary-budget').addEventListener('click', function(event) {
            var cells = document.getElementsByClassName('export-budget');
            for (var columnCell of cells) {
                columnCell.style.display = event.target.checked ? 'table-cell' : 'none';
            }
            saveVisibility();
        });
        {% endif %}
        document.getElementById('summary-duration').addEventListener('click', function(event) {
            var cells = document.getElementsByClassName('summary-duration');
            for (var columnCell of cells) {
                columnCell.style.display = event.target.checked ? 'table-cell' : 'none';
            }
            saveVisibility();
        });
        document.getElementById('summary-rate').addEventListener('click', function(event) {
            var cells = document.getElementsByClassName('summary-rate');
            for (var columnCell of cells) {
                columnCell.style.display = event.target.checked ? 'table-cell' : 'none';
            }
            saveVisibility();
        });
        document.getElementById('summary-rate-internal').addEventListener('click', function(event) {
            var cells = document.getElementsByClassName('summary-rate-internal');
            for (var columnCell of cells) {
                columnCell.style.display = event.target.checked ? 'table-cell' : 'none';
            }
            saveVisibility();
        });
        document.getElementById('summary-show').addEventListener('click', function(event) {
            document.getElementById('export-summary').style.display = event.target.checked ? 'block' : 'none';
            saveVisibility();
        });
        document.getElementById('records-show').addEventListener('click', function(event) {
            document.getElementById('export-records').style.display = event.target.checked ? 'block' : 'none';
            saveVisibility();
        });
        var columnCheckboxes = document.getElementsByClassName('column-visibility-changer');
        for (var checkbox of columnCheckboxes) {
            checkbox.addEventListener('click', function(event) {
                var cells = document.getElementsByClassName('column-'+event.target.name);
                for (var columnCell of cells) {
                    columnCell.style.display = event.target.checked ? 'table-cell' : 'none';
                }
                saveVisibility();
            });
        }
    </script>
{% endblock %}

{% block styles %}
    <style>
        .items td.totals {
            font-weight: bold;
            text-align: right;
        }
        .items td.duration,
        .items th.duration,
        .items th.cost,
        .items td.cost {
            text-align: center;
        }
        .toolbar {
            border-bottom: 1px solid #ccc;
            background-color: #eee;
            padding: 5px 0 0 5px;
        }
    </style>
{% endblock %}

{% block export %}
    <div class="row no-print toolbar">
        <div class="col-xs-12">
            <form class="form-inline">
                <div class="row">
                    <div class="col-xs-1">
                        <div class="form-group">
                            <label class="control-label" for="summary-show">
                                <input type="checkbox" id="summary-show" name="summary-show" checked="checked">
                                {{ 'export.summary'|trans }}
                            </label>
                        </div>
                    </div>
                    <div class="col-xs-11">
                        <div class="form-group">
                            <label class="control-label" for="summary-by-activities">
                                <input type="checkbox" id="summary-by-activities" name="summary-by-activities">
                                {{ 'label.activity'|trans }}
                            </label>
                        </div>
                        {% if showTimeBudget %}
                        <div class="form-group">
                            <label class="control-label" for="summary-timeBudget">
                                <input type="checkbox" id="summary-timeBudget" name="summary-timeBudget" checked>
                                {{ 'label.timeBudget'|trans }}
                            </label>
                        </div>
                        {% endif %}
                        {% if showRateBudget %}
                        <div class="form-group">
                            <label class="control-label" for="summary-budget">
                                <input type="checkbox" id="summary-budget" name="summary-budget" checked>
                                {{ 'label.budget'|trans }}
                            </label>
                        </div>
                        {% endif %}

                        <div class="form-group">
                            <label class="control-label" for="summary-duration">
                                <input type="checkbox" id="summary-duration" name="summary-duration" checked>
                                {{ 'label.duration'|trans }}
                            </label>
                        </div>
                        <div class="form-group">
                            <label class="control-label" for="summary-rate-internal">
                                <input type="checkbox" id="summary-rate-internal" name="summary-rate-internal" checked>
                                {{ 'label.rate_internal'|trans }}
                            </label>
                        </div>
                        <div class="form-group">
                            <label class="control-label" for="summary-rate">
                                <input type="checkbox" id="summary-rate" name="summary-rate" checked>
                                {{ 'label.rate'|trans }}
                            </label>
                        </div>
                    </div>
                </div>

                <div class="row">
                    <div class="col-xs-1">
                        <div class="form-group">
                            <label class="control-label" for="records-show">
                                <input type="checkbox" id="records-show" name="records-show" checked="checked">
                                {{ 'export.full_list'|trans }}
                            </label>
                        </div>
                    </div>
                    <div class="col-xs-11">
                        {% for columnId, visibility in columns %}
                            <div class="form-group">
                                <label class="control-label" for="records-column-{{ columnId }}">
                                    <input type="checkbox" class="column-visibility-changer" id="records-column-{{ columnId }}" name="{{ columnId }}" {% if visibility %}checked="checked"{% endif %}>
                                    {{ columnTitles[columnId]|default('label.'~columnId)|trans }}
                                </label>
                            </div>
                        {% endfor %}
                    </div>
                </div>
            </form>
        </div>
    </div>

    <div class="row">
        <div class="col-xs-12">
            <h2>{{ 'export.document_title'|trans }}</h2>
            <p>
                {{ 'export.period'|trans }}:
                {{ query.begin|date_short }} - {{ query.end|date_short }}
            </p>
        </div>
    </div>

    <div class="row" id="export-summary">
        <div class="col-xs-12">
            <h3>{{ 'export.summary'|trans }}</h3>
            <table class="items table table-condensed table-bordered dataTable" id="summary-project">
                <thead>
                <tr>
                    <th>{{ 'label.customer'|trans }}</th>
                    <th>{{ 'label.project'|trans }}</th>
                    {% if showTimeBudget %}
                        <th class="center export-timeBudget">{{ 'label.timeBudget'|trans }}</th>
                    {% endif %}
                    {% if showRateBudget %}
                        <th class="center export-budget">{{ 'label.budget'|trans }}</th>
                    {% endif %}
                    <th class="duration summary-duration">{{ 'label.duration'|trans }}</th>
                    <th class="cost summary-rate-internal">{{ 'label.rate_internal'|trans }}</th>
                    <th class="cost summary-rate">{{ 'label.rate'|trans }}</th>
                </tr>
                </thead>
                <tbody>
                {% set customer = null %}
                {% set customerDuration = 0 %}
                {% set customerRate = 0 %}
                {% set customerInternalRate = 0 %}
                {% set customerCurrency = null %}
                {% for id, summary in summaries %}
                    {% if customer is same as(null) %}
                        {% set customer = summary.customer %}
                        {% set customerCurrency = summary.currency %}
                    {% endif %}
                    {% if customer is not same as(summary.customer) %}
                        <tr class="summary">
                            <td colspan="2">&nbsp;</td>
                            {% if showTimeBudget %}
                                <td class="export-timeBudget"></td>
                            {% endif %}
                            {% if showRateBudget %}
                                <td class="export-budget"></td>
                            {% endif %}
                            <td class="totals duration summary-duration">{{ customerDuration|duration(decimal) }}</td>
                            <td class="totals cost summary-rate-internal">{{ customerInternalRate|money(customerCurrency) }}</td>
                            <td class="totals cost summary-rate">{{ customerRate|money(customerCurrency) }}</td>
                        </tr>
                        {% set customerCurrency = summary.currency %}
                        {% set customer = summary.customer %}
                        {% set customerDuration = 0 %}
                        {% set customerRate = 0 %}
                        {% set customerInternalRate = 0 %}
                    {% endif %}
                    <tr>
                        <td>{{ summary.customer }}</td>
                        <td>{{ summary.project }}</td>
                        {% if showTimeBudget %}
                            <td class="center export-timeBudget">
                                {% if budgets[id] is defined and budgets[id].time_left > 0 %}
                                    {{ budgets[id].time_left|duration(decimal) }}
                                {% endif %}
                            </td>
                        {% endif %}
                        {% if showRateBudget %}
                            <td class="center export-budget">
                                {% if budgets[id] is defined and budgets[id].money_left > 0 %}
                                    {{ budgets[id].money_left|money(summary.currency) }}
                                {% endif %}
                            </td>
                        {% endif %}
                        <td class="duration summary-duration">{{ summary.duration|duration(decimal) }}</td>
                        <td class="cost summary-rate-internal">{{ summary.rate_internal|money(summary.currency) }}</td>
                        <td class="cost summary-rate">{{ summary.rate|money(summary.currency) }}</td>
                    </tr>
                    {% set customerDuration = customerDuration + summary.duration %}
                    {% set customerRate = customerRate + summary.rate %}
                    {% set customerInternalRate = customerInternalRate + summary.rate_internal %}
                {% endfor %}
                {% if customer is not same as(null) %}
                    <tr class="summary">
                        <td colspan="2">&nbsp;</td>
                        {% if showTimeBudget %}
                            <td class="export-timeBudget"></td>
                        {% endif %}
                        {% if showRateBudget %}
                            <td class="export-budget"></td>
                        {% endif %}
                        <td class="totals duration summary-duration">{{ customerDuration|duration(decimal) }}</td>
                        <td class="totals cost summary-rate-internal">{{ customerInternalRate|money(customerCurrency) }}</td>
                        <td class="totals cost summary-rate">{{ customerRate|money(customerCurrency) }}</td>
                    </tr>
                {% endif %}
                </tbody>
            </table>

            {#
            ============================================
            SUMMARY: BY ACTIVITY
            ============================================
            #}

            <table class="items table table-condensed table-bordered dataTable" id="summary-activity" style="display:none">
                <thead>
                <tr>
                    <th>{{ 'label.customer'|trans }}</th>
                    <th>{{ 'label.project'|trans }}</th>
                    <th>{{ 'label.activity'|trans }}</th>
                    <th class="duration summary-duration">{{ 'label.duration'|trans }}</th>
                    <th class="cost summary-rate-internal">{{ 'label.rate_internal'|trans }}</th>
                    <th class="cost summary-rate">{{ 'label.rate'|trans }}</th>
                </tr>
                </thead>
                <tbody>
                {% set customer = null %}
                {% set customerDuration = 0 %}
                {% set customerRate = 0 %}
                {% set customerInternalRate = 0 %}
                {% set customerCurrency = null %}
                {% for summary in summaries %}
                    {% if customer is same as(null) %}
                        {% set customer = summary.customer %}
                        {% set customerCurrency = summary.currency %}
                    {% endif %}
                    {% if customer is not same as(summary.customer) %}
                        <tr class="summary">
                            <td colspan="3"></td>
                            <td class="totals duration summary-duration">{{ customerDuration|duration(decimal) }}</td>
                            <td class="totals cost summary-rate-internal">{{ customerInternalRate|money(customerCurrency) }}</td>
                            <td class="totals cost summary-rate">{{ customerRate|money(customerCurrency) }}</td>
                        </tr>
                        {% set customerCurrency = summary.currency %}
                        {% set customer = summary.customer %}
                        {% set customerDuration = 0 %}
                        {% set customerRate = 0 %}
                        {% set customerInternalRate = 0 %}
                    {% endif %}
                    {% for activitySummary in summary.activities %}
                        <tr>
                            <td>{{ summary.customer }}</td>
                            <td>{{ summary.project }}</td>
                            <td>{{ activitySummary.activity }}</td>
                            <td class="duration summary-duration">{{ activitySummary.duration|duration(decimal) }}</td>
                            <td class="cost summary-rate-internal">{{ activitySummary.rate_internal|money(activitySummary.currency) }}</td>
                            <td class="cost summary-rate">{{ activitySummary.rate|money(activitySummary.currency) }}</td>
                        </tr>
                    {% endfor %}
                    {% set customerDuration = customerDuration + summary.duration %}
                    {% set customerRate = customerRate + summary.rate %}
                    {% set customerInternalRate = customerInternalRate + summary.rate_internal %}
                {% endfor %}
                {% if customer is not same as(null) %}
                    <tr class="summary">
                        <td colspan="3"></td>
                        <td class="totals duration summary-duration">{{ customerDuration|duration(decimal) }}</td>
                        <td class="totals cost summary-rate-internal">{{ customerInternalRate|money(customerCurrency) }}</td>
                        <td class="totals cost summary-rate">{{ customerRate|money(customerCurrency) }}</td>
                    </tr>
                {% endif %}
                </tbody>
            </table>
        </div>
    </div>

    <div class="row" id="export-records">
        <div class="col-xs-12">
            <h3>{{ 'export.full_list'|trans }}</h3>
            <table class="table table-condensed table-bordered dataTable">
                <thead>
                <tr>
                    {% for columnId, visibility in columns %}
                    <th class="column column-{{ columnId }}" {% if not visibility %}style="display: none"{% endif %}>
                        {{ columnTitles[columnId]|default('label.'~columnId)|trans }}
                    </th>
                    {% endfor %}
                </tr>
                </thead>
                <tbody>
                {% set timeWorked = 0 %}
                {% set rateTotal = 0 %}
                {% set rateInternalTotal = 0 %}
                {% set currency = false %}
                {% for entry in entries %}
                    {% set timeWorked = timeWorked + entry.duration %}
                    {% set rateTotal = rateTotal + entry.rate %}
                    {% if entry.internalRate is defined %}
                        {% set rateInternalTotal = rateInternalTotal + entry.internalRate %}
                    {% else %}
                        {% set rateInternalTotal = rateInternalTotal + entry.rate %}
                    {% endif %}
                    {% if currency is same as(false) %}
                        {% set currency = entry.project.customer.currency %}
                    {% endif %}
                    {% if currency is not same as(entry.project.customer.currency) %}
                        {% set currency = null %}
                    {% endif %}
                    <tr>
                        <td class="column-date text-nowrap" {% if not columns.date %}style="display: none"{% endif %}>
                            {{ entry.begin|date_time }}
                            {% if entry.end %}
                                <br>
                                {{ entry.end|date_time }}
                            {% endif %}
                        </td>
                        <td class="column-username" {% if not columns.username %}style="display: none"{% endif %}>
                            {{ widgets.username(entry.user) }}
                        </td>
                        <td class="column-customer" {% if not columns.customer %}style="display: none"{% endif %}>
                            {{ entry.project.customer.name }}
                        </td>
                        <td class="column-project" {% if not columns.project %}style="display: none"{% endif %}>{{ entry.project.name }}
                        </td>
                        <td class="column-activity" {% if not columns.activity %}style="display: none"{% endif %}>
                            {% if entry.activity is not null %}
                                {{ entry.activity.name }}
                            {% endif %}
                        </td>
                        <td class="column-description" {% if not columns.description %}style="display: none"{% endif %}>
                            {% if entry.description is not empty %}
                                {{ entry.description|desc2html }}
                            {% endif %}
                        </td>
                        <td class="column-exported" {% if not columns.exported %}style="display: none"{% endif %}>
                            {% if entry.exported %}
                                {{ 'entryState.exported'|trans }}
                            {% else %}
                                {{ 'entryState.not_exported'|trans }}
                            {% endif %}
                        </td>
                        <td class="column-tags" {% if not columns.tags %}style="display: none"{% endif %}>
                            {% if entry.tags is defined and entry.tags is not empty %}
                                {{ entry.tagsAsArray|join(', ') }}
                            {% endif %}
                        </td>
                        {% for id, field in timesheetMetaFields %}
                            <td class="column-{{ 't_' ~ field.name }} text-nowrap" {% if not columns['t_' ~ field.name] %}style="display: none"{% endif %}>
                                {{ tables.datatable_meta_column(entry, field) }}
                            </td>
                        {% endfor %}
                        {% for id, field in customerMetaFields %}
                            <td class="column-{{ 'c_' ~ field.name }} text-nowrap" {% if not columns['c_' ~ field.name] %}style="display: none"{% endif %}>
                                {{ tables.datatable_meta_column(entry.project.customer, field) }}
                            </td>
                        {% endfor %}
                        {% for id, field in projectMetaFields %}
                            <td class="column-{{ 'p_' ~ field.name }} text-nowrap" {% if not columns['p_' ~ field.name] %}style="display: none"{% endif %}>
                                {{ tables.datatable_meta_column(entry.project, field) }}
                            </td>
                        {% endfor %}
                        {% for id, field in activityMetaFields %}
                            <td class="column-{{ 'a_' ~ field.name }} text-nowrap" {% if not columns['a_' ~ field.name] %}style="display: none"{% endif %}>
                                {% if entry.activity is not null %}
                                    {{ tables.datatable_meta_column(entry.activity, field) }}
                                {% endif %}
                            </td>
                        {% endfor %}
                        {% for id, field in userPreferences %}
                            <td class="column-{{ 'u_' ~ field.name }} text-nowrap" {% if not columns['u_' ~ field.name] %}style="display: none"{% endif %}>
                                {% set metaField = entry.user.preference(field.name) %}
                                {% if not metaField is null and metaField.value is not null and metaField.value is not empty %}
                                    {{ widgets.form_type_value(field.type, metaField.value, entry.user) }}
                                {% endif %}
                            </td>
                        {% endfor %}
                        <td class="column-hourlyRate text-nowrap" {% if not columns.hourlyRate %}style="display: none"{% endif %}>
                            {{ entry.hourlyRate|money(entry.project.customer.currency) }}
                        </td>
                        <td class="column-fixedRate text-nowrap" {% if not columns.fixedRate %}style="display: none"{% endif %}>
                            {{ entry.fixedRate|money(entry.project.customer.currency) }}
                        </td>
                        <td class="column-duration text-nowrap" {% if not columns.duration %}style="display: none"{% endif %}>
                            {{ entry.duration|duration(decimal) }}
                        </td>
                        <td class="column-rate_internal text-nowrap" {% if not columns.rate_internal %}style="display: none"{% endif %}>
                            {% if entry.internalRate is defined %}
                                {{ entry.internalRate|money(entry.project.customer.currency) }}
                            {% else %}
                                {{ entry.rate|money(entry.project.customer.currency) }}
                            {% endif %}
                        </td>
                        <td class="column-rate text-nowrap" {% if not columns.rate %}style="display: none"{% endif %}>
                            {{ entry.rate|money(entry.project.customer.currency) }}
                        </td>
                    </tr>
                {% endfor %}
                {# leave in tbody instead of adding it to tfoot, as tfoot will be repeated on each page when printing #}
                <tr>
                    {% for id, visibility in columns %}
                        {% if id not in ['duration', 'rate', 'rate_internal'] %}
                            <th class="column-{{ id }}" {% if not visibility %}style="display: none"{% endif %}></th>
                        {% endif %}
                    {% endfor %}
                    <th class="text-nowrap column-duration">
                        {{- timeWorked|duration(decimal) -}}
                    </th>
                    <th class="text-nowrap column-rate_internal">
                        {%- if currency is not null and currency is not same as(false) %}
                            {{ rateInternalTotal|money(currency) }}
                        {% else %}
                            {{ rateInternalTotal|money }}
                        {% endif -%}
                    </th>
                    <th class="text-nowrap column-rate">
                        {%- if currency is not null and currency is not same as(false) %}
                            {{ rateTotal|money(currency) }}
                        {% else %}
                            {{ rateTotal|money }}
                        {% endif -%}
                    </th>
                </tr>
                </tbody>
            </table>
        </div>
    </div>

{% endblock %}