add:用户信息修改

package-lock.json

@@ -12587,6 +12587,14 @@
       "integrity": "sha512-HjSDRw6gZE5JMggctHBcjVak08+KEVhSIiDzFnT9S9aegmp85S/bReBVTb4QTFaRNptJ9kuYaNhnbNEOkbKb/A==",
       "dev": true
     },
+    "v-distpicker": {
+      "version": "1.2.13",
+      "resolved": "https://registry.npmjs.org/v-distpicker/-/v-distpicker-1.2.13.tgz",
+      "integrity": "sha512-dQN7cR7BhHPrmZ0dBngFm69Fgc3u22uOwJDM4vc4n3mdGDI6PvKa/0lCjPkDrU8G1pv9TO+Fb68wmX2ItyI1mQ==",
+      "requires": {
+        "vue": "^2.6.10"
+      }
+    },
     "validate-npm-package-license": {
       "version": "3.0.4",
       "resolved": "https://registry.npmjs.org/validate-npm-package-license/-/validate-npm-package-license-3.0.4.tgz",

package.json

@@ -14,6 +14,7 @@
     "element-ui": "^2.15.6",
     "moment": "^2.29.2",
     "swiper": "^6.8.4",
+    "v-distpicker": "^1.2.13",
     "vue": "^2.5.2",
     "vue-awesome-swiper": "^3.1.3",
     "vue-router": "^3.0.1",

src/apis/user.js

@@ -1,17 +1,70 @@
 import request from '@/axios'
 export default {
+  /**
+   * 
+   * @param {*} data 
+   * @returns 
+   * 修改用户信息
+   */
+  editAppUser(data) {
+    return request({
+      url: '/app/user/edit',
+      method: 'post',
+      data: data
+    })
+  },
+  /**
+   * 
+   * @param {*} data 
+   * @returns 
+   * 获取绑定新手机短信
+   */
+  appcommonsmsbindNew(data) {
+    return request({
+      url: '/app/common/sms/bindNew',
+      method: 'post',
+      data: data,
+      noToken: true
+    })
+  },
+  /**
+   * 
+   * @param {*} data 
+   * @returns 
+   * 绑定新手机
+   */
+  appuserbindNewTel(data) {
+    return request({
+      url: '/app/user/bindNewTel',
+      method: 'post',
+      data: data
+    })
+  },
+  /**
+   * 
+   * @param {*} data 
+   * @returns 
+   * 修改密码
+   */
+  appuserupdatePwd(data) {
+    return request({
+      url: '/app/user/updatePwd',
+      method: 'post',
+      data: data
+    })
+  },
   /**
    * 
    * @param {*} data 
    * @returns 
    * 购物车列表
    */
-   cartList(data) {
+  cartList(data) {
     return request({
-			url: '/base/cart/list',
-			method: 'get',
-			params: data
-		})
+      url: '/base/cart/list',
+      method: 'get',
+      params: data
+    })
   },
   /**
    * 
@@ -21,7 +74,7 @@ export default {
    */
   cartDelete(data) {
     return request({
-      url: '/base/cart/delete/'+data,
+      url: '/base/cart/delete/' + data,
       method: 'post'
     })
   },
@@ -33,12 +86,12 @@ export default {
    * 获取班级
    */
   goodsGradeList(data) {
-		return request({
-			url: '/grade/grade/list',
-			method: 'get',
-			params: data
-		})
-	},
+    return request({
+      url: '/grade/grade/list',
+      method: 'get',
+      params: data
+    })
+  },
   /**
    * 
    * @param {*} data 
@@ -46,12 +99,12 @@ export default {
    * 获取省份
    */
   getProvinceList(data) {
-		return request({
-			url: '/apply/areas/list',
-			method: 'get',
-			params: data
-		})
-	},
+    return request({
+      url: '/apply/areas/list',
+      method: 'get',
+      params: data
+    })
+  },
 
   /**
    * 
@@ -59,27 +112,27 @@ export default {
    * @returns 
    * 获取城市
    */
