{% extends '@LcSov/adminlte/layout.html.twig' %}
{% import '@LcSov/adminlte/macro/infobox.html.twig' as macro %}

{% block content_title %}
    {{ 'detail'|sov_trans_admin_title(ea.getEntity().getFqcn(), {id: ea.getEntity().getInstance().getId()}) }}
{% endblock %}

{% block main %}
    <div class="row">
        <div class="col-4">
            {% embed '@LcSov/adminlte/embed/infobox.html.twig' %}
                {% block color %}blue{% endblock %}
                {% block icon %}fa fa-toggle-on{% endblock %}
                {% block title %}Status{% endblock %}
                {% block content %}
                    {% form_theme form_ticket_status '@LcSov/adminlte/crud/form_theme.html.twig' %}
                    {{ form_start(form_ticket_status,{'attr' : {'id' : 'ticketStatusForm'}}) }}
                    {% for field in form_ticket_status.status %}
                        {{ form_widget(field, {'attr': {"class" : 'ticket-status'}}) }}
                    {% endfor %}
                    {{ form_end(form_ticket_status) }}
                {% endblock %}
            {% endembed %}

            {% embed '@LcSov/adminlte/embed/infobox.html.twig' %}
                {% block color %}blue{% endblock %}
                {% block icon %}fa fa-user{% endblock %}
                {% block title %}Utilisateur{% endblock %}
                {% block content %}
                    {{ ticket_container.solver.getUserInfosTicket(ticket) }}
                {% endblock %}
            {% endembed %}

            {{ macro.infobox('Date',ticket.createdAt|date('d/m/Y'), "yellow", "fa fa-calendar") }}
            {{ macro.infobox('Catégorie',ticket_container.solver.getTypeLabel(ticket)|trans({},'admin'), "green", "fa fa-archive") }}
        </div>
        <div class="col-8">
            {% embed '@LcSov/adminlte/embed/card.html.twig' %}
                {% block class %}card-primary{% endblock %}
                {% block header %}
                    <h3 class="card-title">
                        Liste des messages
                    </h3>
                {% endblock header %}

                {% block body_wrapper %}
                    <div class="card-body row">
                        <div class="col-12  direct-chat-primary">
                            {% for message in ticket.ticketMessages %}
                                <div class="direct-chat-msg {{ message.answerByAdmin ? 'right' }}">
                                    <div class="direct-chat-infos clearfix">
                                        <div class="direct-chat-name {{ message.answerByAdmin ? 'float-right' : 'float-left' }}">
                                            {{ message.createdBy }}
                                        </div>
                                        <div class="direct-chat-timestamp  {{ message.answerByAdmin ? 'float-left' : 'float-right' }}">
                                            {{ message.createdAt|date('d/m/Y H:i') }}
                                        </div>
                                    </div>
                                    {% if message.answerByAdmin %}
                                        <div class="direct-chat-img align-items-center">
                                            <i class="fa fa-user-circle" style="font-size: 2rem; color: red"></i>
                                        </div>
                                    {% else %}
                                        <div class="direct-chat-img align-items-center">
                                            <i class="fa fa-user-circle" style="font-size: 2rem"></i>
                                        </div>
                                    {% endif %}
                                    <div class="direct-chat-text">
                                        <p>{{ message.message|nl2br }}</p>
                                        {% if message.imageFilename is not null %}
                                            <i>Photo jointe au message : </i> <br/>
                                            <a href="{{ sov_liip(message.imageFilename, 'big') }}"
                                               data-toggle="lightbox">
                                                <img src="{{ sov_liip(message.imageFilename, 'thumb') }}"
                                                     alt="Illustration ticket"/>
                                            </a>
                                        {% endif %}
                                    </div>
                                </div>
                            {% endfor %}
                        </div>
                        <hr />
                        {{ form_start(form_add_ticket_message, {"attr" : {"class" : 'col-12', 'id' : 'addTicketMessageForm'}}) }}
                        {% form_theme form_add_ticket_message '@LcSov/adminlte/crud/form_theme.html.twig' %}
                        <div class="row">
                            <div class="col-12">
                                {{ form_row(form_add_ticket_message.message) }}
                            </div>
                            <div class="col-12 text-right">
                                <button type="submit" class="btn btn-primary text-right">{{ 'send'|sov_trans_admin_action }}</button>
                            </div>
                        </div>
                        {{ form_end(form_add_ticket_message) }}
                    </div>
                {% endblock %}
            {% endembed %}
        </div>
    </div>
{% endblock %}