You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
 
 
 
 
 
 

89 lines
2.4 KiB

<template>
<v-list dense>
<v-btn
color="ms-4 my-1 mb-2 primary text-capitalize"
nuxt
@click="toLabeling"
>
<v-icon left>
mdi-play-circle-outline
</v-icon>
{{ $t('home.startAnnotation') }}
</v-btn>
<v-list-item-group
v-model="selected"
mandatory
>
<v-list-item
v-for="(item, i) in filteredItems"
:key="i"
@click="$router.push(localePath(`/projects/${$route.params.id}/${item.link}`))"
>
<v-list-item-action>
<v-icon>
{{ item.icon }}
</v-icon>
</v-list-item-action>
<v-list-item-content>
<v-list-item-title>
{{ item.text }}
</v-list-item-title>
</v-list-item-content>
</v-list-item>
</v-list-item-group>
</v-list>
</template>
<script>
import { mapGetters } from 'vuex'
export default {
props: {
link: {
type: String,
default: '',
required: true
},
role: {
type: Object,
default: () => {},
required: true
}
},
data() {
return {
selected: 0
}
},
computed: {
...mapGetters('projects', ['loadSearchOptions']),
filteredItems() {
const items = [
{ icon: 'mdi-home', text: this.$t('projectHome.home'), link: '', adminOnly: false },
{ icon: 'mdi-database', text: this.$t('dataset.dataset'), link: 'dataset', adminOnly: true },
{ icon: 'label', text: this.$t('labels.labels'), link: 'labels', adminOnly: true },
{ icon: 'person', text: this.$t('members.members'), link: 'members', adminOnly: true },
{ icon: 'mdi-comment-account-outline', text: 'Comments', link: 'comments', adminOnly: true },
{ icon: 'mdi-book-open-outline', text: this.$t('guideline.guideline'), link: 'guideline', adminOnly: true },
{ icon: 'mdi-chart-bar', text: this.$t('statistics.statistics'), link: 'statistics', adminOnly: true },
{ icon: 'mdi-cog', text: this.$t('settings.title'), link: 'settings', adminOnly: true }
]
return items.filter(item => this.isVisible(item))
}
},
methods: {
isVisible(item) {
return !item.adminOnly || this.role.is_project_admin
},
toLabeling() {
this.$router.push({
path: this.localePath(`/projects/${this.$route.params.id}/${this.link}`),
query: this.loadSearchOptions
})
}
}
}
</script>