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.

VItemGroup.js 7.4KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211
  1. 'use strict';
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. exports.BaseItemGroup = undefined;
  6. 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; }; // Styles
  7. // Utilities
  8. require('../../../src/stylus/components/_item-group.styl');
  9. var _proxyable = require('../../mixins/proxyable');
  10. var _proxyable2 = _interopRequireDefault(_proxyable);
  11. var _themeable = require('../../mixins/themeable');
  12. var _themeable2 = _interopRequireDefault(_themeable);
  13. var _mixins = require('../../util/mixins');
  14. var _mixins2 = _interopRequireDefault(_mixins);
  15. var _console = require('../../util/console');
  16. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  17. var BaseItemGroup = exports.BaseItemGroup = (0, _mixins2.default)(_proxyable2.default, _themeable2.default).extend({
  18. name: 'base-item-group',
  19. props: {
  20. activeClass: {
  21. type: String,
  22. default: 'v-item--active'
  23. },
  24. mandatory: Boolean,
  25. max: {
  26. type: [Number, String],
  27. default: null
  28. },
  29. multiple: Boolean
  30. },
  31. data: function data() {
  32. return {
  33. // As long as a value is defined, show it
  34. // Otherwise, check if multiple
  35. // to determine which default to provide
  36. internalLazyValue: this.value !== undefined ? this.value : this.multiple ? [] : undefined,
  37. items: []
  38. };
  39. },
  40. computed: {
  41. classes: function classes() {
  42. return _extends({}, this.themeClasses);
  43. },
  44. selectedItems: function selectedItems() {
  45. var _this = this;
  46. return this.items.filter(function (item, index) {
  47. return _this.toggleMethod(_this.getValue(item, index));
  48. });
  49. },
  50. selectedValues: function selectedValues() {
  51. return Array.isArray(this.internalValue) ? this.internalValue : [this.internalValue];
  52. },
  53. toggleMethod: function toggleMethod() {
  54. var _this2 = this;
  55. if (!this.multiple) {
  56. return function (v) {
  57. return _this2.internalValue === v;
  58. };
  59. }
  60. var internalValue = this.internalValue;
  61. if (Array.isArray(internalValue)) {
  62. return function (v) {
  63. return internalValue.includes(v);
  64. };
  65. }
  66. return function () {
  67. return false;
  68. };
  69. }
  70. },
  71. watch: {
  72. internalValue: function internalValue() {
  73. // https://github.com/vuetifyjs/vuetify/issues/5352
  74. this.$nextTick(this.updateItemsState);
  75. }
  76. },
  77. created: function created() {
  78. if (this.multiple && !Array.isArray(this.internalValue)) {
  79. (0, _console.consoleWarn)('Model must be bound to an array if the multiple property is true.', this);
  80. }
  81. },
  82. methods: {
  83. getValue: function getValue(item, i) {
  84. return item.value == null || item.value === '' ? i : item.value;
  85. },
  86. onClick: function onClick(item, index) {
  87. this.updateInternalValue(this.getValue(item, index));
  88. },
  89. register: function register(item) {
  90. var _this3 = this;
  91. var index = this.items.push(item) - 1;
  92. item.$on('change', function () {
  93. return _this3.onClick(item, index);
  94. });
  95. // If no value provided and mandatory,
  96. // assign first registered item
  97. if (this.mandatory && this.internalLazyValue == null) {
  98. this.updateMandatory();
  99. }
  100. this.updateItem(item, index);
  101. },
  102. unregister: function unregister(item) {
  103. if (this._isDestroyed) return;
  104. var index = this.items.indexOf(item);
  105. var value = this.getValue(item, index);
  106. this.items.splice(index, 1);
  107. var valueIndex = this.selectedValues.indexOf(value);
  108. // Items is not selected, do nothing
  109. if (valueIndex < 0) return;
  110. // If not mandatory, use regular update process
  111. if (!this.mandatory) {
  112. return this.updateInternalValue(value);
  113. }
  114. // Remove the value
  115. if (this.multiple && Array.isArray(this.internalValue)) {
  116. this.internalValue = this.internalValue.filter(function (v) {
  117. return v !== value;
  118. });
  119. } else {
  120. this.internalValue = undefined;
  121. }
  122. // If mandatory and we have no selection
  123. // add the last item as value
  124. /* istanbul ignore else */
  125. if (!this.selectedItems.length) {
  126. this.updateMandatory(true);
  127. }
  128. },
  129. updateItem: function updateItem(item, index) {
  130. var value = this.getValue(item, index);
  131. item.isActive = this.toggleMethod(value);
  132. },
  133. updateItemsState: function updateItemsState() {
  134. if (this.mandatory && !this.selectedItems.length) {
  135. return this.updateMandatory();
  136. }
  137. // TODO: Make this smarter so it
  138. // doesn't have to iterate every
  139. // child in an update
  140. this.items.forEach(this.updateItem);
  141. },
  142. updateInternalValue: function updateInternalValue(value) {
  143. this.multiple ? this.updateMultiple(value) : this.updateSingle(value);
  144. },
  145. updateMandatory: function updateMandatory(last) {
  146. if (!this.items.length) return;
  147. var index = last ? this.items.length - 1 : 0;
  148. this.updateInternalValue(this.getValue(this.items[index], index));
  149. },
  150. updateMultiple: function updateMultiple(value) {
  151. var defaultValue = Array.isArray(this.internalValue) ? this.internalValue : [];
  152. var internalValue = defaultValue.slice();
  153. var index = internalValue.findIndex(function (val) {
  154. return val === value;
  155. });
  156. if (this.mandatory &&
  157. // Item already exists
  158. index > -1 &&
  159. // value would be reduced below min
  160. internalValue.length - 1 < 1) return;
  161. if (
  162. // Max is set
  163. this.max != null &&
  164. // Item doesn't exist
  165. index < 0 &&
  166. // value would be increased above max
  167. internalValue.length + 1 > this.max) return;
  168. index > -1 ? internalValue.splice(index, 1) : internalValue.push(value);
  169. this.internalValue = internalValue;
  170. },
  171. updateSingle: function updateSingle(value) {
  172. var isSame = value === this.internalValue;
  173. if (this.mandatory && isSame) return;
  174. this.internalValue = isSame ? undefined : value;
  175. }
  176. },
  177. render: function render(h) {
  178. return h('div', {
  179. staticClass: 'v-item-group',
  180. class: this.classes
  181. }, this.$slots.default);
  182. }
  183. });
  184. exports.default = BaseItemGroup.extend({
  185. name: 'v-item-group',
  186. provide: function provide() {
  187. return {
  188. itemGroup: this
  189. };
  190. }
  191. });
  192. //# sourceMappingURL=VItemGroup.js.map