{% extends "base.html" %}
{% load i18n %}
{% block title %}{% translate "FTP Accounts" %} - Eenos{% endblock %}
{% block content %}
<div class="eenos-page-header flex-wrap gap-3"><div><h1 class="eenos-page-title">{% translate "FTP Accounts" %}</h1><div class="eenos-page-subtitle">{% translate "Manage FTP logins, home directories, storage quotas, and client access." %}</div></div><div class="col-12 col-sm-auto"><a href="{% url 'ftp_add' %}" class="btn btn-outline-primary d-flex align-items-center justify-content-center gap-2 w-100"><i data-lucide="user-plus"></i><span>{% translate "Create FTP Account" %}</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 "FTP" %}</span><span class="eenos-breadcrumb-separator"><i data-lucide="chevron-right"></i></span><span class="eenos-breadcrumb-current">{% translate "FTP Accounts" %}</span></nav>
{% include "includes/form_alerts.html" %}
<div class="eenos-card"><div class="eenos-card-header"><div><h2 class="eenos-card-title">{% translate "FTP Accounts" %}</h2><p class="eenos-card-subtitle">{% translate "Review usage and manage access for each FTP login." %}</p></div><div class="eenos-card-action-icon"><i data-lucide="users"></i></div></div><div class="table-responsive"><table id="ftpAccountsTable" class="table align-middle w-100"><thead><tr><th>{% translate "FTP Account" %}</th><th>{% translate "Home Directory" %}</th><th>{% translate "Storage Usage" %}</th><th>{% translate "Tools" %}</th><th>{% translate "Access" %}</th></tr></thead></table></div></div>
<div class="modal fade" id="ftpPasswordModal" tabindex="-1" aria-labelledby="ftpPasswordTitle" aria-hidden="true"><div class="modal-dialog modal-dialog-centered"><form method="post" id="ftpPasswordForm" class="modal-content eenos-form" data-parsley-validate>{% csrf_token %}<input type="hidden" name="change_password" value="yes"><input type="hidden" name="ftpuser" id="passwordFtpUser"><div class="modal-header"><div><h2 class="modal-title fs-5 d-flex align-items-center gap-2" id="ftpPasswordTitle"><i data-lucide="key-round"></i>{% translate "Change FTP Password" %}</h2><div class="small text-muted mt-1">{% translate "Set a new password for the selected FTP account." %}</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="user"></i></div><div class="eenos-modal-info-content"><div class="eenos-modal-info-label">{% translate "FTP account" %}</div><div class="eenos-modal-info-value" id="passwordFtpLabel"></div></div></div><label class="form-label" for="newFtpPassword">{% translate "New Password" %}</label><div class="eenos-password-generator"><div class="input-group email-password-input-group"><div class="eenos-password-control"><input type="password" id="newFtpPassword" class="form-control form-control-sm eenos-password-input" name="password" required minlength="8" autocomplete="new-password" placeholder="{% translate 'Enter a new password' %}" data-parsley-required-message="{% translate 'Please enter a new FTP password.' %}" data-parsley-minlength-message="{% translate 'The password must contain at least 8 characters.' %}"></div><button type="button" class="btn btn-sm btn-outline-secondary eenos-password-toggle" title="{% translate 'Show password' %}" aria-label="{% translate 'Show password' %}"><i data-lucide="eye"></i></button><button type="button" class="btn btn-sm btn-outline-primary eenos-password-generate" title="{% translate 'Generate secure password' %}" aria-label="{% translate 'Generate secure password' %}"><i data-lucide="wand-sparkles"></i><span class="d-none d-sm-inline">{% translate "Generate" %}</span></button></div><div class="eenos-password-strength mt-2"><div class="progress" style="height:5px"><div class="progress-bar eenos-password-strength-progress"></div></div><small class="eenos-password-strength-text text-muted"></small></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-primary"><i data-lucide="save"></i>{% translate "Change Password" %}</button></div></form></div></div>
<div class="modal fade" id="ftpQuotaModal" tabindex="-1" aria-labelledby="ftpQuotaTitle" aria-hidden="true"><div class="modal-dialog modal-dialog-centered"><form method="post" id="ftpQuotaForm" class="modal-content eenos-form" data-parsley-validate>{% csrf_token %}<input type="hidden" name="change_quota" value="yes"><input type="hidden" name="ftpuser" id="quotaFtpUser"><div class="modal-header"><div><h2 class="modal-title fs-5 d-flex align-items-center gap-2" id="ftpQuotaTitle"><i data-lucide="hard-drive"></i>{% translate "Change FTP Quota" %}</h2><div class="small text-muted mt-1">{% translate "Update the storage allowance for this FTP account." %}</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="user"></i></div><div class="eenos-modal-info-content"><div class="eenos-modal-info-label">{% translate "FTP account" %}</div><div class="eenos-modal-info-value" id="quotaFtpLabel"></div></div></div><label class="form-label" for="newFtpQuota">{% translate "FTP Quota" %}</label><div class="eenos-quota-row"><div class="input-group eenos-quota-input"><span class="input-group-text"><i data-lucide="hard-drive"></i></span><input type="number" id="newFtpQuota" class="form-control" name="quota" min="1" required data-parsley-required-message="{% translate 'Please enter an FTP quota or select Unlimited.' %}" data-parsley-min-message="{% translate 'FTP quota must be at least 1 MB.' %}"><span class="input-group-text">MB</span></div><div class="form-check mb-0 flex-shrink-0"><input type="checkbox" id="newFtpQuotaUnlimited" class="form-check-input" name="quota" value="0"><label class="form-check-label" for="newFtpQuotaUnlimited">{% translate "Unlimited quota" %}</label></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-primary"><i data-lucide="save"></i>{% translate "Update Quota" %}</button></div></form></div></div>
<div class="modal fade" id="deleteFtpModal" tabindex="-1" aria-labelledby="deleteFtpTitle" aria-hidden="true"><div class="modal-dialog modal-dialog-centered"><form method="post" class="modal-content">{% csrf_token %}<input type="hidden" name="delete_ftp" value="yes"><input type="hidden" name="ftpuser" id="deleteFtpUser"><div class="modal-header"><div><h2 class="modal-title fs-5 d-flex align-items-center gap-2" id="deleteFtpTitle"><i data-lucide="trash-2"></i>{% translate "Delete FTP Account" %}</h2><div class="small text-muted mt-1">{% translate "Remove the FTP login and optionally its home directory." %}</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="user"></i></div><div class="eenos-modal-info-content"><div class="eenos-modal-info-label">{% translate "FTP account" %}</div><div class="eenos-modal-info-value" id="deleteFtpLabel"></div></div></div><div class="eenos-notice eenos-notice-danger mb-4"><i data-lucide="triangle-alert"></i><div><strong>{% translate "Deleting the home directory also removes its files" %}</strong><div>{% translate "Keep the home directory unless you are certain its contents are no longer required." %}</div></div></div><fieldset><legend class="form-label">{% translate "Delete FTP home directory?" %}</legend><div class="d-flex gap-4"><div class="form-check"><input class="form-check-input" type="radio" name="delhome" id="keepFtpHome" value="no" checked><label class="form-check-label" for="keepFtpHome">{% translate "No, keep files" %}</label></div><div class="form-check"><input class="form-check-input" type="radio" name="delhome" id="removeFtpHome" value="yes"><label class="form-check-label" for="removeFtpHome">{% translate "Yes, delete files" %}</label></div></div></fieldset></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 FTP Account" %}</button></div></form></div></div>
<div class="modal fade" id="ftpClientModal" tabindex="-1" aria-labelledby="ftpClientTitle" 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="ftpClientTitle"><i data-lucide="plug"></i>{% translate "Configure FTP Client" %}</h2><div class="small text-muted mt-1">{% translate "Use these settings in FileZilla or another FTP client." %}</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="user"></i></div><div class="eenos-modal-info-content"><div class="eenos-modal-info-label">{% translate "Username" %}</div><div class="eenos-modal-info-value user-select-all" id="clientFtpUser"></div></div></div><dl class="row mb-0"><dt class="col-sm-4">{% translate "Server" %}</dt><dd class="col-sm-8 font-monospace user-select-all" id="clientFtpServer"></dd><dt class="col-sm-4">{% translate "FTP / FTPS port" %}</dt><dd class="col-sm-8 font-monospace">{{ ftpport }}</dd><dt class="col-sm-4">{% translate "Password" %}</dt><dd class="col-sm-8">{% translate "Use the FTP account password" %}</dd></dl><div class="eenos-notice eenos-notice-info mt-4 mb-0"><i data-lucide="shield-check"></i><div>{% translate "Use FTP over TLS (FTPS) whenever your FTP client supports it." %}</div></div></div><div class="modal-footer"><button type="button" class="btn btn-outline-secondary" data-bs-dismiss="modal">{% translate "Close" %}</button></div></div></div></div>
{% endblock %}
{% block extra_js %}<script>(function($){"use strict";$(function(){const esc=v=>$("<div>").text(v==null?"":v).html();const passwordModal=bootstrap.Modal.getOrCreateInstance(document.getElementById("ftpPasswordModal")),quotaModal=bootstrap.Modal.getOrCreateInstance(document.getElementById("ftpQuotaModal")),deleteModal=bootstrap.Modal.getOrCreateInstance(document.getElementById("deleteFtpModal")),clientModal=bootstrap.Modal.getOrCreateInstance(document.getElementById("ftpClientModal"));const table=$("#ftpAccountsTable").DataTable({processing:true,autoWidth:false,ajax:{url:"{% url 'ftp_accounts_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 FTP accounts found.' %}",emptyTable:"{% translate 'No FTP accounts are configured.' %}"},responsive:{details:{renderer:DataTable.Responsive.renderer.listHiddenNodes()}},columns:[{data:"account",responsivePriority:1,className:"text-nowrap",render:(v,t)=>t==="display"?'<span class="fw-semibold">'+esc(v)+"</span>":v},{data:"home",responsivePriority:2,render:(v,t)=>t==="display"?'<span class="d-inline-flex align-items-center gap-1 font-monospace text-break"><i data-lucide="house"></i>'+esc(v)+"</span>":v},{data:"quota_usage_percent",responsivePriority:3,render:(v,t,r)=>{if(t!=="display")return v;const color=v>=95?"danger":v>=80?"warning":v>=50?"info":"success",detail=r.is_unlimited?esc(r.quota_usage)+" / "+esc(r.quota):esc(r.quota_usage)+" / "+esc(r.quota)+" ("+v+"%)";return '<div style="min-width:12rem"><div class="small mb-1">'+detail+'</div><div class="progress" style="height:6px"><div class="progress-bar bg-'+color+'" style="width:'+r.progress_percent+'%" role="progressbar" aria-valuenow="'+v+'" aria-valuemin="0" aria-valuemax="100"></div></div></div>'}},{data:null,orderable:false,searchable:false,responsivePriority:1,className:"text-end text-nowrap",render:(d,t,r)=>t!=="display"?"":'<div class="eenos-dt-actions justify-content-end"><button type="button" class="btn btn-sm btn-outline-primary ftp-password" data-row="'+encodeURIComponent(JSON.stringify(r))+'" title="{% translate 'Change password' %}" aria-label="{% translate 'Change password' %}"><i data-lucide="key-round"></i></button><button type="button" class="btn btn-sm btn-outline-secondary ftp-quota" data-row="'+encodeURIComponent(JSON.stringify(r))+'" title="{% translate 'Change quota' %}" aria-label="{% translate 'Change quota' %}"><i data-lucide="hard-drive"></i></button><button type="button" class="btn btn-sm btn-outline-danger ftp-delete" data-row="'+encodeURIComponent(JSON.stringify(r))+'" title="{% translate 'Delete FTP account' %}" aria-label="{% translate 'Delete FTP account' %}"><i data-lucide="trash-2"></i></button></div>'},{data:null,orderable:false,searchable:false,responsivePriority:4,className:"text-nowrap",render:(d,t,r)=>t!=="display"?"":'<div class="eenos-dt-actions"><button type="button" class="btn btn-sm btn-outline-primary ftp-client" data-row="'+encodeURIComponent(JSON.stringify(r))+'"><i data-lucide="plug"></i><span>{% translate "Configure Client" %}</span></button></div>'}],drawCallback:()=>lucide.createIcons()});table.on("responsive-display",()=>lucide.createIcons());function row(button){return JSON.parse(decodeURIComponent(button.dataset.row))}$(document).on("click",".ftp-password",function(){const r=row(this);$("#passwordFtpUser").val(r.account);$("#passwordFtpLabel").text(r.account);$("#newFtpPassword").val("").trigger("input");$("#ftpPasswordForm").parsley().reset();passwordModal.show()});$(document).on("click",".ftp-quota",function(){const r=row(this),mb=Math.max(1,Math.round(r.quota_bytes/1048576));$("#quotaFtpUser").val(r.account);$("#quotaFtpLabel").text(r.account);$("#newFtpQuota").val(r.is_unlimited?1024:mb);$("#newFtpQuotaUnlimited").prop("checked",r.is_unlimited);syncFtpQuota();$("#ftpQuotaForm").parsley().reset();quotaModal.show()});$(document).on("click",".ftp-delete",function(){const r=row(this);$("#deleteFtpUser").val(r.account);$("#deleteFtpLabel").text(r.account);$("#keepFtpHome").prop("checked",true);deleteModal.show()});$(document).on("click",".ftp-client",function(){const r=row(this);$("#clientFtpUser").text(r.account);$("#clientFtpServer").text(r.domain);clientModal.show()});function syncFtpQuota(){const unlimited=$("#newFtpQuotaUnlimited").is(":checked");$("#newFtpQuota").prop("disabled",unlimited).prop("required",!unlimited).attr("aria-disabled",unlimited?"true":"false")}$("#newFtpQuotaUnlimited").on("change",syncFtpQuota);syncFtpQuota();$("#ftpPasswordForm,#ftpQuotaForm").on("submit",function(e){const validator=$(this).parsley();validator.validate();if(!validator.isValid())e.preventDefault()})})})(jQuery);</script>{% endblock %}