add pages

src/components/GamesPage.vue

@@ -0,0 +1,11 @@
+<script setup lang="ts">
+import HeaderMenu from '@/components/HeaderMenu.vue'
+</script>
+
+<template>
+    <HeaderMenu :add-logout="true"/>
+
+    Игры
+</template>
+
+<style scoped></style>

src/components/HeaderMenu.vue

@@ -66,16 +66,16 @@ const goToLogout = () => {
 <template>
     <div class="menu-block">
         <div class="left-group">
-            <div class="menu-item-block">
+            <div class="menu-item-block" v-if="authStore.hasRole('user')" @click="router.push('/office')">
                 Кабинет
             </div>
-            <div class="menu-item-block" v-if="hasPermission('games_page')">
+            <div class="menu-item-block" v-if="hasPermission('games_page')" @click="router.push('/games')">
                 Игры
             </div>
-            <div class="menu-item-block" v-if="hasPermission('scenarios_page')">
+            <div class="menu-item-block" v-if="hasPermission('scenarios_page')" @click="router.push('/scenarios')">
                 Мои сценарии
             </div>
-            <div class="menu-item-block" v-if="hasPermission('users_page')">
+            <div class="menu-item-block" v-if="hasPermission('users_page')" @click="router.push('/users')">
                 Пользователи
             </div>
         </div>

src/components/OfficePage.vue

@@ -24,11 +24,11 @@ getPermissions()
     <p>
         Доброго времени суток, {{ authStore.username }}.
     </p>
-    <p>
+    <!-- <p>
         {{ authStore.userRoles }}
     </p>
 
-    {{ permissions }}
+    {{ permissions }} -->
 </template>
 
 <style scoped></style>

src/components/ScenariosPage.vue

@@ -0,0 +1,11 @@
+<script setup lang="ts">
+import HeaderMenu from '@/components/HeaderMenu.vue'
+</script>
+
+<template>
+    <HeaderMenu :add-logout="true"/>
+
+    Сценарии
+</template>
+
+<style scoped></style>

src/components/UsersPage.vue

@@ -0,0 +1,11 @@
+<script setup lang="ts">
+import HeaderMenu from '@/components/HeaderMenu.vue'
+</script>
+
+<template>
+    <HeaderMenu :add-logout="true"/>
+
+    Пользователи
+</template>
+
+<style scoped></style>

src/router/index.ts

@@ -4,6 +4,9 @@ import LoginView from '../views/LoginView.vue'
 import OfficeView from '../views/OfficeView.vue'
 import UserAgreementView from '../views/UserAgreementView.vue'
 import PrivacyPolicyView from '../views/PrivacyPolicyView.vue'
+import GamesView from '../views/GamesView.vue'
+import ScenariosView from '../views/ScenariosView.vue'
+import UsersView from '../views/UsersView.vue'
 
 const router = createRouter({
   history: createWebHistory(import.meta.env.BASE_URL),
@@ -33,6 +36,21 @@ const router = createRouter({
       name: 'privacy-policy',
       component: PrivacyPolicyView,
     },
+    {
+      path: '/games',
+      name: 'games',
+      component: GamesView,
+    },
+    {
+      path: '/scenarios',
+      name: 'scenarios',
+      component: ScenariosView,
+    },
+    {
+      path: '/users',
+      name: 'users',
+      component: UsersView,
+    },
   ],
 })
 

src/views/GamesView.vue

@@ -0,0 +1,9 @@
+<script setup lang="ts">
+import GamesPage from '@/components/GamesPage.vue';
+</script>
+
+<template>
+  <main>
+    <GamesPage />
+  </main>
+</template>

src/views/LoginView.vue

@@ -2,7 +2,6 @@
 import LoginPage from '@/components/LoginPage.vue';
 </script>
 
-<!-- Страница авторизации -->
 <template>
   <main>
     <LoginPage />

src/views/OfficeView.vue

@@ -2,7 +2,6 @@
 import OfficePage from '@/components/OfficePage.vue';
 </script>
 
-<!-- Страница авторизации -->
 <template>
   <main>
     <OfficePage />

src/views/ScenariosView.vue

@@ -0,0 +1,9 @@
+<script setup lang="ts">
+import ScenariosPage from '@/components/ScenariosPage.vue';
+</script>
+
+<template>
+  <main>
+    <ScenariosPage />
+  </main>
+</template>

src/views/UsersView.vue

@@ -0,0 +1,9 @@
+<script setup lang="ts">
+import UsersPage from '@/components/UsersPage.vue';
+</script>
+
+<template>
+  <main>
+    <UsersPage />
+  </main>
+</template>