From fb7e00c158060f6367be45bc916947d7d713e2a8 Mon Sep 17 00:00:00 2001
From: FreddleSpl0it <patschul@posteo.de>
Date: Mon, 16 May 2022 11:26:49 +0200
Subject: [PATCH] [BS5] Replace FooTable with jquery Datatables
---
data/web/js/build/014-mailcow.js | 5 +
data/web/js/site/admin.js | 114 ++-
data/web/js/site/mailbox.js | 673 +++++++++---------
data/web/mailbox.php | 1 +
.../templates/admin/tab-config-admins.twig | 5 +-
data/web/templates/mailbox.twig | 1 +
data/web/templates/mailbox/tab-bcc.twig | 4 +-
data/web/templates/mailbox/tab-domains.twig | 4 +-
data/web/templates/mailbox/tab-mailboxes.twig | 4 +-
data/web/templates/mailbox/tab-resources.twig | 4 +-
10 files changed, 447 insertions(+), 368 deletions(-)
diff --git a/data/web/js/build/014-mailcow.js b/data/web/js/build/014-mailcow.js
index 3ca0b6af..cdde60e7 100644
--- a/data/web/js/build/014-mailcow.js
+++ b/data/web/js/build/014-mailcow.js
@@ -252,4 +252,9 @@ $(document).ready(function() {
})
});
})
+
+ // Jquery Datatables, enable responsive plugin
+ $.extend($.fn.dataTable.defaults, {
+ responsive: true
+ });
});
diff --git a/data/web/js/site/admin.js b/data/web/js/site/admin.js
index d7f85021..f98a004a 100644
--- a/data/web/js/site/admin.js
+++ b/data/web/js/site/admin.js
@@ -71,33 +71,90 @@ jQuery(function($){
})
}
function draw_domain_admins() {
- ft_domainadmins = FooTable.init('#domainadminstable', {
- "columns": [
- {"name":"chkbox","title":"","style":{"maxWidth":"60px","width":"60px"},"filterable": false,"sortable": false,"type":"html"},
- {"sorted": true,"name":"username","title":lang.username,"style":{"width":"250px"}},
- {"name":"selected_domains","title":lang.admin_domains,"breakpoints":"xs sm"},
- {"name":"tfa_active","title":"TFA", "filterable": false,"style":{"maxWidth":"80px","width":"80px"},"formatter": function(value){return 1==value?'<i class="bi bi-check-lg"></i>':0==value&&'<i class="bi bi-x-lg"></i>';}},
- {"name":"active","filterable": false,"style":{"maxWidth":"80px","width":"80px"},"title":lang.active,"formatter": function(value){return 1==value?'<i class="bi bi-check-lg"></i>':0==value&&'<i class="bi bi-x-lg"></i>';}},
- {"name":"action","filterable": false,"sortable": false,"style":{"text-align":"right","maxWidth":"250px","width":"250px"},"type":"html","title":lang.action,"breakpoints":"xs sm"}
- ],
- "rows": $.ajax({
- dataType: 'json',
- url: '/api/v1/get/domain-admin/all',
- jsonp: false,
- error: function () {
- console.log('Cannot draw domain admin table');
- },
- success: function (data) {
- return process_table_data(data, 'domainadminstable');
+ $('#domainadminstable').DataTable({
+ processing: true,
+ serverSide: false,
+ language: lang_datatables,
+ ajax: {
+ type: "GET",
+ url: "/api/v1/get/domain-admin/all",
+ dataSrc: function(json){
+ console.log(json);
+ return json;
}
- }),
- "empty": lang.empty,
- "paging": {"enabled": true,"limit": 5,"size": log_pagination_size},
- "state": {"enabled": true},
- "filtering": {"enabled": true,"delay": 1200,"position": "left","connectors": false,"placeholder": lang.filter_table},
- "sorting": {"enabled": true},
- "toggleSelector": "table tbody span.footable-toggle"
+ },
+ columns: [
+ {
+ title: lang.username,
+ data: 'username',
+ },
+ {
+ title: "TFA",
+ data: 'tfa_active',
+ render: function (data, type) {
+ if(data == 1) return '<i class="bi bi-check-lg"></i>';
+ else return '<i class="bi bi-x-lg"></i>'
+ }
+ },
+ {
+ title: lang.admin_domains,
+ data: 'tfa_active',
+ render: function (data, type) {
+ return data;
+ }
+ },
+ {
+ title: lang.active,
+ data: 'active',
+ render: function (data, type) {
+ if(data == 1) return '<i class="bi bi-check-lg"></i>';
+ else return '<i class="bi bi-x-lg"></i>'
+ }
+ },
+ {
+ title: lang.action,
+ data: null,
+ render: function (data, type) {
+ return `<div class="btn-group">
+ <a href="/edit/admin/admin" class="btn btn-xs btn-xs-half btn-secondary">
+ <i class="bi bi-pencil-fill"></i> Bearbeiten
+ </a>
+ <a href="#" data-action="delete_selected" data-id="single-admin" data-api-url="delete/admin" data-item="admin" class="btn btn-xs btn-xs-half btn-danger">
+ <i class="bi bi-trash"></i> Entfernen
+ </a>
+ </div>`;
+ }
+ },
+ ]
});
+
+ // ft_domainadmins = FooTable.init('#domainadminstable', {
+ // "columns": [
+ // {"name":"chkbox","title":"","style":{"maxWidth":"60px","width":"60px"},"filterable": false,"sortable": false,"type":"html"},
+ // {"sorted": true,"name":"username","title":lang.username,"style":{"width":"250px"}},
+ // {"name":"selected_domains","title":lang.admin_domains,"breakpoints":"xs sm"},
+ // {"name":"tfa_active","title":"TFA", "filterable": false,"style":{"maxWidth":"80px","width":"80px"},"formatter": function(value){return 1==value?'<i class="bi bi-check-lg"></i>':0==value&&'<i class="bi bi-x-lg"></i>';}},
+ // {"name":"active","filterable": false,"style":{"maxWidth":"80px","width":"80px"},"title":lang.active,"formatter": function(value){return 1==value?'<i class="bi bi-check-lg"></i>':0==value&&'<i class="bi bi-x-lg"></i>';}},
+ // {"name":"action","filterable": false,"sortable": false,"style":{"text-align":"right","maxWidth":"250px","width":"250px"},"type":"html","title":lang.action,"breakpoints":"xs sm"}
+ // ],
+ // "rows": $.ajax({
+ // dataType: 'json',
+ // url: '/api/v1/get/domain-admin/all',
+ // jsonp: false,
+ // error: function () {
+ // console.log('Cannot draw domain admin table');
+ // },
+ // success: function (data) {
+ // return process_table_data(data, 'domainadminstable');
+ // }
+ // }),
+ // "empty": lang.empty,
+ // "paging": {"enabled": true,"limit": 5,"size": log_pagination_size},
+ // "state": {"enabled": true},
+ // "filtering": {"enabled": true,"delay": 1200,"position": "left","connectors": false,"placeholder": lang.filter_table},
+ // "sorting": {"enabled": true},
+ // "toggleSelector": "table tbody span.footable-toggle"
+ // });
}
function draw_oauth2_clients() {
ft_oauth2clientstable = FooTable.init('#oauth2clientstable', {
@@ -127,10 +184,6 @@ jQuery(function($){
});
}
function draw_admins() {
- $.extend( $.fn.dataTable.defaults, {
- responsive: true
- });
-
$('#adminstable').DataTable({
processing: true,
serverSide: false,
@@ -179,6 +232,7 @@ jQuery(function($){
},
]
});
+
// ft_admins = FooTable.init('#adminstable', {
// "columns": [
// {"name":"chkbox","title":"","style":{"maxWidth":"60px","width":"60px"},"filterable": false,"sortable": false,"type":"html"},
@@ -414,7 +468,7 @@ jQuery(function($){
return data
};
// // Initial table drawings
- // draw_domain_admins();
+ draw_domain_admins();
draw_admins();
// draw_fwd_hosts();
// draw_relayhosts();
diff --git a/data/web/js/site/mailbox.js b/data/web/js/site/mailbox.js
index e12a5a21..7b0841aa 100644
--- a/data/web/js/site/mailbox.js
+++ b/data/web/js/site/mailbox.js
@@ -1,58 +1,58 @@
$(document).ready(function() {
acl_data = JSON.parse(acl);
- FooTable.domainFilter = FooTable.Filtering.extend({
- construct: function(instance){
- this._super(instance);
- this.def = lang.all_domains;
- this.$domain = null;
- },
- $create: function(){
- this._super();
- var self = this;
- var domains = [];
+ // FooTable.domainFilter = FooTable.Filtering.extend({
+ // construct: function(instance){
+ // this._super(instance);
+ // this.def = lang.all_domains;
+ // this.$domain = null;
+ // },
+ // $create: function(){
+ // this._super();
+ // var self = this;
+ // var domains = [];
- $.each(self.ft.rows.all, function(i, row){
- if((row.val().domain != null) && ($.inArray(row.val().domain, domains) === -1)) domains.push(row.val().domain);
- });
+ // $.each(self.ft.rows.all, function(i, row){
+ // if((row.val().domain != null) && ($.inArray(row.val().domain, domains) === -1)) domains.push(row.val().domain);
+ // });
- $form_grp = $('<div/>', {'class': 'form-group'})
- .append($('<label/>', {'class': 'sr-only', text: 'Domain'}))
- .prependTo(self.$form);
- self.$domain = $('<select/>', { 'class': 'aform-control' })
- .on('change', {self: self}, self._onDomainDropdownChanged)
- .append($('<option/>', {text: self.def}))
- .appendTo($form_grp);
+ // $form_grp = $('<div/>', {'class': 'form-group'})
+ // .append($('<label/>', {'class': 'sr-only', text: 'Domain'}))
+ // .prependTo(self.$form);
+ // self.$domain = $('<select/>', { 'class': 'aform-control' })
+ // .on('change', {self: self}, self._onDomainDropdownChanged)
+ // .append($('<option/>', {text: self.def}))
+ // .appendTo($form_grp);
- $.each(domains, function(i, domain){
- domainname = $($.parseHTML(domain)).data('domainname')
- if (domainname !== undefined) {
- self.$domain.append($('<option/>').text(domainname));
- } else {
- self.$domain.append($('<option/>').text(domain));
- }
- });
- },
- _onDomainDropdownChanged: function(e){
- var self = e.data.self,
- selected = $(this).val();
- if (selected !== self.def){
- self.addFilter('domain', selected, ['domain']);
- } else {
- self.removeFilter('domain');
- }
- self.filter();
- },
- draw: function(){
- this._super();
- var domain = this.find('domain');
- if (domain instanceof FooTable.Filter){
- this.$domain.val(domain.query.val());
- } else {
- this.$domain.val(this.def);
- }
- $(this.$domain).closest("select").selectpicker();
- }
- });
+ // $.each(domains, function(i, domain){
+ // domainname = $($.parseHTML(domain)).data('domainname')
+ // if (domainname !== undefined) {
+ // self.$domain.append($('<option/>').text(domainname));
+ // } else {
+ // self.$domain.append($('<option/>').text(domain));
+ // }
+ // });
+ // },
+ // _onDomainDropdownChanged: function(e){
+ // var self = e.data.self,
+ // selected = $(this).val();
+ // if (selected !== self.def){
+ // self.addFilter('domain', selected, ['domain']);
+ // } else {
+ // self.removeFilter('domain');
+ // }
+ // self.filter();
+ // },
+ // draw: function(){
+ // this._super();
+ // var domain = this.find('domain');
+ // if (domain instanceof FooTable.Filter){
+ // this.$domain.val(domain.query.val());
+ // } else {
+ // this.$domain.val(this.def);
+ // }
+ // $(this.$domain).closest("select").selectpicker();
+ // }
+ // });
// Set paging
$('[data-page-size]').on('click', function(e){
e.preventDefault();
@@ -236,9 +236,6 @@ $(document).ready(function() {
});
jQuery(function($){
- // http://stackoverflow.com/questions/24816/escaping-html-strings-with-jquery
- var entityMap={"&":"&","<":"<",">":">",'"':""","'":"'","/":"/","`":"`","=":"="};
- function escapeHtml(n){return String(n).replace(/[&<>"'`=\/]/g,function(n){return entityMap[n]})}
// http://stackoverflow.com/questions/46155/validate-email-address-in-javascript
function humanFileSize(i){if(Math.abs(i)<1024)return i+" B";var B=["KiB","MiB","GiB","TiB","PiB","EiB","ZiB","YiB"],e=-1;do{i/=1024,++e}while(Math.abs(i)>=1024&&e<B.length-1);return i.toFixed(1)+" "+B[e]}
function unix_time_format(i){return""==i?'<i class="bi bi-x-lg"></i>':new Date(i?1e3*i:0).toLocaleDateString(void 0,{year:"numeric",month:"2-digit",day:"2-digit",hour:"2-digit",minute:"2-digit",second:"2-digit"})}
@@ -270,52 +267,27 @@ jQuery(function($){
})
}
function draw_domain_table() {
- ft_domain_table = FooTable.init('#domain_table', {
- "columns": [
- {"name":"chkbox","title":"","style":{"min-width":"60px","width":"60px"},"filterable": false,"sortable": false,"type":"html"},
- {"sorted": true,"name":"domain_name","title":lang.domain,"style":{"width":"250px"}},
- {"name":"aliases","title":lang.aliases,"breakpoints":"xs sm"},
- {"name":"mailboxes","title":lang.mailboxes},
- {"name":"quota","style":{"whiteSpace":"nowrap"},"title":lang.domain_quota,"formatter": function(value){
- res = value.split("/");
- return humanFileSize(res[0]) + " / " + humanFileSize(res[1]);
- },
- "sortValue": function(value){
- res = value.split("/");
- return Number(res[0]);
- }},
- {"name":"stats","sortable": false,"style":{"whiteSpace":"nowrap"},"title":lang.stats,"formatter": function(value){
- res = value.split("/");
- return '<i class="bi bi-files"></i> ' + res[0] + ' / ' + humanFileSize(res[1]);
- }},
- {"name":"def_quota_for_mbox","title":lang.mailbox_defquota,"breakpoints":"xs sm md","style":{"width":"125px"}},
- {"name":"max_quota_for_mbox","title":lang.mailbox_quota,"breakpoints":"xs sm","style":{"width":"125px"}},
- {"name":"rl","title":"RL","breakpoints":"xs sm md lg","style":{"min-width":"100px","width":"100px"}},
- {"name":"backupmx","filterable": false,"style":{"min-width":"120px","width":"120px"},"title":lang.backup_mx,"breakpoints":"xs sm md lg","formatter": function(value){return 1==value?'<i class="bi bi-check-lg"></i>':0==value&&'<i class="bi bi-x-lg"></i>';}},
- {"name":"domain_admins","title":lang.domain_admins,"style":{"word-break":"break-all","min-width":"200px"},"breakpoints":"xs sm md lg","filterable":(role == "admin"),"visible":(role == "admin")},
- {"name":"active","filterable": false,"style":{"min-width":"80px","width":"80px"},"title":lang.active,"formatter": function(value){return 1==value?'<i class="bi bi-check-lg"></i>':0==value&&'<i class="bi bi-x-lg"></i>';}},
- {"name":"action","filterable": false,"sortable": false,"style":{"text-align":"right","min-width":"240px","width":"240px"},"type":"html","title":lang.action,"breakpoints":"xs sm md"}
- ],
- "rows": $.ajax({
- dataType: 'json',
- url: '/api/v1/get/domain/all',
- jsonp: false,
- error: function (data) {
- console.log('Cannot draw domain table');
- },
- success: function (data) {
- $.each(data, function (i, item) {
+ $('#domain_table').DataTable({
+ processing: true,
+ serverSide: false,
+ language: lang_datatables,
+ ajax: {
+ type: "GET",
+ url: "/api/v1/get/domain/all",
+ dataSrc: function(json){
+ $.each(json, function(i, item) {
item.aliases = item.aliases_in_domain + " / " + item.max_num_aliases_for_domain;
item.mailboxes = item.mboxes_in_domain + " / " + item.max_num_mboxes_for_domain;
item.quota = item.quota_used_in_domain + "/" + item.max_quota_for_domain + "/" + item.bytes_total;
item.stats = item.msgs_total + "/" + item.bytes_total;
- if (!item.rl) {
- item.rl = '∞';
- } else {
+
+ if (!item.rl) item.rl = '∞';
+ else {
item.rl = $.map(item.rl, function(e){
return e;
}).join('/1');
}
+
item.def_quota_for_mbox = humanFileSize(item.def_quota_for_mbox);
item.max_quota_for_mbox = humanFileSize(item.max_quota_for_mbox);
item.chkbox = '<input type="checkbox" data-id="domain" name="multi_select" value="' + encodeURIComponent(item.domain_name) + '" />';
@@ -323,7 +295,7 @@ jQuery(function($){
if (role == "admin") {
item.action += '<a href="/edit/domain/' + encodeURIComponent(item.domain_name) + '" class="btn btn-xs btn-xs-third btn-secondary"><i class="bi bi-pencil-fill"></i> ' + lang.edit + '</a>' +
'<a href="#" data-action="delete_selected" data-id="single-domain" data-api-url="delete/domain" data-item="' + encodeURIComponent(item.domain_name) + '" class="btn btn-xs btn-xs-third btn-danger"><i class="bi bi-trash"></i> ' + lang.remove + '</a>' +
- '<a href="#dnsInfoModal" class="btn btn-xs btn-xs-third btn-info" data-bs-toggle="modal" data-domain="' + encodeURIComponent(item.domain_name) + '"><i class="bi bi-globe2"></i> DNS</a></div>';
+ '<a href="#dnsInfoModal" class="btn btn-xs btn-xs-third btn-info" data-bs-toggle="modal" data-domain="' + encodeURIComponent(item.domain_name) + '"><i class="bi bi-globe2"></i> DNS</a></div>';
}
else {
item.action += '<a href="/edit/domain/' + encodeURIComponent(item.domain_name) + '" class="btn btn-xs btn-xs-half btn-secondary"><i class="bi bi-pencil-fill"></i> ' + lang.edit + '</a>' +
@@ -340,97 +312,90 @@ jQuery(function($){
}
}
});
- }
- }),
- "empty": lang.empty,
- "paging": {
- "enabled": true,
- "limit": 5,
- "size": pagination_size
- },
- "state": {
- "enabled": true
- },
- "filtering": {
- "enabled": true,
- "delay": 1200,
- "position": "left",
- "connectors": false,
- "placeholder": lang.filter_table
- },
- "sorting": {
- "enabled": true
- },
- "on": {
- "destroy.ft.table": function(e, ft){
- $('.refresh_table').attr('disabled', 'true');
- },
- "ready.ft.table": function(e, ft){
- table_mailbox_ready(ft, 'domain_table');
- },
- "after.ft.filtering": function(e, ft){
- table_mailbox_ready(ft, 'domain_table');
+
+ console.log(json);
+ return json;
}
},
- "toggleSelector": "table tbody span.footable-toggle"
+ columns: [
+ {
+ title: lang.domain,
+ data: 'domain_name'
+ },
+ {
+ title: lang.aliases,
+ data: 'aliases_in_domain'
+ },
+ {
+ title: lang.mailboxes,
+ data: 'mboxes_in_domain'
+ },
+ {
+ title: lang.domain_quota,
+ data: 'quota',
+ render: function (data, type) {
+ data = data.split("/");
+ return humanFileSize(data[0]) + " / " + humanFileSize(data[1]);
+ }
+ },
+ {
+ title: lang.stats,
+ data: 'stats',
+ render: function (data, type) {
+ data = data.split("/");
+ return '<i class="bi bi-files"></i> ' + data[0] + ' / ' + humanFileSize(data[1]);
+ }
+ },
+ {
+ title: lang.mailbox_defquota,
+ data: 'def_quota_for_mbox'
+ },
+ {
+ title: lang.mailbox_quota,
+ data: 'max_quota_for_mbox'
+ },
+ {
+ title: 'RL',
+ data: 'rl'
+ },
+ {
+ title: lang.backup_mx,
+ data: 'backupmx',
+ redner: function (data, type){
+ return 1==value ? '<i class="bi bi-check-lg"></i>' : 0==value && '<i class="bi bi-x-lg"></i>';
+ }
+ },
+ {
+ title: lang.domain_admins,
+ data: 'domain_admins'
+ },
+ {
+ title: lang.action,
+ data: null,
+ render: function (data, type) {
+ return `<div class="btn-group">
+ <a href="/edit/admin/admin" class="btn btn-xs btn-xs-half btn-secondary">
+ <i class="bi bi-pencil-fill"></i> Bearbeiten
+ </a>
+ <a href="#" data-action="delete_selected" data-id="single-admin" data-api-url="delete/admin" data-item="admin" class="btn btn-xs btn-xs-half btn-danger">
+ <i class="bi bi-trash"></i> Entfernen
+ </a>
+ </div>`;
+ }
+ },
+ ]
});
}
function draw_mailbox_table() {
- ft_mailbox_table = FooTable.init('#mailbox_table', {
- "columns": [
- {"name":"chkbox","title":"","style":{"min-width":"60px","width":"60px"},"filterable": false,"sortable": false,"type":"html"},
- {"sorted": true,"name":"username","style":{"word-break":"break-all","min-width":"120px"},"title":lang.username},
- {"name":"name","title":lang.fname,"style":{"word-break":"break-all","min-width":"120px"},"breakpoints":"xs sm md lg"},
- {"name":"domain","title":lang.domain,"breakpoints":"xs sm md lg"},
- {"name":"quota","style":{"whiteSpace":"nowrap"},"title":lang.domain_quota,"formatter": function(value){
- res = value.split("/");
- var of_q = (res[1] == 0 ? "∞" : humanFileSize(res[1]));
- return humanFileSize(res[0]) + " / " + of_q;
- },
- "sortValue": function(value){
- res = value.split("/");
- return Number(res[0]);
- },
- },
- /* {"name":"spam_aliases","filterable": false,"title":lang.spam_aliases,"breakpoints":"all"}, */
- {"name":"tls_enforce_in","filterable": false,"title":lang.tls_enforce_in,"breakpoints":"all"},
- {"name":"tls_enforce_out","filterable": false,"title":lang.tls_enforce_out,"breakpoints":"all"},
- {"name":"smtp_access","filterable": false,"title":"SMTP","breakpoints":"all"},
- {"name":"imap_access","filterable": false,"title":"IMAP","breakpoints":"all"},
- {"name":"pop3_access","filterable": false,"title":"POP3","breakpoints":"all"},
- {"name":"last_mail_login","breakpoints":"xs sm","title":lang.last_mail_login,"style":{"width":"170px"},
- "sortValue": function(value){
- res = value.split("/");
- return Math.max(res[0], res[1]);
- },
- "formatter": function(value){
- res = value.split("/");
- return '<div class="badge fs-5 bg-last-login">IMAP @ ' + unix_time_format(Number(res[0])) + '</div><br>' +
- '<div class="badge fs-5 bg-last-login">POP3 @ ' + unix_time_format(Number(res[1])) + '</div><br>' +
- '<div class="badge fs-5 bg-last-login">SMTP @ ' + unix_time_format(Number(res[2])) + '</div>';
- }},
- {"name":"last_pw_change","filterable": false,"title":lang.last_pw_change,"breakpoints":"all"},
- {"name":"quarantine_notification","filterable": false,"title":lang.quarantine_notification,"breakpoints":"all"},
- {"name":"quarantine_category","filterable": false,"title":lang.quarantine_category,"breakpoints":"all"},
- {"name":"in_use","filterable": false,"type":"html","title":lang.in_use,"sortValue": function(value){
- return Number($(value).find(".progress-bar-mailbox").attr('aria-valuenow'));
- },
- },
- {"name":"messages","filterable": false,"title":lang.msg_num,"breakpoints":"xs sm md"},
- /* {"name":"rl","title":"RL","breakpoints":"all","style":{"width":"125px"}}, */
- {"name":"active","filterable": false,"style":{"min-width":"80px","width":"80px"},"title":lang.active,"formatter": function(value){return 1==value?'<i class="bi bi-check-lg"></i>':(0==value?'<i class="bi bi-x-lg"></i>':2==value&&'—');}},
- {"name":"action","filterable": false,"sortable": false,"style":{"min-width":"290px","text-align":"right"},"type":"html","title":lang.action,"breakpoints":"xs sm md"}
- ],
- "empty": lang.empty,
- "rows": $.ajax({
- dataType: 'json',
- url: '/api/v1/get/mailbox/reduced',
- jsonp: false,
- error: function () {
- console.log('Cannot draw mailbox table');
- },
- success: function (data) {
- $.each(data, function (i, item) {
+ $('#mailbox_table').DataTable({
+ processing: true,
+ serverSide: false,
+ language: lang_datatables,
+ ajax: {
+ type: "GET",
+ url: "/api/v1/get/mailbox/reduced",
+ dataSrc: function(json){
+ $.each(json, function (i, item) {
item.quota = item.quota_used + "/" + item.quota;
item.max_quota_for_mbox = humanFileSize(item.max_quota_for_mbox);
item.last_mail_login = item.last_imap_login + '/' + item.last_pop3_login + '/' + item.last_smtp_login;
@@ -498,66 +463,111 @@ jQuery(function($){
'style="min-width:2em;width:' + item.percent_in_use + '%">' + item.percent_in_use + '%' + '</div></div>';
item.username = escapeHtml(item.username);
});
- }
- }),
- "paging": {
- "enabled": true,
- "limit": 5,
- "size": pagination_size
- },
- "state": {
- "enabled": true
- },
- "filtering": {
- "enabled": true,
- "delay": 1200,
- "position": "left",
- "connectors": false,
- //"container": "#tab-mailboxes.panel",
- "placeholder": lang.filter_table
- },
- "components": {
- "filtering": FooTable.domainFilter
- },
- "sorting": {
- "enabled": true
- },
- "on": {
- "destroy.ft.table": function(e, ft){
- $('.refresh_table').attr('disabled', 'true');
- },
- "ready.ft.table": function(e, ft){
- table_mailbox_ready(ft, 'mailbox_table');
- },
- "after.ft.filtering": function(e, ft){
- table_mailbox_ready(ft, 'mailbox_table');
+
+ console.log(json);
+ return json;
}
},
- "toggleSelector": "table tbody span.footable-toggle"
+ columns: [
+ {
+ title: lang.username,
+ data: 'username'
+ },
+ {
+ title: lang.fname,
+ data: 'name'
+ },
+ {
+ title: lang.domain,
+ data: 'domain'
+ },
+ {
+ title: lang.domain_quota,
+ data: 'quota',
+ render: function (data, type) {
+ data = data.split("/");
+ var of_q = (data[1] == 0 ? "∞" : humanFileSize(data[1]));
+ return humanFileSize(data[0]) + " / " + of_q;
+ }
+ },
+ {
+ title: lang.tls_enforce_in,
+ data: 'tls_enforce_in'
+ },
+ {
+ title: lang.tls_enforce_out,
+ data: 'tls_enforce_out'
+ },
+ {
+ title: 'SMTP',
+ data: 'smtp_access'
+ },
+ {
+ title: 'IMAP',
+ data: 'imap_access'
+ },
+ {
+ title: 'POP3',
+ data: 'pop3_access'
+ },
+ {
+ title: lang.last_mail_login,
+ data: 'last_mail_login'
+ },
+ {
+ title: lang.last_pw_change,
+ data: 'last_pw_change'
+ },
+ {
+ title: lang.quarantine_notification,
+ data: 'quarantine_notification'
+ },
+ {
+ title: lang.quarantine_category,
+ data: 'quarantine_category'
+ },
+ {
+ title: lang.in_use,
+ data: 'in_use'
+ },
+ {
+ title: lang.msg_num,
+ data: 'messages'
+ },
+ {
+ title: lang.active,
+ data: 'active',
+ render: function (data, type) {
+ return 1==value?'<i class="bi bi-check-lg"></i>':(0==value?'<i class="bi bi-x-lg"></i>':2==value&&'—');
+ }
+ },
+ {
+ title: lang.action,
+ data: null,
+ render: function (data, type) {
+ return `<div class="btn-group">
+ <a href="/edit/admin/admin" class="btn btn-xs btn-xs-half btn-secondary">
+ <i class="bi bi-pencil-fill"></i> Bearbeiten
+ </a>
+ <a href="#" data-action="delete_selected" data-id="single-admin" data-api-url="delete/admin" data-item="admin" class="btn btn-xs btn-xs-half btn-danger">
+ <i class="bi bi-trash"></i> Entfernen
+ </a>
+ </div>`;
+ }
+ },
+ ]
});
}
function draw_resource_table() {
- ft_resource_table = FooTable.init('#resource_table', {
- "columns": [
- {"name":"chkbox","title":"","style":{"min-width":"60px","width":"60px"},"filterable": false,"sortable": false,"type":"html"},
- {"sorted": true,"name":"description","title":lang.description,"style":{"width":"250px"}},
- {"name":"name","title":lang.alias},
- {"name":"kind","title":lang.kind},
- {"name":"domain","title":lang.domain,"breakpoints":"xs sm"},
- {"name":"multiple_bookings","filterable": false,"style":{"min-width":"150px","width":"140px"},"title":lang.multiple_bookings,"breakpoints":"xs sm"},
- {"name":"active","filterable": false,"style":{"min-width":"80px","width":"80px"},"title":lang.active,"formatter": function(value){return 1==value?'<i class="bi bi-check-lg"></i>':0==value&&'<i class="bi bi-x-lg"></i>';}},
- {"name":"action","filterable": false,"sortable": false,"style":{"text-align":"right","min-width":"180px","width":"180px"},"type":"html","title":lang.action,"breakpoints":"xs sm"}
- ],
- "empty": lang.empty,
- "rows": $.ajax({
- dataType: 'json',
- url: '/api/v1/get/resource/all',
- jsonp: false,
- error: function () {
- console.log('Cannot draw resource table');
- },
- success: function (data) {
- $.each(data, function (i, item) {
+ $('#resource_table').DataTable({
+ processing: true,
+ serverSide: false,
+ language: lang_datatables,
+ ajax: {
+ type: "GET",
+ url: "/api/v1/get/resource/all",
+ dataSrc: function(json){
+ $.each(json, function (i, item) {
if (item.multiple_bookings == '0') {
item.multiple_bookings = '<span id="active-script" class="badge fs-5 bg-success">' + lang.booking_0_short + '</span>';
} else if (item.multiple_bookings == '-1') {
@@ -572,65 +582,66 @@ jQuery(function($){
item.chkbox = '<input type="checkbox" data-id="resource" name="multi_select" value="' + encodeURIComponent(item.name) + '" />';
item.name = escapeHtml(item.name);
});
- }
- }),
- "paging": {
- "enabled": true,
- "limit": 5,
- "size": pagination_size
- },
- "state": {
- "enabled": true
- },
- "filtering": {
- "enabled": true,
- "delay": 1200,
- "position": "left",
- "connectors": false,
- "placeholder": lang.filter_table
- },
- "components": {
- "filtering": FooTable.domainFilter
- },
- "sorting": {
- "enabled": true
- },
- "on": {
- "destroy.ft.table": function(e, ft){
- $('.refresh_table').attr('disabled', 'true');
- },
- "ready.ft.table": function(e, ft){
- table_mailbox_ready(ft, 'resource_table');
- },
- "after.ft.filtering": function(e, ft){
- table_mailbox_ready(ft, 'resource_table');
+
+ console.log(json);
+ return json;
}
},
- "toggleSelector": "table tbody span.footable-toggle"
+ columns: [
+ {
+ title: lang.description,
+ data: 'description'
+ },
+ {
+ title: lang.alias,
+ data: 'name'
+ },
+ {
+ title: lang.kind,
+ data: 'kind'
+ },
+ {
+ title: lang.domain,
+ data: 'domain'
+ },
+ {
+ title: lang.multiple_bookings,
+ data: 'multiple_bookings'
+ },
+ {
+ title: lang.active,
+ data: 'active',
+ render: function (data, type) {
+ return 1==value?'<i class="bi bi-check-lg"></i>':(0==value?'<i class="bi bi-x-lg"></i>':2==value&&'—');
+ }
+ },
+ {
+ title: lang.action,
+ data: null,
+ render: function (data, type) {
+ return `<div class="btn-group">
+ <a href="/edit/admin/admin" class="btn btn-xs btn-xs-half btn-secondary">
+ <i class="bi bi-pencil-fill"></i> Bearbeiten
+ </a>
+ <a href="#" data-action="delete_selected" data-id="single-admin" data-api-url="delete/admin" data-item="admin" class="btn btn-xs btn-xs-half btn-danger">
+ <i class="bi bi-trash"></i> Entfernen
+ </a>
+ </div>`;
+ }
+ },
+ ]
});
}
function draw_bcc_table() {
- ft_bcc_table = FooTable.init('#bcc_table', {
- "columns": [
- {"name":"chkbox","title":"","style":{"min-width":"60px","width":"60px"},"filterable": false,"sortable": false,"type":"html"},
- {"sorted": true,"name":"id","title":"ID","style":{"min-width":"60px","width":"60px","text-align":"center"}},
- {"name":"type","title":lang.bcc_type},
- {"name":"local_dest","title":lang.bcc_local_dest},
- {"name":"bcc_dest","title":lang.bcc_destinations},
- {"name":"domain","title":lang.domain,"breakpoints":"xs sm"},
- {"name":"active","filterable": false,"style":{"min-width":"80px","width":"80px"},"title":lang.active,"formatter": function(value){return 1==value?'<i class="bi bi-check-lg"></i>':0==value&&'<i class="bi bi-x-lg"></i>';}},
- {"name":"action","filterable": false,"sortable": false,"style":{"text-align":"right","min-width":"180px","width":"180px"},"type":"html","title":lang.action,"breakpoints":"xs sm"}
- ],
- "empty": lang.empty,
- "rows": $.ajax({
- dataType: 'json',
- url: '/api/v1/get/bcc/all',
- jsonp: false,
- error: function () {
- console.log('Cannot draw bcc table');
- },
- success: function (data) {
- $.each(data, function (i, item) {
+ $('#bcc_table').DataTable({
+ processing: true,
+ serverSide: false,
+ language: lang_datatables,
+ ajax: {
+ type: "GET",
+ url: "/api/v1/get/bcc/all",
+ dataSrc: function(json){
+ $.each(json, function (i, item) {
item.action = '<div class="btn-group footable-actions">' +
'<a href="/edit/bcc/' + item.id + '" class="btn btn-xs btn-xs-half btn-secondary"><i class="bi bi-pencil-fill"></i> ' + lang.edit + '</a>' +
'<a href="#" data-action="delete_selected" data-id="single-bcc" data-api-url="delete/bcc" data-item="' + item.id + '" class="btn btn-xs btn-xs-half btn-danger"><i class="bi bi-trash"></i> ' + lang.remove + '</a>' +
@@ -644,38 +655,54 @@ jQuery(function($){
item.type = '<span id="inactive-script" class="badge fs-5 bg-warning">' + lang.bcc_rcpt_map + '</span>';
}
});
- }
- }),
- "paging": {
- "enabled": true,
- "limit": 5,
- "size": pagination_size
- },
- "state": {
- "enabled": true
- },
- "filtering": {
- "enabled": true,
- "delay": 1200,
- "position": "left",
- "connectors": false,
- "placeholder": lang.filter_table
- },
- "sorting": {
- "enabled": true
- },
- "on": {
- "destroy.ft.table": function(e, ft){
- $('.refresh_table').attr('disabled', 'true');
- },
- "ready.ft.table": function(e, ft){
- table_mailbox_ready(ft, 'bcc_table');
- },
- "after.ft.filtering": function(e, ft){
- table_mailbox_ready(ft, 'bcc_table');
+
+ console.log(json);
+ return json;
}
},
- "toggleSelector": "table tbody span.footable-toggle"
+ columns: [
+ {
+ title: "ID",
+ data: 'id'
+ },
+ {
+ title: lang.bcc_type,
+ data: 'type'
+ },
+ {
+ title: lang.bcc_local_dest,
+ data: 'local_dest'
+ },
+ {
+ title: lang.bcc_destinations,
+ data: 'bcc_dest'
+ },
+ {
+ title: lang.domain,
+ data: 'domain'
+ },
+ {
+ title: lang.active,
+ data: 'active',
+ render: function (data, type) {
+ return 1==value?'<i class="bi bi-check-lg"></i>':(0==value?'<i class="bi bi-x-lg"></i>':2==value&&'—');
+ }
+ },
+ {
+ title: lang.action,
+ data: null,
+ render: function (data, type) {
+ return `<div class="btn-group">
+ <a href="/edit/admin/admin" class="btn btn-xs btn-xs-half btn-secondary">
+ <i class="bi bi-pencil-fill"></i> Bearbeiten
+ </a>
+ <a href="#" data-action="delete_selected" data-id="single-admin" data-api-url="delete/admin" data-item="admin" class="btn btn-xs btn-xs-half btn-danger">
+ <i class="bi bi-trash"></i> Entfernen
+ </a>
+ </div>`;
+ }
+ },
+ ]
});
}
function draw_recipient_map_table() {
@@ -1150,12 +1177,12 @@ jQuery(function($){
draw_domain_table();
draw_mailbox_table();
draw_resource_table();
- draw_alias_table();
- draw_aliasdomain_table();
- draw_sync_job_table();
- draw_filter_table();
+ // draw_alias_table();
+ // draw_aliasdomain_table();
+ // draw_sync_job_table();
+ // draw_filter_table();
draw_bcc_table();
- draw_recipient_map_table();
- draw_tls_policy_table();
+ // draw_recipient_map_table();
+ // draw_tls_policy_table();
});
diff --git a/data/web/mailbox.php b/data/web/mailbox.php
index 489ac429..a8abd7ca 100644
--- a/data/web/mailbox.php
+++ b/data/web/mailbox.php
@@ -40,6 +40,7 @@ $template_data = [
'domains' => $domains,
'mailboxes' => $mailboxes,
'lang_mailbox' => json_encode($lang['mailbox']),
+ 'lang_datatables' => json_encode($lang['datatables']),
];
require_once $_SERVER['DOCUMENT_ROOT'] . '/inc/footer.inc.php';
diff --git a/data/web/templates/admin/tab-config-admins.twig b/data/web/templates/admin/tab-config-admins.twig
index 16f7321d..8f2c62a8 100644
--- a/data/web/templates/admin/tab-config-admins.twig
+++ b/data/web/templates/admin/tab-config-admins.twig
@@ -225,9 +225,8 @@
<div class="card mb-4">
<div class="card-header">{{ lang.admin.domain_admins }}</div>
<div class="card-body">
- <div class="table-responsive">
- <table class="table table-striped table-condensed" id="domainadminstable"></table>
- </div>
+ <table id="domainadminstable" class="table table-striped dt-responsive nowrap" style="width:100%">
+ </table>
<div class="mass-actions-admin">
<div class="btn-group">
<a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary" id="toggle_multi_select_all" data-id="domain_admins" href="#"><i class="bi bi-check-all"></i> {{ lang.mailbox.toggle_all }}</a>
diff --git a/data/web/templates/mailbox.twig b/data/web/templates/mailbox.twig
index 62c24bb4..cba189d7 100644
--- a/data/web/templates/mailbox.twig
+++ b/data/web/templates/mailbox.twig
@@ -47,6 +47,7 @@
<script type='text/javascript'>
var acl = '{{ acl_json|raw }}';
var lang = {{ lang_mailbox|raw }};
+ var lang_datatables = {{ lang_datatables|raw }}
var csrf_token = '{{ csrf_token }}';
var pagination_size = '{{ pagination_size }}';
var role = '{{ role }}';
diff --git a/data/web/templates/mailbox/tab-bcc.twig b/data/web/templates/mailbox/tab-bcc.twig
index ed3f6566..2e2178a1 100644
--- a/data/web/templates/mailbox/tab-bcc.twig
+++ b/data/web/templates/mailbox/tab-bcc.twig
@@ -15,9 +15,7 @@
</div>
<p style="margin:10px" class="text-muted">{{ lang.mailbox.bcc_info|raw }}</p>
{# <div class="mass-actions-mailbox" data-actions-header="true"></div>#}
- <div class="table-responsive">
- <table class="table table-striped" id="bcc_table"></table>
- </div>
+ <table id="bcc_table" class="table table-striped dt-responsive nowrap w-100"></table>
<div class="mass-actions-mailbox">
<div class="btn-group" data-acl="{{ acl.bcc_maps }}">
<a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary" id="toggle_multi_select_all" data-id="bcc" href="#"><i class="bi bi-check-all"></i> {{ lang.mailbox.toggle_all }}</a>
diff --git a/data/web/templates/mailbox/tab-domains.twig b/data/web/templates/mailbox/tab-domains.twig
index 53800960..495fa5f8 100644
--- a/data/web/templates/mailbox/tab-domains.twig
+++ b/data/web/templates/mailbox/tab-domains.twig
@@ -14,9 +14,7 @@
</div>
</div>
{# <div class="mass-actions-mailbox" data-actions-header="true"></div>#}
- <div class="table-responsive">
- <table id="domain_table" class="table table-striped"></table>
- </div>
+ <table id="domain_table" class="table table-striped dt-responsive nowrap" style="width:100%"></table>
<div class="mass-actions-mailbox">
<div class="btn-group">
<a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary" id="toggle_multi_select_all" data-id="domain" href="#"><i class="bi bi-check-all"></i> {{ lang.mailbox.toggle_all }}</a>
diff --git a/data/web/templates/mailbox/tab-mailboxes.twig b/data/web/templates/mailbox/tab-mailboxes.twig
index 1a7aa86d..85eabdb3 100644
--- a/data/web/templates/mailbox/tab-mailboxes.twig
+++ b/data/web/templates/mailbox/tab-mailboxes.twig
@@ -12,9 +12,7 @@
</div>
</div>
<div class="mass-actions-mailbox d-none d-sm-flex" data-actions-header="true"></div>
- <div class="table-responsive">
- <table id="mailbox_table" class="table table-striped"></table>
- </div>
+ <table id="mailbox_table" class="table table-striped dt-responsive nowrap w-100"></table>
<div class="mass-actions-mailbox">
<div class="btn-group d-block d-md-none">
<a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary" id="toggle_multi_select_all" data-id="mailbox" href="#"><i class="bi bi-check-all"></i> {{ lang.mailbox.toggle_all }}</a>
diff --git a/data/web/templates/mailbox/tab-resources.twig b/data/web/templates/mailbox/tab-resources.twig
index 9e72956b..e53d815f 100644
--- a/data/web/templates/mailbox/tab-resources.twig
+++ b/data/web/templates/mailbox/tab-resources.twig
@@ -17,9 +17,7 @@
<p><span class="badge fs-5 bg-danger">{{ lang.mailbox.booking_custom_short }}</span> - {{ lang.mailbox.booking_custom }}</p>
</div>
{# <div class="mass-actions-mailbox" data-actions-header="true"></div>#}
- <div class="table-responsive">
- <table id="resource_table" class="table table-striped"></table>
- </div>
+ <table id="resource_table" class="table table-striped dt-responsive nowrap w-100"></table>
<div class="mass-actions-mailbox">
<div class="btn-group">
<a class="btn btn-sm btn-xs-half d-block d-sm-inline btn-secondary" id="toggle_multi_select_all" data-id="resource" href="#"><i class="bi bi-check-all"></i> {{ lang.mailbox.toggle_all }}</a>