Проблема с отображением элементов на панели навигации в основном интерфейсе vue.js.
Я делаю сайт, используя vue.js и coreui. Вопрос в том, что у меня есть 2 вида пользователей на этом сайте (то есть администратор и пользователи). Я надеюсь, что в панели навигации, когда пользователь ->(пользователи) вошел в систему, добавлены только определенные элементы на панели навигации. Как мне этого добиться? Я читал документацию и не нашел удачи.
Я не знаю, как переопределить этот шаблон боковой панели. Я пытался напрямую изменить файлы @coreui, но это не отражается.
Любая помощь будет оценена. Благодарю вас
_nav.js
export default {
items: [
{
name: 'Dashboard',
url: '/dashboard',
icon: 'icon-speedometer',
badge: {
variant: 'primary',
text: 'NEW'
}
},
{
title: true,
name: 'Administrator',
class: '',
wrapper: {
element: '',
attributes: {}
}
},
{
name: 'PRC',
url: '/priority',
icon: 'icon-layers',
children: [
{
name: 'PRC Types',
url: '/priority',
icon: 'icon-puzzle'
},
{
name: 'PRC Range',
url: '/priority/range',
icon: 'icon-directions'
}
]
},
{
name: 'Users',
url: '/users',
icon: 'icon-user'
},
{
name: 'SubTenant',
url: '/tenant',
icon: 'icon-user'
},
{
name: 'Groups',
url: '/groups',
icon: 'icon-list'
},
{
name: 'TaskList',
url: '/tasklist',
icon: 'icon-list'
},
{
name: 'ProcessList',
url: '/process',
icon: 'icon-list'
},
]
}
main.js
// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import 'core-js/es6/promise'
import 'core-js/es6/string'
import 'core-js/es7/array'
// import cssVars from 'css-vars-ponyfill'
import Vue from 'vue'
import BootstrapVue from 'bootstrap-vue'
import App from './App'
import router from './router'
import axios from 'axios'
import VueAxios from 'vue-axios'
import VueAuth from '@websanova/vue-auth'
import VeeValidate from 'vee-validate';
import Element from 'element-ui'
Vue.use(Element);
Vue.use(VeeValidate);
Vue.use(VueAxios, axios);
Vue.axios.defaults.baseURL = 'http://127.0.0.1:8080/api/v1/client';
Vue.router = router;
Vue.use(VueAuth, {
auth: require('@websanova/vue-auth/drivers/auth/bearer.js'),
http: require('@websanova/vue-auth/drivers/http/axios.1.x.js'),
router: require('@websanova/vue-auth/drivers/router/vue-router.2.x.js'),
tokenDefaultName:"token",
tokenStore: ['localStorage', 'cookie'],
authRedirect: {path: '/auth'},
notFoundRedirect: {path: '/dashboard'},
fetchData:{url : "auth" , method : "GET"},
refreshData:{enabled:false}
});
Vue.use(BootstrapVue);
new Vue({
el: '#app',
router,
template: '<App/>',
mounted(){
},
methods: {
},
components: {
App
}
});
И я не ищу, как я делаю эту часть.