Реализуется легко:
на беке юзаете баунсер + $this->authorize/Gate::allows и проверяете нужные права, вне зависимости от фронта.
на фронт с бека передаете берете массив пермишенов (абилитис в баунсере), в том же месте, где передаете юзера (не важно, отдельным запросом или сразу при загрузке страницы). Пишите во vuex'е нужные геттеры, как пример из моего проекта:
export const can = (state) => (perm) => this.loggedIn(state) && state.authUser.abilities.includes(perm);
export const canAny = (state) => (perms) => perms.some(x => this.can(state)(x));
И юзаете директивы где нужно, предварительно импортнув нужные геттеры:
v-if="can('chat.mute')"
PS: не стоит писать свои директивы "v-can", ибо:
1) они не информативны (непонятно, что они делают, если прав нет)
2) прийдется написать с десяток таких, на все случаи жизни, типа "can-show", "can-if" и прочая лабудень.
PS2: про "переход по страницам" и любые запросы на бек - ларавель сам кинет forbidden 403, проверяете интерцептором в axios'е на этот статус и кидаете на страницу с ошибкой/показываете окошко/нотификацию/птичку/кошку.
