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.

data-iterable.js 20KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503
  1. 'use strict';
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. var _slicedToArray = function () { function sliceIterator(arr, i) { var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"]) _i["return"](); } finally { if (_d) throw _e; } } return _arr; } return function (arr, i) { if (Array.isArray(arr)) { return arr; } else if (Symbol.iterator in Object(arr)) { return sliceIterator(arr, i); } else { throw new TypeError("Invalid attempt to destructure non-iterable instance"); } }; }();
  6. var _VBtn = require('../components/VBtn');
  7. var _VBtn2 = _interopRequireDefault(_VBtn);
  8. var _VIcon = require('../components/VIcon');
  9. var _VIcon2 = _interopRequireDefault(_VIcon);
  10. var _VSelect = require('../components/VSelect');
  11. var _VSelect2 = _interopRequireDefault(_VSelect);
  12. var _filterable = require('./filterable');
  13. var _filterable2 = _interopRequireDefault(_filterable);
  14. var _themeable = require('./themeable');
  15. var _themeable2 = _interopRequireDefault(_themeable);
  16. var _loadable = require('./loadable');
  17. var _loadable2 = _interopRequireDefault(_loadable);
  18. var _helpers = require('../util/helpers');
  19. var _console = require('../util/console');
  20. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  21. function _toConsumableArray(arr) { if (Array.isArray(arr)) { for (var i = 0, arr2 = Array(arr.length); i < arr.length; i++) { arr2[i] = arr[i]; } return arr2; } else { return Array.from(arr); } }
  22. /**
  23. * DataIterable
  24. *
  25. * @mixin
  26. *
  27. * Base behavior for data table and data iterator
  28. * providing selection, pagination, sorting and filtering.
  29. *
  30. */
  31. /* @vue/component */
  32. exports.default = {
  33. name: 'data-iterable',
  34. mixins: [_filterable2.default, _loadable2.default, _themeable2.default],
  35. props: {
  36. expand: Boolean,
  37. hideActions: Boolean,
  38. disableInitialSort: Boolean,
  39. mustSort: Boolean,
  40. noResultsText: {
  41. type: String,
  42. default: '$vuetify.dataIterator.noResultsText'
  43. },
  44. nextIcon: {
  45. type: String,
  46. default: '$vuetify.icons.next'
  47. },
  48. prevIcon: {
  49. type: String,
  50. default: '$vuetify.icons.prev'
  51. },
  52. rowsPerPageItems: {
  53. type: Array,
  54. default: function _default() {
  55. return [5, 10, 25, {
  56. text: '$vuetify.dataIterator.rowsPerPageAll',
  57. value: -1
  58. }];
  59. }
  60. },
  61. rowsPerPageText: {
  62. type: String,
  63. default: '$vuetify.dataIterator.rowsPerPageText'
  64. },
  65. selectAll: [Boolean, String],
  66. search: {
  67. required: false
  68. },
  69. filter: {
  70. type: Function,
  71. default: function _default(val, search) {
  72. return val != null && typeof val !== 'boolean' && val.toString().toLowerCase().indexOf(search) !== -1;
  73. }
  74. },
  75. customFilter: {
  76. type: Function,
  77. default: function _default(items, search, filter) {
  78. search = search.toString().toLowerCase();
  79. if (search.trim() === '') return items;
  80. return items.filter(function (i) {
  81. return Object.keys(i).some(function (j) {
  82. return filter(i[j], search);
  83. });
  84. });
  85. }
  86. },
  87. customSort: {
  88. type: Function,
  89. default: function _default(items, index, isDescending) {
  90. if (index === null) return items;
  91. return items.sort(function (a, b) {
  92. var sortA = (0, _helpers.getObjectValueByPath)(a, index);
  93. var sortB = (0, _helpers.getObjectValueByPath)(b, index);
  94. if (isDescending) {
  95. var _ref = [sortB, sortA];
  96. sortA = _ref[0];
  97. sortB = _ref[1];
  98. }
  99. // Check if both are numbers
  100. if (!isNaN(sortA) && !isNaN(sortB)) {
  101. return sortA - sortB;
  102. }
  103. // Check if both cannot be evaluated
  104. if (sortA === null && sortB === null) {
  105. return 0;
  106. }
  107. var _map = [sortA, sortB].map(function (s) {
  108. return (s || '').toString().toLocaleLowerCase();
  109. });
  110. var _map2 = _slicedToArray(_map, 2);
  111. sortA = _map2[0];
  112. sortB = _map2[1];
  113. if (sortA > sortB) return 1;
  114. if (sortA < sortB) return -1;
  115. return 0;
  116. });
  117. }
  118. },
  119. value: {
  120. type: Array,
  121. default: function _default() {
  122. return [];
  123. }
  124. },
  125. items: {
  126. type: Array,
  127. required: true,
  128. default: function _default() {
  129. return [];
  130. }
  131. },
  132. totalItems: {
  133. type: Number,
  134. default: null
  135. },
  136. itemKey: {
  137. type: String,
  138. default: 'id'
  139. },
  140. pagination: {
  141. type: Object,
  142. default: function _default() {}
  143. }
  144. },
  145. data: function data() {
  146. return {
  147. searchLength: 0,
  148. defaultPagination: {
  149. descending: false,
  150. page: 1,
  151. rowsPerPage: 5,
  152. sortBy: null,
  153. totalItems: 0
  154. },
  155. expanded: {},
  156. actionsClasses: 'v-data-iterator__actions',
  157. actionsRangeControlsClasses: 'v-data-iterator__actions__range-controls',
  158. actionsSelectClasses: 'v-data-iterator__actions__select',
  159. actionsPaginationClasses: 'v-data-iterator__actions__pagination'
  160. };
  161. },
  162. computed: {
  163. computedPagination: function computedPagination() {
  164. return this.hasPagination ? this.pagination : this.defaultPagination;
  165. },
  166. computedRowsPerPageItems: function computedRowsPerPageItems() {
  167. var _this = this;
  168. return this.rowsPerPageItems.map(function (item) {
  169. return (0, _helpers.isObject)(item) ? Object.assign({}, item, {
  170. text: _this.$vuetify.t(item.text)
  171. }) : { value: item, text: Number(item).toLocaleString(_this.$vuetify.lang.current) };
  172. });
  173. },
  174. hasPagination: function hasPagination() {
  175. var pagination = this.pagination || {};
  176. return Object.keys(pagination).length > 0;
  177. },
  178. hasSelectAll: function hasSelectAll() {
  179. return this.selectAll !== undefined && this.selectAll !== false;
  180. },
  181. itemsLength: function itemsLength() {
  182. if (this.hasSearch) return this.searchLength;
  183. return this.totalItems || this.items.length;
  184. },
  185. indeterminate: function indeterminate() {
  186. return this.hasSelectAll && this.someItems && !this.everyItem;
  187. },
  188. everyItem: function everyItem() {
  189. var _this2 = this;
  190. return this.filteredItems.length && this.filteredItems.every(function (i) {
  191. return _this2.isSelected(i);
  192. });
  193. },
  194. someItems: function someItems() {
  195. var _this3 = this;
  196. return this.filteredItems.some(function (i) {
  197. return _this3.isSelected(i);
  198. });
  199. },
  200. getPage: function getPage() {
  201. var rowsPerPage = this.computedPagination.rowsPerPage;
  202. return rowsPerPage === Object(rowsPerPage) ? rowsPerPage.value : rowsPerPage;
  203. },
  204. pageStart: function pageStart() {
  205. return this.getPage === -1 ? 0 : (this.computedPagination.page - 1) * this.getPage;
  206. },
  207. pageStop: function pageStop() {
  208. return this.getPage === -1 ? this.itemsLength : this.computedPagination.page * this.getPage;
  209. },
  210. filteredItems: function filteredItems() {
  211. return this.filteredItemsImpl();
  212. },
  213. selected: function selected() {
  214. var selected = {};
  215. for (var index = 0; index < this.value.length; index++) {
  216. var key = (0, _helpers.getObjectValueByPath)(this.value[index], this.itemKey);
  217. selected[key] = true;
  218. }
  219. return selected;
  220. },
  221. hasSearch: function hasSearch() {
  222. return this.search != null;
  223. }
  224. },
  225. watch: {
  226. items: function items() {
  227. var _this4 = this;
  228. if (this.pageStart >= this.itemsLength) {
  229. this.resetPagination();
  230. }
  231. var newItemKeys = new Set(this.items.map(function (item) {
  232. return (0, _helpers.getObjectValueByPath)(item, _this4.itemKey);
  233. }));
  234. var selection = this.value.filter(function (item) {
  235. return newItemKeys.has((0, _helpers.getObjectValueByPath)(item, _this4.itemKey));
  236. });
  237. if (selection.length !== this.value.length) {
  238. this.$emit('input', selection);
  239. }
  240. },
  241. search: function search() {
  242. var _this5 = this;
  243. this.$nextTick(function () {
  244. _this5.updatePagination({ page: 1, totalItems: _this5.itemsLength });
  245. });
  246. },
  247. 'computedPagination.sortBy': 'resetPagination',
  248. 'computedPagination.descending': 'resetPagination'
  249. },
  250. methods: {
  251. initPagination: function initPagination() {
  252. if (!this.rowsPerPageItems.length) {
  253. (0, _console.consoleWarn)('The prop \'rows-per-page-items\' can not be empty', this);
  254. } else {
  255. this.defaultPagination.rowsPerPage = this.rowsPerPageItems[0];
  256. }
  257. this.defaultPagination.totalItems = this.items.length;
  258. this.updatePagination(Object.assign({}, this.defaultPagination, this.pagination));
  259. },
  260. updatePagination: function updatePagination(val) {
  261. var pagination = this.hasPagination ? this.pagination : this.defaultPagination;
  262. var updatedPagination = Object.assign({}, pagination, val);
  263. this.$emit('update:pagination', updatedPagination);
  264. if (!this.hasPagination) {
  265. this.defaultPagination = updatedPagination;
  266. }
  267. },
  268. isSelected: function isSelected(item) {
  269. return this.selected[(0, _helpers.getObjectValueByPath)(item, this.itemKey)];
  270. },
  271. isExpanded: function isExpanded(item) {
  272. return this.expanded[(0, _helpers.getObjectValueByPath)(item, this.itemKey)];
  273. },
  274. filteredItemsImpl: function filteredItemsImpl() {
  275. if (this.totalItems) return this.items;
  276. var items = this.items.slice();
  277. if (this.hasSearch) {
  278. for (var _len = arguments.length, additionalFilterArgs = Array(_len), _key = 0; _key < _len; _key++) {
  279. additionalFilterArgs[_key] = arguments[_key];
  280. }
  281. items = this.customFilter.apply(this, [items, this.search, this.filter].concat(_toConsumableArray(additionalFilterArgs)));
  282. this.searchLength = items.length;
  283. }
  284. items = this.customSort(items, this.computedPagination.sortBy, this.computedPagination.descending);
  285. return this.hideActions && !this.hasPagination ? items : items.slice(this.pageStart, this.pageStop);
  286. },
  287. resetPagination: function resetPagination() {
  288. this.computedPagination.page !== 1 && this.updatePagination({ page: 1 });
  289. },
  290. sort: function sort(index) {
  291. var _computedPagination = this.computedPagination,
  292. sortBy = _computedPagination.sortBy,
  293. descending = _computedPagination.descending;
  294. if (sortBy === null) {
  295. this.updatePagination({ sortBy: index, descending: false });
  296. } else if (sortBy === index && !descending) {
  297. this.updatePagination({ descending: true });
  298. } else if (sortBy !== index) {
  299. this.updatePagination({ sortBy: index, descending: false });
  300. } else if (!this.mustSort) {
  301. this.updatePagination({ sortBy: null, descending: null });
  302. } else {
  303. this.updatePagination({ sortBy: index, descending: false });
  304. }
  305. },
  306. toggle: function toggle(value) {
  307. var _this6 = this;
  308. var selected = Object.assign({}, this.selected);
  309. for (var index = 0; index < this.filteredItems.length; index++) {
  310. var key = (0, _helpers.getObjectValueByPath)(this.filteredItems[index], this.itemKey);
  311. selected[key] = value;
  312. }
  313. this.$emit('input', this.items.filter(function (i) {
  314. var key = (0, _helpers.getObjectValueByPath)(i, _this6.itemKey);
  315. return selected[key];
  316. }));
  317. },
  318. createProps: function createProps(item, index) {
  319. var _this7 = this;
  320. var props = { item: item, index: index };
  321. var keyProp = this.itemKey;
  322. var itemKey = (0, _helpers.getObjectValueByPath)(item, keyProp);
  323. Object.defineProperty(props, 'selected', {
  324. get: function get() {
  325. return _this7.selected[itemKey];
  326. },
  327. set: function set(value) {
  328. if (itemKey == null) {
  329. (0, _console.consoleWarn)('"' + keyProp + '" attribute must be defined for item', _this7);
  330. }
  331. var selected = _this7.value.slice();
  332. if (value) selected.push(item);else selected = selected.filter(function (i) {
  333. return (0, _helpers.getObjectValueByPath)(i, keyProp) !== itemKey;
  334. });
  335. _this7.$emit('input', selected);
  336. }
  337. });
  338. Object.defineProperty(props, 'expanded', {
  339. get: function get() {
  340. return _this7.expanded[itemKey];
  341. },
  342. set: function set(value) {
  343. if (itemKey == null) {
  344. (0, _console.consoleWarn)('"' + keyProp + '" attribute must be defined for item', _this7);
  345. }
  346. if (!_this7.expand) {
  347. for (var key in _this7.expanded) {
  348. _this7.expanded.hasOwnProperty(key) && _this7.$set(_this7.expanded, key, false);
  349. }
  350. }
  351. _this7.$set(_this7.expanded, itemKey, value);
  352. }
  353. });
  354. return props;
  355. },
  356. genItems: function genItems() {
  357. if (!this.itemsLength && !this.items.length) {
  358. var noData = this.$slots['no-data'] || this.$vuetify.t(this.noDataText);
  359. return [this.genEmptyItems(noData)];
  360. }
  361. if (!this.filteredItems.length) {
  362. var noResults = this.$slots['no-results'] || this.$vuetify.t(this.noResultsText);
  363. return [this.genEmptyItems(noResults)];
  364. }
  365. return this.genFilteredItems();
  366. },
  367. genPrevIcon: function genPrevIcon() {
  368. var _this8 = this;
  369. return this.$createElement(_VBtn2.default, {
  370. props: {
  371. disabled: this.computedPagination.page === 1,
  372. icon: true,
  373. flat: true
  374. },
  375. on: {
  376. click: function click() {
  377. var page = _this8.computedPagination.page;
  378. _this8.updatePagination({ page: page - 1 });
  379. }
  380. },
  381. attrs: {
  382. 'aria-label': this.$vuetify.t('$vuetify.dataIterator.prevPage')
  383. }
  384. }, [this.$createElement(_VIcon2.default, this.$vuetify.rtl ? this.nextIcon : this.prevIcon)]);
  385. },
  386. genNextIcon: function genNextIcon() {
  387. var _this9 = this;
  388. var pagination = this.computedPagination;
  389. var disabled = pagination.rowsPerPage < 0 || pagination.page * pagination.rowsPerPage >= this.itemsLength || this.pageStop < 0;
  390. return this.$createElement(_VBtn2.default, {
  391. props: {
  392. disabled: disabled,
  393. icon: true,
  394. flat: true
  395. },
  396. on: {
  397. click: function click() {
  398. var page = _this9.computedPagination.page;
  399. _this9.updatePagination({ page: page + 1 });
  400. }
  401. },
  402. attrs: {
  403. 'aria-label': this.$vuetify.t('$vuetify.dataIterator.nextPage')
  404. }
  405. }, [this.$createElement(_VIcon2.default, this.$vuetify.rtl ? this.prevIcon : this.nextIcon)]);
  406. },
  407. genSelect: function genSelect() {
  408. var _this10 = this;
  409. return this.$createElement('div', {
  410. 'class': this.actionsSelectClasses
  411. }, [this.$vuetify.t(this.rowsPerPageText), this.$createElement(_VSelect2.default, {
  412. attrs: {
  413. 'aria-label': this.$vuetify.t(this.rowsPerPageText)
  414. },
  415. props: {
  416. items: this.computedRowsPerPageItems,
  417. value: this.computedPagination.rowsPerPage,
  418. hideDetails: true,
  419. menuProps: {
  420. auto: true,
  421. dark: this.dark,
  422. light: this.light,
  423. minWidth: '75px'
  424. }
  425. },
  426. on: {
  427. input: function input(val) {
  428. _this10.updatePagination({
  429. page: 1,
  430. rowsPerPage: val
  431. });
  432. }
  433. }
  434. })]);
  435. },
  436. genPagination: function genPagination() {
  437. var _this11 = this;
  438. var pagination = '–';
  439. if (this.itemsLength) {
  440. var _$vuetify;
  441. var stop = this.itemsLength < this.pageStop || this.pageStop < 0 ? this.itemsLength : this.pageStop;
  442. pagination = this.$scopedSlots.pageText ? this.$scopedSlots.pageText({
  443. pageStart: this.pageStart + 1,
  444. pageStop: stop,
  445. itemsLength: this.itemsLength
  446. }) : (_$vuetify = this.$vuetify).t.apply(_$vuetify, ['$vuetify.dataIterator.pageText'].concat(_toConsumableArray([this.pageStart + 1, stop, this.itemsLength].map(function (n) {
  447. return Number(n).toLocaleString(_this11.$vuetify.lang.current);
  448. }))));
  449. }
  450. return this.$createElement('div', {
  451. 'class': this.actionsPaginationClasses
  452. }, [pagination]);
  453. },
  454. genActions: function genActions() {
  455. var rangeControls = this.$createElement('div', {
  456. 'class': this.actionsRangeControlsClasses
  457. }, [this.genPagination(), this.genPrevIcon(), this.genNextIcon()]);
  458. return [this.$createElement('div', {
  459. 'class': this.actionsClasses
  460. }, [this.$slots['actions-prepend'] ? this.$createElement('div', {}, this.$slots['actions-prepend']) : null, this.rowsPerPageItems.length > 1 ? this.genSelect() : null, rangeControls, this.$slots['actions-append'] ? this.$createElement('div', {}, this.$slots['actions-append']) : null])];
  461. }
  462. }
  463. };
  464. //# sourceMappingURL=data-iterable.js.map