{% extends "admin/import_export/base.html" %}
{% load i18n %}
{% load admin_urls %}
{% load import_export_tags %}
{% load static %}

{% block extrastyle %}{{ block.super }}<link rel="stylesheet" type="text/css" href="{% static "import_export/import.css" %}" />{% endblock %}

{% block breadcrumbs_last %}
{% trans "Import" %}
{% endblock %}

{% block content_content %}

  {% if confirm_form %}
    <form action="{% url opts|admin_urlname:"process_import" %}" method="POST">
      {% csrf_token %}
      {{ confirm_form.as_p }}
      <p>
        {% trans "Below is a preview of data to be imported. If you are satisfied with the results, click 'Confirm import'" %}
      </p>
      <div class="row justify-content-end mt-4 mx-2">
        <div class="col px-0"></div>
        <div class="col-sm-12 col-md-auto px-1"><input type="submit" class="default form-control btn btn-success" name="confirm" value="{% trans "Confirm import" %}"></div>
      </div>
    </form>
  {% else %}
    <form action="" method="post" enctype="multipart/form-data">
      {% csrf_token %}

      <p>
        {% trans "This importer will import the following fields: " %}
        <code>{{ fields|join:", " }}</code>
      </p>

      <fieldset class="module aligned">
        {% for field in form %}
          <div class="form-row row">

            <div class="offset-md-2 col-md-10 error-container">
              {{ field.errors }}
            </div>
            <div class="col-md-2 mt-2">
              {{ field.label_tag }}
            </div>
            <div class="col-md-10 {% if field.is_checkbox %}mt-2{% endif %} vTextField">
              {{ field }}
            </div>
            {% if field.field.help_text %}
              <div class="offset-md-2 col-md-10">{{ field.field.help_text|safe }}</div>
            {% endif %}
          </div>
        {% endfor %}
      </fieldset>
      <div class="row justify-content-end mt-4 mx-2">
        {% if sample_file %}
          <div class="col-sm-12 col-md-auto px-1"><a href="{% static sample_file %}" class="default form-control btn btn-info text-white">{% trans "Download Sample File" %}</a></div>
        {% endif %}
        <div class="col px-0"></div>
        <div class="col-sm-12 col-md-auto px-1"><input type="submit" class="default form-control btn btn-primary" value="{% trans "Submit" %}"></div>
      </div>
    </form>
  {% endif %}

  {% if result %}
    {% if result.has_errors %}

      <h5>{% trans "Errors" %}</h5>
      <ul>
        {% for error in result.base_errors  %}
        <li>
          {{ error.error }}
          <div class="traceback">{{ error.traceback|linebreaks }}</div>
        </li>
        {% endfor %}
        {% for line, errors in result.row_errors %}
          {% for error in errors %}
            <li>
              {% trans "Line number" %}: {{ line }} - {{ error.error }}
              <div><code>{{ error.row.values|join:", " }}</code></div>
              <div class="traceback">{{ error.traceback|linebreaks }}</div>
            </li>
          {% endfor %}
        {% endfor %}
      </ul>

    {% elif result.has_validation_errors %}

      <h5>{% trans "Some rows failed to validate" %}</h5>
        
      <p>{% trans "Please correct these errors in your data where possible, then reupload it using the form above." %}</p>
      <div class="table-responsive" style="min-height: 350px;">
      <table class="import-preview table">
        <thead>
          <tr>
            <th>{% trans "Row" %}</th>
            <th>{% trans "Errors" %}</th>
            {% for field in result.diff_headers %}
              <th>{{ field }}</th>
            {% endfor %}
          </tr>
        </thead>
        <tbody>
        {% for row in result.invalid_rows %}
          <tr>
            <td>{{ row.number }} </td>
            <td class="errors">
              <span class="validation-error-count">{{ row.error_count }}</span> 
              <div class="validation-error-container">
                <ul class="validation-error-list">
                  {% for field_name, error_list in row.field_specific_errors.items %}
                    <li>
                        <span class="validation-error-field-label">{{ field_name }}</span>
                        <ul>
                          {% for error in error_list %}
                            <li>{{ error }}</li>
                          {% endfor %}
                        </ul>
                    </li>
                  {% endfor %}
                  {% if row.non_field_specific_errors %}
                    <li>
                      <span class="validation-error-field-label">{% trans "Non field specific" %}</span>
                      <ul>
                        {% for error in row.non_field_specific_errors %}
                          <li>{{ error }}</li>
                        {% endfor %}
                      </ul>
                    </li>
                  {% endif %}
                </ul>
              </div>
            </td>
            {% for field in row.values %}
              <td>{{ field }}</td>
            {% endfor %}
          </tr>
        {% endfor %}
        </tbody>
      </table>
      </div>
  
    {% else %}

      <h5>{% trans "Preview" %}</h5>
      <div class="table-responsive">
      <table class="import-preview table">
        <thead>
          <tr>
            <th></th>
            {% for field in result.diff_headers %}
              <th>{{ field }}</th>
            {% endfor %}
          </tr>
        </thead>
        {% for row in result.valid_rows %}
          <tr class="{{ row.import_type }}">
            <td class="import-type">
              {% if row.import_type == 'new' %}
                {% trans "New" %}
              {% elif row.import_type == 'skip' %}
                {% trans "Skipped" %}
              {% elif row.import_type == 'delete' %}
                {% trans "Delete" %}
              {% elif row.import_type == 'update' %}
                {% trans "Update" %}
              {% endif %}
            </td>
            {% for field in row.diff %}
              <td>{{ field }}</td>
            {% endfor %}
          </tr>
        {% endfor %}
      </table>
      </div>
    {% endif %}
  {% endif %}
{% endblock %}
