{% extends '@commons/default.html.twig' %}

{% block content %}
    {% include '@commons/basics/drop_down.html.twig' %}
    <div class="content_container" style="display: block;">
        {% include '@commons/warning.html.twig' %}
        <div style="display: flex;">
            <div class="demo-charts mdl-color--white mdl-shadow--2dp mdl-cell mdl-cell--8-col-desktop mdl-grid">
                <div class="mdl-card__title mdl-card--expand">
                    <h2 class="mdl-card__title-text">{{ project.status_str }}</h2>
                </div>
                <form action="/buchhaltung/projekt_list/details/{{ project_id }}" method="post">
                    <div class="mdl-card__supporting-text mdl-color-text--grey-600">
                        <h5>Aktueller Stand</h5>
                        <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
                            <input class="mdl-textfield__input input--mandatory" id="hours" name="hours" type="text"
                                   pattern="-?([0-9]||\.[0-9]{3})*(,[0-9]([0-9])?)?"
                                   value="{{ post_calculation.hours }}">
                            <label class="mdl-textfield__label" for="hours">Stunden in h</label>
                            <span class="mdl-textfield__error">Eingabe ist kein gültiger Wert</span>
                        </div>
                        <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
                            <input class="mdl-textfield__input input--mandatory" id="material_costs"
                                   name="material_costs" type="text" pattern="-?([0-9]||\.[0-9]{3})*(,[0-9][0-9])?"
                                   value="{{ post_calculation.material_costs }}">
                            <label class="mdl-textfield__label" for="material_costs">Material in €</label>
                            <span class="mdl-textfield__error">Eingabe ist kein gültiger Wert</span>
                        </div>
                        <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
                            <input class="mdl-textfield__input input--mandatory" id="external_costs"
                                   name="external_costs" type="text" pattern="-?([0-9]||\.[0-9]{3})*(,[0-9][0-9])?"
                                   value="{{ post_calculation.external_costs }}">
                            <label class="mdl-textfield__label" for="external_costs">Fremdleistungen in €</label>
                            <span class="mdl-textfield__error">Eingabe ist kein gültiger Wert</span>
                        </div>
                        <h5>Abrechnungsstand</h5>
                        <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
                            <input class="mdl-textfield__input input--mandatory" id="accounting_1" name="accounting_1"
                                   type="text" pattern="-?([0-9]||\.[0-9]{3})*(,[0-9][0-9])?"
                                   value="{{ post_calculation.accounting_1 }}">
                            <label class="mdl-textfield__label" for="accounting_1">Abrechnungsstand 1 (BWA) in €</label>
                            <span class="mdl-textfield__error">Eingabe ist kein gültiger Wert</span>
                        </div>
                        <div class="mdl-textfield mdl-js-textfield mdl-textfield--floating-label">
                            <input class="mdl-textfield__input input--mandatory" id="accounting_2" name="accounting_2"
                                   type="text" pattern="-?([0-9]||\.[0-9]{3})*(,[0-9][0-9])?"
                                   value="{{ post_calculation.accounting_2 }}">
                            <label class="mdl-textfield__label" for="accounting_2">Abrechnungsstand 2 (Alle) in €</label>
                            <span class="mdl-textfield__error">Eingabe ist kein gültiger Wert</span>
                        </div>
                        <div>
                            <label for="date">Bewertungsdatum*
                                <input type="date" name="date" id="date" max="{{ date_limit }}"
                                       value="{{ post_calculation.date }}" required>
                            </label>
                        </div>
                        <p class="info_text">
                            * Pflichtfeld
                        </p>
                    </div>
                    {% if not is_admin %}
                        {% if metadata.project_selected %}
                            <div class="mdl-card__actions mdl-card--border">
                                <button class="mdl-button mdl-js-button mdl-js-ripple-effect"
                                        id="button_updacte_post_calc" type="submit">Senden
                                </button>
                            </div>
                        {% endif %}
                    {% endif %}
                </form>
            </div>
            <div class="demo-charts mdl-color--white mdl-shadow--2dp mdl-cell mdl-cell--4-col-desktop mdl-grid">
                <div class="mdl-card__title mdl-card--expand">
                    <h2 class="mdl-card__title-text">Statistiken</h2>
                </div>
                <div class="mdl-card__supporting-text mdl-color-text--grey-600">
                    <h5>Fertigstellungsgrad</h5>
                    <p>
                        <b>Fertigstellungsgrad:</b> {{ stats.completion }} %
                    </p>
                    <h5>Halbfertige Arbeiten</h5>
                    <p>
                        <b>Abrechungsstand 1 (BWA):</b> {{ stats.bwa }} €<br/>
                        <b>Halbfertige Arbeiten:</b> {{ stats.half_finished }} €
                    </p>
                    <h5>Abrechnungspotenzial</h5>
                    <p>
                        <b>Abrechnungsstand 2 (alle):</b> {{ stats.all }} €<br/>
                        <b>Abrechnungspotenzial:</b> {{ stats.potential }} €
                    </p>
                </div>
            </div>
        </div>
        <div style="display: flex;">
            <div class="demo-charts mdl-color--white mdl-shadow--2dp mdl-cell mdl-cell--4-col-desktop mdl-grid">
                <div class="mdl-card__title mdl-card--expand">
                    <h2 class="mdl-card__title-text">Aktuelle Arbeitskalkulation</h2>
                </div>
                <div class="mdl-card__supporting-text mdl-color-text--grey-600">
                    <p>
                        <b>Auftragsvolumen:</b> {{ working_calculation.order_volume }} €<br/>
                        <b>Material:</b> {{ working_calculation.material }} €<br/>
                        <b>Fremdleistungen:</b> {{ working_calculation.external_service }} €<br/>
                        <b>Rohertrag (gesamt):</b> {{ working_calculation.gross_profit }} €<br/>
                        <b>Rohertrag / Stunde:</b> {{ working_calculation.gross_per_hour }} €<br/>
                        <b>Stunden:</b> {{ working_calculation.productive }} h
                    </p>
                </div>
            </div>
        </div>
    </div>
{% endblock %}

{% block scripts_post_loaded %}
    <script src="{{ asset('/assets/js/drop_down.js') }}"></script>
    <script src="{{ asset('/assets/js/drop_down_projects.js') }}"></script>
    <script>
        let project_status = {{ project.status }};
        console.log('project_status: ' + project_status);
        if(project_status !== 2 && project_status !== 3 && project_status !== 4) {
            $('#button_updacte_post_calc').prop("disabled",true);
            $('#project_status_notification').show();
        }

    </script>
{% endblock %}