Fix profile/athlete update actions

Found the need for double click to update

web/src/store/modules/athletes.ts

@@ -60,6 +60,13 @@ export default class Athletes extends VuexModule {
         this.err = err;
     }
 
+    @Mutation
+    private athlete_addTrainer(trainer: UserInterface) {
+        this.trainer = trainer;
+        this.athlete._trainer = this.trainer._id;
+    }
+
+
     @Action
     private athlete_getAll() {
         return new Promise((resolve, reject) => {
@@ -78,12 +85,12 @@ export default class Athletes extends VuexModule {
     }
 
     @Action
-    private athlete_update(athlete: AthleteInterface) {
+    private athlete_update() {
         return new Promise((resolve, reject) => {
             axios({
                 method: 'PUT',
-                url: `/api/athletes/${athlete._id}`,
-                data: {...athlete}
+                url: `/api/athletes/${this.athlete._id}`,
+                data: {...this.athlete}
             })
                 .then((resp: AxiosResponse) => {
                     this.context.commit('api_athlete', resp.data);
@@ -95,11 +102,6 @@ export default class Athletes extends VuexModule {
         });
     }
 
-    @Action
-    private athlete_saveLocalTrainer(trainer: UserInterface) {
-        this.context.commit('api_trainer', trainer);
-    }
-
     @Action
     private athlete_saveLocal(athlete: AthleteInterface) {
         this.context.commit('api_athlete', athlete);

web/src/store/modules/backend.ts

@@ -36,12 +36,11 @@ export default class Backend extends VuexModule {
 
     @Mutation
     private server_logout() {
-        this.liveAthData = []
+        this.liveAthData = [];
     }
 
     @Action
     private server_saveLiveData(data: AthleteData) {
-        console.log(this.liveAthData);
         this.context.commit('server_queueData', data);
         if (this.liveAthData.length > 15)
             this.context.commit('server_dequeueData');
@@ -55,10 +54,10 @@ export default class Backend extends VuexModule {
                 url: `/api/data/`
             })
                 .then((resp: AxiosResponse) => {
-                    resolve(resp)
+                    resolve(resp);
                 })
                 .catch((err: Error) => {
-                    reject(err)
+                    reject(err);
                 });
         });
     }
@@ -71,10 +70,10 @@ export default class Backend extends VuexModule {
                 url: `/api/data/${id}`
             })
                 .then((resp: AxiosResponse) => {
-                    resolve(resp)
+                    resolve(resp);
                 })
                 .catch((err: Error) => {
-                    reject(err)
+                    reject(err);
                 });
         });
     }

web/src/store/modules/user.ts

@@ -6,7 +6,9 @@ export interface UserInterface {
     _id: string,
     username: string,
     email: string,
-    password: string,
+    password: string | undefined,
+    newPassword: string | undefined,
+    repeatNewPassword: string | undefined,
     registered: Date,
     lastLogin: Date,
 }
@@ -32,6 +34,7 @@ export default class User extends VuexModule {
     @Mutation
     private auth_success(user: UserInterface) {
         this.user = user;
+        delete this.user['password'];
         this.userStatus = true;
     }
 
@@ -55,6 +58,7 @@ export default class User extends VuexModule {
     @Mutation
     private update_user(user: UserInterface) {
         this.user = user;
+        delete this.user['password'];
     }
 
     @Action
@@ -106,7 +110,7 @@ export default class User extends VuexModule {
                     resolve(resp);
                 })
                 .catch((err: Error) => {
-                    this.context.commit('auth_error')
+                    this.context.commit('auth_error');
                     reject(err);
                 });
         });
@@ -114,19 +118,19 @@ export default class User extends VuexModule {
 
 
     @Action
-    private user_update(user: UserInterface) {
+    private user_update() {
         return new Promise((resolve, reject) => {
             axios({
                 method: 'PUT',
-                url: `/api/user/${user._id}`,
-                data: {...user}
+                url: `/api/user/${this.user._id}`,
+                data: {...this.user}
             })
                 .then((resp: AxiosResponse) => {
                     this.context.commit('update_user', resp.data);
                     resolve(resp);
                 })
                 .catch((err: Error) => {
-                    this.context.commit('update_err', err)
+                    this.context.commit('update_err', err);
                     reject(err);
                 });
         });

web/src/views/Athlete.vue

@@ -87,7 +87,7 @@
           </div>
           <div class="field">
             <p class="control">
-              <button class="button is-medium is-rounded is-primary" @click="athlete_update('adopt')">Adopt</button>
+              <button class="button is-medium is-rounded is-primary" @click="athlete_adopt">Adopt</button>
             </p>
           </div>
         </div>
@@ -138,30 +138,25 @@ export default class Athlete extends Vue {
 
     if (this.trainer) {
       this.trainerLogin = new Date(this.trainer.lastLogin).toLocaleString();
-      this.$store.dispatch('athlete_saveLocalTrainer', this.trainer);
+      this.$store.commit('api_trainer', this.trainer);
     }
   }
 
-  private athlete_update(action: string) {
-    if (action === 'adopt' && this.clientID === '') {
-      this.msgError = 'Please give a valid athlete ID!';
-      return;
-    }
-
+  private athlete_adopt() {
     if (this.clientID != '' && this.clientID != this.athlete.id) {
       this.msgError = 'Athlete ID does not match with current athlete!';
       return;
     }
 
-    if (action === 'adopt') {
-      Object.assign(this.athlete, {_trainer: this.$store.getters.user_current._id});
-    } else {
-      Object.assign(this.athlete, {_trainer: ''});
-    }
+    this.athlete_update();
+  }
+
+  private athlete_update() {
+    this.$store.commit('athlete_addTrainer', this.$store.getters.user_current);
 
-    this.$store.dispatch('athlete_update', this.athlete)
+    this.$store.dispatch('athlete_update')
         .then((res: any) => {
-          this.msgSuccess = 'Athlete updated'
+          this.msgSuccess = 'Athlete updated';
           this.athlete = res.data;
         })
         .catch(() => this.msgError = this.$store.getters.athlete_err.response.data.errors.message ||

web/src/views/Athletes.vue

@@ -154,7 +154,7 @@ export default class Athletes extends Vue {
   }
 
   private athlete_save(athlete: AthleteInterface) {
-    this.$store.dispatch('athlete_saveLocal', athlete);
+    this.$store.commit('api_athlete', athlete);
   }
 
   private athlete_delete(athlete: AthleteInterface, index: number) {

web/src/views/Profile.vue

@@ -31,25 +31,25 @@
           <p class="title">Change Password</p>
           <div class="field">
             <p class="control has-icons-left">
-              <input v-model="currentPassword" class="input" placeholder="Current Password" type="password">
+              <input v-model="user.password" class="input" placeholder="Current Password" type="password">
               <span class="icon is-small is-left"><i class="fas fa-lock"></i></span>
             </p>
           </div>
           <div class="field">
             <p class="control has-icons-left">
-              <input v-model="newPassword" class="input" placeholder="New Password" type="password">
+              <input v-model="user.newPassword" class="input" placeholder="New Password" type="password">
               <span class="icon is-small is-left"><i class="fas fa-lock"></i></span>
             </p>
           </div>
           <div class="field">
             <p class="control has-icons-left">
-              <input v-model="repeatNewPassword" class="input" placeholder="Confirm Password" type="password">
+              <input v-model="user.repeatNewPassword" class="input" placeholder="Confirm Password" type="password">
               <span class="icon is-small is-left"><i class="fas fa-lock"></i></span>
             </p>
           </div>
           <div class="field">
             <p class="control">
-              <button class="button is-primary is-rounded">
+              <button class="button is-primary is-rounded" type="submit">
                 Update
               </button>
             </p>
@@ -79,17 +79,9 @@
 import {Vue} from "vue-class-component";
 import {UserInterface} from "@/store/modules/user";
 
-interface UpdatedUser extends UserInterface {
-  newPassword: string,
-  repeatNewPassword: string,
-}
-
 export default class Profile extends Vue {
-  private user = <UpdatedUser>{};
+  private user = <UserInterface>{};
   private date = '';
-  private currentPassword = '';
-  private newPassword = '';
-  private repeatNewPassword = '';
   private msgSuccess = '';
   private msgError = '';
 
@@ -99,14 +91,12 @@ export default class Profile extends Vue {
   }
 
   private user_update() {
-    if (this.newPassword != this.repeatNewPassword) {
+    if (this.user.newPassword != this.user.repeatNewPassword) {
       this.msgError = 'Passwords do not match!';
       return;
     }
 
-    Object.assign(this.user, {password: this.currentPassword, newPassword: this.newPassword});
-
-    this.$store.dispatch('user_update', this.user)
+    this.$store.dispatch('user_update')
         .then(() => this.msgSuccess = 'User updated!')
         .catch(() => this.msgError = this.$store.getters.user_err.response.data.errors.message ||
             'Something went wrong!');