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.

VSwitch.js 3.5KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104
  1. 'use strict';
  2. Object.defineProperty(exports, "__esModule", {
  3. value: true
  4. });
  5. 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; };
  6. // Mixins
  7. // Directives
  8. // Components
  9. // Helpers
  10. require('../../../src/stylus/components/_selection-controls.styl');
  11. require('../../../src/stylus/components/_switch.styl');
  12. var _selectable = require('../../mixins/selectable');
  13. var _selectable2 = _interopRequireDefault(_selectable);
  14. var _touch = require('../../directives/touch');
  15. var _touch2 = _interopRequireDefault(_touch);
  16. var _transitions = require('../transitions');
  17. var _VProgressCircular = require('../VProgressCircular/VProgressCircular');
  18. var _VProgressCircular2 = _interopRequireDefault(_VProgressCircular);
  19. var _helpers = require('../../util/helpers');
  20. function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
  21. /* @vue/component */
  22. exports.default = {
  23. name: 'v-switch',
  24. directives: { Touch: _touch2.default },
  25. mixins: [_selectable2.default],
  26. props: {
  27. loading: {
  28. type: [Boolean, String],
  29. default: false
  30. }
  31. },
  32. computed: {
  33. classes: function classes() {
  34. return {
  35. 'v-input--selection-controls v-input--switch': true
  36. };
  37. },
  38. switchData: function switchData() {
  39. return this.setTextColor(this.loading ? undefined : this.computedColor, {
  40. class: this.themeClasses
  41. });
  42. }
  43. },
  44. methods: {
  45. genDefaultSlot: function genDefaultSlot() {
  46. return [this.genSwitch(), this.genLabel()];
  47. },
  48. genSwitch: function genSwitch() {
  49. return this.$createElement('div', {
  50. staticClass: 'v-input--selection-controls__input'
  51. }, [this.genInput('checkbox', this.$attrs), this.genRipple(this.setTextColor(this.computedColor, {
  52. directives: [{
  53. name: 'touch',
  54. value: {
  55. left: this.onSwipeLeft,
  56. right: this.onSwipeRight
  57. }
  58. }]
  59. })), this.$createElement('div', _extends({
  60. staticClass: 'v-input--switch__track'
  61. }, this.switchData)), this.$createElement('div', _extends({
  62. staticClass: 'v-input--switch__thumb'
  63. }, this.switchData), [this.genProgress()])]);
  64. },
  65. genProgress: function genProgress() {
  66. return this.$createElement(_transitions.VFabTransition, {}, [this.loading === false ? null : this.$slots.progress || this.$createElement(_VProgressCircular2.default, {
  67. props: {
  68. color: this.loading === true || this.loading === '' ? this.color || 'primary' : this.loading,
  69. size: 16,
  70. width: 2,
  71. indeterminate: true
  72. }
  73. })]);
  74. },
  75. onSwipeLeft: function onSwipeLeft() {
  76. if (this.isActive) this.onChange();
  77. },
  78. onSwipeRight: function onSwipeRight() {
  79. if (!this.isActive) this.onChange();
  80. },
  81. onKeydown: function onKeydown(e) {
  82. if (e.keyCode === _helpers.keyCodes.left && this.isActive || e.keyCode === _helpers.keyCodes.right && !this.isActive) this.onChange();
  83. }
  84. }
  85. };
  86. //# sourceMappingURL=VSwitch.js.map