bootstrap-table-auto-refresh.js 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293
  1. /**
  2. * @author: Alec Fenichel
  3. * @webSite: https://fenichelar.com
  4. * @update: zhixin wen <wenzhixin2010@gmail.com>
  5. */
  6. const Utils = $.fn.bootstrapTable.utils
  7. $.extend($.fn.bootstrapTable.defaults, {
  8. autoRefresh: false,
  9. autoRefreshInterval: 60,
  10. autoRefreshSilent: true,
  11. autoRefreshStatus: true,
  12. autoRefreshFunction: null
  13. })
  14. $.extend($.fn.bootstrapTable.defaults.icons, {
  15. autoRefresh: {
  16. bootstrap3: 'glyphicon-time icon-time',
  17. materialize: 'access_time',
  18. 'bootstrap-table': 'icon-clock'
  19. }[$.fn.bootstrapTable.theme] || 'fa-clock'
  20. })
  21. $.extend($.fn.bootstrapTable.locales, {
  22. formatAutoRefresh () {
  23. return 'Auto Refresh'
  24. }
  25. })
  26. $.extend($.fn.bootstrapTable.defaults, $.fn.bootstrapTable.locales)
  27. $.BootstrapTable = class extends $.BootstrapTable {
  28. init (...args) {
  29. super.init(...args)
  30. if (this.options.autoRefresh && this.options.autoRefreshStatus) {
  31. this.setupRefreshInterval()
  32. }
  33. }
  34. initToolbar (...args) {
  35. if (this.options.autoRefresh) {
  36. this.buttons = Object.assign(this.buttons, {
  37. autoRefresh: {
  38. html: `
  39. <button class="auto-refresh ${this.constants.buttonsClass}
  40. ${this.options.autoRefreshStatus ? ` ${this.constants.classes.buttonActive}` : ''}"
  41. type="button" name="autoRefresh" title="${this.options.formatAutoRefresh()}">
  42. ${ this.options.showButtonIcons ? Utils.sprintf(this.constants.html.icon, this.options.iconsPrefix, this.options.icons.autoRefresh) : ''}
  43. ${ this.options.showButtonText ? this.options.formatAutoRefresh() : ''}
  44. </button>
  45. `,
  46. event: this.toggleAutoRefresh
  47. }
  48. })
  49. }
  50. super.initToolbar(...args)
  51. }
  52. toggleAutoRefresh () {
  53. if (this.options.autoRefresh) {
  54. if (this.options.autoRefreshStatus) {
  55. clearInterval(this.options.autoRefreshFunction)
  56. this.$toolbar.find('>.columns .auto-refresh')
  57. .removeClass(this.constants.classes.buttonActive)
  58. } else {
  59. this.setupRefreshInterval()
  60. this.$toolbar.find('>.columns .auto-refresh')
  61. .addClass(this.constants.classes.buttonActive)
  62. }
  63. this.options.autoRefreshStatus = !this.options.autoRefreshStatus
  64. }
  65. }
  66. destroy () {
  67. if (this.options.autoRefresh && this.options.autoRefreshStatus) {
  68. clearInterval(this.options.autoRefreshFunction)
  69. }
  70. super.destroy()
  71. }
  72. setupRefreshInterval () {
  73. this.options.autoRefreshFunction = setInterval(() => {
  74. if (!this.options.autoRefresh || !this.options.autoRefreshStatus) {
  75. return
  76. }
  77. this.refresh({ silent: this.options.autoRefreshSilent })
  78. }, this.options.autoRefreshInterval * 1000)
  79. }
  80. }