All files / src Navigation.vue

100% Statements 22/22
75% Branches 9/12
100% Functions 8/8
100% Lines 13/13
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 423x     3x     3x     5x             7x     7x         2x 1x   1x           3x 3x 7x 3x          
<template>
  <div class="navigation">
    <a href="#" class="next" v-on:click.prevent="triggerPageAdvance()" v-bind:class="{ disabled: !canAdvanceBackward }">Prev</a>
    <a href="#" class="prev" v-on:click.prevent="triggerPageAdvance('backward')" v-bind:class="{ disabled: !canAdvanceForward }">Next</a>
  </div>
</template>
 
<script>
  export default {
    name: "navigation",
    data() {
      return {
        parentContainer: this.$parent,
      }
    },
    computed: {
      canAdvanceForward() {
        return this.parentContainer.canAdvanceForward || false
      },
      canAdvanceBackward() {
        return this.parentContainer.canAdvanceBackward || false
      },
    },
    methods: {
      triggerPageAdvance(direction) {
        if (direction) {
          this.$parent.advancePage(direction)
        } else {
          this.$parent.advancePage()
        }
      },
    },
  }
E</script>

<style scoped>
  .disabled {
    opacity: 0.5;
    cursor: default;
  }
</style>