diff --git a/internal/api/v1/user/types.go b/internal/api/v1/user/types.go
index 064848ef1..1b6212830 100644
--- a/internal/api/v1/user/types.go
+++ b/internal/api/v1/user/types.go
@@ -4,7 +4,7 @@ import v1User "github.com/KubeOperator/kubepi/internal/model/v1/user"
 
 type User struct {
 	v1User.User
-	Roles []string `json:"roles"`
-	Password string `json:"password"`
+	Roles       []string `json:"roles"`
+	OldPassword string   `json:"oldPassword"`
+	Password    string   `json:"password"`
 }
-
diff --git a/internal/api/v1/user/user.go b/internal/api/v1/user/user.go
index d921a71e9..3cb3bdf96 100644
--- a/internal/api/v1/user/user.go
+++ b/internal/api/v1/user/user.go
@@ -329,9 +329,9 @@ func (h *Handler) UpdateUser() iris.Handler {
 			return
 		}
 		if req.Password != "" {
-			if err := h.userService.ResetPassword(userName, req.Password, common.DBOptions{}); err != nil {
+			if err := h.userService.UpdatePassword(userName, req.OldPassword, req.Password, common.DBOptions{}); err != nil {
 				ctx.StatusCode(iris.StatusInternalServerError)
-				ctx.Values().Set("message", err.Error())
+				ctx.Values().Set("message", "can not match original password")
 				return
 			}
 			ctx.Values().Set("data", "ok")
diff --git a/web/kubepi/src/business/app-layout/header-components/UserSetting.vue b/web/kubepi/src/business/app-layout/header-components/UserSetting.vue
index b101a73ae..aa2b7bd26 100644
--- a/web/kubepi/src/business/app-layout/header-components/UserSetting.vue
+++ b/web/kubepi/src/business/app-layout/header-components/UserSetting.vue
@@ -9,6 +9,9 @@
       <el-dropdown-item style="text-align: center" command="profile">
         {{ $t("commons.personal.profile") }}
       </el-dropdown-item>
+      <el-dropdown-item style="text-align: center" command="password">
+        {{ $t("business.user.change_password") }}
+      </el-dropdown-item>
 
 
       <el-dropdown-item style="text-align: center" divided command="exit">
@@ -27,7 +30,8 @@ export default {
   name: "UserSetting",
   computed: {
     ...mapGetters([
-      "nickName"
+      "nickName",
+      "name"
     ])
   },
   methods: {
@@ -39,6 +43,9 @@ export default {
         case "profile":
           this.$router.push("/profile")
           break
+        case "password":
+          this.$router.push({name: "UserPassword", params: {name: this.name}})
+          break
         default:
           this.aboutDialogVisible = true
           break
diff --git a/web/kubepi/src/business/profile/index.vue b/web/kubepi/src/business/profile/index.vue
index 54f07d8f3..0ffcecb63 100644
--- a/web/kubepi/src/business/profile/index.vue
+++ b/web/kubepi/src/business/profile/index.vue
@@ -21,10 +21,6 @@
               <span v-if="editModeOpened"><el-input v-model="profileForm.email"></el-input></span>
             </el-form-item>
 
-            <el-form-item :label="$t('business.user.password')">
-              <el-link @click="openPasswordChange">{{ $t('business.user.change_password') }}</el-link>
-            </el-form-item>
-
             <el-form-item>
               <div style="float: right">
                 <el-button v-if="!editModeOpened" @click="onEditProfile">{{ $t("commons.button.edit") }}</el-button>
@@ -36,75 +32,27 @@
               </div>
             </el-form-item>
           </el-form>
-
         </div>
       </el-col>
       <el-col :span="4"><br/></el-col>
     </el-row>
-
-    <el-dialog
-        :title="$t('business.user.change_password')"
-        :visible.sync="changePasswordOpened"
-        :close-on-click-modal="false"
-        width="30%">
-      <div>
-        <el-form :rules="passwordChangeRules" ref="passwordChangeFrom" :model="passwordChangeFrom" label-width="150px"
-                 label-position="left">
-          <el-form-item :label="$t('business.user.old_password')" prop="oldPassword">
-            <el-input type="password" v-model="passwordChangeFrom.oldPassword"></el-input>
-          </el-form-item>
-          <el-form-item :label="$t('business.user.new_password')" prop="newPassword">
-            <el-input type="password" v-model="passwordChangeFrom.newPassword"></el-input>
-          </el-form-item>
-          <el-form-item :label="$t('business.user.confirm_password')" prop="confirmPassword">
-            <el-input type="password" v-model="passwordChangeFrom.confirmPassword"></el-input>
-          </el-form-item>
-        </el-form>
-      </div>
-      <span slot="footer" class="dialog-footer">
-    <el-button @click="changePasswordOpened = false">{{ $t("commons.button.cancel") }}</el-button>
-    <el-button type="primary" @click="onChangePasswordConfirm">{{ $t("commons.button.confirm") }}</el-button>
-  </span>
-    </el-dialog>
-
-
   </layout-content>
 </template>
 
 <script>
 import LayoutContent from "@/components/layout/LayoutContent"
-import {getCurrentUser, updateProfile, updatePassword,} from "@/api/auth"
+import {getCurrentUser, updateProfile} from "@/api/auth"
 import Rules from "@/utils/rules"
 
 export default {
   name: "UserProfile",
   components: {LayoutContent},
   data() {
-    var validatePass = (rule, value, callback) => {
-      if (value === '') {
-        callback(new Error(this.$t('business.user.please_input_password')));
-      } else {
-        if (this.passwordChangeFrom.newPassword !== '') {
-          this.$refs.passwordChangeFrom.validateField('checkPass');
-        }
-        callback();
-      }
-    };
-    var validatePass2 = (rule, value, callback) => {
-      if (value === '') {
-        callback(new Error(this.$t('business.user.please_input_password')));
-      } else if (value !== this.passwordChangeFrom.newPassword) {
-        callback(new Error(this.$t('business.user.password_not_equal')));
-      } else {
-        callback();
-      }
-    };
     return {
       loading: false,
       isSubmitGoing: false,
       roleOptions: [],
       editModeOpened: false,
-      changePasswordOpened: false,
       profileForm: {
         name: "",
         nickname: "",
@@ -119,30 +67,9 @@ export default {
           Rules.EmailRule
         ],
       },
-      passwordChangeFrom: {
-        oldPassword: "",
-        newPassword: "",
-        confirmPassword: ""
-      },
-      passwordChangeRules: {
-        oldPassword: [
-          Rules.RequiredRule
-        ],
-        newPassword: [
-          Rules.RequiredRule,
-          Rules.PasswordRule,
-          {validator: validatePass, trigger: 'blur'},
-        ],
-        confirmPassword: [
-          Rules.RequiredRule,
-          Rules.PasswordRule,
-          {validator: validatePass2, trigger: 'blur'}
-        ]
-      }
     }
   },
   methods: {
-
     onConfirm() {
       if (this.isSubmitGoing) {
         return
@@ -163,7 +90,6 @@ export default {
         this.loading = false
         this.editModeOpened = false
         this.$message.success(this.$t('commons.msg.update_success'))
-        // 修改vuex
         window.location.reload()
       })
 
@@ -175,30 +101,6 @@ export default {
       this.editModeOpened = false
       this.onVueCreated()
     },
-
-    openPasswordChange() {
-      this.passwordChangeFrom.newPassword = ""
-      this.passwordChangeFrom.oldPassword = ""
-      this.changePasswordOpened = true
-    },
-    onChangePasswordConfirm() {
-      let isFormReady = false
-      this.$refs["passwordChangeFrom"].validate((valid) => {
-        if (valid) {
-          isFormReady = true
-        }
-      })
-      if (!isFormReady) {
-        return
-      }
-      updatePassword({
-        "oldPassword": this.passwordChangeFrom.oldPassword,
-        "newPassword": this.passwordChangeFrom.newPassword
-      }).then(() => {
-        this.$message.success(this.$t('commons.msg.update_success'))
-        this.changePasswordOpened = false
-      })
-    },
     onVueCreated() {
       getCurrentUser().then(data => {
         this.profileForm.name = data.data.name
@@ -208,7 +110,6 @@ export default {
     }
   },
 
-
   created() {
     this.onVueCreated()
   }
diff --git a/web/kubepi/src/business/user-management/user/edit/index.vue b/web/kubepi/src/business/user-management/user/edit/index.vue
index b624ff2ec..0d5ea451c 100644
--- a/web/kubepi/src/business/user-management/user/edit/index.vue
+++ b/web/kubepi/src/business/user-management/user/edit/index.vue
@@ -27,9 +27,6 @@
                 </el-option>
               </el-select>
             </el-form-item>
-            <el-form-item :label="$t('business.user.password')" v-if="form.type !=='LDAP'">
-              <el-link @click="openedChangePassword">{{ $t("business.user.change_password") }}</el-link>
-            </el-form-item>
             <el-form-item :label="$t('commons.table.mfa_enable')" prop="mfa.enable">
               <el-checkbox v-model="form.mfa.enable">{{ $t("commons.enable.true") }}</el-checkbox>
             </el-form-item>
@@ -46,31 +43,6 @@
       </el-col>
       <el-col :span="4"><br/></el-col>
     </el-row>
-
-
-    <el-dialog
-            :title="$t('business.user.change_password')"
-            :visible.sync="changePasswordOpened"
-            :close-on-click-modal="false"
-            width="30%">
-      <div>
-        <el-form :rules="passwordChangeRules" ref="passwordChangeFrom" :model="passwordChangeFrom" label-width="150px"
-                 label-position="left">
-          <el-form-item :label="$t('business.user.new_password')" prop="newPassword">
-            <el-input type="password" v-model="passwordChangeFrom.newPassword"></el-input>
-          </el-form-item>
-          <el-form-item :label="$t('business.user.confirm_password')" prop="confirmPassword">
-            <el-input type="password" v-model="passwordChangeFrom.confirmPassword"></el-input>
-          </el-form-item>
-        </el-form>
-      </div>
-      <span slot="footer" class="dialog-footer">
-    <el-button @click="changePasswordOpened = false">{{ $t("commons.button.cancel") }}</el-button>
-    <el-button type="primary" @click="onChangePasswordConfirm">{{ $t("commons.button.confirm") }}</el-button>
-  </span>
-    </el-dialog>
-
-
   </layout-content>
 </template>
 
@@ -86,25 +58,6 @@ export default {
   props: ["name"],
   components: { LayoutContent },
   data () {
-    var validatePass = (rule, value, callback) => {
-      if (value === "") {
-        callback(new Error(this.$t("business.user.please_input_password")))
-      } else {
-        if (this.passwordChangeFrom.newPassword !== "") {
-          this.$refs.form.validateField("checkPass")
-        }
-        callback()
-      }
-    }
-    var validatePass2 = (rule, value, callback) => {
-      if (value === "") {
-        callback(new Error(this.$t("business.user.please_input_password")))
-      } else if (value !== this.passwordChangeFrom.newPassword) {
-        callback(new Error(this.$t("business.user.password_not_equal")))
-      } else {
-        callback()
-      }
-    }
     return {
       loading: false,
       isSubmitGoing: false,
@@ -128,23 +81,6 @@ export default {
           // enable:Rules.RequiredRule,
         }
       },
-      changePasswordOpened: false,
-      passwordChangeRules: {
-        newPassword: [
-          Rules.RequiredRule,
-          Rules.PasswordRule,
-          { validator: validatePass, trigger: "blur" },
-        ],
-        confirmPassword: [
-          Rules.RequiredRule,
-          Rules.PasswordRule,
-          { validator: validatePass2, trigger: "blur" }
-        ],
-      },
-      passwordChangeFrom: {
-        newPassword: "",
-        confirmPassword: ""
-      },
       form: {
         name: "",
         nickname: "",
@@ -156,26 +92,6 @@ export default {
     }
   },
   methods: {
-    onChangePasswordConfirm () {
-      let isFormReady = false
-      this.$refs["passwordChangeFrom"].validate((valid) => {
-        if (valid) {
-          isFormReady = true
-        }
-      })
-      if (!isFormReady) {
-        return
-      }
-      updateUser(this.name, {
-        "password": this.passwordChangeFrom.newPassword
-      }).then(() => {
-        this.$message.success(this.$t("commons.msg.update_success"))
-        this.changePasswordOpened = false
-      })
-    },
-    openedChangePassword () {
-      this.changePasswordOpened = true
-    },
     onConfirm () {
       if (this.isSubmitGoing) {
         return
diff --git a/web/kubepi/src/business/user-management/user/index.vue b/web/kubepi/src/business/user-management/user/index.vue
index 47e19c34a..4b174b3e0 100644
--- a/web/kubepi/src/business/user-management/user/index.vue
+++ b/web/kubepi/src/business/user-management/user/index.vue
@@ -65,7 +65,7 @@ import {checkPermissions} from "@/utils/permission"
 
 
 export default {
-  name: "ClusterList",
+  name: "Users",
   components: {ComplexTable, LayoutContent},
   data() {
     return {
@@ -80,6 +80,16 @@ export default {
             return  !checkPermissions({resource: "users", verb: "update"})
           }
         },
+        {
+          label: this.$t("commons.button.change_password"),
+          icon: "el-icon-edit-outline",
+          click: (row) => {
+            this.onChangePassword(row.name)
+          },
+          disabled: () => {
+            return  !checkPermissions({resource: "users", verb: "update"})
+          }
+        },
         {
           label: this.$t("commons.button.delete"),
           icon: "el-icon-delete",
@@ -132,6 +142,9 @@ export default {
     onEdit(name) {
       this.$router.push({name: "UserEdit", params: {name: name}})
     },
+    onChangePassword(name) {
+      this.$router.push({name: "UserPassword", params: {name: name}})
+    },
     onDelete(name) {
       this.$confirm(this.$t("commons.confirm_message.delete"), this.$t("commons.message_box.alert"), {
         confirmButtonText: this.$t("commons.button.confirm"),
diff --git a/web/kubepi/src/business/user-management/user/password/index.vue b/web/kubepi/src/business/user-management/user/password/index.vue
new file mode 100644
index 000000000..3e67f2fdf
--- /dev/null
+++ b/web/kubepi/src/business/user-management/user/password/index.vue
@@ -0,0 +1,118 @@
+<template>
+    <layout-content :header="$t('business.user.change_password')" :back-to="{ name: 'Users' }">
+      <el-row>
+        <el-col :span="4"><br/></el-col>
+        <el-col :span="10">
+          <div class="grid-content bg-purple-light">
+            <el-form :rules="passwordChangeRules" ref="passwordChangeFrom" :model="passwordChangeFrom" label-width="150px" label-position="left">
+                <el-form-item :label="$t('business.user.old_password')" prop="oldPassword">
+                    <el-input type="password" show-password v-model="passwordChangeFrom.oldPassword"></el-input>
+                </el-form-item>
+
+                <el-form-item :label="$t('business.user.new_password')" prop="newPassword">
+                    <el-input type="password" show-password v-model="passwordChangeFrom.newPassword"></el-input>
+                </el-form-item>
+
+                <el-form-item :label="$t('business.user.confirm_password')" prop="confirmPassword">
+                    <el-input type="password" show-password v-model="passwordChangeFrom.confirmPassword"></el-input>
+                </el-form-item>
+                <el-form-item>
+                    <div style="float: right">
+                        <el-button @click="onCancel()">{{ $t("commons.button.cancel") }}</el-button>
+                        <el-button type="primary" @click="onChangePasswordConfirm">{{ $t("commons.button.confirm") }}
+                        </el-button>
+                    </div>
+                </el-form-item>
+          </el-form>
+          </div>
+        </el-col>
+        <el-col :span="4"><br/></el-col>
+      </el-row>
+  
+    </layout-content>
+  </template>
+  
+  <script>
+  import LayoutContent from "@/components/layout/LayoutContent"
+  import {getCurrentUser} from "@/api/auth"
+  import {updateUser} from "@/api/users"
+  import Rules from "@/utils/rules"
+  
+  export default {
+    name: "UserPassword",
+    props: ["name"],
+    components: { LayoutContent },
+    data () {
+      var validatePass = (rule, value, callback) => {
+        if (value === "") {
+          callback(new Error(this.$t("business.user.please_input_password")))
+        } else {
+          if (this.passwordChangeFrom.newPassword !== "") {
+            this.$refs.passwordChangeFrom.validateField("checkPass")
+          }
+          callback()
+        }
+      }
+      var validatePass2 = (rule, value, callback) => {
+        if (value === "") {
+          callback(new Error(this.$t("business.user.please_input_password")))
+        } else if (value !== this.passwordChangeFrom.newPassword) {
+          callback(new Error(this.$t("business.user.password_not_equal")))
+        } else {
+          callback()
+        }
+      }
+      return {
+        passwordChangeFrom: {
+            oldPassword: "",
+            newPassword: "",
+            confirmPassword: ""
+        },
+        passwordChangeRules: {
+            oldPassword: [
+                Rules.RequiredRule
+            ],
+            newPassword: [
+                Rules.RequiredRule,
+                Rules.PasswordRule,
+                {validator: validatePass, trigger: 'blur'},
+            ],
+            confirmPassword: [
+                Rules.RequiredRule,
+                Rules.PasswordRule,
+                {validator: validatePass2, trigger: 'blur'}
+            ]
+        }
+      }
+    },
+    methods: {
+      onChangePasswordConfirm () {
+        this.$refs["passwordChangeFrom"].validate((valid) => {
+          if (valid) {
+            updateUser(this.name, {
+                "oldPassword": this.passwordChangeFrom.oldPassword,
+                "password": this.passwordChangeFrom.newPassword
+            }).then(() => {
+                this.$message.success(this.$t("commons.msg.update_success"))
+                this.onCancel()
+            })
+          }
+        })
+      },
+      onCancel () {
+        this.$router.push({ name: "Users" })
+      }
+    },
+    created() {
+      if (!this.name) {
+        getCurrentUser().then(data => {
+          this.name = data.data.name
+        })
+      }
+    }
+  }
+  </script>
+  
+  <style scoped>
+  </style>
+  
\ No newline at end of file
diff --git a/web/kubepi/src/i18n/lang/en-US.js b/web/kubepi/src/i18n/lang/en-US.js
index 090eda7f7..c1d53b781 100644
--- a/web/kubepi/src/i18n/lang/en-US.js
+++ b/web/kubepi/src/i18n/lang/en-US.js
@@ -42,7 +42,8 @@ const message = {
             search: "Search",
             rbac_manage: "RBAC Manage",
             sync: "Sync",
-            bind: "Bind"
+            bind: "Bind",
+            change_password: 'Change Password',
         },
         table: {
             name: "Name",
diff --git a/web/kubepi/src/i18n/lang/zh-CN.js b/web/kubepi/src/i18n/lang/zh-CN.js
index 395387e9f..f08a5a481 100644
--- a/web/kubepi/src/i18n/lang/zh-CN.js
+++ b/web/kubepi/src/i18n/lang/zh-CN.js
@@ -42,7 +42,8 @@ const message = {
             search: "搜索",
             rbac_manage: "授权",
             sync: "同步",
-            bind: "绑定"
+            bind: "绑定",
+            change_password: '改密',
         },
         table: {
             name: "名称",
diff --git a/web/kubepi/src/router/modules/users.js b/web/kubepi/src/router/modules/users.js
index 6d76c7498..a14f3d4bc 100644
--- a/web/kubepi/src/router/modules/users.js
+++ b/web/kubepi/src/router/modules/users.js
@@ -46,6 +46,16 @@ const UserManagement = {
         activeMenu: "/user-management/users",
       }
     },
+    {
+      props: true,
+      path: "users/password/:name",
+      component: () => import("@/business/user-management/user/password"),
+      name: "UserPassword",
+      hidden: true,
+      meta: {
+        activeMenu: "/user-management/users",
+      }
+    },
     {
       path: "roles",
       component: () => import("@/business/user-management/role"),