{% extends '../layout/admin.html' %}

{% block html_title %}{{ customTitle(t('External Account management')) }}{% endblock %}

{% block content_header %}
<div class="header-wrap">
  <header id="page-header">
    <h1 id="admin-title" class="title">{{ t('User_management') }}/{{ t('External Account management') }}</h1>
  </header>
</div>
{% endblock %}

{% block content_main %}
<div class="content-main">
  {% set wmessage = req.flash('warningMessage') %}
  {% if wmessage.length %}
  <div class="alert alert-warning">
    {{ wmessage }}
  </div>
  {% endif %}

  {% set smessage = req.flash('successMessage') %}
  {% if smessage.length %}
  <div class="alert alert-success">
    {{ smessage }}
  </div>
  {% endif %}

  {% set emessage = req.flash('errorMessage') %}
  {% if emessage.length %}
  <div class="alert alert-danger">
    {{ emessage }}
  </div>
  {% endif %}

  <div class="row">
    <div class="col-md-3">
      {% include './widget/menu.html' with {current: 'external-account'} %}
    </div>

    <div class="col-md-9">
      <p>
        <a class="btn btn-default" href="/admin/users">
          <i class="icon-fw ti-arrow-left" aria-hidden="true"></i>
          {{ t('user_management.back_to_user_management') }}
        </a>
      </p>

      <h2>{{ t('user_management.external_account_list') }}</h2>

      <table class="table table-bordered table-user-list">
        <thead>
          <tr>
            <th width="120px">{{ t('user_management.authentication_provider') }}</th>
            <th><code>accountId</code></th>
            <th>{{ t('user_management.related_username', 'username') }}</th>

            <th>
              {{ t('user_management.password_setting') }}
              <a class="text-muted"
                  data-toggle="popover" data-placement="top"
                  data-trigger="hover focus" tabindex="0" role="button" {# dismiss settings #}
                  data-animation="false" data-html="true"
                  data-content="<small>{{ t('user_management.password_setting_help') }}</small>">
                <small>
                  <i class="icon-question" aria-hidden="true"></i>
                </small>
              </a>
            </th>
            <th width="100px">{{ t('Created') }}</th>
            <th width="70px"></th>
          </tr>
        </thead>
        <tbody>
          {% for account in accounts %}
          <tr>
            <td>{{ account.providerType }}</td>
            <td>
              <strong>{{ account.accountId }}</strong>
            </td>
            <td>
              <strong>{{ account.user.username }}</strong>
            </td>
            <td>
              {% if account.user.password != null %}
              <span class="label label-info">
                {{ t('user_management.set') }}
              </span>
              {% else %}
              <span class="label label-warning">
                {{ t('user_management.unset') }}
              </span>
              {% endif %}
            </td>
            <td>{{ account.createdAt|date('Y-m-d', account.createdAt.getTimezoneOffset()) }}</td>
            <td>
              <div class="btn-group admin-user-menu">

                <button type="button" class="btn btn-default btn-sm dropdown-toggle" data-toggle="dropdown">
                  <i class="icon-settings"></i> <span class="caret"></span>
                </button>
                <ul class="dropdown-menu" role="menu">
                  <li class="dropdown-header">{{ t('user_management.Edit_menu') }}</li>
                  <form id="form_remove_{{ loop.index }}" action="/admin/users/external-accounts/{{ account._id.toString() }}/remove" method="post">
                    <input type="hidden" name="_csrf" value="{{ csrf() }}">
                  </form>
                  <li>
                    <a href="javascript:form_remove_{{ loop.index }}.submit()">
                      <i class="icon-fw icon-fire text-danger"></i>
                      {{ t('Delete') }}
                    </a>
                  </li>
                </ul>{# end of .dropdown-menu #}



              </div>{# end of .btn-group #}
            </td>
          </tr>
          {% endfor %}
        </tbody>
      </table>

      {% include '../widget/pager.html' with {path: "/admin/users/external-accounts", pager: pager} %}

    </div>
  </div>
</div>
{% endblock content_main %}

{% block content_footer %}
{% endblock content_footer %}