From d8c6aefd13cee7aa56f72cd171b306b5e698d0d2 Mon Sep 17 00:00:00 2001
From: fanxb <fleyx20@outlook.com>
Date: Fri, 5 Mar 2021 17:03:51 +0800
Subject: [PATCH] =?UTF-8?q?feat:=E4=B8=AA=E4=BA=BA=E4=BF=A1=E6=81=AF?=
 =?UTF-8?q?=E5=8A=9F=E8=83=BD=E4=BF=AE=E6=94=B9?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../business/user/entity/EmailUpdateBody.java |  2 +-
 .../user/entity/UpdatePasswordBody.java       |  2 +-
 .../user/service/BaseInfoService.java         | 14 ++-
 bookmark_front/public/index.html              |  1 -
 bookmark_front/src/layout/main/Bottom.vue     |  6 +-
 bookmark_front/src/layout/main/Top.vue        |  3 +-
 .../src/store/modules/globalConfig.js         |  6 ++
 .../views/main/pages/personSpace/UserInfo.vue | 97 ++++++++++++++++++-
 8 files changed, 111 insertions(+), 20 deletions(-)

diff --git a/bookMarkService/business/user/src/main/java/com/fanxb/bookmark/business/user/entity/EmailUpdateBody.java b/bookMarkService/business/user/src/main/java/com/fanxb/bookmark/business/user/entity/EmailUpdateBody.java
index 5f4fefb..cd7da78 100644
--- a/bookMarkService/business/user/src/main/java/com/fanxb/bookmark/business/user/entity/EmailUpdateBody.java
+++ b/bookMarkService/business/user/src/main/java/com/fanxb/bookmark/business/user/entity/EmailUpdateBody.java
@@ -17,7 +17,7 @@ import javax.validation.constraints.Pattern;
 @Data
 public class EmailUpdateBody {
     @NotNull(message = "参数不为空")
-    private String actionId;
+    private String oldPassword;
     @Email(message = "请输入有效邮箱地址")
     private String email;
 }
diff --git a/bookMarkService/business/user/src/main/java/com/fanxb/bookmark/business/user/entity/UpdatePasswordBody.java b/bookMarkService/business/user/src/main/java/com/fanxb/bookmark/business/user/entity/UpdatePasswordBody.java
index 82357fc..a210d2b 100644
--- a/bookMarkService/business/user/src/main/java/com/fanxb/bookmark/business/user/entity/UpdatePasswordBody.java
+++ b/bookMarkService/business/user/src/main/java/com/fanxb/bookmark/business/user/entity/UpdatePasswordBody.java
@@ -15,7 +15,7 @@ import javax.validation.constraints.Pattern;
 @Data
 public class UpdatePasswordBody {
 
-    private String actionId;
+    private String oldPassword;
     @Pattern(regexp = ValidatedConstant.PASSWORD_REG, message = ValidatedConstant.PASSWORD_MESSAGE)
     private String password;
 }
diff --git a/bookMarkService/business/user/src/main/java/com/fanxb/bookmark/business/user/service/BaseInfoService.java b/bookMarkService/business/user/src/main/java/com/fanxb/bookmark/business/user/service/BaseInfoService.java
index 9f08a48..374a446 100644
--- a/bookMarkService/business/user/src/main/java/com/fanxb/bookmark/business/user/service/BaseInfoService.java
+++ b/bookMarkService/business/user/src/main/java/com/fanxb/bookmark/business/user/service/BaseInfoService.java
@@ -1,5 +1,6 @@
 package com.fanxb.bookmark.business.user.service;
 
+import cn.hutool.core.util.StrUtil;
 import com.fanxb.bookmark.business.user.constant.RedisConstant;
 import com.fanxb.bookmark.business.user.dao.UserDao;
 import com.fanxb.bookmark.business.user.entity.EmailUpdateBody;
