Dropdown.js 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112
  1. /**
  2. * --------------------------------------------
  3. * AdminLTE Dropdown.js
  4. * License MIT
  5. * --------------------------------------------
  6. */
  7. const Dropdown = (($) => {
  8. /**
  9. * Constants
  10. * ====================================================
  11. */
  12. const NAME = 'Dropdown'
  13. const DATA_KEY = 'lte.dropdown'
  14. const EVENT_KEY = `.${DATA_KEY}`
  15. const JQUERY_NO_CONFLICT = $.fn[NAME]
  16. const Selector = {
  17. DROPDOWN_MENU: 'ul.dropdown-menu',
  18. DROPDOWN_TOGGLE: '[data-toggle="dropdown"]',
  19. }
  20. const ClassName = {
  21. DROPDOWN_HOVER: '.dropdown-hover'
  22. }
  23. const Default = {
  24. }
  25. /**
  26. * Class Definition
  27. * ====================================================
  28. */
  29. class Dropdown {
  30. constructor(element, config) {
  31. this._config = config
  32. this._element = element
  33. }
  34. // Public
  35. toggleSubmenu() {
  36. this._element.siblings().show().toggleClass("show");
  37. if (! this._element.next().hasClass('show')) {
  38. this._element.parents('.dropdown-menu').first().find('.show').removeClass("show").hide();
  39. }
  40. this._element.parents('li.nav-item.dropdown.show').on('hidden.bs.dropdown', function(e) {
  41. $('.dropdown-submenu .show').removeClass("show").hide();
  42. });
  43. }
  44. // Static
  45. static _jQueryInterface(config) {
  46. return this.each(function () {
  47. let data = $(this).data(DATA_KEY)
  48. const _config = $.extend({}, Default, $(this).data())
  49. if (!data) {
  50. data = new Dropdown($(this), _config)
  51. $(this).data(DATA_KEY, data)
  52. }
  53. if (config === 'toggleSubmenu') {
  54. data[config]()
  55. }
  56. })
  57. }
  58. }
  59. /**
  60. * Data API
  61. * ====================================================
  62. */
  63. $(Selector.DROPDOWN_MENU + ' ' + Selector.DROPDOWN_TOGGLE).on("click", function(event) {
  64. event.preventDefault();
  65. event.stopPropagation();
  66. Dropdown._jQueryInterface.call($(this), 'toggleSubmenu')
  67. });
  68. // $(Selector.SIDEBAR + ' a').on('focusin', () => {
  69. // $(Selector.MAIN_SIDEBAR).addClass(ClassName.SIDEBAR_FOCUSED);
  70. // })
  71. // $(Selector.SIDEBAR + ' a').on('focusout', () => {
  72. // $(Selector.MAIN_SIDEBAR).removeClass(ClassName.SIDEBAR_FOCUSED);
  73. // })
  74. /**
  75. * jQuery API
  76. * ====================================================
  77. */
  78. $.fn[NAME] = Dropdown._jQueryInterface
  79. $.fn[NAME].Constructor = Dropdown
  80. $.fn[NAME].noConflict = function () {
  81. $.fn[NAME] = JQUERY_NO_CONFLICT
  82. return Dropdown._jQueryInterface
  83. }
  84. return Dropdown
  85. })(jQuery)
  86. export default Dropdown