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.

VBottomNav.js 2.0KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263
  1. // Styles
  2. import '../../../src/stylus/components/_bottom-navs.styl';
  3. // Mixins
  4. import Applicationable from '../../mixins/applicationable';
  5. import ButtonGroup from '../../mixins/button-group';
  6. import Colorable from '../../mixins/colorable';
  7. import Themeable from '../../mixins/themeable';
  8. // Util
  9. import mixins from '../../util/mixins';
  10. export default mixins(Applicationable('bottom', ['height', 'value']), Colorable, Themeable
  11. /* @vue/component */
  12. ).extend({
  13. name: 'v-bottom-nav',
  14. props: {
  15. active: [Number, String],
  16. mandatory: Boolean,
  17. height: {
  18. default: 56,
  19. type: [Number, String],
  20. validator: function validator(v) {
  21. return !isNaN(parseInt(v));
  22. }
  23. },
  24. shift: Boolean,
  25. value: null
  26. },
  27. computed: {
  28. classes: function classes() {
  29. return {
  30. 'v-bottom-nav--absolute': this.absolute,
  31. 'v-bottom-nav--fixed': !this.absolute && (this.app || this.fixed),
  32. 'v-bottom-nav--shift': this.shift,
  33. 'v-bottom-nav--active': this.value
  34. };
  35. },
  36. computedHeight: function computedHeight() {
  37. return parseInt(this.height);
  38. }
  39. },
  40. methods: {
  41. updateApplication: function updateApplication() {
  42. return !this.value ? 0 : this.computedHeight;
  43. },
  44. updateValue: function updateValue(val) {
  45. this.$emit('update:active', val);
  46. }
  47. },
  48. render: function render(h) {
  49. return h(ButtonGroup, this.setBackgroundColor(this.color, {
  50. staticClass: 'v-bottom-nav',
  51. class: this.classes,
  52. style: {
  53. height: parseInt(this.computedHeight) + 'px'
  54. },
  55. props: {
  56. mandatory: Boolean(this.mandatory || this.active !== undefined),
  57. value: this.active
  58. },
  59. on: { change: this.updateValue }
  60. }), this.$slots.default);
  61. }
  62. });
  63. //# sourceMappingURL=VBottomNav.js.map