{% extends "baseTemplate/index.html" %}
{% load static %}
{# Issue mail.<domain> and install it into Postfix and Dovecot. #}

{% block title %}Mail server SSL{% endblock %}

{% block content %}
<div ng-controller="mailServerSSLController">

  <div class="cp-page-head">
    <div>
      <h1 class="cp-page-head__title"><i class="fa-solid fa-envelope-circle-check"></i> Mail server SSL</h1>
      <p class="cp-page-head__sub">
        A certificate for <code>mail.&lt;domain&gt;</code>, installed into
        Postfix (SMTP) and Dovecot (IMAP/POP3).
      </p>
    </div>
    <div class="cp-page-head__actions">
      <a class="cp-btn cp-btn--ghost" href="/ssl/manageSSL">
        <i class="fa-solid fa-lock"></i> Website certificates
      </a>
    </div>
  </div>

  <div class="cp-alert cp-alert--info">
    <i class="fa-solid fa-circle-info"></i>
    <p>
      <code>mail.&lt;domain&gt;</code> must already have an A record pointing at
      this server, and port 80 must be open, because validation happens over
      HTTP. Postfix and Dovecot are reloaded afterwards; existing sessions are
      not dropped. Let's Encrypt allows {{ duplicateLimit }} duplicate
      certificates per registered domain per week, so avoid re-issuing a
      healthy certificate.
    </p>
  </div>

  <div class="cp-card">
    <div class="cp-card__head">
      <h2 class="cp-card__title"><i class="fa-solid fa-at"></i> Mail hostnames</h2>
      <p class="cp-card__sub">One certificate per domain that sends or receives mail here.</p>
    </div>

    <div class="cp-card__body cp-card__body--flush">

      <div class="cp-empty" ng-show="certificates.length === 0" ng-cloak>
        <i class="fa-solid fa-inbox"></i>
        <h4>No websites yet</h4>
        <p>Create a website before issuing a mail certificate for it.</p>
      </div>

      <div class="cp-table-wrap" ng-show="certificates.length" ng-cloak>
        <table class="cp-table">
          <thead>
            <tr>
              <th scope="col">Mail host</th>
              <th scope="col">Issuer</th>
              <th scope="col">Expires</th>
              <th scope="col">Days left</th>
              <th scope="col" style="text-align:right">Action</th>
            </tr>
          </thead>
          <tbody>
            <tr ng-repeat="row in certificates track by row.domain">
              <td><code ng-bind="row.domain"></code></td>
              <td>
                <span ng-show="row.issuer" ng-bind="row.issuer"></span>
                <span class="cp-badge" ng-hide="row.issuer">Not issued</span>
              </td>
              <td ng-bind="row.expiry ? row.expiry.substring(0, 10) : '—'"></td>
              <td>
                <span class="cp-badge" ng-class="'cp-badge--' + row.badge"
                      ng-show="row.daysLeft !== null && row.daysLeft !== undefined"
                      ng-bind="row.daysLeft < 0 ? 'Expired' : row.daysLeft + ' days'"></span>
                <span ng-hide="row.daysLeft !== null && row.daysLeft !== undefined">—</span>
              </td>
              <td>
                <div class="cp-table__actions">
                  <button type="button" class="cp-btn cp-btn--sm"
                          ng-class="row.hasCertificate ? 'cp-btn--ghost' : 'cp-btn--primary'"
                          ng-click="issue(row)" ng-disabled="job.active">
                    <i class="fa-solid fa-rotate"></i>
                    <span ng-bind="row.hasCertificate ? 'Renew' : 'Issue'"></span>
                  </button>
                </div>
                <p class="cp-help" ng-show="row.lastError" ng-bind="row.lastError"></p>
              </td>
            </tr>
          </tbody>
        </table>
      </div>
    </div>
  </div>

  {% include "sslManager/_joblog.html" %}

  {{ certificates|json_script:"cpSSLData" }}
</div>
{% endblock %}

{% block scripts %}
<script src="{% static 'sslManager/sslManager.js' %}"></script>
{% endblock %}