账号设置密码修改样式调整

src/views/trials/trials-myinfo/password.vue

@@ -2,7 +2,7 @@
   <div class="trial-myinfo-right-box">
     <div class="trial-myinfo-head">
       <!-- 修改密码 -->
-      {{ $t("trials:trials-myinfo:title:updatePaasord") }}
+      {{ $t('trials:trials-myinfo:title:updatePaasord') }}
     </div>
     <el-form
       ref="passwordForm"
@@ -52,17 +52,17 @@
       </el-form-item>
     </el-form>
     <el-button type="primary" size="small" class="trial-info-btn" @click="save">
-      {{ $t("trials:trials-myinfo:button:save") }}
+      {{ $t('trials:trials-myinfo:button:save') }}
     </el-button>
   </div>
 </template>
 <script>
-import md5 from "js-md5";
+import md5 from 'js-md5'
-import { mapGetters, mapMutations } from "vuex";
+import { mapGetters, mapMutations } from 'vuex'
-import { modifyPassword } from "@/api/admin.js";
+import { modifyPassword } from '@/api/admin.js'
-import { removeToken } from "@/utils/auth";
+import { removeToken } from '@/utils/auth'
 export default {
-  name: "password",
+  name: 'password',
   data() {
     return {
       password: {},
@@ -70,91 +70,96 @@ export default {
         OldPassWord: [
           {
             required: true,
-            message: this.$t("common:ruleMessage:specify"),
+            message: this.$t('common:ruleMessage:specify'),
-            trigger: "blur",
+            trigger: 'blur',
           },
         ],
         NewPassWord: [
           {
             required: true,
-            message: this.$t("common:ruleMessage:specify"),
+            message: this.$t('common:ruleMessage:specify'),
-            trigger: "blur",
+            trigger: 'blur',
           },
           {
             required: true,
-            trigger: "blur",
+            trigger: 'blur',
             validator: this.$validatePassword,
           },
         ],
         ConfirmPassWord: [
           {
             required: true,
-            message: this.$t("common:ruleMessage:specify"),
+            message: this.$t('common:ruleMessage:specify'),
-            trigger: "blur",
+            trigger: 'blur',
           },
           {
             required: true,
-            trigger: "blur",
+            trigger: 'blur',
             validator: this.$validatePassword,
           },
         ],
       },
-    };
+    }
   },
   computed: {
-    ...mapGetters(["userId"]),
+    ...mapGetters(['userId']),
   },
   methods: {
-    ...mapMutations({ setLanguage: "lang/setLanguage" }),
+    ...mapMutations({ setLanguage: 'lang/setLanguage' }),
     async save() {
       try {
-        let validate = await this.$refs.passwordForm.validate();
+        let validate = await this.$refs.passwordForm.validate()
-        if (!validate) return;
+        if (!validate) return
         if (this.password.NewPassWord !== this.password.ConfirmPassWord) {
-          this.$alert(this.$t("passwordReset:formRule:passwordsDiffer"));
+          this.$alert(this.$t('passwordReset:formRule:passwordsDiffer'))
-          return;
+          return
         }
         let confirm = await this.$confirm(
-          this.$t("trials:trials-myInfo:confirmMessage:updatePassWord"),
+          this.$t('trials:trials-myInfo:confirmMessage:updatePassWord'),
           {
-            type: "warning",
+            type: 'warning',
             distinguishCancelAndClose: true,
-            confirmButtonText: this.$t("common:button:confirm"),
+            confirmButtonText: this.$t('common:button:confirm'),
-            cancelButtonText: this.$t("common:button:cancel"),
+            cancelButtonText: this.$t('common:button:cancel'),
           }
-        );
+        )
-        if (confirm !== "confirm") return;
+        if (confirm !== 'confirm') return
         const param = {
           UserId: this.userId,
           NewPassWord: md5(this.password.NewPassWord),
           OldPassWord: md5(this.password.OldPassWord),
-        };
+        }
-        let res = await modifyPassword(param);
+        let res = await modifyPassword(param)
         if (res.IsSuccess) {
           // 修改成功,请重新登录账号
           this.$message.success(
-            this.$t("trials:trials-myinfo:message:modifyPWSuccessfully")
+            this.$t('trials:trials-myinfo:message:modifyPWSuccessfully')
-          );
+          )
-          removeToken();
+          removeToken()
-          this.logout();
+          this.logout()
         }
       } catch (err) {
-        console.log(err);
+        console.log(err)
       }
     },
     async logout() {
       /* eslint-disable */
-      var loginType = zzSessionStorage.getItem("loginType");
+      var loginType = zzSessionStorage.getItem('loginType')
-      await this.$store.dispatch("user/logout");
+      await this.$store.dispatch('user/logout')
       if (loginType) {
-        this.$router.push(`/login?loginType=${loginType}`);
+        this.$router.push(`/login?loginType=${loginType}`)
       } else {
-        this.$router.push(`/login`);
+        this.$router.push(`/login`)
       }
-      this.$i18n.locale = "zh";
+      this.$i18n.locale = 'zh'
-      this.setLanguage("zh");
+      this.setLanguage('zh')
-      this.$updateDictionary();
+      this.$updateDictionary()
     },
   },
-};
+}
-</script>
+</script>
+<style lang="scss" scoped>
+.el-form-item {
+  margin-bottom: 30px;
+}
+</style>