Ohm-Management - Projektarbeit B-ME
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

VExpansionPanel.js 4.1KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120
  1. var _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; };
  2. import '../../../src/stylus/components/_expansion-panel.styl';
  3. import Themeable from '../../mixins/themeable';
  4. import { provide as RegistrableProvide } from '../../mixins/registrable';
  5. import mixins from '../../util/mixins';
  6. /* @vue/component */
  7. export default mixins(Themeable, RegistrableProvide('expansionPanel')).extend({
  8. name: 'v-expansion-panel',
  9. provide: function provide() {
  10. return {
  11. expansionPanel: this
  12. };
  13. },
  14. props: {
  15. disabled: Boolean,
  16. readonly: Boolean,
  17. expand: Boolean,
  18. focusable: Boolean,
  19. inset: Boolean,
  20. popout: Boolean,
  21. value: {
  22. type: [Number, Array],
  23. default: function _default() {
  24. return null;
  25. }
  26. }
  27. },
  28. data: function data() {
  29. return {
  30. items: [],
  31. open: []
  32. };
  33. },
  34. computed: {
  35. classes: function classes() {
  36. return _extends({
  37. 'v-expansion-panel--focusable': this.focusable,
  38. 'v-expansion-panel--popout': this.popout,
  39. 'v-expansion-panel--inset': this.inset
  40. }, this.themeClasses);
  41. }
  42. },
  43. watch: {
  44. expand: function expand(v) {
  45. var openIndex = -1;
  46. if (!v) {
  47. // Close all panels unless only one is open
  48. var openCount = this.open.reduce(function (acc, val) {
  49. return val ? acc + 1 : acc;
  50. }, 0);
  51. var open = Array(this.items.length).fill(false);
  52. if (openCount === 1) {
  53. openIndex = this.open.indexOf(true);
  54. }
  55. if (openIndex > -1) {
  56. open[openIndex] = true;
  57. }
  58. this.open = open;
  59. }
  60. this.$emit('input', v ? this.open : openIndex > -1 ? openIndex : null);
  61. },
  62. value: function value(v) {
  63. this.updateFromValue(v);
  64. }
  65. },
  66. mounted: function mounted() {
  67. this.value !== null && this.updateFromValue(this.value);
  68. },
  69. methods: {
  70. updateFromValue: function updateFromValue(v) {
  71. if (Array.isArray(v) && !this.expand) return;
  72. var open = Array(this.items.length).fill(false);
  73. if (typeof v === 'number') {
  74. open[v] = true;
  75. } else if (v !== null) {
  76. open = v;
  77. }
  78. this.updatePanels(open);
  79. },
  80. updatePanels: function updatePanels(open) {
  81. this.open = open;
  82. for (var i = 0; i < this.items.length; i++) {
  83. this.items[i].toggle(open && open[i]);
  84. }
  85. },
  86. panelClick: function panelClick(uid) {
  87. var open = this.expand ? this.open.slice() : Array(this.items.length).fill(false);
  88. for (var i = 0; i < this.items.length; i++) {
  89. if (this.items[i]._uid === uid) {
  90. open[i] = !this.open[i];
  91. !this.expand && this.$emit('input', open[i] ? i : null);
  92. }
  93. }
  94. this.updatePanels(open);
  95. if (this.expand) this.$emit('input', open);
  96. },
  97. register: function register(content) {
  98. var i = this.items.push(content) - 1;
  99. this.value !== null && this.updateFromValue(this.value);
  100. content.toggle(!!this.open[i]);
  101. },
  102. unregister: function unregister(content) {
  103. var index = this.items.findIndex(function (i) {
  104. return i._uid === content._uid;
  105. });
  106. this.items.splice(index, 1);
  107. this.open.splice(index, 1);
  108. }
  109. },
  110. render: function render(h) {
  111. return h('ul', {
  112. staticClass: 'v-expansion-panel',
  113. class: this.classes
  114. }, this.$slots.default);
  115. }
  116. });
  117. //# sourceMappingURL=VExpansionPanel.js.map