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.

VStepper.js 3.5KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107
  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. // Styles
  3. import '../../../src/stylus/components/_steppers.styl';
  4. // Mixins
  5. import { provide as RegistrableProvide } from '../../mixins/registrable';
  6. import Themeable from '../../mixins/themeable';
  7. // Util
  8. import mixins from '../../util/mixins';
  9. export default mixins(RegistrableProvide('stepper'), Themeable
  10. /* @vue/component */
  11. ).extend({
  12. name: 'v-stepper',
  13. provide: function provide() {
  14. return {
  15. stepClick: this.stepClick,
  16. isVertical: this.vertical
  17. };
  18. },
  19. props: {
  20. nonLinear: Boolean,
  21. altLabels: Boolean,
  22. vertical: Boolean,
  23. value: [Number, String]
  24. },
  25. data: function data() {
  26. return {
  27. inputValue: null,
  28. isBooted: false,
  29. steps: [],
  30. content: [],
  31. isReverse: false
  32. };
  33. },
  34. computed: {
  35. classes: function classes() {
  36. return _extends({
  37. 'v-stepper': true,
  38. 'v-stepper--is-booted': this.isBooted,
  39. 'v-stepper--vertical': this.vertical,
  40. 'v-stepper--alt-labels': this.altLabels,
  41. 'v-stepper--non-linear': this.nonLinear
  42. }, this.themeClasses);
  43. }
  44. },
  45. watch: {
  46. inputValue: function inputValue(val, prev) {
  47. this.isReverse = Number(val) < Number(prev);
  48. for (var index = this.steps.length; --index >= 0;) {
  49. this.steps[index].toggle(this.inputValue);
  50. }
  51. for (var _index = this.content.length; --_index >= 0;) {
  52. this.content[_index].toggle(this.inputValue, this.isReverse);
  53. }
  54. this.$emit('input', this.inputValue);
  55. prev && (this.isBooted = true);
  56. },
  57. value: function value() {
  58. var _this = this;
  59. this.$nextTick(function () {
  60. return _this.inputValue = _this.value;
  61. });
  62. }
  63. },
  64. mounted: function mounted() {
  65. this.inputValue = this.value || this.steps[0].step || 1;
  66. },
  67. methods: {
  68. register: function register(item) {
  69. if (item.$options.name === 'v-stepper-step') {
  70. this.steps.push(item);
  71. } else if (item.$options.name === 'v-stepper-content') {
  72. item.isVertical = this.vertical;
  73. this.content.push(item);
  74. }
  75. },
  76. unregister: function unregister(item) {
  77. if (item.$options.name === 'v-stepper-step') {
  78. this.steps = this.steps.filter(function (i) {
  79. return i !== item;
  80. });
  81. } else if (item.$options.name === 'v-stepper-content') {
  82. item.isVertical = this.vertical;
  83. this.content = this.content.filter(function (i) {
  84. return i !== item;
  85. });
  86. }
  87. },
  88. stepClick: function stepClick(step) {
  89. var _this2 = this;
  90. this.$nextTick(function () {
  91. return _this2.inputValue = step;
  92. });
  93. }
  94. },
  95. render: function render(h) {
  96. return h('div', {
  97. 'class': this.classes
  98. }, this.$slots.default);
  99. }
  100. });
  101. //# sourceMappingURL=VStepper.js.map