Rewrote auto-refresh extension to ES6.

CHANGELOG.md

@@ -3,6 +3,7 @@ ChangeLog
 
 ### 1.13.5
 
+- **New(auto-refresh extension):** Rewrote auto-refresh extension to ES6.
 - **Update(js):** Fixed showFullscreen cannot work bug.
 - **Update(js):** Redefined customSearch option.
 - **Update(js):** Fixed show footer cannot work bug.

src/extensions/auto-refresh/bootstrap-table-auto-refresh.css

@@ -1,3 +0,0 @@
-.btn.enabled {
-    background-color: #5bc0de;
-}

src/extensions/auto-refresh/bootstrap-table-auto-refresh.js

@@ -1,84 +1,78 @@
 /**
  * @author: Alec Fenichel
  * @webSite: https://fenichelar.com
- * @version: v1.0.0
+ * @update: zhixin wen <wenzhixin2010@gmail.com>
  */
 
-(function ($) {
+($ => {
+  const Utils = $.fn.bootstrapTable.utils
 
-    'use strict';
+  $.extend($.fn.bootstrapTable.defaults, {
+    autoRefresh: false,
+    autoRefreshInterval: 60,
+    autoRefreshSilent: true,
+    autoRefreshStatus: true,
+    autoRefreshFunction: null
+  })
 
-    $.extend($.fn.bootstrapTable.defaults, {
-        autoRefresh: false,
-        autoRefreshInterval: 60,
-        autoRefreshSilent: true,
-        autoRefreshStatus: true,
-        autoRefreshFunction: null
-    });
+  $.extend($.fn.bootstrapTable.defaults.icons, {
+    autoRefresh: Utils.bootstrapVersion === 4 ? 'fa-clock' : 'glyphicon-time icon-time'
+  })
 
-    $.extend($.fn.bootstrapTable.defaults.icons, {
-        autoRefresh: $.fn.bootstrapTable.utils.bootstrapVersion === 4 ? 'fa-clock' : 'glyphicon-time icon-time'
-    });
+  $.extend($.fn.bootstrapTable.locales, {
+    formatAutoRefresh () {
+      return 'Auto Refresh'
+    }
+  })
 
-    $.extend($.fn.bootstrapTable.locales, {
-        formatAutoRefresh: function() {
-            return 'Auto Refresh';
-        }
-    });
-
-    $.extend($.fn.bootstrapTable.defaults, $.fn.bootstrapTable.locales);
+  $.extend($.fn.bootstrapTable.defaults, $.fn.bootstrapTable.locales)
 
-    var BootstrapTable = $.fn.bootstrapTable.Constructor;
-    var _init = BootstrapTable.prototype.init;
-    var _initToolbar = BootstrapTable.prototype.initToolbar;
-    var sprintf = $.fn.bootstrapTable.utils.sprintf;
+  $.BootstrapTable = class extends $.BootstrapTable {
+    init (...args) {
+      super.init(...args)
 
-    BootstrapTable.prototype.init = function () {
-        _init.apply(this, Array.prototype.slice.apply(arguments));
+      if (this.options.autoRefresh && this.options.autoRefreshStatus) {
+        this.options.autoRefreshFunction = setInterval(() => {
+          this.refresh({silent: this.options.autoRefreshSilent})
+        }, this.options.autoRefreshInterval * 1000)
+      }
+    }
 
-        if (this.options.autoRefresh && this.options.autoRefreshStatus) {
-            var that = this;
-            this.options.autoRefreshFunction = setInterval(function () {
-                that.refresh({silent: that.options.autoRefreshSilent});
-            }, this.options.autoRefreshInterval*1000);
-        }
-    };
+    initToolbar (...args) {
+      super.initToolbar(...args)
 
-    BootstrapTable.prototype.initToolbar = function() {
-        _initToolbar.apply(this, Array.prototype.slice.apply(arguments));
+      if (this.options.autoRefresh) {
+        const $btnGroup = this.$toolbar.find('>.btn-group')
+        let $btnAutoRefresh = $btnGroup.find('.auto-refresh')
 
-        if (this.options.autoRefresh) {
-            var $btnGroup = this.$toolbar.find('>.btn-group');
-            var $btnAutoRefresh = $btnGroup.find('.auto-refresh');
+        if (!$btnAutoRefresh.length) {
+          $btnAutoRefresh = $(`
+            <button class="auto-refresh btn${Utils.sprintf(' btn-%s', this.options.buttonsClass)}
+            ${Utils.sprintf(' btn-%s', this.options.iconSize)}
+            ${this.options.autoRefreshStatus ? 'active' : ''}"
+            type="button" title="${this.options.formatAutoRefresh()}">
+            <i class="${this.options.iconsPrefix} ${this.options.icons.autoRefresh}"></i>
+            </button>
+          `).appendTo($btnGroup)
 
-            if (!$btnAutoRefresh.length) {
-                $btnAutoRefresh = $([
-                    sprintf('<button class="btn btn-default auto-refresh %s" ', this.options.autoRefreshStatus ? 'enabled' : ''),
-                    'type="button" ',
-                    sprintf('title="%s">', this.options.formatAutoRefresh()),
-                    sprintf('<i class="%s %s"></i>', this.options.iconsPrefix, this.options.icons.autoRefresh),
-                    '</button>'
-                ].join('')).appendTo($btnGroup);
-
-                $btnAutoRefresh.on('click', $.proxy(this.toggleAutoRefresh, this));
-            }
+          $btnAutoRefresh.on('click', $.proxy(this.toggleAutoRefresh, this))
         }
-    };
+      }
+    }
 
-    BootstrapTable.prototype.toggleAutoRefresh = function() {
-        if (this.options.autoRefresh) {
-            if (this.options.autoRefreshStatus) {
-                clearInterval(this.options.autoRefreshFunction);
-                this.$toolbar.find('>.btn-group').find('.auto-refresh').removeClass('enabled');
-            } else {
-                var that = this;
-                this.options.autoRefreshFunction = setInterval(function () {
-                    that.refresh({silent: that.options.autoRefreshSilent});
-                }, this.options.autoRefreshInterval*1000);
-                this.$toolbar.find('>.btn-group').find('.auto-refresh').addClass('enabled');
-            }
-            this.options.autoRefreshStatus = !this.options.autoRefreshStatus;
+    toggleAutoRefresh () {
+      if (this.options.autoRefresh) {
+        if (this.options.autoRefreshStatus) {
+          clearInterval(this.options.autoRefreshFunction)
+          this.$toolbar.find('>.btn-group').find('.auto-refresh').removeClass('active')
+        } else {
+          this.options.autoRefreshFunction = setInterval(() => {
+            this.refresh({silent: this.options.autoRefreshSilent})
+          }, this.options.autoRefreshInterval * 1000)
+          this.$toolbar.find('>.btn-group').find('.auto-refresh').addClass('active')
         }
-    };
-
-})(jQuery);
+        this.options.autoRefreshStatus = !this.options.autoRefreshStatus
+      }
+    }
+  }
+})(jQuery)