{% extends "withnav_template.html" %}
{% from "components/page-footer.html" import page_footer %}
{% from "components/file-upload.html" import file_upload %}
{% from "components/table.html" import list_table, text_field, index_field, index_field_heading %}

{% block page_title %}
  Upload recipients – GOV.UK Notify
{% endblock %}

{% block maincolumn_content %}

  <h1 class="heading-large">Upload recipients</h1>

  {{ template|string }}

  <div class="page-footer bottom-gutter">
    {{file_upload(
      form.file,
      button_text='Choose a file'
    )}}
  </div>

  <h2 class="heading-medium">Your file needs to look like this example</h2>
  <div class="spreadsheet">
    {% call(item, row_number) list_table(
      example,
      caption="Example",
      caption_visible=False,
      field_headings=[''] + column_headings
    ) %}
      {{ index_field(row_number - 1) }}
      {% for column in item %}
        {{ text_field(column) }}
      {% endfor %}
    {% endcall %}
  </div>
  <p class="table-show-more-link">
    <a href="{{ url_for('.get_example_csv', service_id=current_service.id, template_id=template.id) }}">Download this example</a>
  </p>

  <h2 class="heading-medium">Accepted file formats</h2>
  <ul class="list list-bullet">
    <li>.<acronym title="Comma Separated Values">csv</acronym></li>
    <li>.<acronym title="Comma Separated Values">tsv</acronym></li>
    <li>Open Document Spreadsheet (.ods)</li>
    <li>Microsoft Excel (.xls, .xlsx, .xlsm)</li>
  </p>

{% endblock %}