Merge pull request #4914 from tomudding/fix/datatables-not-ordering-datetimes-correctly

Fix sorting dates and missing Rspamd attributes in datatables

data/web/js/build/006-datetime-moment.js

@@ -1,70 +0,0 @@
-/**
- * This plug-in for DataTables represents the ultimate option in extensibility
- * for sorting date / time strings correctly. It uses
- * [Moment.js](http://momentjs.com) to create automatic type detection and
- * sorting plug-ins for DataTables based on a given format. This way, DataTables
- * will automatically detect your temporal information and sort it correctly.
- *
- * For usage instructions, please see the DataTables blog
- * post that [introduces it](//datatables.net/blog/2014-12-18).
- *
- * @name Ultimate Date / Time sorting
- * @summary Sort date and time in any format using Moment.js
- * @author [Allan Jardine](//datatables.net)
- * @depends DataTables 1.10+, Moment.js 1.7+
- *
- * @example
- *    $.fn.dataTable.moment( 'HH:mm MMM D, YY' );
- *    $.fn.dataTable.moment( 'dddd, MMMM Do, YYYY' );
- *
- *    $('#example').DataTable();
- */
-
-(function (factory) {
-	if (typeof define === "function" && define.amd) {
-		define(["jquery", "moment", "datatables.net"], factory);
-	} else {
-		factory(jQuery, moment);
-	}
-}(function ($, moment) {
-
-function strip (d) {
-	if ( typeof d === 'string' ) {
-		// Strip HTML tags and newline characters if possible
-		d = d.replace(/(<.*?>)|(\r?\n|\r)/g, '');
-
-		// Strip out surrounding white space
-		d = d.trim();
-	}
-
-	return d;
-}
-
-$.fn.dataTable.moment = function ( format, locale, reverseEmpties ) {
-	var types = $.fn.dataTable.ext.type;
-
-	// Add type detection
-	types.detect.unshift( function ( d ) {
-		d = strip(d);
-
-		// Null and empty values are acceptable
-		if ( d === '' || d === null ) {
-			return 'moment-'+format;
-		}
-
-		return moment( d, format, locale, true ).isValid() ?
-			'moment-'+format :
-			null;
-	} );
-
-	// Add sorting method - use an integer for the sorting
-	types.order[ 'moment-'+format+'-pre' ] = function ( d ) {
-		d = strip(d);
-		
-		return !moment(d, format, locale, true).isValid() ?
-			(reverseEmpties ? -Infinity : Infinity) :
-			parseInt( moment( d, format, locale, true ).format( 'x' ), 10 );
-	};
-};
-
-}));

data/web/js/build/013-mailcow.js

@@ -274,11 +274,10 @@ $(document).ready(function() {
     });
   })
 
-  // Jquery Datatables, enable responsive plugin and date sort plugin
+  // Jquery Datatables, enable responsive plugin
   $.extend($.fn.dataTable.defaults, {
     responsive: true
   });
