dropdown-menu.js 1.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677
  1. import TComponent from '../common/component';
  2. import config from '../common/config';
  3. const { prefix } = config;
  4. const name = `${prefix}-dropdown-menu`;
  5. TComponent({
  6. properties: {
  7. overlay: {
  8. type: Boolean,
  9. value: true,
  10. },
  11. duration: {
  12. type: Number,
  13. value: 200,
  14. },
  15. closeOnClickOverlay: {
  16. type: Boolean,
  17. value: true,
  18. },
  19. },
  20. data: {
  21. classBasePrefix: prefix,
  22. classPrefix: name,
  23. nodes: null,
  24. menus: null,
  25. activeIdx: -1,
  26. bottom: 0,
  27. },
  28. relations: {
  29. './dropdown-item': {
  30. type: 'child',
  31. },
  32. },
  33. methods: {
  34. _getAllItems() {
  35. const nodes = this.getRelationNodes('./dropdown-item');
  36. const menus = nodes.map((a) => {
  37. const { title, disabled } = a.data;
  38. return { title, disabled };
  39. });
  40. this.setData({
  41. nodes,
  42. menus,
  43. });
  44. },
  45. _toggleDropdown(e) {
  46. const idx = e.target.dataset.index;
  47. const { activeIdx } = this.data;
  48. if (activeIdx !== -1) {
  49. this.triggerEvent('close');
  50. this.data.nodes[activeIdx].setData({
  51. show: false,
  52. });
  53. this.triggerEvent('closed');
  54. }
  55. if (activeIdx === idx) {
  56. this.setData({
  57. activeIdx: -1,
  58. });
  59. }
  60. else {
  61. this.triggerEvent('open');
  62. this.setData({
  63. activeIdx: idx,
  64. });
  65. this.data.nodes[idx].setData({
  66. show: true,
  67. });
  68. this.triggerEvent('opened');
  69. }
  70. },
  71. },
  72. ready() {
  73. this._getAllItems();
  74. },
  75. });
  76. //# sourceMappingURL=dropdown-menu.js.map