roles-tree.js 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115
  1. /**
  2. * Copyright © Magento, Inc. All rights reserved.
  3. * See COPYING.txt for license details.
  4. */
  5. /**
  6. * @api
  7. */
  8. define([
  9. 'jquery',
  10. 'jquery/ui',
  11. 'jquery/jstree/jquery.jstree'
  12. ], function ($) {
  13. 'use strict';
  14. $.widget('mage.rolesTree', {
  15. options: {
  16. treeInitData: {},
  17. treeInitSelectedData: {}
  18. },
  19. /** @inheritdoc */
  20. _create: function () {
  21. this.element.jstree({
  22. plugins: ['themes', 'json_data', 'ui', 'crrm', 'types', 'vcheckbox', 'hotkeys'],
  23. vcheckbox: {
  24. 'two_state': true,
  25. 'real_checkboxes': true,
  26. /**
  27. * @param {*} n
  28. * @return {Array}
  29. */
  30. 'real_checkboxes_names': function (n) {
  31. return ['resource[]', $(n).data('id')];
  32. }
  33. },
  34. 'json_data': {
  35. data: this.options.treeInitData
  36. },
  37. ui: {
  38. 'select_limit': 0
  39. },
  40. hotkeys: {
  41. space: this._changeState,
  42. 'return': this._changeState
  43. },
  44. types: {
  45. 'types': {
  46. 'disabled': {
  47. 'check_node': false,
  48. 'uncheck_node': false
  49. }
  50. }
  51. }
  52. });
  53. this._bind();
  54. },
  55. /**
  56. * @private
  57. */
  58. _destroy: function () {
  59. this.element.jstree('destroy');
  60. },
  61. /**
  62. * @private
  63. */
  64. _bind: function () {
  65. this.element.on('loaded.jstree', $.proxy(this._checkNodes, this));
  66. this.element.on('click.jstree', 'a', $.proxy(this._checkNode, this));
  67. },
  68. /**
  69. * @param {jQuery.Event} event
  70. * @private
  71. */
  72. _checkNode: function (event) {
  73. event.stopPropagation();
  74. this.element.jstree(
  75. 'change_state',
  76. event.currentTarget,
  77. this.element.jstree('is_checked', event.currentTarget)
  78. );
  79. },
  80. /**
  81. * @private
  82. */
  83. _checkNodes: function () {
  84. var $items = $('[data-id="' + this.options.treeInitSelectedData.join('"],[data-id="') + '"]');
  85. $items.removeClass('jstree-unchecked').addClass('jstree-checked');
  86. $items.children(':checkbox').prop('checked', true);
  87. },
  88. /**
  89. * @return {Boolean}
  90. * @private
  91. */
  92. _changeState: function () {
  93. var element;
  94. if (this.data.ui.hovered) {
  95. element = this.data.ui.hovered;
  96. this['change_state'](element, this['is_checked'](element));
  97. }
  98. return false;
  99. }
  100. });
  101. return $.mage.rolesTree;
  102. });