утим бронь дальше

resources/publicWishlist.js

@@ -16,4 +16,12 @@ const vuetify = createVuetify({
 
 const pinia = createPinia()
 
-createApp(PublicApp).use(vuetify).use(pinia).mount("#app")
+const routes = [
+]
+
+const router = createRouter({
+    history: createMemoryHistory(),
+    routes,
+})
+
+createApp(PublicApp).use(vuetify).use(router).use(pinia).mount("#app")

resources/views/Public.vue

@@ -9,6 +9,17 @@
                         <span v-if="userStore.user !== null">{{ userStore.user['name'] }}</span>
                         <span v-else>Гость</span>
                     </div>
+                    <span v-if="isAuthenticated" class="link-no-decor align-end" @click="logout">Выйти</span>
+                    <div v-else>
+                        <a class="link-no-decor align-end" @click="showAuthDialog = true">Вход/Регистрация</a>
+                    </div>
+                    <v-dialog v-model="showAuthDialog">
+                        <v-card class="card-bg">
+                            <v-card-title class="d-flex justify-end">
+                                <v-icon @click="showAuthDialog = false" class="cursor-pointer" color="white" icon="mdi-close-thick"></v-icon>
+                            </v-card-title>
+                        </v-card>
+                    </v-dialog>
                 </v-card-title>
                 <v-card-text class="d-flex justify-center align-center h-auto">
                     <ShowWhishlist/>
@@ -21,15 +32,27 @@
 <script>
 import ShowWhishlist from "./PublicWishlist/ShowWhishlist.vue";
 import {useUserStore} from "../store/user.js";
+import { watch } from "vue";
 export default {
     name: "Public",
     components: {ShowWhishlist},
     data: ()=>({
+        isAuthenticated: false,
         isWide: window.innerWidth >= 800,
-        userStore: useUserStore()
+        userStore: useUserStore(),
+        showAuthDialog: false
     }),
     mounted() {
+        watch(this.userStore, (newStore, oldStore)=>{
+            this.isAuthenticated = newStore.user !== null && newStore.user !== undefined;
+        });
         useUserStore().checkUser();
+    },
+    methods: {
+        async logout() {
+            this.userStore.logout();
+            window.location.reload();
+        }
     }
 }
 </script>

resources/views/PublicWishlist/ShowWhishlist.vue

@@ -109,28 +109,6 @@ export default {
             </v-card>
         </v-dialog>
     </div>
-<!--    <v-table v-if="!fetching && !isWide" class="card-bg w-100 h-auto mt-5 pa-3">-->
-<!--        <thead>-->
-<!--            <tr>-->
-<!--                <th colspan="3" class="text-center text-subtitle-1">Список пользователя {{ this.username }}</th>-->
-<!--            </tr>-->
-<!--            <tr>-->
-<!--                <th class="text-body-1">Наименование</th>-->
-<!--                <th class="text-body-1">Цена</th>-->
-<!--                <th class="text-body-1">Бронь</th>-->
-<!--            </tr>-->
-<!--        </thead>-->
-<!--        <tbody>-->
-<!--            <tr v-for="wish in wishes">-->
-<!--                <td><a target="_blank" :href="wish['url']">{{ wish['name'] }}</a></td>-->
-<!--                <td>{{ wish['price'] }}</td>-->
-<!--                <td>-->
-<!--                    <v-icon v-if="wish['book_user'] === null" class="cursor-pointer" color="white" icon="mdi-lock"></v-icon>-->
-<!--                    <span v-else><v-icon color="green" icon="mdi-check-bold"></v-icon></span>-->
-<!--                </td>-->
-<!--            </tr>-->
-<!--        </tbody>-->
-<!--    </v-table>-->
 </template>
 
 <style scoped>