-	getCityList(data) {
-		return request({
-			url: '/apply/areas/cityList',
-			method: 'get',
-			params: data
-		})
-	},
-  
+  getCityList(data) {
+    return request({
+      url: '/apply/areas/cityList',
+      method: 'get',
+      params: data
+    })
+  },
+
   /**
    * 
    * @param {*} data 
    * @returns 
    * 获取考期 
    */
-	getExamineList(data) {
-		return request({
-			url: '/course/examine/list',
-			method: 'get',
-			params: data
-		})
-	},
+  getExamineList(data) {
+    return request({
+      url: '/course/examine/list',
+      method: 'get',
+      params: data
+    })
+  },
 
   /**
    * 
@@ -88,31 +141,31 @@ export default {
    * 加入购物车
    */
   addCart(data) {
-		return request({
-			url: '/base/cart',
-			method: 'post',
-			data: data
-		})
-	},
+    return request({
+      url: '/base/cart',
+      method: 'post',
+      data: data
+    })
+  },
 
   /**
-	 * @param {Object} data
-	 * 查看锁定状态
-	 */
-	lockLockStatus(data) {
-		return request({
-			url: '/lock/lockStatus',
-			method: 'post',
-			data: data,
-		})
-	},
+   * @param {Object} data
+   * 查看锁定状态
+   */
+  lockLockStatus(data) {
+    return request({
+      url: '/lock/lockStatus',
+      method: 'post',
+      data: data,
+    })
+  },
 
   lockLockAction(data) {
-		return request({
-			url: '/lock/lockAction',
-			method: 'post',
-			data: data
-		})
-	},
-  
+    return request({
+      url: '/lock/lockAction',
+      method: 'post',
+      data: data
+    })
+  },
+
 }

src/axios.js

@@ -1,9 +1,9 @@
 import axios from 'axios'
 export const BASE_URL = 'http://42.192.164.187:19005'    //test
-export const tenantId = '867735392558919680' 
+export const tenantId = '867735392558919680'
 
 
- //图片上传api
+//图片上传api
 // export const BASE_IMG_URL = 'https://file.xyyxt.net/'     //release
 export const BASE_IMG_URL = 'https://file-dev.xyyxt.net/'  //test
 
@@ -13,20 +13,20 @@ import router from './router'
 
 // 创建 axios 实例
 const request = axios.create({
-  baseURL:BASE_URL,
+  baseURL: BASE_URL,
   timeout: 10000 // 请求超时时间
 })
