mirror of
https://github.com/YunoHost/yunohost-admin.git
synced 2024-09-03 20:06:15 +02:00
52 lines
1.2 KiB
Vue
52 lines
1.2 KiB
Vue
<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.text }}
|
|
</b-breadcrumb-item>
|
|
</b-breadcrumb>
|
|
</template>
|
|
|
|
<script>
|
|
export default {
|
|
name: 'Breadcrumb',
|
|
computed: {
|
|
params: function () {
|
|
return this.$route.params
|
|
},
|
|
breadcrumb: function () {
|
|
return this.$route.meta.breadcrumb.map(({ name, trad, param }) => {
|
|
let text = ''
|
|
// if a traduction key string has been given and we also need to pass
|
|
// the route param as a variable.
|
|
if (trad && param) {
|
|
text = this.$i18n.t(trad, { [param]: this.params[param] })
|
|
} else if (trad) {
|
|
text = this.$i18n.t(trad)
|
|
} else {
|
|
text = this.params[param]
|
|
}
|
|
return { name, text }
|
|
})
|
|
},
|
|
lastIndex: function () {
|
|
return this.breadcrumb.length - 1
|
|
}
|
|
}
|
|
}
|
|
</script>
|
|
|
|
<style lang="scss" scoped>
|
|
.breadcrumb {
|
|
border: none;
|
|
background-color: transparent;
|
|
}
|
|
</style>
|