{% extends "base.html" %}
{% load i18n %}
{% block title %}{% translate "DNS Zones" %} - Eenos{% endblock %}
{% block content %}
<div class="eenos-page-header flex-wrap gap-3">
  <div><h1 class="eenos-page-title">{% translate "DNS Zones" %}</h1><div class="eenos-page-subtitle">{% translate "Manage DNS records, mail policies, and authoritative nameservers." %}</div></div>
  <div class="col-12 col-sm-auto"><a href="{% url 'dns_add' %}" class="btn btn-outline-primary d-flex align-items-center justify-content-center gap-2 w-100"><i data-lucide="plus"></i><span>{% translate "Add DNS Zone" %}</span></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 "Hosting" %}</span><span class="eenos-breadcrumb-separator"><i data-lucide="chevron-right"></i></span><span>{% translate "DNS" %}</span><span class="eenos-breadcrumb-separator"><i data-lucide="chevron-right"></i></span><span class="eenos-breadcrumb-current">{% translate "DNS Zones" %}</span></nav>
{% include "includes/form_alerts.html" %}
<div class="eenos-card">
  <div class="eenos-card-header"><div><h2 class="eenos-card-title">{% translate "Managed DNS Zones" %}</h2><p class="eenos-card-subtitle">{% translate "Review zone addresses, policies, nameservers, and available actions." %}</p></div><div class="eenos-card-action-icon"><i data-lucide="list-tree"></i></div></div>
  <div class="table-responsive"><table id="dnsZonesTable" class="table align-middle w-100"><thead><tr><th>{% translate "Domain" %}</th><th>{% translate "DKIM" %}</th><th>{% translate "SPF" %}</th><th>{% translate "Addresses" %}</th><th>{% translate "Nameservers" %}</th><th>{% translate "Template" %}</th><th>{% translate "Actions" %}</th></tr></thead></table></div>
</div>
<form method="post" id="dnsPolicyForm" class="d-none">{% csrf_token %}<input type="hidden" name="set_dkim" id="dnsDkimMarker" value="yes" disabled><input type="hidden" name="set_spf" id="dnsSpfMarker" value="yes" disabled><input type="hidden" name="domain" id="dnsPolicyDomain"><input type="hidden" name="action" id="dnsPolicyAction"></form>
<div class="modal fade" id="dnsPolicyModal" tabindex="-1" aria-labelledby="dnsPolicyTitle" 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 d-flex align-items-center gap-2" id="dnsPolicyTitle"><i data-lucide="shield-check"></i><span></span></h2><div class="small text-muted mt-1">{% translate "Confirm this DNS policy change." %}</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 "DNS zone" %}</div><div class="eenos-modal-info-value" id="dnsPolicyDomainLabel"></div></div></div><div class="eenos-notice eenos-notice-info mb-0"><i data-lucide="info"></i><div id="dnsPolicyMessage"></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="confirmDnsPolicy"><i data-lucide="check"></i>{% translate "Confirm Change" %}</button></div></div></div></div>
<div class="modal fade" id="dnsNameserverModal" tabindex="-1" aria-labelledby="dnsNameserverTitle" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered">
    <form method="post" id="dnsNameserverForm" class="modal-content eenos-form" data-parsley-validate>
      {% csrf_token %}
      <input type="hidden" name="set_ns" value="yes">
      <input type="hidden" name="domain" id="dnsNameserverDomain">
      <input type="hidden" name="nss" id="dnsNameservers">
      <div class="modal-header">
        <div><h2 class="modal-title fs-5 d-flex align-items-center gap-2" id="dnsNameserverTitle"><i data-lucide="network"></i>{% translate "Change Nameservers" %}</h2><div class="small text-muted mt-1">{% translate "Set the authoritative nameservers for this DNS zone." %}</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 "DNS zone" %}</div><div class="eenos-modal-info-value" id="dnsNameserverDomainLabel"></div></div></div>
        <label class="form-label">{% translate "Nameservers" %}</label>
        <div class="row g-3">
          <div class="col-12 col-sm-6"><label for="dnsNs1" class="form-label small text-muted">{% translate "Nameserver 1" %}</label><input type="text" id="dnsNs1" class="form-control dns-ns-input" placeholder="ns1.example.com" required data-parsley-required-message="{% translate 'Please enter the primary nameserver.' %}"></div>
          <div class="col-12 col-sm-6"><label for="dnsNs2" class="form-label small text-muted">{% translate "Nameserver 2" %}</label><input type="text" id="dnsNs2" class="form-control dns-ns-input" placeholder="ns2.example.com"></div>
          <div class="col-12 col-sm-6"><label for="dnsNs3" class="form-label small text-muted">{% translate "Nameserver 3" %}</label><input type="text" id="dnsNs3" class="form-control dns-ns-input" placeholder="ns3.example.com"></div>
          <div class="col-12 col-sm-6"><label for="dnsNs4" class="form-label small text-muted">{% translate "Nameserver 4" %}</label><input type="text" id="dnsNs4" class="form-control dns-ns-input" placeholder="ns4.example.com"></div>
        </div>
        <div id="dnsNameserverError" class="invalid-feedback mt-2">{% translate "Please enter at least one valid nameserver." %}</div>
      </div>
      <div class="modal-footer"><button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">{% translate "Cancel" %}</button><button type="submit" class="btn btn-primary"><i data-lucide="save"></i>{% translate "Update Nameservers" %}</button></div>
    </form>
  </div>
