{% extends "base.html" %}
{% load i18n %}
{% block title %}{% translate "SSL Certificates" %} - Eenos{% endblock %}
{% block content %}
<div class="eenos-page-header flex-wrap gap-3">
  <div><h1 class="eenos-page-title">{% translate "SSL Certificates" %}</h1><div class="eenos-page-subtitle">{% translate "Install and manage Let's Encrypt and commercial certificates for your domains." %}</div></div>
  <div class="d-grid col-12 col-sm-auto d-sm-flex gap-2"><a href="{% url 'ssl_csr_create' %}" class="btn btn-outline-primary text-nowrap"><i data-lucide="file-key-2"></i>{% translate "Generate CSR" %}</a><a href="{% url 'ssl_commercial' %}" class="btn btn-outline-secondary text-nowrap"><i data-lucide="shield-plus"></i>{% translate "Install Certificate" %}</a></div>
</div>
<nav class="eenos-breadcrumb" aria-label="{% translate 'Breadcrumb' %}"><a href="{% url 'dashboard' %}">{% translate "Dashboard" %}</a><span class="eenos-breadcrumb-separator"><i data-lucide="chevron-right"></i></span><span>{% translate "Security" %}</span><span class="eenos-breadcrumb-separator"><i data-lucide="chevron-right"></i></span><span>{% translate "SSL/TLS" %}</span><span class="eenos-breadcrumb-separator"><i data-lucide="chevron-right"></i></span><span class="eenos-breadcrumb-current">{% translate "SSL Certificates" %}</span></nav>
{% include "includes/form_alerts.html" %}
<div class="eenos-amber-notice eenos-amber-notice-warning mb-4" role="alert"><div class="eenos-amber-notice-icon"><i data-lucide="triangle-alert"></i></div><div class="eenos-amber-notice-content"><div class="eenos-amber-notice-title">{% translate "Certificate priority" %}</div><div class="eenos-amber-notice-text">{% translate "When both certificate types are installed, the commercial certificate is served by default." %}</div></div></div>
<div class="eenos-card"><div class="eenos-card-header"><div><h2 class="eenos-card-title">{% translate "Domain Certificates" %}</h2><p class="eenos-card-subtitle">{% translate "Review certificate validity and manage SSL for every hosted domain." %}</p></div><div class="eenos-card-action-icon"><i data-lucide="badge-check"></i></div></div><div class="table-responsive"><table id="sslDomainsTable" class="table align-middle w-100"><thead><tr><th>{% translate "Domain" %}</th><th>{% translate "Commercial SSL" %}</th><th>{% translate "AutoSSL" %}</th><th class="text-end">{% translate "Actions" %}</th></tr></thead></table></div></div>
<form method="post" id="sslActionForm" class="d-none">{% csrf_token %}<input type="hidden" name="domain" id="sslActionDomain"><input type="hidden" name="installautossl" id="installautossl" value="yes" disabled><input type="hidden" name="deleteautossl" id="deleteautossl" value="yes" disabled><input type="hidden" name="deletecomssl" id="deletecomssl" value="yes" disabled></form>
<div class="modal fade" id="sslActionModal" tabindex="-1" aria-labelledby="sslActionTitle" aria-hidden="true"><div class="modal-dialog modal-dialog-centered"><div class="modal-content"><div class="modal-header"><div><h2 class="modal-title fs-5" id="sslActionTitle"></h2><div class="small text-muted mt-1">{% translate "Confirm this certificate operation before continuing." %}</div></div><button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="{% translate 'Close' %}"></button></div><div class="modal-body"><div class="eenos-modal-info mb-4"><div class="eenos-modal-info-icon"><i data-lucide="globe-2"></i></div><div class="eenos-modal-info-content"><div class="eenos-modal-info-label">{% translate "Domain" %}</div><div class="eenos-modal-info-value" id="sslActionDomainLabel"></div></div></div><div class="eenos-notice eenos-notice-warning mb-0"><div class="eenos-notice-icon"><i data-lucide="shield-check"></i></div><div class="eenos-notice-content"><div class="eenos-notice-text" id="sslActionMessage"></div></div></div></div><div class="modal-footer"><button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">{% translate "Cancel" %}</button><button type="button" class="btn btn-primary" id="confirmSslAction">{% translate "Continue" %}</button></div></div></div></div>
{% endblock %}
{% block extra_js %}<script>
(function($){"use strict";$(function(){
const esc=v=>$("<div>").text(v==null?"":v).html();
const status=(prefix,row)=>{const value=row[prefix+"_status"];if(value==="not_installed")return'<span class="eenos-status text-muted">{% translate "Not installed" %}</span>';const cls=value==="active"?"text-success":value==="expired"?"text-danger":"text-warning",label=value==="active"?"{% translate 'Active' %}":value==="expired"?"{% translate 'Expired' %}":"{% translate 'Error' %}";let html='<span class="eenos-status '+cls+'">'+label+"</span>";if(row[prefix+"_expires_at"])html+='<div class="small text-muted mt-1 text-nowrap">{% translate "Expires" %}: '+esc(row[prefix+"_expires_at"])+"</div>";if(row[prefix+"_sans"])html+='<div class="small text-muted mt-1 text-break" style="max-width:20rem"><span class="fw-semibold">SAN:</span> '+esc(row[prefix+"_sans"])+"</div>";return html};
const table=$("#sslDomainsTable").DataTable({processing:true,autoWidth:false,ajax:{url:"{% url 'ssl_domains_data' %}",dataSrc:"data"},pageLength:25,lengthMenu:[[25,50,100,-1],[25,50,100,"{% translate 'All' %}"]],order:[[0,"asc"]],language:{lengthMenu:"{% translate '_MENU_ Rows per page' %}",loadingRecords:"&nbsp;",processing:"{% translate 'Loading...' %}",emptyTable:"{% translate 'No hosted domains are available.' %}",zeroRecords:"{% translate 'No matching domains found.' %}"},responsive:{details:{renderer:DataTable.Responsive.renderer.listHiddenNodes()}},columns:[
{data:"domain",responsivePriority:1,className:"text-nowrap",render:(v,t,r)=>t==="display"&&r.site_url?'<a href="'+esc(r.site_url)+'" target="_blank" rel="noopener noreferrer" class="d-inline-flex align-items-center gap-1">'+esc(v)+'<i data-lucide="external-link"></i></a>':v},
{data:null,responsivePriority:4,render:(d,t,r)=>t==="display"?status("commercial_ssl",r):r.commercial_ssl_status},
{data:null,responsivePriority:3,render:(d,t,r)=>t==="display"?status("auto_ssl",r):r.auto_ssl_status},
{data:null,orderable:false,searchable:false,responsivePriority:2,className:"text-end text-nowrap",render:(d,t,r)=>{if(t!=="display")return"";let a='<div class="eenos-dt-actions justify-content-end">';if(r.can_install_auto_ssl)a+='<button type="button" class="btn btn-sm btn-outline-success ssl-action" data-action="installautossl" data-domain="'+esc(r.domain)+'" title="{% translate "Install AutoSSL" %}"><i data-lucide="shield-check"></i></button>';if(r.can_delete_auto_ssl)a+='<button type="button" class="btn btn-sm btn-outline-warning ssl-action" data-action="deleteautossl" data-domain="'+esc(r.domain)+'" title="{% translate "Remove AutoSSL" %}"><i data-lucide="shield-off"></i></button>';if(r.can_install_commercial_ssl)a+='<a class="btn btn-sm btn-outline-primary" href="'+esc(r.commercial_install_url)+'" title="{% translate "Install commercial SSL" %}"><i data-lucide="upload"></i></a>';if(r.can_delete_commercial_ssl)a+='<button type="button" class="btn btn-sm btn-outline-danger ssl-action" data-action="deletecomssl" data-domain="'+esc(r.domain)+'" title="{% translate "Remove commercial SSL" %}"><i data-lucide="trash-2"></i></button>';return a+"</div>"}}],drawCallback:()=>lucide.createIcons()});
table.on("responsive-display",()=>lucide.createIcons());
const modal=bootstrap.Modal.getOrCreateInstance(document.getElementById("sslActionModal"));$("#sslActionModal").on("hidden.bs.modal",()=>$("#installautossl,#deleteautossl,#deletecomssl").prop("disabled",true));
$(document).on("click",".ssl-action",function(){const action=this.dataset.action,domain=this.dataset.domain,removing=action!=="installautossl";$("#sslActionDomain").val(domain);$("#sslActionDomainLabel").text(domain);$("#"+action).prop("disabled",false);$("#sslActionTitle").text(removing?"{% translate 'Remove SSL Certificate' %}":"{% translate 'Install AutoSSL' %}");$("#sslActionMessage").text(removing?"{% translate 'The selected certificate will be removed from this domain.' %}":"{% translate 'An AutoSSL certificate request will be started for this domain.' %}");$("#confirmSslAction").toggleClass("btn-primary",!removing).toggleClass("btn-danger",removing).text(removing?"{% translate 'Remove Certificate' %}":"{% translate 'Install AutoSSL' %}");modal.show()});
$("#confirmSslAction").on("click",()=>document.getElementById("sslActionForm").submit());
})})(jQuery);
</script>{% endblock %}