{% if element.person is not null %}
    {% set template = '@ChillPerson/Person/layout.html.twig' %}
    {% set indexPage = 'chill_budget_elements_index' %}
    {% set activeRouteKey = '' %}
    {% set person = element.person %}
{% else %}
    {% set template = '@ChillPerson/Household/layout.html.twig' %}
    {% set indexPage = 'chill_budget_elements_household_index' %}
    {% set activeRouteKey = '' %}
    {% set household = element.household %}
{% endif %}

{% set title = 'Charge' %}

{% extends template %}

{% block title title %}

{% block content %}
<div class="budget-show">
    <h1>{{ title }}</h1>

    <div class="flex-table">
        <div class="item-bloc">
            <div class="item-row">
                <h2 class="badge-title">
                    <span class="title_label title_label_charge"></span>
                    <span class="title_action">{{ element.charge.getName | localize_translatable_string }}</span>
                </h2>
            </div>
            <div class="item-row separator">
                <dl class="chill_view_data">
                    <dt>{{ 'Amount'|trans }}</dt>
                    <dd>{{ element.amount|format_currency('EUR') }}</dd>
                    <dt>{{ 'Validity period'|trans }}</dt>
                    <dd>
                        {% if element.endDate is not null %}
                            {{ 'Valid since %startDate% until %endDate%'|trans( { '%startDate%': element.startDate|format_date('long'), '%endDate%': element.endDate|format_date('long') } ) }}
                        {% else %}
                            {{ 'Valid since %startDate%'|trans( { '%startDate%': element.startDate|format_date('long') } ) }}
                        {% endif %}
                    </dd>
                    <dt>{{ 'Comment'|trans }}</dt>
                    <dd>
                        {%- if element.comment is not empty -%}
                        <blockquote class="chill-user-quote">
                            {{ element.comment }}
                        </blockquote>
                        {%- else -%}
                        <span class="chill-no-data-statement">{{ 'Not given'|trans }}</span>
                        {%- endif -%}
                    </dd>
                </dl>
            </div>
        </div>
    </div>
</div>

<ul class="record_actions sticky-form-buttons">
    <li class="cancel">
        <a href="{{ path(indexPage, { 'id': person is defined ? person.id : household.id } ) }}" class="btn btn-cancel">
            {{ 'Back to the list'|trans }}
        </a>
    </li>
    {% if is_granted('CHILL_BUDGET_ELEMENT_UPDATE', element) %}
        <li>
            <a href="{{ path('chill_budget_charge_edit', { 'id': element.id } ) }}" class="btn btn-edit">{{ 'Edit'|trans }}</a>
        </li>
    {% endif %}
</ul>
{% endblock %}