- 
+
 // 错误处理函数
 const err = (error) => {
   if (error.response) {
     const data = error.response.data
     // const token = Vue.ls.get(ACCESS_TOKEN)
     if (error.response.status === 403) {
-       
+
     }
     if (error.response.status === 401) {
-       
+
     }
   }
   return Promise.reject(error)
@@ -36,7 +36,7 @@ const err = (error) => {
 request.interceptors.request.use(config => {
   const token = tools.getToken()
   if (token && !config.noToken) {
-    config.headers['AuthorizationToken'] = 'WX ' +token // 让每个请求携带自定义 token 请根据实际情况自行修改
+    config.headers['AuthorizationToken'] = 'WX ' + token // 让每个请求携带自定义 token 请根据实际情况自行修改
   }
   config.headers['TenantId'] = tenantId
 
@@ -47,72 +47,77 @@ request.interceptors.request.use(config => {
 request.interceptors.response.use(async (response) => {
   const res = response.data
   const code = res.code || 200;
-  if (code!==200) { 
-    
-    if(code == 401) {
+  if (code !== 200) {
+
+    if (code == 401) {
       let userAccount = tools.getUserAccount();
 
-      if(!userAccount) {
-       Message({
-         message: `登录失效，重新登录`,
-         type: "error",
-       });
-      
-       setTimeout(() => {
-        router.push({
-          path:'/login'
-        })
-       }, 1000);
-       
+      if (!userAccount) {
+        Message({
+          message: `登录失效，重新登录`,
+          type: "error",
+        });
+
+        setTimeout(() => {
+          router.push({
+            path: '/login'
+          })
+        }, 1000);
       } else {
         let res = await refreshToken(response.config)
         return res
       }
+    } else if (code == 500) {
+      Message({
+        message: res.msg,
+        type: "error",
+      });
+      return Promise.reject(res)
     } else {
       return Promise.reject(res)
     }
-    
+
   } else {
     return res
   }
 }, err)
 
 async function refreshToken(response) {
-    let userAccount = tools.getUserAccount();
-
-    var datas = {
-			url: '/refreshToken/' + userAccount,
-			method: 'get',
-			noToken: true
-		}
-		const res = await request(datas)
-		if (res.code === 200) {
-			localStorage.setItem('token', res.data.token)
-
-			var userInfo = {
-				url: '/app/user/getInfo',
-				method: 'get',
-			}
-			const resUser = await request(userInfo)
-			if (resUser.data.code === 200) {
-				store.state.userInfo = resUser.data
-				localStorage.setItem('user_account',userAccount)
-				num = 1;
-			}
-			let onset = await request(response)
-			return onset
-		} else {
-      Message({
-        message: `登录失效，重新登录`,
-        type: "error",
-      });
-     
-      setTimeout(() => {
-       router.push({
-         path:'/login'
-       })
-      }, 1000);
-		}
+  let userAccount = tools.getUserAccount();
+
+  var datas = {
+    url: '/refreshToken/' + userAccount,
+    method: 'get',
+    noToken: true
+  }
+  const res = await request(datas)
+  if (res.code === 200) {
+    localStorage.setItem('token', res.data.token)
+
+    var userInfo = {
+      url: '/app/user/getInfo',
+      method: 'get',
+    }
+    const resUser = await request(userInfo)
+    if (resUser.data.code === 200) {
+      store.state.userInfo = resUser.data
+      localStorage.setItem('user_account', userAccount)
+      num = 1;
+    }
+    let onset = await request(response)
+    return onset
+  } else {
+    Message({
+      message: `登录失效，重新登录`,
+      type: "error",
+    });
+
+    setTimeout(() => {
+      router.push({
+        path: '/login'
+      })
+    }, 1000);
+  }
 }
 
 export default request

src/components/toolbar/index.vue

@@ -14,7 +14,6 @@
       <div class="text blue">02087085982</div>
       <div class="text">报名咨询</div>
     </div>
-
     <div class="item">
       <img src="@/assets/top.png" class="img" alt="" />
       <div class="text">返回顶部</div>
@@ -55,7 +54,7 @@ export default {
   background: #fff;
   display: flex;
   flex-direction: column;
-
+  z-index: 12;
   .item {
     cursor: pointer;
     width: 64px;

src/pages/course-list/index.vue

@@ -8,7 +8,7 @@
             <el-breadcrumb-item :to="{ path: '/index' }"
               >首页</el-breadcrumb-item
             >
-            <el-breadcrumb-item>题库</el-breadcrumb-item>
+            <el-breadcrumb-item>课程</el-breadcrumb-item>
           </el-breadcrumb>
         </div>
       </div>

src/pages/home/index.vue

@@ -261,9 +261,23 @@
           </div>
         </div>
         <div class="course__body">
-          <ul class="list clearfix">
+          <p
+            v-if="
+              !goodsList1[active1].goodsList ||
+              goodsList1[active1].goodsList.length === 0
+            "
+            class="text_align"
+          >
+            该业务层次无推荐课程
+          </p>
+          <ul v-else class="list clearfix">
             <template v-for="(item, index) in goodsList1[active1].goodsList">
-              <li class="course-item" v-if="index < 8" :key="index">
+              <li
+                class="course-item"
+                v-if="index < 8"
+                :key="index"
+                @click="goodsDetail(item, 1)"
+              >
                 <div class="course-item__img">
                   <div class="note" v-if="item.year">{{ item.year }}</div>
                   <img
@@ -277,7 +291,7 @@
                 </div>
                 <div class="course-item__desc">
                   <div class="price">￥{{ item.standPrice }}</div>
-                  <a class="add">加购物车</a>
+                  <a class="add" @click.stop="addCart(item)">加购物车</a>
                 </div>
               </li>
             </template>
@@ -285,7 +299,7 @@
         </div>
 
         <div class="course__footer">
-          <div class="btn">查看更多</div>
+          <div class="btn" @click="go('/course-list')">查看更多</div>
         </div>
       </div>
     </section>
@@ -293,7 +307,7 @@
     <section class="bank">
       <div class="container">
         <div class="bank__header">
-          <div class="title">推荐课程</div>
+          <div class="title">推荐题库</div>
           <div class="tabs">
             <div
               v-for="(item, index) in goodsList2"
@@ -307,9 +321,23 @@
           </div>
         </div>
         <div class="bank__body">
-          <ul class="list clearfix">
+          <p
+            v-if="
+              !goodsList2[active2].goodsList ||
+              goodsList2[active2].goodsList.length === 0
+            "
+            class="text_align"
+          >
+            该业务层次无推荐题库
+          </p>
+          <ul v-else class="list clearfix">
             <template v-for="(item, index) in goodsList2[active2].goodsList">
-              <li class="bank-item" v-if="index < 8" :key="index">
+              <li
+                class="bank-item"
+                v-if="index < 8"
+                :key="index"
+                @click="goodsDetail(item, 2)"
+              >
                 <div class="bank-item__img">
                   <div class="note" v-if="item.year">{{ item.year }}</div>
                   <img
@@ -323,7 +351,7 @@
                 </div>
                 <div class="bank-item__desc">
                   <div class="price">￥{{ item.standPrice }}</div>
-                  <a class="add">加购物车</a>
+                  <a class="add" @click.stop="addCart(item)">加购物车</a>
                 </div>
               </li>
             </template>
@@ -331,7 +359,7 @@
         </div>
 
         <div class="bank__footer">
-          <div class="btn">查看更多</div>
+          <div class="btn" @click="go('/bank-list')">查看更多</div>
         </div>
       </div>
     </section>
@@ -476,6 +504,45 @@ export default {
   },
   methods: {
     ...mapMutations(["setUserInfo"]),
+    /**
+     * 查看商品详情
+     */
+    goodsDetail(item, type) {
+      if (type === 1) {
+        this.$router.push({
+          path: "/course-detail/" + item.goodsId,
+        });
+      }
+      if (type === 2) {
+        this.$router.push({
+          path: "/bank-detail/" + item.goodsId,
+        });
+      }
+    },
+    /**
+     * 加入购物车
+     */
+    addCart(item) {
+      this.$request
+        .addCart({ goodsId: item.goodsId })
+        .then((res) => {
+          if (res) {
+            this.$message({
+              message: "加入购物车成功",
+              type: "success",
+            });
+          }
+        })
+        .catch((err) => {
+          this.$message({
+            message: err.msg,
+            type: "warning",
+          });
+        });
+    },
+    /**
+     * 获取推荐商品
+     */
     getActivityList() {
       this.$request
         .appCommonActivityRecommendList({ platform: 2, status: 1 })
@@ -683,6 +750,11 @@ export default {
 
 <!-- Add "scoped" attribute to limit CSS to this component only -->
 <style scoped lang="scss">
+.text_align {
+  text-align: center;
+  font-size: 18px;
+  margin: 40px 0px;
+}
 .home {
   .header {
     background: #ffffff;
@@ -1093,6 +1165,7 @@ export default {
         width: 100%;
 
         .course-item {
+          cursor: pointer;
           float: left;
           margin: 100px 9px 0;
           width: 300px;
@@ -1172,7 +1245,7 @@ export default {
               font-size: 16px;
               color: #3f8dfd;
               text-align: center;
-
+              transition: all 0.2s;
               &:hover {
                 background: #3f8dfd;
                 color: #f2f4f7;
@@ -1195,7 +1268,7 @@ export default {
         color: #3f8dfd;
         text-align: center;
         line-height: 40px;
-
+        transition: all 0.2s;
         &:hover {
           color: #fff;
           box-shadow: 0px 8px 4px 0px rgba(7, 82, 208, 0.08);
@@ -1255,6 +1328,7 @@ export default {
         width: 100%;
 
         .bank-item {
+          cursor: pointer;
           float: left;
           margin: 100px 9px 0;
           width: 300px;
@@ -1335,6 +1409,7 @@ export default {
               font-size: 16px;
               color: #3f8dfd;
               text-align: center;
+              transition: all 0.2s;
 
               &:hover {
                 background: #3f8dfd;
@@ -1358,7 +1433,7 @@ export default {
         color: #3f8dfd;
         text-align: center;
         line-height: 40px;
-
+        transition: all 0.2s;
         &:hover {
           color: #fff;
           box-shadow: 0px 8px 4px 0px rgba(7, 82, 208, 0.08);

src/pages/login/index.vue

@@ -2,7 +2,13 @@
   <div class="reg">
     <header class="header">
       <div class="container">
-        <div class="logo"></div>
+        <img
+          style="margin: 24px 0; width: 162px; height: 33px"
+          v-if="header.companyLogo"
+          :src="$tools.splitImgHost(header.companyLogo)"
+          alt=""
+        />
+        <div v-else class="logo"></div>
       </div>
     </header>
     <section class="section">
@@ -299,6 +305,7 @@
 
 <script>
 import Footer from "@/components/footer/index";
+import { mapGetters } from "vuex";
 import { mapMutations } from "vuex";
 export default {
   name: "login",
@@ -379,6 +386,9 @@ export default {
       token: "",
     };
   },
+  computed: {
+    ...mapGetters(["header"]),
+  },
   mounted() {
     this.state = this.$route.query.state || 1;
   },

src/pages/person-center/my-info/index.vue

@@ -3,40 +3,80 @@
     <div class="my-info__header">我的资料</div>
 
     <div class="my-info__body">
-      <el-form ref="form" label-width="100px">
+      <el-form label-width="100px">
         <el-form-item>
           <div class="avatar-wrap">
-            <div class="avatar"></div>
-            <div class="btn">上传头像</div>
+            <div class="avatar">
+              <img
+                v-if="listData.avatar"
+                :src="$tools.splitImgHost(listData.avatar)"
+                alt=""
+              />
+            </div>
+            <label for="uplose">
+              <div class="btn">
+                {{ listData.avatar ? "更换头像" : "上传头像" }}
+              </div></label
+            >
+            <input
+              ref="file"
+              type="file"
+              style="display: none"
+              id="uplose"
+              @change="getImgFile"
+            />
           </div>
         </el-form-item>
         <el-form-item label="昵称">
-          <el-input placeholder="请填写你的昵称"></el-input>
-          <div class="save-btn">保存</div>
+          <el-input
+            placeholder="请填写你的昵称"
+            v-model="listData.nickname"
+          ></el-input>
         </el-form-item>
         <el-form-item label="性别">
-          <el-radio-group v-model="form.resource">
-            <el-radio label="男"></el-radio>
-            <el-radio label="女"></el-radio>
+          <el-radio-group v-model="listData.sex">
+            <el-radio :label="0">男</el-radio>
+            <el-radio :label="1">女</el-radio>
           </el-radio-group>
         </el-form-item>
         <el-form-item label="年龄">
-          <el-input placeholder="请输入你的年龄"></el-input>
-          <div class="save-btn">保存</div>
+          <el-date-picker
+            v-model="listData.userBirth"
+            type="date"
+            format="yyyy 年 MM 月 dd 日"
+            value-format="yyyy-MM-dd"
+            placeholder="请输入你的出生日期"
+          >
+          </el-date-picker>
         </el-form-item>
         <el-form-item label="关联姓名">
-          <el-input placeholder="请填写你的姓名"></el-input>
-          <div class="save-btn">保存</div>
+          <el-input
+            placeholder="请填写你的姓名"
+            v-model="listData.realname"
+          ></el-input>
         </el-form-item>
         <el-form-item label="关联身份证">
-          <el-input placeholder="请输入你的身份证"></el-input>
-          <div class="save-btn">保存</div>
+          <el-input
+            placeholder="请输入你的身份证"
+            v-model="listData.idCard"
+          ></el-input>
         </el-form-item>
         <el-form-item label="所在城市">
-          <el-input placeholder="请选择你的城市"></el-input>
-          <div class="save-btn">保存</div>
+          <v-distpicker
+            @province="onProvince"
+            @city="onCity"
+            @area="onArea"
+            style="width: 510px; display: inline-block"
+            :placeholders="placeholders"
+            :province="listData.province"
+            :city="listData.city"
+            :area="listData.district"
+          ></v-distpicker>
+          <!-- <el-input placeholder="请选择你的城市"></el-input> -->
         </el-form-item>
-
+        <el-button type="primary" style="margin-left: 300px" @click="submit"
+          >保存</el-button
+        >
         <el-form-item label="账户密码">
           <div class="phone-wrap">
             <div class="slide-btn" @click="showUsername = !showUsername">
@@ -44,38 +84,38 @@
             </div>
             <div v-if="showUsername">
               <div class="note">重新修改密码请验证您的用户信息</div>
-              <el-input
-                v-model="form.userPhone"
-                placeholder="请输入手机号"
-              ></el-input>
-              <el-input v-model="form.code" placeholder="短信验证码">
-                <span slot="suffix" class="get-code">获取验证码</span>
-              </el-input>
-              <el-input
-                v-model="form.userPwd"
-                :type="pwdType"
-                placeholder="新密码"
-              >
-                <i
-                  slot="suffix"
-                  class="el-icon-view eye"
-                  :style="{ color: pwdType == 'text' ? '#3F8DFD' : '' }"
-                  @click="showPass"
-                ></i>
-              </el-input>
-              <el-input
-                v-model="form.reUsePwd"
-                :type="rePwdType"
-                placeholder="再次输入新密码"
-              >
-                <i
-                  slot="suffix"
-                  class="el-icon-view eye"
-                  :style="{ color: rePwdType == 'text' ? '#3F8DFD' : '' }"
-                  @click="showRePass"
-                ></i>
-              </el-input>
-              <div class="submit-btn">确认</div>
+              <el-form :model="form" ref="form" :rules="rules">
+                <el-form-item
+                  ><el-input
+                    v-model="listData.telphone"
+                    readonly
+                    placeholder="请输入手机号"
+                  ></el-input
+                ></el-form-item>
+
+                <el-form-item prop="oldPwd"
+                  ><el-input
+                    placeholder="请输入旧密码"
+                    v-model="form.oldPwd"
+                    show-password
+                  ></el-input
+                ></el-form-item>
+                <el-form-item prop="userPwd"
+                  ><el-input
+                    placeholder="请输入新密码"
+                    v-model="form.userPwd"
+                    show-password
+                  ></el-input
+                ></el-form-item>
+                <el-form-item prop="reUsePwd">
+                  <el-input
+                    placeholder="再次输入新密码"
+                    v-model="form.reUsePwd"
+                    show-password
+                  ></el-input
+                ></el-form-item>
+              </el-form>
+              <div class="submit-btn" @click="resultForm('form')">确认</div>
             </div>
           </div>
         </el-form-item>
@@ -86,13 +126,23 @@
             <div v-if="showPhone">
               <div class="note">重新修改密码请验证您的用户信息</div>
               <el-input
+                style="margin-bottom: 24px"
                 v-model="form.phone"
                 placeholder="请输入需要绑定的手机号"
               ></el-input>
-              <el-input v-model="form.code" placeholder="短信验证码">
-                <span slot="suffix" class="get-code">获取验证码</span>
+              <el-input
+                style="margin-bottom: 24px"
+                v-model="form.code"
+                placeholder="短信验证码"
+              >
+                <span
+                  slot="suffix"
+                  class="get-code"
+                  @click="getCodeStatus ? getCode() : ''"
+                  >{{ getCodeStatus ? "获取验证码" : `倒计时：${num}秒` }}
+                </span>
               </el-input>
-              <div class="submit-btn">确认</div>
+              <div class="submit-btn" @click="submitForm">确认</div>
             </div>
           </div>
         </el-form-item>
@@ -102,26 +152,221 @@
 </template>
 
 <script>
+import VDistpicker from "v-distpicker";
 export default {
+  components: { VDistpicker },
   name: "MyMessage",
   data() {
     return {
+      rules: {
+        oldPwd: [{ required: true, message: "请输入旧密码", trigger: "blur" }],
+        userPwd: [{ required: true, message: "请输入新密码", trigger: "blur" }],
+        reUsePwd: [
+          { required: true, message: "请再次输入新密码", trigger: "blur" },
+        ],
+      },
+      placeholders: {
+        province: "------- 省 --------",
+        city: "--- 市 ---",
+        area: "--- 区 ---",
+      },
       form: {
         resource: "",
         userPhone: "",
         userPwd: "",
         reUsePwd: "",
         phone: "",
+        oldPwd: "",
         code: "",
       },
       pwdType: "password",
       rePwdType: "password",
       showPhone: false,
       showUsername: false,
+      listData: {},
+      setTimeStatus: null,
+      getCodeStatus: true,
+      num: 60, //倒计时
     };
   },
-  mounted() {},
+  mounted() {
+    this.getUserInfo();
+  },
   methods: {
+    getCode() {
+      let testPhone = /^1[3|4|5|7|8][0-9]{9}$/;
+      if (testPhone.test(this.form.phone)) {
+        this.$request
+          .appcommonsmsbindNew({ tel: this.form.phone })
+          .then((res) => {
+            this.getCodeStatus = false;
+            this.setTimeStatus = setInterval(() => {
+              if (this.num <= 1) {
+                this.getCodeStatus = true;
+                this.num = 60;
+                clearInterval(this.setTimeStatus);
+              } else {
+                this.num--;
+              }
+            }, 1000);
+          });
+      } else {
+        this.$message.error("请输入正确手机号码");
+        return;
+      }
+    },
+    /**
+     * 确认提交修改
+     */
+    submitForm() {
+      let testPhone = /^1[3|4|5|7|8][0-9]{9}$/;
+      if (!testPhone.test(this.form.phone)) {
+        this.$message.error("请输入正确手机号码");
+        return;
+      }
+      if (!this.form.code) {
+        this.$message.error("请输入验证码");
+        return;
+      }
+      this.$request
+        .appuserbindNewTel({
+          userId: this.listData.userId,
+          tel: this.form.phone,
+          code: this.form.code,
+        })
+        .then((res) => {
+          this.$message.success("绑定成功");
+        });
+    },
+    /**
+     * 验证
+     */
+    resultForm(formName) {
+      this.$refs[formName].validate((valid) => {
+        if (valid) {
+          this.submitPwd();
+        } else {
+          console.log("error submit!!");
+          return false;
+        }
+      });
+    },
+    /**
+     * 修改密码
+     */
+    submitPwd() {
+      if (!this.form.oldPwd) {
+        this.$message.error("请输入旧密码");
+        return;
+      }
+      if (!this.form.newPwd && !this.form.reUsePwd) {
+        this.$message.error("请输入新密码");
+        return;
+      }
+      if (this.form.newPwd !== this.form.reUsePwd) {
+        this.$message.error("密码不一致");
+        return;
+      }
+      let data = {
+        userId: this.listData.userId,
+        oldPwd: this.form.oldPwd,
+        newPwd: this.form.userPwd,
+      };
+      this.$request.appuserupdatePwd(data).then((res) => {
+        this.$message.success("修改成功，请重新登录");
+      });
+    },
+    /**
+     * 更新头像
+     */
+    getImgFile() {
+      var self = this;
+      var file = self.$refs.file.files[0];
+      if (file === undefined) {
+        self.$set(self.listData, "avatar", "");
+        return;
+      }
+      if (file.size > 0.3 * 1024 * 1024) {
+        self.$message.error("图片不得大于300kb");
+        return;
+      }
+      var type = self.$refs.file.value.toLowerCase().split(".").splice(-1);
+      if (
+        type[0] != "jpg" &&
+        type[0] != "png" &&
+        type[0] != "jpeg" &&
+        type[0] != "gif"
+      ) {
+        self.$message.error("上传格式需为：.jpg/.png/.jpeg/gif");
+        self.$refs.file.value = "";
+        return;
+      }
+      this.$upload.upload(file, 0).then((res) => {
+        self.listData.avatar = res;
+      });
+    },
+    onProvince(data) {
+      if (!data.code) {
+        this.listData.province = "";
+      } else {
+        this.listData.province = data.value;
+      }
+    },
+    onCity(data) {
+      if (!data.code) {
+        this.listData.city = "";
+      } else {
+        this.listData.city = data.value;
+      }
+    },
+    onArea(data) {
+      if (!data.code) {
+        this.listData.district = "";
+      } else {
+        this.listData.district = data.value;
+      }
+    },
+    getUserInfo() {
+      this.$store.dispatch("getUserInfo").then(() => {
+        this.listData = this.$store.getters.userInfo;
+      });
+    },
+    /**
+     * 保存信息
+     */
+    submit() {
+      if (
+        (this.listData.province ||
+          this.listData.city ||
+          this.listData.district) &&
+        !(
+          this.listData.province &&
+          this.listData.city &&
+          this.listData.district
+        )
+      ) {
+        this.$message.warning("请选择所在城市");
+        return;
+      }
+      let data = {
+        userId: this.listData.userId,
+        avatar: this.listData.avatar,
+        nickname: this.listData.nickname,
+        sex: this.listData.sex,
+        userBirth: this.listData.userBirth,
+        realname: this.listData.realname,
+        idCard: this.listData.idCard,
+        province: this.listData.province,
+        city: this.listData.city,
+        district: this.listData.district,
+      };
+      this.$request.editAppUser(data).then((res) => {
+        if (res.code === 200) {
+          this.$store.dispatch("getUserInfo");
+          this.$message.success("保存成功");
+        }
+      });
+    },
     showRePass() {
       if (this.rePwdType == "password") {
         this.rePwdType = "text";
@@ -164,6 +409,11 @@ export default {
         background: #3f8dfd;
         border-radius: 50%;
         float: left;
+        overflow: hidden;
+        img {
+          width: 100%;
+          height: 100%;
+        }
       }
 
       .btn {
@@ -217,9 +467,9 @@ export default {
         font-weight: 400;
         color: #999999;
       }
-      .el-input {
-        margin-bottom: 24px;
-      }
+      // .el-input {
+      //   margin-bottom: 24px;
+      // }
 
       .submit-btn {
         width: 122px;
@@ -239,4 +489,7 @@ export default {
     }
   }
 }
+/deep/ .el-form-item {
+  margin-bottom: 22px;
+}
 </style>

src/store/index.js

@@ -65,10 +65,7 @@ export default new Vuex.Store({
     getUserInfo(context) {
       return new Promise(resolve => {
         login.getInfo().then(res => {
-          console.log(res)
-
           context.commit('setUserInfo', res.data)
-
           resolve()
         })
       })