</div>
<div class="modal fade" id="dnsDkimModal" tabindex="-1" aria-labelledby="dnsDkimTitle" aria-hidden="true">
  <div class="modal-dialog modal-dialog-centered modal-lg">
    <div class="modal-content">
      <div class="modal-header">
        <div>
          <h2 class="modal-title fs-5" id="dnsDkimTitle">{% translate "DKIM Record" %}</h2>
          <div class="small text-muted font-monospace" id="dnsDkimDomain"></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-notice eenos-notice-info mb-3">
          <div class="eenos-notice-icon"><i data-lucide="key-round"></i></div>
          <div class="eenos-notice-content">
            <div class="eenos-notice-title">{% translate "Public DKIM record" %}</div>
            <div class="eenos-notice-text">{% translate "Publish this record when an external DNS provider manages the domain." %}</div>
          </div>
        </div>
        <div id="dnsDkimLoading" class="text-center text-muted py-5"><span class="spinner-border spinner-border-sm me-2"></span>{% translate "Loading DKIM record..." %}</div>
        <pre class="eenos-code-view eenos-code-view-wrap mb-0 d-none" id="dnsDkimRecord"></pre>
      </div>
      <div class="modal-footer"><button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">{% translate "Close" %}</button></div>
    </div>
  </div>
