add generic breadcrumb with data stored in routes's meta

This commit is contained in:
Axolotle 2020-07-14 19:49:49 +02:00
parent a0eabf36a8
commit 1278e1e1d3
2 changed files with 41 additions and 2 deletions
app/src

View file

@ -0,0 +1,37 @@
<template>
<b-breadcrumb>
<b-breadcrumb-item to="/">
<span class="sr-only">{{ $t('home') }}</span>
<icon iname="home"/>
</b-breadcrumb-item>
<b-breadcrumb-item
v-for="(route, index) in breadcrumb"
:key="index"
:to="{name: route.name}"
:active="index == lastIndex ? true : false"
>{{ route.trad ? $t(route.trad) : params[route.param] }}</b-breadcrumb-item>
</b-breadcrumb>
</template>
<script>
export default {
computed: {
params: function () {
return this.$route.params
},
breadcrumb: function () {
return this.$route.meta.breadcrumb
},
lastIndex: function () {
return this.breadcrumb.length - 1
},
},
}
</script>
<style lang="scss" scoped>
.breadcrumb {
border: none;
background-color: transparent;
}
</style>

View file

@ -3,8 +3,10 @@ import Login from './views/Login'
const routes = [
{path: '/', component: Home},
{path: '/login', component: Login, meta: {noAuth: true}},
{name: 'home', path: '/', component: Home},
{name: 'login', path: '/login', component: Login, meta: {
noAuth: true
}},
]
export default routes