Пофиксил зависания кнопок входа/регистрации

resources/views/Auth/Login.vue

@@ -38,6 +38,7 @@ export default {
             let validation = this.validate();
             if (validation !== true){
                 alert(validation);
+                this.loading = false;
                 return;
             }
             this.userStore.login(this.email, this.password, this.rememberMe).then((isLogged) => {

resources/views/Auth/Registration.vue

@@ -43,6 +43,7 @@ export default {
             let validation = this.validate();
             if (validation !== true){
                 alert(validation);
+                this.loading = false;
                 return;
             }
             this.userStore.registration(this.login, this.email, this.password, this.repeatPassword).then((isRegistred)=>{

resources/views/Wishlist/DeleteWish.vue

@@ -0,0 +1,59 @@
+<script>
+import {useUserStore} from "../../store/user.js";
+import {useWishStore} from "../../store/wish.js";
+import {rules} from "../../js/rules.js";
+import {toRef} from "vue";
+export default {
+    name: "DeleteWish",
+    data: () => ({
+        userStore: useUserStore(),
+        wishStore: useWishStore(),
+        isWide: window.innerWidth >= 800,
+        deleting: false
+    }),
+    computed: {
+        rules() {
+            return rules
+        }
+    },
+    props: {
+        dialogDelete: Function,
+        updateFrontWishes: Function,
+        wish_id: Number
+    },
+    setup(props) {
+        const id = toRef(props, 'wish_id')
+    },
+    methods: {
+        removeWish(){
+            this.deleting = true;
+            this.wishStore.remove(this.wish_id, this.userStore.token).then(()=>{
+                this.deleting = false;
+                this.updateFrontWishes();
+                this.dialogDelete();
+            });
+        }
+    }
+}
+</script>
+
+<template>
+    <v-card class="card-bg">
+        <v-card-title class="d-flex justify-space-between">
+            <span>Удалить запись?</span>
+            <span>
+                            <v-icon @click="dialogDelete" class="cursor-pointer" color="white" icon="mdi-close-thick"></v-icon>
+                        </span>
+        </v-card-title>
+        <v-card-text>
+            <div class="d-flex justify-center">
+                <v-btn class="ma-3" @click="removeWish" :loading="deleting">Да</v-btn>
+                <v-btn class="ma-3" @click="dialogDelete">Нет</v-btn>
+            </div>
+        </v-card-text>
+    </v-card>
+</template>
+
+<style scoped>
+
+</style>

resources/views/Wishlist/Wishlist.vue

@@ -4,9 +4,10 @@ import {useWishStore} from "../../store/wish.js";
 import CreateWish from "./CreateWish.vue";
 import {ref} from "vue";
 import EditWish from "./EditWish.vue";
+import DeleteWish from "./DeleteWish.vue";
 export default {
     name: "Wishlist",
-    components: {EditWish, CreateWish},
+    components: {DeleteWish, EditWish, CreateWish},
     data: () => ({
         userStore: useUserStore(),
         wishStore: useWishStore(),
@@ -15,6 +16,8 @@ export default {
         fetching: true,
         dialogCreate: ref(false),
         dialogEdit: ref(false),
+        dialogDelete: ref(false),
+        wishToDelete: ref(0),
         wishToEditId: ref(0),
         wishlistLink: '',
         snackbar: false
@@ -33,6 +36,9 @@ export default {
         dialogEditClose(){
             this.dialogEdit = false;
         },
+        dialogDeleteClose(){
+            this.dialogDelete = false;
+        },
         updateFrontWishes(){
             this.fetching = true;
             this.wishStore.getUserWishes(this.userStore.user['id']).then((wishes)=>{
@@ -40,19 +46,14 @@ export default {
                 this.fetching = false
             });
         },
-        removeWish(id){
-            this.fetching = true;
-            this.wishStore.remove(id, this.userStore.token).then(()=>{
-                this.wishStore.getUserWishes(this.userStore.user['id']).then((wishes)=>{
-                    this.wishesList = wishes;
-                    this.fetching = false;
-                });
-            })
-        },
         editWish(id){
             this.wishToEditId = id;
             this.dialogEdit = true;
         },
+        deleteWish(id){
+            this.wishToDelete = id;
+            this.dialogDelete = true;
+        },
         getWishToEditId(){
             return this.wishToEditId;
         },
@@ -68,9 +69,9 @@ export default {
     <div class="d-flex flex-column">
         <v-skeleton-loader color="grey-darken-4" type="table" v-if="fetching"></v-skeleton-loader>
         <div v-if="!fetching" class="d-flex justify-center align-center w-100 pt-5">
-            <v-text-field 
-                class="w-33" 
-                append-inner-icon="mdi-content-copy" 
+            <v-text-field
+                class="w-33"
+                append-inner-icon="mdi-content-copy"
                 @click:append-inner="copyLink"
                 readonly
             >
@@ -94,7 +95,7 @@ export default {
                     <td>{{ wish['price'] }}</td>
                     <td><a target="_blank" :href="wish['url']">{{ wish['url'] }}</a></td>
                     <td><v-icon @click="editWish(wish['id'])" class="cursor-pointer" color="white" icon="mdi-pencil"></v-icon></td>
-                    <td><v-icon @click="removeWish(wish['id'])" class="cursor-pointer" color="white" icon="mdi-trash-can"></v-icon></td>
+                    <td><v-icon @click="deleteWish(wish['id'])" class="cursor-pointer" color="white" icon="mdi-trash-can"></v-icon></td>
                 </tr>
                 <tr class="text-center">
                     <td colspan="5"><v-btn @click="dialogCreate = true" color="#212022" elevation="0" block><v-icon class="cursor-pointer" icon="mdi-plus-thick"></v-icon></v-btn></td>
@@ -106,6 +107,9 @@ export default {
             <v-dialog v-model="dialogEdit" class="w-66">
                 <EditWish :dialogEdit="dialogEditClose" :updateFrontWishes="updateFrontWishes" :wish_id="wishToEditId"/>
             </v-dialog>
+            <v-dialog v-model="dialogDelete" :class="isWide ? 'w-33' : 'w-100'">
+                <DeleteWish :dialogDelete="dialogDeleteClose" :updateFrontWishes="updateFrontWishes" :wish_id="wishToDelete"/>
+            </v-dialog>
         </v-table>
         <v-table v-if="!fetching && !isWide" class="card-bg w-100 h-auto mt-5 pa-3">
             <thead>
@@ -121,7 +125,7 @@ export default {
                     <td><a target="_blank" :href="wish['url']">{{ wish['name'] }}</a></td>
                     <td>{{ wish['price'] }}</td>
                     <td><v-icon @click="editWish(wish['id'])" class="cursor-pointer" color="white" icon="mdi-pencil"></v-icon></td>
-                    <td><v-icon @click="removeWish(wish['id'])" class="cursor-pointer" color="white" icon="mdi-trash-can"></v-icon></td>
+                    <td><v-icon @click="deleteWish(wish['id'])" class="cursor-pointer" color="white" icon="mdi-trash-can"></v-icon></td>
                 </tr>
                 <tr class="text-center">
                     <td colspan="5"><v-btn @click="dialogCreate = true" color="#212022" elevation="0" block><v-icon class="cursor-pointer" icon="mdi-plus-thick"></v-icon></v-btn></td>
@@ -133,6 +137,9 @@ export default {
             <v-dialog v-model="dialogEdit" :class="isWide ? 'w-66' : 'w-100'">
                 <EditWish :dialogEdit="dialogEditClose" :updateFrontWishes="updateFrontWishes" :wish_id="wishToEditId"/>
             </v-dialog>
+            <v-dialog v-model="dialogDelete" :class="isWide ? 'w-66' : 'w-100'">
+                <DeleteWish :dialogDelete="dialogDeleteClose" :updateFrontWishes="updateFrontWishes" :wish_id="wishToDelete"/>
+            </v-dialog>
         </v-table>
     </div>
 </template>