update & create user CRUD

pages/home/users.vue

@@ -195,8 +195,7 @@
 <script>
 import Nav from "@/components/Nav";
 import axios from "axios";
-import Toasted from 'vue-toasted';
-import { ModalPlugin } from 'bootstrap-vue';
+
 
 export default {
   layout: "admin",
@@ -225,6 +224,7 @@ export default {
       { text: 'Actions', value: 'actions', sortable: false },
     ],
     users: [],
+    eIndex: [],
     eID: '',
     eEmail:'',
     eName:'',
@@ -235,10 +235,8 @@ export default {
       name: "",
       id: "",
       email: "",
-      status: "",
       created_at: "",
       updated_at: "",
-    
     },
     defaultItem: {
       name: "",
@@ -269,7 +267,8 @@ export default {
   },
   methods: {
     initialize() {
-      this.users = [];
+      this.users = [],
+      this.editedItem = {}
     },
     editItem(item) {
       this.editedIndex = this.users.indexOf(item);
@@ -294,9 +293,9 @@ export default {
     },
     closeDelete() {
       this.dialogDelete = false;
-      this.$nextTick(() => {
-        this.editedItem = Object.assign({}, this.defaultItem);
-        this.editedIndex = -1;
+        this.$nextTick(() => {
+          this.editedItem = Object.assign({}, this.defaultItem);
+          this.editedIndex = -1;
       });
     },
     save() {
@@ -328,10 +327,15 @@ export default {
       })
       .then(response => {
         // $bvModal.hide('modal-login');
+        this.$bvModal.hide('modal-login')
         self.$toast.success('User created successfully!',{
         duration: 3000
       });
-        console.log(response);
+        console.log(response)
+        this.editedItem = response.data.data
+        console.log(this.editedItem)
+        this.users.push(this.editedItem)
+
       })
       .catch(errors => {
         this.$bvModal.hide('modal-login')
@@ -343,13 +347,19 @@ export default {
         });       
     },
     deleteUser(userID, index) {
+      const self = this
       this.editedIndex = this.users.indexOf(index);
       if(confirm("Do you really want to delete?")){
       try{
       axios
         .delete(`http://127.0.0.1:8000/api/users/${userID}`)
         .then(response => {
+          console.log(response.data)
           this.users.splice(this.editedIndex, 1);
+          self.$toast.success('User deleted successfully!',{
+        duration: 3000
+      });
+
       })
       } catch(error){
         console.log(error)
@@ -361,6 +371,7 @@ export default {
       this.eID = user.id;
       this.eEmail = user.email;
       this.eName = user.name;
+      this.editedIndex = this.users.indexOf(user);
       console.log(this?.eID);
     },
     updateUser(userID) {
@@ -379,7 +390,10 @@ export default {
         self.$toast.success('User updated successfully!',{
         duration: 3000
       });
-        console.log(response);
+        console.log(response)
+        this.editedItem = response.data.data
+        this.$bvModal.hide('modal-edit')
+        Object.assign(this.users[this.editedIndex], this.editedItem)
       })
       } catch(error){
         console.log(error)