From 5998fc3edd2e14101775835ccbe1291fc88cc5e7 Mon Sep 17 00:00:00 2001
From: Ran_Chen <1908198662@qq.com>
Date: Tue, 1 Apr 2025 10:59:35 +0800
Subject: [PATCH] =?UTF-8?q?user=E6=8E=A5=E5=8F=A3=E4=BF=AE=E6=94=B9?=
 =?UTF-8?q?=E5=B9=B6=E6=B5=8B=E8=AF=95?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 main/manager-web/src/apis/httpRequest.js      |   5 +-
 main/manager-web/src/apis/module/user.js      |   4 +-
 .../assets/header/{roboot.png => robot.png}   | Bin
 .../src/components/ChangePasswordDialog.vue   | 109 ++++++++++--------
 main/manager-web/src/components/HeaderBar.vue |  12 +-
 main/manager-web/src/store/index.js           |   2 +-
 main/manager-web/src/views/login.vue          |  24 ++--
 7 files changed, 84 insertions(+), 72 deletions(-)
 rename main/manager-web/src/assets/header/{roboot.png => robot.png} (100%)

diff --git a/main/manager-web/src/apis/httpRequest.js b/main/manager-web/src/apis/httpRequest.js
index 98f47bf7..4d8093d3 100755
--- a/main/manager-web/src/apis/httpRequest.js
+++ b/main/manager-web/src/apis/httpRequest.js
@@ -105,11 +105,12 @@ function httpHandlerError(info, callBack) {
     /** 请求成功，退出该函数 可以根据项目需求来判断是否请求成功。这里判断的是status为200的时候是成功 */
     let networkError = false
     if (info.status === 200) {
-
         if (info.data.code === 'success' || info.data.code === 0 || info.data.code === undefined) {
             return networkError
         }else if (info.data.code === 401) {
-            goToPage(Constant.PAGE.LOGIN, true)
+            console.log('触发 401，清除 Token 并跳转登录页');
+            store.commit('clearAuth');
+            window.location.href = '/login';
             return true
         } else {
             showDanger(info.data.msg)
diff --git a/main/manager-web/src/apis/module/user.js b/main/manager-web/src/apis/module/user.js
index 1fb3503d..5ce20941 100755
--- a/main/manager-web/src/apis/module/user.js
+++ b/main/manager-web/src/apis/module/user.js
@@ -138,8 +138,8 @@ export default {
             .url(`${getServiceUrl()}/api/v1/user/change-password`)
             .method('PUT')
             .data({
-                old_password: oldPassword,
-                new_password: newPassword,
+                password: oldPassword,
+                newPassword: newPassword,
             })
             .success((res) => {
                 RequestService.clearRequestTime();
diff --git a/main/manager-web/src/assets/header/roboot.png b/main/manager-web/src/assets/header/robot.png
similarity index 100%
rename from main/manager-web/src/assets/header/roboot.png
rename to main/manager-web/src/assets/header/robot.png
diff --git a/main/manager-web/src/components/ChangePasswordDialog.vue b/main/manager-web/src/components/ChangePasswordDialog.vue
index 19c20fd6..ffefdb41 100644
--- a/main/manager-web/src/components/ChangePasswordDialog.vue
+++ b/main/manager-web/src/components/ChangePasswordDialog.vue
@@ -1,57 +1,63 @@
 <template>
-  <el-dialog :visible.sync="visible" width="400px" center>
-    <div
-        style="margin: 0 10px 10px;display: flex;align-items: center;gap: 10px;font-weight: 700;font-size: 20px;text-align: left;color: #3d4566;">
+  <form>
+    <el-dialog :visible.sync="value" width="400px" center>
       <div
-          style="width: 40px;height: 40px;border-radius: 50%;background: #5778ff;display: flex;align-items: center;justify-content: center;">
-        <img src="@/assets/login/shield.png" alt="" style="width: 19px;height: 23px; filter: brightness(0) invert(1);" />
+          style="margin: 0 10px 10px;display: flex;align-items: center;gap: 10px;font-weight: 700;font-size: 20px;text-align: left;color: #3d4566;">
+        <div
+            style="width: 40px;height: 40px;border-radius: 50%;background: #5778ff;display: flex;align-items: center;justify-content: center;">
+          <img src="@/assets/login/shield.png" alt="" style="width: 19px;height: 23px; filter: brightness(0) invert(1);" />
+        </div>
+        修改密码
       </div>
-      修改密码
-    </div>
-    <div style="height: 1px;background: #e8f0ff;"/>
-    <div style="margin: 22px 15px;">
-      <div style="font-weight: 400;font-size: 14px;text-align: left;color: #3d4566;">
-        <div style="color: red;display: inline-block;">*</div>
-        旧密码：
+      <div style="height: 1px;background: #e8f0ff;"/>
+      <div style="margin: 22px 15px;">
+        <div style="font-weight: 400;font-size: 14px;text-align: left;color: #3d4566;">
+          <div style="color: red;display: inline-block;">*</div>
+          旧密码：
+        </div>
+        <div class="input-46" style="margin-top: 12px;">
+          <el-input placeholder="请输入旧密码" v-model="oldPassword" type="password" show-password/>
+        </div>
+        <div style="font-weight: 400;font-size: 14px;text-align: left;color: #3d4566;margin-top: 12px;">
+          <div style="color: red;display: inline-block;">*</div>
+          新密码：
+        </div>
+        <div class="input-46" style="margin-top: 12px;">
+          <el-input placeholder="请输入新密码" v-model="newPassword" type="password" show-password/>
+        </div>
+        <div style="font-weight: 400;font-size: 14px;text-align: left;color: #3d4566;margin-top: 12px;">
+          <div style="color: red;display: inline-block;">*</div>
+          确认新密码：
+        </div>
+        <div class="input-46" style="margin-top: 12px;">
+          <el-input placeholder="请再次输入新密码" v-model="confirmNewPassword" type="password" show-password/>
+        </div>
       </div>
-      <div class="input-46" style="margin-top: 12px;">
-        <el-input placeholder="请输入旧密码" v-model="oldPassword" type="password" show-password/>
+      <div style="display: flex;margin: 15px 15px;gap: 7px;">
+        <div class="dialog-btn" @click="confirm">
+          确定
+        </div>
+        <div class="dialog-btn"
+             style="background: #e6ebff;border: 1px solid #adbdff;color: #5778ff;"
+             @click="cancel">
+          取消
+        </div>
       </div>
-      <div style="font-weight: 400;font-size: 14px;text-align: left;color: #3d4566;margin-top: 12px;">
-        <div style="color: red;display: inline-block;">*</div>
-        新密码：
-      </div>
-      <div class="input-46" style="margin-top: 12px;">
-        <el-input placeholder="请输入新密码" v-model="newPassword" type="password" show-password/>
-      </div>
-      <div style="font-weight: 400;font-size: 14px;text-align: left;color: #3d4566;margin-top: 12px;">
-        <div style="color: red;display: inline-block;">*</div>
-        确认新密码：
-      </div>
-      <div class="input-46" style="margin-top: 12px;">
-        <el-input placeholder="请再次输入新密码" v-model="confirmNewPassword" type="password" show-password/>
-      </div>
-    </div>
-    <div style="display: flex;margin: 15px 15px;gap: 7px;">
-      <div class="dialog-btn" @click="confirm">
-        确定
-      </div>
-      <div class="dialog-btn"
-           style="background: #e6ebff;border: 1px solid #adbdff;color: #5778ff;"
-           @click="cancel">
-        取消
-      </div>
-    </div>
-  </el-dialog>
+    </el-dialog>
+  </form>
 </template>
 
 <script>
 import userApi from '@/apis/module/user';
+import { mapActions } from 'vuex';
 
 export default {
   name: 'ChangePasswordDialog',
   props: {
-    visible: {type: Boolean, required: true}
+    value: {
+      type: Boolean,
+      required: true
+    }
   },
   data() {
     return {
@@ -61,6 +67,7 @@ export default {
     }
   },
   methods: {
+    ...mapActions(['logout']), // 引入Vuex的logout action
     confirm() {
       if (!this.oldPassword.trim() || !this.newPassword.trim() || !this.confirmNewPassword.trim()) {
         this.$message.error('请填写所有字段');
@@ -75,22 +82,24 @@ export default {
         return;
       }
 
-      // 直接调用修改密码接口
+      // 修改后的接口调用
       userApi.changePassword(this.oldPassword, this.newPassword, (res) => {
-        if (res.code === 0) {
-          this.$message.error(res.msg || '密码修改失败');
-        } else {
-          this.$message.success('密码修改成功');
-          this.$emit('confirm', res);
-          this.$emit('update:visible', false);
-          this.resetForm();
+        if (res.data.code === 0) {
+          this.$message.success('密码修改成功，请重新登录');
+          this.logout().then(() => {
+            this.$router.push('/login');
+            this.$emit('update:visible', false);
+          });
+        }else{
+          this.$message.error(res.data.msg || '密码修改失败');
         }
       }, (err) => {
         this.$message.error(err.msg || '密码修改失败');
       });
+      this.$emit('input', false);
     },
     cancel() {
-      this.$emit('update:visible', false);
+      this.$emit('input', false);
       this.resetForm();
     },
     resetForm() {
diff --git a/main/manager-web/src/components/HeaderBar.vue b/main/manager-web/src/components/HeaderBar.vue
index 0828d201..264773ff 100644
--- a/main/manager-web/src/components/HeaderBar.vue
+++ b/main/manager-web/src/components/HeaderBar.vue
@@ -10,7 +10,7 @@
       <!-- 中间导航菜单 -->
       <div class="header-center">
         <div class="equipment-management" :class="{ 'active-tab': $route.path === '/home' }" @click="goHome">
-          <img alt="" src="@/assets/header/roboot.png" :style="{ filter: $route.path === '/home' ? 'brightness(0) invert(1)' : 'None' }"/>
+          <img alt="" src="@/assets/header/robot.png" :style="{ filter: $route.path === '/home' ? 'brightness(0) invert(1)' : 'None' }"/>
           智能体管理
         </div>
         <div class="equipment-management" :class="{ 'active-tab': $route.path === '/user-management' }" @click="goUserManagement">
@@ -27,7 +27,7 @@
       <div class="header-right">
         <div class="search-container">
           <el-input
-            v-model="serach"
+            v-model="search"
             placeholder="输入名称搜索.."
             class="custom-search-input"
             @keyup.enter.native="handleSearch"
@@ -38,7 +38,7 @@
         <img alt="" src="@/assets/home/avatar.png" class="avatar-img"/>
         <el-dropdown trigger="click" class="user-dropdown">
           <span class="el-dropdown-link">
-             {{ userInfo.mobile || '加载中...' }}<i class="el-icon-arrow-down el-icon--right"></i>
+             {{ userInfo.username || '加载中...' }}<i class="el-icon-arrow-down el-icon--right"></i>
           </span>
           <el-dropdown-menu slot="dropdown">
             <el-dropdown-item icon="el-icon-plus" @click.native="">个人中心</el-dropdown-item>
@@ -50,7 +50,7 @@
     </div>
 
     <!-- 修改密码弹窗 -->
-    <ChangePasswordDialog :visible.sync="isChangePasswordDialogVisible"/>
+    <ChangePasswordDialog v-model="isChangePasswordDialogVisible"/>
   </el-header>
 </template>
 
@@ -68,7 +68,7 @@ export default {
   props: ['devices'],  // 接收父组件设备列表
   data() {
     return {
-      serach: '',
+      search: '',
       userInfo: {
         username: '',
         mobile: ''
@@ -99,7 +99,7 @@ export default {
 
     // 处理搜索
     handleSearch() {
-      const searchValue = this.serach.trim();
+      const searchValue = this.search.trim();
       let filteredDevices;
 
       if (!searchValue) {
diff --git a/main/manager-web/src/store/index.js b/main/manager-web/src/store/index.js
index c781243e..d0292a63 100644
--- a/main/manager-web/src/store/index.js
+++ b/main/manager-web/src/store/index.js
@@ -39,7 +39,7 @@ export default new Vuex.Store({
     logout({ commit }) {
       return new Promise((resolve) => {
         commit('clearAuth')
-        resolve()
+        window.location.href = '/login';
       })
     }
   },
diff --git a/main/manager-web/src/views/login.vue b/main/manager-web/src/views/login.vue
index ef6255e1..ea3b7b73 100644
--- a/main/manager-web/src/views/login.vue
+++ b/main/manager-web/src/views/login.vue
@@ -9,7 +9,7 @@
         </div>
       </el-header>
       <el-main style="position: relative;">
-        <div class="login-box">
+        <div class="login-box" @keyup.enter="login">
           <div
               style="display: flex;align-items: center;gap: 20px;margin-bottom: 39px;padding: 0 30px;">
             <img alt="" src="@/assets/login/hi.png" style="width: 34px;height: 34px;"/>
@@ -87,8 +87,11 @@ export default {
   },
   methods: {
     fetchCaptcha() {
+      console.log(this.$store.getters.getToken)
       if (this.$store.getters.getToken) {
-        goToPage('/home')
+        if (this.$route.path !== '/home'){
+          this.$router.push('/home')
+        }
       } else {
         this.captchaUuid = getUUID();
 
@@ -96,10 +99,8 @@ export default {
           if (res.status === 200) {
             const blob = new Blob([res.data], {type: res.data.type});
             this.captchaUrl = URL.createObjectURL(blob);
-
           } else {
-            console.error('验证码加载异常:', error);
-            showDanger('验证码加载失败，点击刷新')
+            showDanger('验证码加载失败，点击刷新');
           }
         });
       }
@@ -130,12 +131,13 @@ export default {
 
       this.form.captchaId = this.captchaUuid
       Api.user.login(this.form, ({data}) => {
-        console.log(data)
-        showSuccess('登陆成功！')
-        // 将令牌存储到 Vuex 中
-        this.$store.commit('setToken', JSON.stringify(data.data))
-
-        goToPage('/home')
+        if (data.code === 0) {
+          showSuccess('登录成功！');
+          this.$store.commit('setToken', JSON.stringify(data.data));
+          goToPage('/home');
+        } else {
+          showDanger(data.msg || '登录失败');
+        }
       })
 
       // 重新获取验证码