-  $.fn.dataTable.moment('dd:mm:YYYY');
 
   // tag boxes
   $('.tag-box .tag-add').click(function(){

data/web/js/site/debug.js

@@ -1,3 +1,13 @@
+const LOCALE = undefined;
+const DATETIME_FORMAT = {
+  year: "numeric",
+  month: "2-digit",
+  day: "2-digit",
+  hour: "2-digit",
+  minute: "2-digit",
+  second: "2-digit"
+};
+
 $(document).ready(function() {
   // Parse seconds ago to date
   // Get "now" timestamp
@@ -7,14 +17,7 @@ $(document).ready(function() {
     if (typeof started_s_ago != 'NaN') {
       var started_date = new Date((ts_now - started_s_ago) * 1000);
       if (started_date instanceof Date && !isNaN(started_date)) {
-        var started_local_date = started_date.toLocaleDateString(undefined, {
+        var started_local_date = started_date.toLocaleDateString(LOCALE, DATETIME_FORMAT);
-          year: "numeric",
-          month: "2-digit",
-          day: "2-digit",
-          hour: "2-digit",
-          minute: "2-digit",
-          second: "2-digit"
-        });
         $(this).text(started_local_date);
       } else {
         $(this).text('-');
@@ -25,14 +28,7 @@ $(document).ready(function() {
   $('.parse_date').each(function(i, parse_date) {
     var started_date = new Date(Date.parse($(this).text()));
     if (typeof started_date != 'NaN') {
-      var started_local_date = started_date.toLocaleDateString(undefined, {
+      var started_local_date = started_date.toLocaleDateString(LOCALE, DATETIME_FORMAT);
-        year: "numeric",
-        month: "2-digit",
-        day: "2-digit",
-        hour: "2-digit",
-        minute: "2-digit",
-        second: "2-digit"
-      });
       $(this).text(started_local_date);
     }
   });
@@ -75,6 +71,13 @@ jQuery(function($){
     var table_name = $(this).data('table');
     $('#' + table_name).DataTable().ajax.reload();
   });
+  function createSortableDate(td, cellData) {
+    $(td).attr({
+      "data-order": cellData,
+      "data-sort": cellData
+    });
+    $(td).html(convertTimestampToLocalFormat(cellData));
+  }
   function draw_autodiscover_logs() {
     // just recalc width if instance already exists
     if ($.fn.DataTable.isDataTable('#autodiscover_log') ) {
@@ -100,9 +103,8 @@ jQuery(function($){
           data: 'time',
           defaultContent: '',
           responsivePriority: 1,
-          render: function(data, type){
+          createdCell: function(td, cellData) {
-            var date = new Date(data ? data * 1000 : 0); 
+            createSortableDate(td, cellData)
-            return date.toLocaleDateString(undefined, {year: "numeric", month: "2-digit", day: "2-digit", hour: "2-digit", minute: "2-digit", second: "2-digit"});
           }
         },
         {
@@ -157,9 +159,8 @@ jQuery(function($){
           title: lang.time,
           data: 'time',
           defaultContent: '',
-          render: function(data, type){
+          createdCell: function(td, cellData) {
-            var date = new Date(data ? data * 1000 : 0); 
+            createSortableDate(td, cellData)
-            return date.toLocaleDateString(undefined, {year: "numeric", month: "2-digit", day: "2-digit", hour: "2-digit", minute: "2-digit", second: "2-digit"});
           }
         },
         {
@@ -200,9 +201,8 @@ jQuery(function($){
           title: lang.time,
           data: 'time',
           defaultContent: '',
-          render: function(data, type){
+          createdCell: function(td, cellData) {
-            var date = new Date(data ? data * 1000 : 0); 
+            createSortableDate(td, cellData)
-            return date.toLocaleDateString(undefined, {year: "numeric", month: "2-digit", day: "2-digit", hour: "2-digit", minute: "2-digit", second: "2-digit"});
           }
         },
         {
@@ -247,9 +247,8 @@ jQuery(function($){
           title: lang.time,
           data: 'time',
           defaultContent: '',
-          render: function(data, type){
+          createdCell: function(td, cellData) {
-            var date = new Date(data ? data * 1000 : 0); 
+            createSortableDate(td, cellData)
-            return date.toLocaleDateString(undefined, {year: "numeric", month: "2-digit", day: "2-digit", hour: "2-digit", minute: "2-digit", second: "2-digit"});
           }
         },
         {
@@ -306,9 +305,8 @@ jQuery(function($){
           title: lang.time,
           data: 'time',
           defaultContent: '',
-          render: function(data, type){
+          createdCell: function(td, cellData) {
-            var date = new Date(data ? data * 1000 : 0); 
+            createSortableDate(td, cellData)
-            return date.toLocaleDateString(undefined, {year: "numeric", month: "2-digit", day: "2-digit", hour: "2-digit", minute: "2-digit", second: "2-digit"});
           }
         },
         {
@@ -393,9 +391,8 @@ jQuery(function($){
           title: lang.time,
           data: 'time',
           defaultContent: '',
-          render: function(data, type){
+          createdCell: function(td, cellData) {
-            var date = new Date(data ? data * 1000 : 0); 
+            createSortableDate(td, cellData)
-            return date.toLocaleDateString(undefined, {year: "numeric", month: "2-digit", day: "2-digit", hour: "2-digit", minute: "2-digit", second: "2-digit"});
           }
         },
         {
@@ -481,9 +478,9 @@ jQuery(function($){
           title: lang.login_time,
           data: 'datetime',
           defaultContent: '',
-          render: function(data, type){
+          createdCell: function(td, cellData) {
-            var date = new Date(data.replace(/-/g, "/")); 
+            cellData = Math.floor((new Date(data.replace(/-/g, "/"))).getTime() / 1000);
-            return date.toLocaleDateString(undefined, {year: "numeric", month: "2-digit", day: "2-digit", hour: "2-digit", minute: "2-digit", second: "2-digit"});
+            createSortableDate(td, cellData)
           }
         }
       ]
@@ -513,9 +510,8 @@ jQuery(function($){
           title: lang.time,
           data: 'time',
           defaultContent: '',
-          render: function(data, type){
+          createdCell: function(td, cellData) {
-            var date = new Date(data ? data * 1000 : 0); 
+            createSortableDate(td, cellData)
-            return date.toLocaleDateString(undefined, {year: "numeric", month: "2-digit", day: "2-digit", hour: "2-digit", minute: "2-digit", second: "2-digit"});
           }
         },
         {
@@ -551,9 +547,8 @@ jQuery(function($){
           title: lang.time,
           data: 'time',
           defaultContent: '',
-          render: function(data, type){
+          createdCell: function(td, cellData) {
-            var date = new Date(data ? data * 1000 : 0); 
+            createSortableDate(td, cellData)
-            return date.toLocaleDateString(undefined, {year: "numeric", month: "2-digit", day: "2-digit", hour: "2-digit", minute: "2-digit", second: "2-digit"});
           }
         },
         {
@@ -594,9 +589,8 @@ jQuery(function($){
           title: lang.time,
           data: 'time',
           defaultContent: '',
-          render: function(data, type){
+          createdCell: function(td, cellData) {
-            var date = new Date(data ? data * 1000 : 0); 
+            createSortableDate(td, cellData)
-            return date.toLocaleDateString(undefined, {year: "numeric", month: "2-digit", day: "2-digit", hour: "2-digit", minute: "2-digit", second: "2-digit"});
           }
         },
         {
@@ -637,9 +631,8 @@ jQuery(function($){
           title: lang.time,
           data: 'time',
           defaultContent: '',
-          render: function(data, type){
+          createdCell: function(td, cellData) {
-            var date = new Date(data ? data * 1000 : 0); 
+            createSortableDate(td, cellData)
-            return date.toLocaleDateString(undefined, {year: "numeric", month: "2-digit", day: "2-digit", hour: "2-digit", minute: "2-digit", second: "2-digit"});
           }
         },
         {
@@ -728,6 +721,7 @@ jQuery(function($){
       processing: true,
       serverSide: false,
       language: lang_datatables,
+      order: [[0, 'desc']],
       ajax: {
         type: "GET",
         url: "/api/v1/get/logs/rspamd-history",
@@ -738,11 +732,10 @@ jQuery(function($){
       columns: [
         {
           title: lang.time,
-          data: 'time',
+          data: 'unix_time',
           defaultContent: '',
-          render: function(data, type){
+          createdCell: function(td, cellData) {
-            var date = new Date(data ? data * 1000 : 0); 
+            createSortableDate(td, cellData)
-            return date.toLocaleDateString(undefined, {year: "numeric", month: "2-digit", day: "2-digit", hour: "2-digit", minute: "2-digit", second: "2-digit"});
           }
         },
         {
@@ -773,7 +766,14 @@ jQuery(function($){
         {
           title: 'Score',
           data: 'score',
-          defaultContent: ''
+          defaultContent: '',
+          createdCell: function(td, cellData) {
+            $(td).attr({
+              "data-order": cellData.sortBy,
+              "data-sort": cellData.sortBy
+            });
+            $(td).html(cellData.value);
+          }
         },
         {
           title: 'Subject',
@@ -794,7 +794,14 @@ jQuery(function($){
         {
           title: 'Scan Time',
           data: 'scan_time',
-          defaultContent: ''
+          defaultContent: '',
+          createdCell: function(td, cellData) {
+            $(td).attr({
+              "data-order": cellData.sortBy,
+              "data-sort": cellData.sortBy
+            });
+            $(td).html(cellData.value);
+          }
         },
         {
           title: 'ID',
@@ -851,9 +858,7 @@ jQuery(function($){
         scan_time += ' / ' + item.time_virtual.toFixed(3);
       }
       item.scan_time = {
-        "options": {
+        "sortBy": item.time_real,
-          "sortValue": item.time_real
-        },
         "value": scan_time
       };
       if (item.action === 'clean' || item.action === 'no action') {
@@ -872,9 +877,7 @@ jQuery(function($){
         score_content = "[ <span class='text-danger'>" + item.score.toFixed(2) + " / " + item.required_score + "</span> ]";
       }
       item.score = {
-        "options": {
+        "sortBy": item.score,
-          "sortValue": item.score
-        },
         "value": score_content
       };
       if (item.user == null) {
@@ -1531,3 +1534,8 @@ function parseGithubMarkdownLinks(inputText) {
 
   return replacedText;
 }
+
+function convertTimestampToLocalFormat(timestamp) {
+  var date = new Date(timestamp ? timestamp * 1000 : 0);
+  return date.toLocaleDateString(LOCALE, DATETIME_FORMAT);
+}