</div>
<div class="modal fade" id="deleteDnsModal" tabindex="-1" aria-labelledby="deleteDnsTitle" aria-hidden="true"><div class="modal-dialog modal-dialog-centered"><form method="post" class="modal-content">{% csrf_token %}<input type="hidden" name="del_dns" value="yes"><input type="hidden" name="domain" id="deleteDnsDomain"><div class="modal-header"><div><h2 class="modal-title fs-5 d-flex align-items-center gap-2" id="deleteDnsTitle"><i data-lucide="trash-2"></i>{% translate "Delete DNS Zone" %}</h2><div class="small text-muted mt-1">{% translate "Permanently remove this DNS zone from the server." %}</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 "DNS zone" %}</div><div class="eenos-modal-info-value" id="deleteDnsDomainLabel"></div></div></div><div class="eenos-notice eenos-notice-danger mb-0"><i data-lucide="triangle-alert"></i><div><strong>{% translate "This action cannot be undone." %}</strong><div>{% translate "All records stored in this DNS zone will be removed." %}</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="submit" class="btn btn-danger"><i data-lucide="trash-2"></i>{% translate "Delete DNS Zone" %}</button></div></form></div></div>
{% endblock %}
{% block extra_js %}
<script>
(function($){"use strict";$(function(){
const esc=v=>$("<div>").text(v==null?"":v).html(),arr=v=>Array.isArray(v)?v.filter(Boolean):(v?[v]:[]);
const policyModal=bootstrap.Modal.getOrCreateInstance(document.getElementById("dnsPolicyModal")),nsModal=bootstrap.Modal.getOrCreateInstance(document.getElementById("dnsNameserverModal")),dkimModal=bootstrap.Modal.getOrCreateInstance(document.getElementById("dnsDkimModal")),deleteModal=bootstrap.Modal.getOrCreateInstance(document.getElementById("deleteDnsModal"));
const table=$("#dnsZonesTable").DataTable({processing:true,autoWidth:false,ajax:{url:"{% url 'dns_zones_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...' %}",zeroRecords:"{% translate 'No matching DNS zones found.' %}",emptyTable:"{% translate 'No DNS zones are configured.' %}"},responsive:{details:{renderer:DataTable.Responsive.renderer.listHiddenNodes()}},columns:[
{data:"domain",responsivePriority:1,className:"text-nowrap",render:(v,t,r)=>t==="display"?'<a href="'+esc(r.site_url)+'" target="_blank" rel="noopener" class="d-inline-flex align-items-center gap-1 text-decoration-none">'+esc(v)+'<i data-lucide="external-link"></i></a>':v},
{data:"dkim_enabled",responsivePriority:3,className:"text-nowrap",render:(v,t,r)=>{if(t!=="display")return v;let h='<div class="d-flex align-items-center gap-2"><div class="form-check form-switch mb-0"><input class="form-check-input eenos-switch-success dns-policy-toggle" type="checkbox" role="switch" data-policy="dkim" data-domain="'+esc(r.domain)+'"'+(v?" checked":"")+' aria-label="{% translate "Toggle DKIM" %}"></div>';if(r.actions&&r.actions.view_dkim)h+='<div class="eenos-dt-actions d-inline-flex gap-1"><button type="button" class="btn btn-sm btn-outline-secondary view-dkim" data-domain="'+esc(r.domain)+'" title="{% translate "View DKIM record" %}"><i data-lucide="key-round"></i></button></div>';return h+'</div>'}},
{data:"spf_enabled",responsivePriority:4,className:"text-nowrap",render:(v,t,r)=>t==="display"?'<div class="form-check form-switch mb-0"><input class="form-check-input eenos-switch-success dns-policy-toggle" type="checkbox" role="switch" data-policy="spf" data-domain="'+esc(r.domain)+'"'+(v?" checked":"")+' aria-label="{% translate "Toggle SPF" %}"></div>':v},
{data:null,responsivePriority:5,render:(d,t,r)=>{const a=arr(r.ipv4),b=arr(r.ipv6);if(t!=="display")return a.concat(b).join(" ");if(!a.length&&!b.length)return'<span class="text-muted">—</span>';return'<div class="d-flex flex-column gap-1 font-monospace small">'+a.map(v=>'<span><span class="eenos-badge eenos-badge-info me-1">IPv4</span>'+esc(v)+'</span>').join("")+b.map(v=>'<span><span class="eenos-badge eenos-badge-neutral me-1">IPv6</span>'+esc(v)+'</span>').join("")+"</div>"}},
{data:"nameservers",responsivePriority:6,render:(v,t,r)=>{const n=arr(v);if(t!=="display")return n.join(" ");const l=n.length?'<div class="small font-monospace">'+n.map(esc).join("<br>")+"</div>":'<span class="text-muted">—</span>';return'<div class="d-flex align-items-start gap-2">'+l+'<div class="eenos-dt-actions d-inline-flex gap-1 flex-shrink-0"><button type="button" class="btn btn-sm btn-outline-secondary edit-nameservers" data-row="'+encodeURIComponent(JSON.stringify(r))+'" title="{% translate "Change nameservers" %}"><i data-lucide="pencil"></i></button></div></div>'}},
{data:"zone_template",responsivePriority:7,className:"text-nowrap",render:(v,t)=>t==="display"?'<span class="eenos-badge eenos-badge-neutral">'+esc(v||"default")+"</span>":v},
{data:null,orderable:false,searchable:false,responsivePriority:2,className:"text-end text-nowrap",render:(d,t,r)=>{if(t!=="display")return"";let h='<div class="eenos-dt-actions justify-content-end"><a href="'+esc(r.edit_url)+'" class="btn btn-sm btn-outline-primary" title="{% translate "Manage DNS records" %}"><i data-lucide="settings-2"></i></a>';if(r.actions&&r.actions.delete)h+='<button type="button" class="btn btn-sm btn-outline-danger delete-dns" data-domain="'+esc(r.domain)+'" title="{% translate "Delete DNS zone" %}"><i data-lucide="trash-2"></i></button>';return h+"</div>"}}],drawCallback:()=>lucide.createIcons()});
table.on("responsive-display",()=>lucide.createIcons());
$(document).on("change",".dns-policy-toggle",function(){const p=this.dataset.policy,d=this.dataset.domain,e=this.checked;this.checked=!e;$("#dnsDkimMarker").prop("disabled",p!=="dkim");$("#dnsSpfMarker").prop("disabled",p!=="spf");$("#dnsPolicyDomain").val(d);$("#dnsPolicyAction").val(e?"on":"off");$("#dnsPolicyTitle span").text((e?"{% translate 'Enable' %} ":"{% translate 'Disable' %} ")+p.toUpperCase());$("#dnsPolicyDomainLabel").text(d);$("#dnsPolicyMessage").text(e?"{% translate 'The policy will be enabled and its DNS record will be published.' %}":"{% translate 'The policy will be disabled and its DNS record will no longer be published.' %}");policyModal.show()});
$("#confirmDnsPolicy").on("click",()=>document.getElementById("dnsPolicyForm").submit());
$(document).on("click",".edit-nameservers",function(){const r=JSON.parse(decodeURIComponent(this.dataset.row)),nameservers=arr(r.nameservers);$("#dnsNameserverDomain").val(r.domain);$("#dnsNameserverDomainLabel").text(r.domain);$(".dns-ns-input").removeClass("is-invalid").val("").each(function(index){$(this).val(nameservers[index]||"")});$("#dnsNameserverError").text("{% translate 'Please enter the primary nameserver.' %}").hide();nsModal.show()});
$("#dnsNameserverForm").on("submit",function(e){const primary=$("#dnsNs1").val().trim(),nameservers=$(".dns-ns-input").map(function(){return $(this).val().trim()}).get().filter(Boolean);if(!primary){e.preventDefault();$("#dnsNs1").addClass("is-invalid");$("#dnsNameserverError").text("{% translate 'Please enter the primary nameserver.' %}").show();return}$("#dnsNameservers").val(nameservers.join(","))});
$(".dns-ns-input").on("input",function(){$(".dns-ns-input").removeClass("is-invalid");$("#dnsNameserverError").hide()});
$(document).on("click",".view-dkim",function(){const d=this.dataset.domain;$("#dnsDkimDomain").text(d);$("#dnsDkimLoading").removeClass("d-none");$("#dnsDkimRecord").addClass("d-none").text("");dkimModal.show();$.get("{% url 'dkimview' %}",{dkim:d}).done(x=>$("#dnsDkimRecord").text(x||"{% translate 'No DKIM record was returned.' %}")).fail(()=>$("#dnsDkimRecord").text("{% translate 'Unable to load the DKIM record.' %}")).always(()=>{$("#dnsDkimLoading").addClass("d-none");$("#dnsDkimRecord").removeClass("d-none")})});
$(document).on("click",".delete-dns",function(){const d=this.dataset.domain;$("#deleteDnsDomain").val(d);$("#deleteDnsDomainLabel").text(d);deleteModal.show()});
})})(jQuery);
</script>
{% endblock %}