diff --git a/UI2.0/package.json b/UI2.0/package.json
index 2dbf6c299a092ee98e15ecd15c8e74e69011a546..ecbf64162200c633c892e23901475d6583087c2c 100644
--- a/UI2.0/package.json
+++ b/UI2.0/package.json
@@ -21,6 +21,7 @@
     "vue": "^3.0.0",
     "vue-router": "^4.0.0",
     "vuex": "^4.0.1",
+    "vuex-persistedstate": "^4.1.0",
     "xterm": "^4.19.0"
   },
   "devDependencies": {
diff --git a/UI2.0/src/js/login.js b/UI2.0/src/js/login.js
index 13ed9f606059e1ab36eac788afbe3deccd469d26..601660e832c8447867c4e8356a17f642f745f252 100644
--- a/UI2.0/src/js/login.js
+++ b/UI2.0/src/js/login.js
@@ -23,7 +23,10 @@ export default defineComponent({
                 .then(res => {
                     res = JSON.parse(res)
                     if (res.login) {
-                        this.$store.commit("changeUserName", res.user_name)
+                        this.$store.commit("setUserInfo", {
+                            name: res.user_name,
+                            userId: res.user_id,
+                        })
                         this.$router.push({
                             path: "/user",
                         });
diff --git a/UI2.0/src/js/personal.js b/UI2.0/src/js/personal.js
index 612d7c2a3b1c8db63d0901cd1c9a66e53af20e74..a5ecbef5e75051276936b14f8f38fe0b6af69427 100644
--- a/UI2.0/src/js/personal.js
+++ b/UI2.0/src/js/personal.js
@@ -1,7 +1,23 @@
 import { defineComponent } from "vue";
+import axios from "./utils/AxiosConfig";
+import base64Encode from './utils/utils'
 
 export default defineComponent({
   name: "PageIndex",
+  data() {
+    return{
+      basicInfo: {
+        name: "",
+        description: ""
+      },
+      password: {
+        hint: "",
+        oldPassword: "",
+        newPassword: "",
+        renewPassword: ""
+      }
+    }
+  },
   methods: {
     popWin() {
       document.getElementById("light").style.display = "block";
@@ -19,8 +35,69 @@ export default defineComponent({
       document.getElementById("card-password").style.display = "none";
       document.getElementById("fade").style.display = "none";
     },
+    changeBasicInfo(){
+      if(this.basicInfo.name == this.$store.state.User.userInfo.name && 
+        this.basicInfo.description == this.$store.state.User.userInfo.description) {
+          this.closeWin()
+      }else{
+        this.$store.commit("setUserInfo", {
+          userId: this.$store.state.User.userInfo.userId,
+          name: this.basicInfo.name,
+          description: this.basicInfo.description
+        })
+        axios("/v1/UI/user/changeBasicInfo", {
+          userId: this.$store.state.User.userInfo.userId,
+          name: this.basicInfo.name,
+          description: this.basicInfo.description,
+        }, "post").then(res => {
+          res = JSON.parse(res)
+          if(!res.success) {
+            console.log("修改失败")
+          } else {
+            console.log("修改成功")
+          }
+        }).catch(err => {
+          console.log(err)
+        })
+      }
+    },
+    changePwd() {
+      if(this.password.oldPassword == "" || this.password.newPassword == "" || this.password.renewPassword == ""){
+        this.password.hint = "上述参数必须填写完整"
+        return
+      }
+      if(this.password.newPassword != this.password.renewPassword) {
+        this.password.hint = "两次输入的新密码不同"
+        return
+      }
+      if(this.password.newPassword == this.password.oldPassword) {
+        this.password.hint = "新密码不能和旧密码一致"
+        return
+      }
+      console.log(base64Encode(this.password.oldPassword))
+      axios("/v1/UI/user/changePasswd", {
+        userId: this.$store.state.User.userInfo.userId,
+        password: base64Encode(this.password.oldPassword),
+        newPasswd: base64Encode(this.password.newPassword)
+      }, "post").then(res => {
+        res = JSON.parse(res)
+        if(!res.oldMatch) {
+          this.password.hint = "旧密码错误，请重新输入"
+          this.password.oldPassword = ""
+          this.password.newPassword = ""
+          this.password.renewPassword = ""
+          return
+        }else{
+          this.password.hint = "密码修改成功，下次登陆生效"
+        }
+      }).catch(err => {
+        console.log(err)
+      })
+    },
   },
+  
   mounted() {
-
+    this.basicInfo.name = this.$store.state.User.userInfo.name
+    this.basicInfo.description = this.$store.state.User.userInfo.description
   },
 });
\ No newline at end of file
diff --git a/UI2.0/src/js/userlayout.js b/UI2.0/src/js/userlayout.js
index 77429713b41814f36d31fff1aa647e01c1de8102..68367248823f5d40261692ba6795e3e4ccfa13aa 100644
--- a/UI2.0/src/js/userlayout.js
+++ b/UI2.0/src/js/userlayout.js
@@ -58,6 +58,9 @@ export default defineComponent({
       document.getElementById("search-input").style.display = "block";
     },
   },
+  mounted() {
+    this.$store.dispatch("getUserInfoFromBackend")
+  },
   setup() {
     return {
 
diff --git a/UI2.0/src/js/utils/utils.js b/UI2.0/src/js/utils/utils.js
index 7aa92a94c5682277cf2cf9ae93a51c55c77a7ffc..12d2be6b73b93ec3f3615060403aed5b8664d403 100644
--- a/UI2.0/src/js/utils/utils.js
+++ b/UI2.0/src/js/utils/utils.js
@@ -1,5 +1,11 @@
+import CryptoJS from "crypto-js";
+
 export function getRandomInt(min, max) {
   min = Math.ceil(min);
   max = Math.floor(max);
   return Math.floor(Math.random() * (max - min) + min);
+}
+
+export default function base64Encode(pwd) {
+  return CryptoJS.enc.Base64.stringify(CryptoJS.enc.Utf8.parse(pwd));
 }
\ No newline at end of file
diff --git a/UI2.0/src/layouts/UserLayout.vue b/UI2.0/src/layouts/UserLayout.vue
index f57d98e983a6efa13c7c99380e303810ce468f4a..7297988a75a62726b95f9409fb13be6a19de15ec 100644
--- a/UI2.0/src/layouts/UserLayout.vue
+++ b/UI2.0/src/layouts/UserLayout.vue
@@ -55,7 +55,7 @@
                 padding: 0px;
                 padding-right: 32px;
               "
-              :label="$store.state.user.name"
+              :label="$store.state.User.userInfo.name"
               dropdown-icon="expand_more"
             >
               <q-list>
diff --git a/UI2.0/src/pages/Control-panel.vue b/UI2.0/src/pages/Control-panel.vue
index 67afb96ee6fea02b88abeefdc48ee7980c3c3a71..e54730e771c92ecd8d64e6ff71ca3e2830fcfc29 100644
--- a/UI2.0/src/pages/Control-panel.vue
+++ b/UI2.0/src/pages/Control-panel.vue
@@ -5,10 +5,10 @@
       <div id="col-info-mod">
         <div class="float-" style="padding-left: 204px;">
           <div id="col-info-left-text">
-            嗨，{{$store.state.user.name}}愿您事事顺心，快乐相随！
+            嗨，{{$store.state.User.userInfo.name}}愿您事事顺心，快乐相随！
           </div>
           <div id="col-info-left-subtext">
-            长风破浪会有时，直挂云帆济沧海
+            {{$store.state.User.userInfo.description}}
           </div>
         </div>
         <div class="float-right" style="margin: 32px 32px;">
diff --git a/UI2.0/src/pages/Personal.vue b/UI2.0/src/pages/Personal.vue
index add010f7747e86998640075e08028d5bfe9ab204..01ab33ed9a460fd8e906a7d9cbf4f314decadcdf 100644
--- a/UI2.0/src/pages/Personal.vue
+++ b/UI2.0/src/pages/Personal.vue
@@ -23,10 +23,10 @@
                   margin-top: 16px;
                 "
               >
-                {{$store.state.user.name}}
+                {{$store.state.User.userInfo.name}}
               </div>
               <div style="color: #1d68c4; font-size: 14px">
-                长风破浪会有时，直挂云帆济沧海
+                {{$store.state.User.userInfo.description}}
               </div>
             </div>
           </div>
@@ -128,6 +128,7 @@
         <div class="essential-info">
           <a>昵称：</a>
           <input
+            v-model="basicInfo.name"
             class="info-input"
             placeholder="请输入"
             style="margin-top: 24px; margin-bottom: 16px"
@@ -136,6 +137,7 @@
         <div class="essential-info row">
           <a>签名：</a>
           <textarea
+            v-model="basicInfo.description"
             class="info-input"
             placeholder="请输入"
             style="height: 100px"
@@ -145,40 +147,50 @@
       <!-- --------------------------- -->
       <div class="row" style="position: absolute; bottom: 0px; left: 30%">
         <button class="button-add-chart-no" @click="closeWin">取消</button>
-        <button class="button-add-chart-yes">确定</button>
+        <button class="button-add-chart-yes" @click="changeBasicInfo">确定</button>
       </div>
     </q-card>
     <q-card id="card-password" class="pop-win" style="height: 320px">
       <q-card-section class="row" style="justify-content: space-between">
-        <div class="card-title">修改密码</div>
+        <div class="card-title" @click="changePwd">修改密码</div>
         <div class="close-card" @click="closeWinpass"></div>
       </q-card-section>
       <div>
         <div class="essential-info">
           <a>旧密码</a>
           <input
+            v-model="password.oldPassword"
             class="info-password"
             placeholder="--请输入--"
             style="margin-top: 24px; margin-left: 44px"
+            type="password"
           />
         </div>
         <div class="essential-info">
           <a>新密码</a>
           <input
+            v-model="password.newPassword"
             class="info-password"
             placeholder="--请输入--"
             style="margin-left: 44px"
+            type="password"
           />
         </div>
         <div class="essential-info">
           <a>确认新密码</a>
-          <input class="info-password" placeholder="--请输入--" />
+          <input  
+            v-model="password.renewPassword" 
+            class="info-password" 
+            placeholder="--请输入--" 
+            type="password"
+          />
         </div>
+        <p style="margin-left: 31px; font-size: 16px; color: red;">{{ password.hint }}</p>
       </div>
       <!-- --------------------------- -->
       <div class="row" style="position: absolute; bottom: 0px; left: 30%">
         <button class="button-add-chart-no" @click="closeWinpass">取消</button>
-        <button class="button-add-chart-yes">确定</button>
+        <button class="button-add-chart-yes" @click="changePwd">确定</button>
       </div>
     </q-card>
   </div>
diff --git a/UI2.0/src/store/index.js b/UI2.0/src/store/index.js
index 5fa0ba4a446beed46ba1f112841f7e9d0b6c313f..2ccb79f90e86d1a0aff846b814c074b245cb7ff5 100644
--- a/UI2.0/src/store/index.js
+++ b/UI2.0/src/store/index.js
@@ -1,5 +1,8 @@
 import { store } from 'quasar/wrappers'
 import { createStore } from 'vuex'
+import createPersistedState from 'vuex-persistedstate'
+import User from './user/userInfo'
+
 
 // import example from './module-example'
 
@@ -15,24 +18,18 @@ import { createStore } from 'vuex'
 export default store(function (/* { ssrContext } */) {
   const Store = createStore({
     state() {
-      return {
-        user: {
-          name: "游客",
-        }
-      }
     },
     mutations: {
-      changeUserName(state, newName){
-        state.user.name = newName
-      }
     },
     modules: {
       // example
+      User,
     },
 
     // enable strict mode (adds overhead!)
     // for dev mode and --debug builds only
-    strict: process.env.DEBUGGING
+    strict: process.env.DEBUGGING,
+    plugins: [createPersistedState()]
   })
 
   return Store
diff --git a/UI2.0/src/store/user/userInfo.js b/UI2.0/src/store/user/userInfo.js
new file mode 100644
index 0000000000000000000000000000000000000000..20802c346d90c132d2ac0017dfe565d687cd6270
--- /dev/null
+++ b/UI2.0/src/store/user/userInfo.js
@@ -0,0 +1,37 @@
+import axios from "src/js/utils/AxiosConfig"
+
+const User = {
+    state(){
+        return {
+            userInfo: {
+                name: "游客",
+                userId: 0,
+                description: "长风破浪会有时，直挂云帆济沧海",
+            },
+        }
+    },
+    mutations: {
+        setUserInfo(state, user) {
+            state.userInfo.userId = user.userId
+            state.userInfo.name = user.name
+            state.userInfo.description = user.description
+        },
+    },
+    actions: {
+        getUserInfoFromBackend({state, commit}) {
+            //通过userId获取用户完整信息
+            axios("/v1/UI/user/getBasicInfo",{
+                userId: state.userInfo.userId
+            }, "post").then(res => {
+                res = JSON.parse(res)
+                commit("setUserInfo",{
+                    userId: state.userInfo.userId,
+                    name: res.name,
+                    description: res.description
+                })
+            })
+        }   
+    }
+}
+
+export default User
\ No newline at end of file