{% block content %}
    {% set disabled = action == 'u' %}
    <style>
        .autocomplete-suggestions{
            font-size: 18px;
        }
    </style>
    <div>
        <form method="POST" action="{{ path('ticket_reply_form', {action: action, id: id, branch: branch}) }}">
            <h5>{{ page_title }}</h5>
            <div class="row max-width-initial">
                <div class="row max-width-initial">
                    <div class="large-6 columns">
                        <div class="row max-width-initial">
                            <div class="large-3 columns">
                                <div class="input-group">
                                </div>
                            </div>
                            <div class="large-9 columns">
                                <table width="100%">
                                    <thead>
                                    <tr>
                                        <th style="font-weight: 500; text-align: center">Patient</th>
                                        <th></th>
                                    </tr>
                                    </thead>
                                    <tbody id="tbody-patient-list">
                                    {% for pbb_form in form.patientTickets %}
                                        <tr>
                                            <td>
                                                <input type="text"
                                                       name="ticket[patientTickets][{{ loop.index0 }}][patientTicket_patientName]"
                                                       value="{{ pbb_form.vars.value.patient.fullName|default('') }}"
                                                       class="ticket_pt_patientName"
                                                       placeholder="Patient"
                                                       {{ disabled ? 'readonly' : '' }}
                                                />
                                                <input type="hidden"
                                                       name="ticket[patientTickets][{{ loop.index0 }}][patient]"
                                                       value="{{ pbb_form.vars.value.patient.id|default('') }}"
                                                       class="ticket_pt_patient"
                                                />
                                            </td>
                                            <td>
                                                {% if not disabled %}
                                                <a href="javascript:void(0)" class="btn-patient-list-remove">X</a>
                                                {% endif %}
                                                <input type="hidden"
                                                       name="ticket[patientTickets][{{ loop.index0 }}][id]"
                                                       class="ticket_pt_id"
                                                       value="{{ pbb_form.id.vars.value }}" />
                                            </td>
                                        </tr>
                                    {% endfor %}
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                    <div class="large-6 columns">
                        <div class="row max-width-initial">
                            <div class="large-3 columns">
                                <div class="input-group">
                                    {% if not disabled %}
                                    <div class="input-group-button">
                                        <input type="button" class="button secondary" value="Add Encounter"
                                               id="btn-ticket-add-patient-chart"
                                               style="margin: 0; background-color: #e6e6e6; color: #0a0a0a; border: 1px solid #cacaca;" />
                                    </div>
                                    {% endif %}
                                </div>
                            </div>
                            <div class="large-9 columns">
                                <table width="100%">
                                    <thead>
                                    <tr>
                                        <th colspan="2" style="font-weight: 500; text-align: center">Encounter
                                            <i class="fa fa-info-circle float-right" title="NOTE: You can only search and select Encounter Types that was set with Billing."></i>
                                        </th>
                                        {#<th class="text-center"><i class="fa fa-info-circle"></i></th>#}
                                    </tr>
                                    </thead>
                                    <tbody id="tbody-patient-chart-list">
                                    {% for pbb_form in form.patientChartTickets %}
                                        <tr>
                                            <td>
                                                <input type="text"
                                                       name="ticket[patientChartTickets][{{ loop.index0 }}][patientChartTicket_chartNo]"
                                                       value="{{ pbb_form.vars.value.patientChart.id|default('') }} - {{ pbb_form.vars.value.patientChart.chartDateAsString|default('') }} - {{ pbb_form.vars.value.patientChart.chartType.description|default('') }}"
                                                       class="ticket_pct_patientChartNo"
                                                       placeholder="Patient"
                                                        {{ disabled ? 'readonly' : '' }}
                                                />
                                                <input type="hidden"
                                                       name="ticket[patientChartTickets][{{ loop.index0 }}][patientChart]"
                                                       value="{{ pbb_form.vars.value.patientChart.id|default('') }}"
                                                       class="ticket_pct_patientChart"
                                                />
                                            </td>
                                            <td>
                                                {% if not disabled %}
                                                <a href="javascript:void(0)" class="btn-patient-list-remove">X</a>
                                                {% endif %}
                                                <input type="hidden"
                                                       name="ticket[patientChartTickets][{{ loop.index0 }}][id]"
                                                       class="ticket_pct_id"
                                                       value="{{ pbb_form.id.vars.value }}" />
                                            </td>
                                        </tr>
                                    {% endfor %}
                                    </tbody>
                                </table>
                            </div>
                        </div>
                    </div>
                </div>
                <hr>
                <div class="row max-width-initial">
                    <div class="large-6 columns">
                        <div class="row max-width-initial">
                            <div class="large-3 large-text-right columns">
                                {{ form_label(form.accountUser_fullName) }}
                            </div>
                            <div class="large-9 columns">
                                {% if latestTicketNote_accountUser is null %}
                                    {{ form_widget(form.accountUser_fullName) }}
                                    {{ form_widget(form.accountUser) }}
                                {% else %}
                                    {{ form_widget(form.accountUser_fullName, {'value': latestTicketNote_accountUser.fullName}) }}
                                    {{ form_widget(form.accountUser, {'value' : latestTicketNote_accountUser.id}) }}
                                {% endif %}
                            </div>
                        </div>
                        <div class="row max-width-initial">
                            <div class="large-3 large-text-right columns">
                                {{ form_label(form.ticketStatus) }}
                            </div>
                            <div class="large-9 columns">
                                {{ form_widget(form.ticketStatus) }}
                            </div>
                        </div>
                        <div class="row max-width-initial">
                            <div class="large-3 large-text-right columns">
                                {{ form_label(form.ticketSeverity) }}
                            </div>
                            <div class="large-9 columns">
                                {{ form_widget(form.ticketSeverity) }}
                            </div>
                        </div>
                    </div>
                    <div class="large-5 columns">
                        <div class="row max-width-initial">
                            <div class="large-3 large-text-right columns">
                                {{ form_label(form.note) }}
                            </div>
                            <div class="large-9 columns">
                                {{ form_widget(form.note) }}
                            </div>
                        </div>
                    </div>
                    <div class="large-1 columns"></div>
                </div>
                <div class="small-12 columns">
                    <hr class="max-width-initial">
                    <div class="button-container">
                        <button type="submit" class="button just-continue" name="action" value="{{ action }}"
                                data-message="Are you sure you want to save this information?"
                        >Save</button>
                        {% if action == 'u' and (userData.type == 'Super Admin' or 'Admin Internal Status Delete' in userData.accesses) %}
                            <button type="submit" class="ask-continue button alert" name="action" value="d"
                                    data-message="Are you sure you want to delete this record?"
                            >Delete</button>
                        {% endif %}
                        <button class="button secondary" data-close="" aria-label="Close modal" type="button">
                            Close
                        </button>
                    </div>
                </div>
                <hr>
                {% if ticket ? ticket.ticketNotes|length > 0 %}
                    <div class="row">
                        <div class="large-12 columns">
                            <div class="demo-box" style="height:auto; border:solid 2px #1eb7f0; padding-bottom:5px; margin-bottom: 15px;">
                                <h5 style="height:25px; font-size:12px; background-color:#2199e8; padding: 5px; color:#fff; font-family:'Arial';">Notes History</h5>
                                <div class="notes-history">
                                    {% for tn in ticket.ticketNotes %}
                                        <div class="row">
                                            <div class="large-12 columns" style="margin-bottom: 5px; padding-left: 30px;">
                                                <b> {{ tn.createdBy|default('') }} [{{ tn.createdAt|date('m/d/Y H:i a')|default('') }}]</b> - {{ tn.note|default('') }}
                                            </div>
                                        </div>
                                    {% endfor %}
                                </div>
                            </div>
                        </div>
                    </div>
                {% endif %}
            </div>
            {{ form_widget(form.action) }}
            {{ form_widget(form.id) }}
            {{ form_widget(form._token) }}
        </form>
    </div>

    {% if javascripts is defined %}
        {% for javascript in javascripts %}
            <script src="{{ asset('bundles/' ~ javascript ) }}"></script>
        {% endfor %}
    {% endif %}

    <script language="javascript">
        //<![CDATA[
        ticket_form.settings.accountUser_autocompleteUrl = '{{ path('account_user_autocomplete') }}';
        ticket_form.settings.patient_autocompleteUrl = '{{ path('patient_autocomplete') }}';
        ticket_form.settings.patientChart_autocompleteUrl = '{{ path('patient_chart_autocomplete') }}';
        jQ(document).ready(function(){
            ticket_form.init();
        });
        //]]>
    </script>
{% endblock %}