bug fixes

src/assets/css/base.css

@@ -3,7 +3,6 @@
   padding: 0;
 }
 body {
-  background-color: #f9f9f9;
   color:#666;
 }
 /* element-ui input,textarea font-family reset */

src/components/layout/Header.vue

@@ -42,7 +42,7 @@ export default {
   name: 'AppHeader',
   computed: {
     user() {
-      return this.$store.state.user.user
+      return this.$store.getters.user
     }
   },
   methods: {

src/components/layout/Main.vue

@@ -18,7 +18,6 @@ export default {
 .app-main {
   position: relative;
   flex: 1;
-  padding: 20px;
 }
 .app-main-inner {
   margin: 0 auto;

src/modules/settings/components/Base.vue

@@ -107,7 +107,7 @@ export default {
   },
   computed: {
     user() {
-      return this.$store.state.user.user
+      return this.$store.getters.user
     }
   },
   watch: {
@@ -171,92 +171,5 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.app-card-item {
-  position: relative;
-  margin-left: 24px;
-  display: flex;
-  align-items: center;
-  padding: 16px 24px 16px 0;
-  border-top: 1px solid #dadce0;
-  cursor: pointer;
-  &:hover {
-    margin-left: 0;
-    padding-left: 24px;
-    background-color: rgba(128, 134, 139, 0.04);
-    &::after {
-      content: '';
-      position: absolute;
-      left: 0;
-      right: 0;
-      bottom: -1px;
-      border-top: 1px solid #dadce0;
-    }
-  }
-}
-.app-card-item-label {
-  flex-basis: 156px;
-  margin-right: 24px;
-  font-weight: 500;
-  color: #5f6368;
-}
-.app-card-item-content {
-  flex: 1;
-}
-.avatar {
-  position: relative;
-  width: 60px;
-  height: 60px;
-  border-radius: 50%;
-  overflow: hidden;
-  img {
-    width: 100%;
-    height: 100%;
-    object-fit: cover;
-  }
-  .cover {
-    position: absolute;
-    left: 0;
-    right: 0;
-    bottom: 0;
-    height: 20px;
-    background-color: rgba(32, 33, 36, 0.6);
-    color: #fff;
-    text-align: center;
-  }
-}
-::v-deep .el-dialog {
-  max-width: 490px;
-}
-.avatar-dialog-body {
-  text-align: center;
-  ::v-deep .el-upload {
-    width: 288px;
-    height: 288px;
-    border-radius: 50%;
-  }
-  ::v-deep .avatar-uploader-icon {
-    font-size: 40px;
-    line-height: 288px;
-  }
-  h2 {
-    margin-top: 24px;
-    line-height: 2rem;
-    font-size: 1.5rem;
-    letter-spacing: 0;
-    font-weight: 400;
-  }
-  p {
-    margin-top: 4px;
-    line-height: 1.5rem;
-    font-size: 1rem;
-    letter-spacing: 0.00625em;
-    font-weight: 400;
-  }
-}
-.avatar-dialog-footer {
-  display: flex;
-  ::v-deep .el-button {
-    flex: 1;
-  }
-}
+@import '../css/style.scss';
 </style>

src/modules/settings/components/Contact.vue

@@ -48,7 +48,7 @@ export default {
   },
   computed: {
     user() {
-      return this.$store.state.user.user
+      return this.$store.getters.user
     }
   },
   watch: {
@@ -92,38 +92,5 @@ export default {
 </script>
 
 <style lang="scss" scoped>
-.app-card-item {
-  position: relative;
-  margin-left: 24px;
-  display: flex;
-  align-items: center;
-  padding: 16px 24px 16px 0;
-  border-top: 1px solid #dadce0;
-  cursor: pointer;
-  &:hover {
-    margin-left: 0;
-    padding-left: 24px;
-    background-color: rgba(128, 134, 139, 0.04);
-    &::after {
-      content: '';
-      position: absolute;
-      left: 0;
-      right: 0;
-      bottom: -1px;
-      border-top: 1px solid #dadce0;
-    }
-  }
-}
-.app-card-item-label {
-  flex-basis: 156px;
-  margin-right: 24px;
-  font-weight: 500;
-  color: #5f6368;
-}
-.app-card-item-content {
-  flex: 1;
-}
-::v-deep .el-dialog {
-  max-width: 490px;
-}
+@import '../css/style.scss';
 </style>

src/modules/settings/components/Password.vue

@@ -94,40 +94,6 @@ export default {
   }
 }
 </script>
-
 <style lang="scss" scoped>
-.app-card-item {
-  position: relative;
-  margin-left: 24px;
-  display: flex;
-  align-items: center;
-  padding: 16px 24px 16px 0;
-  border-top: 1px solid #dadce0;
-  cursor: pointer;
-  &:hover {
-    margin-left: 0;
-    padding-left: 24px;
-    background-color: rgba(128, 134, 139, 0.04);
-    &::after {
-      content: '';
-      position: absolute;
-      left: 0;
-      right: 0;
-      bottom: -1px;
-      border-top: 1px solid #dadce0;
-    }
-  }
-}
-.app-card-item-label {
-  flex-basis: 156px;
-  margin-right: 24px;
-  font-weight: 500;
-  color: #5f6368;
-}
-.app-card-item-content {
-  flex: 1;
-}
-::v-deep .el-dialog {
-  max-width: 490px;
-}
+@import '../css/style.scss';
 </style>

src/modules/settings/css/style.scss

+.app-card-item {
+  position: relative;
+  margin-left: 24px;
+  display: flex;
+  align-items: center;
+  padding: 16px 24px 16px 0;
+  border-top: 1px solid #dadce0;
+  cursor: pointer;
+  &:hover {
+    margin-left: 0;
+    padding-left: 24px;
+    background-color: rgba(128, 134, 139, 0.04);
+    &::after {
+      content: '';
+      position: absolute;
+      left: 0;
+      right: 0;
+      bottom: -1px;
+      border-top: 1px solid #dadce0;
+    }
+  }
+}
+.app-card-item-label {
+  flex-basis: 156px;
+  margin-right: 24px;
+  font-weight: 500;
+  color: #5f6368;
+}
+.app-card-item-content {
+  flex: 1;
+}
+
+.avatar {
+  position: relative;
+  width: 60px;
+  height: 60px;
+  border-radius: 50%;
+  overflow: hidden;
+  img {
+    width: 100%;
+    height: 100%;
+    object-fit: cover;
+  }
+  .cover {
+    position: absolute;
+    left: 0;
+    right: 0;
+    bottom: 0;
+    height: 20px;
+    background-color: rgba(32, 33, 36, 0.6);
+    color: #fff;
+    text-align: center;
+  }
+}
+
+.avatar-dialog-body {
+  text-align: center;
+  ::v-deep .el-upload {
+    width: 288px;
+    height: 288px;
+    border-radius: 50%;
+  }
+  ::v-deep .avatar-uploader-icon {
+    font-size: 40px;
+    line-height: 288px;
+  }
+  h2 {
+    margin-top: 24px;
+    line-height: 2rem;
+    font-size: 1.5rem;
+    letter-spacing: 0;
+    font-weight: 400;
+  }
+  p {
+    margin-top: 4px;
+    line-height: 1.5rem;
+    font-size: 1rem;
+    letter-spacing: 0.00625em;
+    font-weight: 400;
+  }
+}
+.avatar-dialog-footer {
+  display: flex;
+  ::v-deep .el-button {
+    flex: 1;
+  }
+}
+
+::v-deep .el-dialog {
+  width: 90%;
+  max-width: 490px;
+  border-radius: 8px;
+}
+::v-deep .el-dialog__headerbtn {
+  font-size: 24px;
+}
+::v-deep .el-dialog__headerbtn .el-dialog__close {
+  color: #3c4043;
+}
+.dialog-footer {
+  text-align: right;
+}

src/modules/settings/views/Index.vue

@@ -24,6 +24,7 @@ export default {
 .settings {
   max-width: 838px;
   margin: 0 auto;
+  padding: 20px;
 }
 .title {
   margin-bottom: 8px;

src/store/modules/user.js

@@ -15,12 +15,17 @@ const user = {
   },
 
   actions: {
+    // 获取用户信息
+    getUser({ commit }) {
+      getUser().then(response => {
+        commit('setUser', response.data)
+      })
+    },
     // 退出登录
     logout({ commit }) {
       return logout().then(response => {
         commit('setUser', {})
         commit('setIsLogin', false)
-        // resetRouter()
         return response
       })
     },
@@ -28,8 +33,12 @@ const user = {
     async checkLogin({ commit }) {
       const isLogin = await getUser()
         .then(response => {
+          if (response.code === 0) {
             commit('setUser', response.data)
             return true
+          } else {
+            return false
+          }
         })
         .catch(() => {
           commit('setUser', {})