feat(/person-center): 新增修改密码，更新头像，完整信息

src/apis/login.js

@@ -11,14 +11,14 @@ export const login = (vm, name) =>{
     }).then(res=>{
         if(res.data.result == false){
             vm.$Message.warning(res.data.message);
+            vm.$refs[name].resetFields();
         }else{
             vm.isShowlogDialog = false;
             vm.isLogedIn = false;
             vm.$Message.success('登录成功');
-            Cookie.set({
-                name: 'userName',
-                value: vm.formData.user
-            });
+            console.log('------');
+            Cookie.set('userName', vm.formData.user);
+            console.log('Cookie', Cookie.get('userName'))
             vm.$refs[name].resetFields();
             localStorage.setItem('jwt',res.data.jwt);
         }
@@ -41,7 +41,6 @@ export const addUsers = (vm, name) =>{
         if(res.data.result){
             vm.$Message.success('新增用户成功');
             vm.$refs[name].resetFields();
-        
         }else{
             vm.$Message.warning(res.data.message);
         }

src/apis/personalCenter.js

+import Cookie from 'js-cookie'
+
+// 提交完整信息
 export const submitCompleteInfo = (vm, name)=>{
     vm.$axios.request({
       data:vm.completeInfo,
@@ -11,3 +14,63 @@ export const submitCompleteInfo = (vm, name)=>{
     })
 }
 
+// 获得完整用户信息
+export const getCompleteInfo = vm => {
+    vm.$axios.request({
+        url:'/personalCenter/getCompleteUserInfo',
+        method:'get'
+    }).then(res => {
+        console.log('getCompleteInfo', res);
+        vm.personalInfoForm.nickName = res.data.userInfo.name;
+        vm.personalInfoForm.avatarUrl = res.data.userInfo.avatarUrl;
+        vm.personalInfoForm.realName = res.data.userInfo.realName;
+        vm.personalInfoForm.postName = res.data.userInfo.postName;
+        vm.personalInfoForm.education = res.data.userInfo.education;
+        vm.personalInfoForm.companyName = res.data.userInfo.companyName;
+    }).catch(error => {
+        console.log("error", error);
+    })
+}
+
+// 修改用户头像
+export const submitAvatarUrl = vm => {
+
+    vm.$axios.request({
+        url:'/personalCenter/submitAvatarUrl',
+        method:'post',
+        data:{
+            avatarUrl:vm.avatarUrl
+        }
+    }).then( res =>{
+        vm.avatarUrl = '';
+        vm.$Message.success(res.data.msg)
+    }).catch( error =>{
+        console.log("error", error);
+    })
+}
+
+// 修改密码
+export const changePassword = vm =>{
+    vm.$axios.request({
+        url:'personalCenter/changePassword',
+        method:'post',
+        data:{
+            oldPassword:vm.updatePasswordInfo.oldPassword,
+            newPassword:vm.updatePasswordInfo.newPassword
+        }
+    }).then(res =>{
+        if(res.data.result == true){
+            vm.$Message.success(res.data.msg)
+        }else{
+            vm.$Message.warning(res.data.msg)
+        }
+    }).catch(error =>{
+        console.log('error', error);
+    })
+
+}
+
+
+
+
+

src/components/menu-component/menuComponent.vue

 <template>
-    <Menu @on-select="redirectToOtherRouter">
+    <Menu @on-select="redirectToOtherRouter" active-name = "articleManagementIndex">
         <template v-for='item in menuList' >
             <MenuItem :key='item.name' v-if='item.children.length == 1' :name='item.children[0].name' > 
                 <Icon :type="item.icon" size='16'/>

src/router/router.js

@@ -66,7 +66,7 @@ export const otherRouters = {
     path:'/',
     component:Home,
     name:'Home',
-    // redirect:'/personalCenter',
+    redirect:'/articleManagement/index',
     children:[
         {
             path:'personalCenter',

src/views/Home.vue

@@ -64,6 +64,7 @@ export default {
     return {
         isShowlogDialog:false,//是否显示登陆弹框
         isLogedIn:true,
+        // userName:Cookie.get('userName'),
         formData:{
                 user:'',
                 password:'',
@@ -89,11 +90,14 @@ export default {
     ...mapState({
       menuList: state => {
         return state.app.menuList;
-      }
-    }),
+      },
       userName(){
         return  Cookie.get('userName');
       }
+    }),
+    // userName(){
+    //   return  Cookie.get('userName');
+    // }
   },
 
   methods:{
@@ -122,7 +126,9 @@ export default {
        }
       }else{
         localStorage.removeItem('jwt');
-        Cookie.delete('userName');
+        this.isLogedIn = true;
+        this.$router.push({name:'articleManagementIndex'})
+        Cookie.remove('userName');
       }
     },
     // 登录表单处理

src/views/personal-center/components/personal-info/personalInfo.vue

@@ -8,7 +8,8 @@
             <FormItem prop='avatarUrl'>
                 <div>
                     个人头像: 
-                    <Avatar src="https://i.loli.net/2017/08/21/599a521472424.jpg" size='large' style="margin-left:10px"></Avatar>
+                    <Avatar  size='large' style="margin-left:10px" v-if="personalInfoForm.avatarUrl" :src="personalInfoForm.avatarUrl"></Avatar>
+                    <Avatar  size='large' style="margin-left:10px" v-else>{{userName}}</Avatar>
                 </div>
                 
             </FormItem>
@@ -48,11 +49,14 @@
 </template>
 
 <script>
+import * as personalCenterRequest from '@/apis/personalCenter.js';
+import Cookie from 'js-cookie';
+
     export default {
         data(){
             return {
                 personalInfoForm:{
-                    nickName:'bemount',
+                    nickName:'',
                     avatarUrl:'',
                     education:'',
                     companyName:'',
@@ -60,6 +64,17 @@
                     realName:''
                 }
             }
+        },
+        created(){
+            personalCenterRequest.getCompleteInfo(this);       
+        },
+        methods:{
+           
+        },
+        computed:{
+            userName(){
+                return Cookie.get('userName');
+            }
         }
     }
 </script>

src/views/personal-center/components/update-avatar/updateAvatar.vue

@@ -12,12 +12,14 @@
             <span style="color:red;font-size:5px">(为线上图片格式)</span>
         </div>
         <div style="margin-top:50px">
-            <Button type="info">提交</Button>
+            <Button type="info" @click="submitAvatarUrl">提交</Button>
         </div>
     </Card>
 </template>
 
 <script>
+import {submitAvatarUrl} from '@/apis/personalCenter';
+
     export default {
         data(){
             return {
@@ -26,6 +28,13 @@
         },
         methods:{
           
+            submitAvatarUrl(){
+                if(!this.avatarUrl){
+                    this.$Message.warning("头像URL不可为空");
+                    return;
+                }
+                submitAvatarUrl(this);
+            }
         }
     }
 </script>

src/views/personal-center/components/update-password/updatePassword.vue

@@ -28,6 +28,8 @@
 </template>
 
 <script>
+import {changePassword} from '@/apis/personalCenter';
+
     export default {
         data(){
             return {
@@ -56,7 +58,12 @@
             handleSubmit(name){
                  this.$refs[name].validate((valid) => {
                     if (valid) {
-                        this.$Message.success('Success!');
+                        // this.$Message.success('Success!');
+                        if(this.updatePasswordInfo.newPassword != this.updatePasswordInfo.reNewPassword){
+                            this.$Message.warning("两次密码输入不一致");
+                            return ;
+                        }
+                        changePassword(this);
                     } else {
                         this.$Message.error('Fail!');
                     }

src/views/personal-center/personalCenter.vue

@@ -31,6 +31,7 @@
 </template>
 
 <script>
+
 export default {
     data(){
         return {
@@ -43,6 +44,7 @@ export default {
             this.$router.push({name:name});
         }
     }
+
 }
 </script>