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.

VDatePickerHeader.js 5.4KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134
  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. 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"); } }; }();
  3. import '../../../src/stylus/components/_date-picker-header.styl';
  4. // Components
  5. import VBtn from '../VBtn';
  6. import VIcon from '../VIcon';
  7. // Mixins
  8. import Colorable from '../../mixins/colorable';
  9. import Themeable from '../../mixins/themeable';
  10. // Utils
  11. import { createNativeLocaleFormatter, monthChange } from './util';
  12. import mixins from '../../util/mixins';
  13. export default mixins(Colorable, Themeable
  14. /* @vue/component */
  15. ).extend({
  16. name: 'v-date-picker-header',
  17. props: {
  18. disabled: Boolean,
  19. format: Function,
  20. locale: {
  21. type: String,
  22. default: 'en-us'
  23. },
  24. min: String,
  25. max: String,
  26. nextIcon: {
  27. type: String,
  28. default: '$vuetify.icons.next'
  29. },
  30. prevIcon: {
  31. type: String,
  32. default: '$vuetify.icons.prev'
  33. },
  34. readonly: Boolean,
  35. value: {
  36. type: [Number, String],
  37. required: true
  38. }
  39. },
  40. data: function data() {
  41. return {
  42. isReversing: false
  43. };
  44. },
  45. computed: {
  46. formatter: function formatter() {
  47. if (this.format) {
  48. return this.format;
  49. } else if (String(this.value).split('-')[1]) {
  50. return createNativeLocaleFormatter(this.locale, { month: 'long', year: 'numeric', timeZone: 'UTC' }, { length: 7 });
  51. } else {
  52. return createNativeLocaleFormatter(this.locale, { year: 'numeric', timeZone: 'UTC' }, { length: 4 });
  53. }
  54. }
  55. },
  56. watch: {
  57. value: function value(newVal, oldVal) {
  58. this.isReversing = newVal < oldVal;
  59. }
  60. },
  61. methods: {
  62. genBtn: function genBtn(change) {
  63. var _this = this;
  64. var disabled = this.disabled || change < 0 && this.min && this.calculateChange(change) < this.min || change > 0 && this.max && this.calculateChange(change) > this.max;
  65. return this.$createElement(VBtn, {
  66. props: {
  67. dark: this.dark,
  68. disabled: disabled,
  69. icon: true,
  70. light: this.light
  71. },
  72. nativeOn: {
  73. click: function click(e) {
  74. e.stopPropagation();
  75. _this.$emit('input', _this.calculateChange(change));
  76. }
  77. }
  78. }, [this.$createElement(VIcon, change < 0 === !this.$vuetify.rtl ? this.prevIcon : this.nextIcon)]);
  79. },
  80. calculateChange: function calculateChange(sign) {
  81. var _String$split$map = String(this.value).split('-').map(Number),
  82. _String$split$map2 = _slicedToArray(_String$split$map, 2),
  83. year = _String$split$map2[0],
  84. month = _String$split$map2[1];
  85. if (month == null) {
  86. return '' + (year + sign);
  87. } else {
  88. return monthChange(String(this.value), sign);
  89. }
  90. },
  91. genHeader: function genHeader() {
  92. var _this2 = this;
  93. var color = !this.disabled && (this.color || 'accent');
  94. var header = this.$createElement('div', this.setTextColor(color, {
  95. key: String(this.value)
  96. }), [this.$createElement('button', {
  97. attrs: {
  98. type: 'button'
  99. },
  100. on: {
  101. click: function click() {
  102. return _this2.$emit('toggle');
  103. }
  104. }
  105. }, [this.$slots.default || this.formatter(String(this.value))])]);
  106. var transition = this.$createElement('transition', {
  107. props: {
  108. name: this.isReversing === !this.$vuetify.rtl ? 'tab-reverse-transition' : 'tab-transition'
  109. }
  110. }, [header]);
  111. return this.$createElement('div', {
  112. staticClass: 'v-date-picker-header__value',
  113. class: {
  114. 'v-date-picker-header__value--disabled': this.disabled
  115. }
  116. }, [transition]);
  117. }
  118. },
  119. render: function render() {
  120. return this.$createElement('div', {
  121. staticClass: 'v-date-picker-header',
  122. class: _extends({
  123. 'v-date-picker-header--disabled': this.disabled
  124. }, this.themeClasses)
  125. }, [this.genBtn(-1), this.genHeader(), this.genBtn(+1)]);
  126. }
  127. });
  128. //# sourceMappingURL=VDatePickerHeader.js.map