{% import 'macros/form.jinja2' as f with context %}

{% if request.endpoint.endswith('new') %}
  {% set endpoint = 'admin.issues_new' %}
  {% set form_kwargs = {} %}
  {% set legend = 'Add New Issue' %}
  {% set button = _('Add') %}
{% else %}
  {% set endpoint = 'admin.issues_edit' %}
  {% set form_kwargs = {'id': issue.id} %}
  {% set legend = 'Update This Issue' %}
  {% set button = _('Save') %}
{% endif %}

<div class="content">
    <div class="container-fluid">
        <div class="row">
        {% call f.form_tag(endpoint, **form_kwargs) %}
            <div class="col-sm-8 col-sm-offset-2">
                <div class="card">
                    <div class="card-header card-header-icon" data-background-color="light-blue">
                        <i class="material-icons">info_outline</i>
                    </div>
                    <div class="card-content">
                        <h4 class="card-title">{{ legend }}
                        </h4>
                        <div class="row">
                            <div class="col-md-12 form-group">
                                <label >Created on</label>
                                <span class="margin-bottom text-muted">
                                    <time class="from-now"
                                        data-datetime="{{ issue.created_on }}">
                                    {{ issue.created_on }}
                                    </time>
                                </span>
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-6 form-group label-floating">
                                {% call f.form_group(form.label, css_class='form-control') %}
                                {% endcall %}
                            </div>
                            <div class="col-md-6 form-group label-floating">
                                {% call f.form_group(form.email, css_class='form-control') %}
                                {% endcall %}
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-12 form-group label-floating">
                                {% call f.form_group(form.question, css_class='form-control',
                                 placeholder='The more we know, the easier it will be to help you',
                                 rows='4') %}
                                {% endcall %}
                            </div>
                        </div>
                        <div class="row">
                            <div class="col-md-12 form-group label-floating">
                                {% call f.form_group(form.status) %}
                                {% endcall %}
                            </div>
                        </div>
                        <div class="row">
                            <div class="form-group col-md-12" style="text-align:center">
                                <button type="submit" class="btn btn-fill btn-light-blue">
                                    {{ button }}
                                </button>
                                <div class="visible-xs visible-sm sm-margin-top"></div>
                                <a href="{{ url_for('admin.issues') }}"
                                 class="btn btn-simple">
                                {{ _('Cancel') }}
                                </a>
                            </div>
                        </div>
                        <h4>Contact the person who issued this ticket</h4>
                        <div class="visible-xs visible-sm sm-margin-top"></div>
                        <a href="#issues_contact" class="btn btn-success bnt-fill"
                           data-toggle="modal" data-target="#issues_contact">
                          {{ _('Contact') }}
                        </a>
                    </div>
                </div>
            </div>
        {% endcall %}
        </div>
    </div>
</div>
<div class="modal fade" id="issues_contact" tabindex="-1" role="dialog" aria-hidden="true">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal"
                        aria-label="Close">
                    <span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">
                  You are about to send an e-mail
                </h4>
            </div>
          {% call f.form_tag('admin.issues_contact', **form_kwargs) %}
                <div class="modal-body">
                    <div class="row">
                        <div class="col-md-12 form-group label-floating">
                            {% call f.form_group(contact_form.subject, css_class='form-control') %}
                            {% endcall %}
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-md-12 form-group label-floating">
                            {% call f.form_group(contact_form.message, css_class='form-control', rows='12') %}
                            {% endcall %}
                        </div>
                    </div>
              </div>
              <div class="modal-footer">
                  <button type="submit" class="btn btn-light-blue">
                    {{ _('Send') }}
                  </button>
                  <button type="button" class="btn btn-simple"
                          data-dismiss="modal">
                    {{ _('Cancel') }}
                  </button>
              </div>
          {% endcall %}
        </div>
    </div>
</div>