<template>
    <ul class="nav justify-content-between">
        <li class="nav-item">
            <a class="nav-link" title="Zobraziť predchádzajúcu sekciu" :href="navigacia.predchadzajucaUrl">
                <i class="fa fa-2x fa-arrow-left"></i>
            </a>
        </li>
        <li class="nav-item">
            <a class="nav-link" title="Zobraziť nadradenú sekciu" :href="navigacia.rodicUrl">
                <i class="fa fa-2x fa-arrow-up"></i>
            </a>
        </li>
        <li class="nav-item">
            <a class="nav-link" title="Zobraziť nasledujúcu sekciu" :href="navigacia.nasledujucaUrl">
                <i class="fa fa-2x fa-arrow-right"></i>
            </a>
        </li>
    </ul>
</template>

<script>
  export default {
    name: 'NavigaciaComponent',
    props: {
      sekcia: {
        required: true,
        type: Object,
        default: function () {
          return {
            nazov: null,
          }
        },
      },
      navigacia: {
        type: Object,
        default: function () {
          return {
            predchadzajucaUrl: null,
            rodicUrl: null,
            nasledujucaUrl: null,
          }
        },
      },
    },
    methods: {
      isRoot () {
        return this.sekcia.parent_id === null
      },
      isLeaf () {
        return this.sekcia._lft + 1 === this.sekcia._rgt
      },
    },
  }
</script>

<style scoped>

</style>