koha-tmpl/intranet-tmpl/prog/js/vue/components/ERM/Breadcrumb.vue

   1 <template>
   2     <nav id="breadcrumbs" aria-label="Breadcrumb" class="breadcrumb">
   3         <ol>
   4             <li v-for="(item, counter) in breadCrumbs" v-bind:key="counter">
   5                 <router-link
   6                     v-if="!item.path && counter == breadCrumbs.length - 1"
   7                     :to="`${currentRoute}`"
   8                 >
   9                     {{ $__(item.text) }}</router-link
  10                 >
  11                 <router-link v-else-if="item.path" :to="item.path">
  12                     {{ $__(item.text) }}</router-link
  13                 >
  14                 <a v-else class="disabled"> {{ $__(item.text) }}</a>
  15             </li>
  16         </ol>
  17     </nav>
  18 </template>
  19
  20 <script>
  21 import { useRouter } from "vue-router"
  22 export default {
  23     computed: {
  24         breadCrumbs() {
  25             if (this.$route.meta.breadcrumb) {
  26                 return this.$route.meta.breadcrumb()
  27             }
  28         },
  29         currentRoute() {
  30             return this.$route.path
  31         },
  32     },
  33 }
  34 </script>
  35
  36 <style scoped>
  37 a.disabled {
  38     padding: 0.6em 0.3em;
  39     text-decoration: none;
  40     color: #000;
  41 }
  42 </style>