@@ -39,10 +40,9 @@ public class BaseInfoService {
 
     public void changePassword(UpdatePasswordBody body) {
         int userId = UserContextHolder.get().getUserId();
-        String checkAuthKey = com.fanxb.bookmark.common.constant.RedisConstant.getPasswordCheckKey(userId, body.getActionId());
-        String str = RedisUtil.get(checkAuthKey, String.class);
-        if (str == null) {
-            throw new CustomException("密码校验失败，无法更新密码");
+        String password = userDao.selectByUserId(userId).getPassword();
+        if (!StrUtil.equals(password, HashUtil.getPassword(body.getOldPassword()))) {
+            throw new CustomException("旧密码错误");
         }
         userDao.updatePasswordByUserId(userId, HashUtil.getPassword(body.getPassword()));
     }
@@ -69,12 +69,10 @@ public class BaseInfoService {
     @Transactional(rollbackFor = Exception.class)
     public void updateEmail(EmailUpdateBody body) {
         int userId = UserContextHolder.get().getUserId();
-        String checkAuthKey = com.fanxb.bookmark.common.constant.RedisConstant.getPasswordCheckKey(userId, body.getActionId());
-        String str = RedisUtil.get(checkAuthKey, String.class);
-        if (str == null) {
+        String oldPassword = userDao.selectByUserId(userId).getPassword();
+        if (!StrUtil.equals(oldPassword, HashUtil.getPassword(body.getOldPassword()))) {
             throw new CustomException("密码校验失败，无法更新email");
         }
-        RedisUtil.delete(checkAuthKey);
         String secret = UUID.randomUUID().toString().replaceAll("-", "");
         String url = VERIFY_EMAIL.replaceAll("XXXX", Constant.serviceAddress + VERIFY_EMAIL_PATH + secret);
         log.debug(url);
diff --git a/bookmark_front/public/index.html b/bookmark_front/public/index.html
index 045bc59..141137b 100644
--- a/bookmark_front/public/index.html
+++ b/bookmark_front/public/index.html
@@ -3,7 +3,6 @@
   <head>
     <meta charset="utf-8" />
     <meta http-equiv="X-UA-Compatible" content="IE=edge" />
-    <!-- <meta name="viewport" content="width=device-width,initial-scale=1.0" /> -->
     <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
     <link rel="icon" href="<%= BASE_URL %>favicon.ico" />
     <title><%= htmlWebpackPlugin.options.title %></title>
diff --git a/bookmark_front/src/layout/main/Bottom.vue b/bookmark_front/src/layout/main/Bottom.vue
index 0f54304..e16be90 100644
--- a/bookmark_front/src/layout/main/Bottom.vue
+++ b/bookmark_front/src/layout/main/Bottom.vue
@@ -1,19 +1,19 @@
 <template>
   <div class="main">
-    <div>bottom</div>
+    <div>开源地址:<a href="https://github.com/FleyX/bookmark">github.com/FleyX/bookmark</a> &emsp;<a href="https://github.com/FleyX/bookmark/issues">反馈/建议</a></div>
   </div>
 </template>
 
 <script>
 export default {
-  name: "Bottom"
+  name: "Bottom",
 };
 </script>
 
 <style lang="less" scoped>
 @import "../../global";
 .main {
-  background-color: gray;
+  background-color: rgb(207, 198, 198);
   height: @bottomHeight;
   display: flex;
   justify-content: center;
diff --git a/bookmark_front/src/layout/main/Top.vue b/bookmark_front/src/layout/main/Top.vue
index 9deb73b..bb69da3 100644
--- a/bookmark_front/src/layout/main/Top.vue
+++ b/bookmark_front/src/layout/main/Top.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="main">
-    <img class="ico" src="/static/img/bookmarkLogo.png" />
+    <a class="ico" href="/"><img src="/static/img/bookmarkLogo.png" /></a>
     <a-dropdown>
       <div class="user">
         <img :src="userInfo.icon" class="userIcon" />
@@ -52,6 +52,7 @@ export default {
   background-color: rgba(197, 190, 198, 0.4);
   z-index: 100;
   .ico {
+    display: flex;
     height: 100%;
   }
   .user {
diff --git a/bookmark_front/src/store/modules/globalConfig.js b/bookmark_front/src/store/modules/globalConfig.js
index 3fa7efb..c31e960 100644
--- a/bookmark_front/src/store/modules/globalConfig.js
+++ b/bookmark_front/src/store/modules/globalConfig.js
@@ -1,4 +1,5 @@
 import localforage from "localforage";
+import HttpUtil from "../../util/HttpUtil";
 /**
  * 存储全局配置
  */
@@ -36,6 +37,11 @@ const actions = {
     context.commit("isInit", true);
     context.commit("isPhone", /Android|webOS|iPhone|iPod|BlackBerry/i.test(navigator.userAgent));
   },
+  async refreshUserInfo({ commit }) {
+    let userInfo = await HttpUtil.get("/user/currentUserInfo");
+    await localforage.setItem("userInfo", userInfo);
+    commit("setUserInfo", userInfo);
+  },
   //登出清除数据
   async clear(context) {
     await localforage.removeItem("userInfo");
diff --git a/bookmark_front/src/views/main/pages/personSpace/UserInfo.vue b/bookmark_front/src/views/main/pages/personSpace/UserInfo.vue
index 59e537a..ad3c313 100644
--- a/bookmark_front/src/views/main/pages/personSpace/UserInfo.vue
+++ b/bookmark_front/src/views/main/pages/personSpace/UserInfo.vue
@@ -11,9 +11,50 @@
     </div>
     <div class="baseInfo">
       <div class="item">
-        <span>昵称</span>
-        <span>{{userInfo.name}}</span>
+
+        <a-tooltip title="点击修改" v-if="currentAction!='name'">
+          <span style="font-size:2em;cursor: pointer;" @click="()=>this.currentAction='name'">{{userInfo.username}}</span>
+        </a-tooltip>
+        <div class="inputGroup" v-else-if="currentAction==='name'">
+          <a-input type="text" v-model="name" placeholder="修改昵称" />
+          <div style="padding-top:0.2em">
+            <a-button style="margin-right:2em" type="warn" @click="()=>this.currentAction=null">取消</a-button>
+            <a-button type="primary" @click="submit">确定</a-button>
+          </div>
+        </div>
       </div>
+
+      <div class="item">
+        <span style="width:5em">密码</span>
+        <a-tooltip title="点击修改" v-if="currentAction!='password'">
+          <span style="cursor: pointer;" @click="()=>this.currentAction='password'">**********</span>
+        </a-tooltip>
+        <div class="inputGroup" v-else-if="currentAction==='password'">
+          <a-input type="password" v-model="oldPassword" placeholder="旧密码" />
+          <a-input type="password" v-model="password" placeholder="新密码" />
+          <a-input type="password" v-model="rePassword" placeholder="重复新密码" />
+          <div style="padding-top:0.2em">
+            <a-button style="margin-right:2em" type="warn" @click="()=>this.currentAction=null">取消</a-button>
+            <a-button type="primary" @click="submit">确定</a-button>
+          </div>
+        </div>
+      </div>
+
+      <div class="item">
+        <span style="width:5em">邮箱</span>
+        <a-tooltip title="点击修改" v-if="currentAction!='email'">
+          <span style="cursor: pointer;" @click="()=>this.currentAction='email'">{{userInfo.email}}</span>
+        </a-tooltip>
+        <div class="inputGroup" v-else-if="currentAction==='email'">
+          <a-input type="password" v-model="oldPassword" placeholder="旧密码" />
+          <a-input type="email" v-model="email" placeholder="email" />
+          <div style="padding-top:0.2em">
+            <a-button style="margin-right:2em" type="warn" @click="()=>this.currentAction=null">取消</a-button>
+            <a-button type="primary" @click="submit">确定</a-button>
+          </div>
+        </div>
+      </div>
+
     </div>
   </div>
 </template>
@@ -23,15 +64,24 @@ import { mapState } from "vuex";
 import HttpUtil from "../../../../util/HttpUtil";
 export default {
   name: "UserInfo",
+  data() {
+    return {
+      currentAction: null, //当前操作,name,password,email
+      name: "",
+      oldPassword: "",
+      password: "",
+      rePassword: "",
+      email: "",
+    };
+  },
   computed: {
     ...mapState("globalConfig", ["userInfo"]),
   },
   methods: {
     async changeIcon(e) {
       let file = e.target.files[0];
-      console.log(file);
-      if (!file || file.size > 500 * 1024 * 8) {
-        message.error("文件大小请勿超过500KB");
+      if (!file || file.size > 200 * 1024) {
+        message.error("文件大小请勿超过200KB");
         return;
       }
       let formData = new FormData();
@@ -39,6 +89,30 @@ export default {
       let res = await HttpUtil.post("/user/icon", null, formData, true);
       this.$set(this.userInfo, "icon", res);
     },
+    async submit() {
+      let url, body;
+      if (this.currentAction === "name") {
+        url = "/baseInfo/username";
+        body = { username: this.name };
+      } else if (this.currentAction === "password") {
+        if (!this.password === this.rePassword) {
+          this.$message.error("新密码两次输入不一致");
+          return;
+        }
+        url = "/baseInfo/password";
+        body = {
+          oldPassword: this.oldPassword,
+          password: this.password,
+        };
+      } else {
+        url = "/baseInfo/email";
+        body = { oldPassword: this.oldPassword, email: this.email };
+      }
+      await HttpUtil.post(url, null, body);
+      await this.$store.dispatch("globalConfig/refreshUserInfo");
+      this.$message.success("操作成功");
+      this.currentAction = null;
+    },
   },
 };
 </script>
@@ -54,6 +128,7 @@ export default {
     position: relative;
     border-radius: 5px;
     margin-right: 1em;
+    cursor: pointer;
     @media (min-width: 768px) {
       width: 150px;
       height: 150px;
@@ -85,6 +160,18 @@ export default {
     }
   }
 
+  .item {
+    font-size: 1.5em;
+    padding-top: 1em;
+    padding-bottom: 1em;
+    border-bottom: 1px solid #ebebeb;
+
+    display: flex;
+    .inputGroup {
+      flex: 1;
+    }
+  }
+
   .baseInfo {
     flex: 1;
   }