BRCO
Coder
JavaScript:
** FIRST** <script>
export default {
name: 'UserSetting',
data: function(){
return {
user_email: '',
user_new_password: '',
user_confirm_password: '',
user_existing_password: '',
}
},
mounted: function () {
this.loadUserDetails();
},
methods: {
loadUserDetails: function() {
this.$http.get('users/' + localStorage.getItem('user') + '/user_details')
.then(response => {
if(response.data != null) {
this.user_email = response.data.email
}
})
.catch(error => {
this.$parent.toast(error);
});
},
saveUserDetail: function(){
if (this.user_existing_password == ''){
alert('To update settings, you need to enter current password.')
}
else{
this.$http.put('users/' + localStorage.getItem('user') + '/user_details',
{
user_email: this.user_email,
user_new_password: this.user_new_password,
user_confirm_password: this.user_confirm_password,
user_existing_password: this.user_existing_password
})
.then(response => {
this.$parent.toast("Settings have been updated successfully");
location.reload();
})
.catch(error => {
this.$parent.toast(error);
});
}
}
}
}
</script>
**SECOND** <script>
import Profile from './Profile.vue'
import Plan from './Plan.vue'
export default {
name: 'Summary',
props: {
selectedYear: Number
},
components: {
Profile,
Plan
}
}
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
</style>So the first <script> is for email and pass change the <script> underneath it is for the Profile and plan section... However, the first <script> is not working unless I move it under the second <script> but when I do that then the Profile and Plan sections disappear.
Is anyone able to help me out with this?
