修改密码弹窗中文改成英文

src/components/tools/UserPassword.vue

@@ -6,152 +6,164 @@
     :confirmLoading="confirmLoading"
     @ok="handleOk"
     @cancel="handleCancel"
-    cancelText="关闭"
+    cancelText="Cancel"
   >
     <a-spin :spinning="confirmLoading">
       <a-form :form="form">
-
+        <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="Old Password">
-        <a-form-item
+          <a-input
-          :labelCol="labelCol"
+            type="password"
-          :wrapperCol="wrapperCol"
+            placeholder="Please enter your old password"
-          label="旧密码">
+            v-decorator="['oldpassword', validatorRules.oldpassword]"
-          <a-input type="password" placeholder="请输入旧密码" v-decorator="[ 'oldpassword', validatorRules.oldpassword]" />
+          />
         </a-form-item>
 
-        <a-form-item
+        <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="New Password">
-          :labelCol="labelCol"
+          <a-input
-          :wrapperCol="wrapperCol"
+            type="password"
-          label="新密码">
+            placeholder="Please enter your new password"
-          <a-input type="password" placeholder="请输入新密码" v-decorator="[ 'password', validatorRules.password]" />
+            v-decorator="['password', validatorRules.password]"
+          />
         </a-form-item>
 
-        <a-form-item
+        <a-form-item :labelCol="labelCol" :wrapperCol="wrapperCol" label="Confirm New Password">
-          :labelCol="labelCol"
+          <a-input
-          :wrapperCol="wrapperCol"
+            type="password"
-          label="确认新密码">
+            @blur="handleConfirmBlur"
-          <a-input type="password" @blur="handleConfirmBlur" placeholder="请确认新密码" v-decorator="[ 'confirmpassword', validatorRules.confirmpassword]"/>
+            placeholder="Please enter your new password"
+            v-decorator="['confirmpassword', validatorRules.confirmpassword]"
+          />
         </a-form-item>
-
       </a-form>
     </a-spin>
   </a-modal>
 </template>
 
 <script>
+import { putAction } from '@/api/manage'
 
-  import { putAction } from '@/api/manage'
+export default {
-
+  name: 'UserPassword',
-  export default {
+  data() {
-    name: "UserPassword",
+    return {
-    data () {
+      title: 'Change Password',
-      return {
+      modalWidth: 800,
-        title:"修改密码",
+      visible: false,
-        modalWidth:800,
+      confirmLoading: false,
-        visible: false,
+      validatorRules: {
-        confirmLoading: false,
+        oldpassword: {
-        validatorRules:{
+          rules: [
-          oldpassword:{
+            {
-            rules: [{
+              required: true,
-              required: true, message: '请输入旧密码!',
+              message: '请输入旧密码!',
-            }],
+            },
-          },
+          ],
-          password:{
+        },
-            rules: [{
+        password: {
-              required: true, message: '请输入新密码!',
+          rules: [
-            }, {
+            {
+              required: true,
+              message: '请输入新密码!',
+            },
+            {
               validator: this.validateToNextPassword,
-            }],
+            },
-          },
+          ],
-          confirmpassword:{
+        },
-            rules: [{
+        confirmpassword: {
-              required: true, message: '请确认新密码!',
+          rules: [
-            }, {
+            {
+              required: true,
+              message: '请确认新密码!',
+            },
+            {
               validator: this.compareToFirstPassword,
-            }],
+            },
-          }
+          ],
-        },
-        confirmDirty:false,
-        labelCol: {
-          xs: { span: 24 },
-          sm: { span: 5 },
-        },
-        wrapperCol: {
-          xs: { span: 24 },
-          sm: { span: 16 },
         },
+      },
+      confirmDirty: false,
+      labelCol: {
+        xs: { span: 24 },
+        sm: { span: 6 },
+      },
+      wrapperCol: {
+        xs: { span: 24 },
+        sm: { span: 16 },
+      },
 
-        form:this.$form.createForm(this),
+      form: this.$form.createForm(this),
-        url: "sys/user/updatePassword",
+      url: 'sys/user/updatePassword',
-        username:"",
+      username: '',
+    }
+  },
+  methods: {
+    show(uname) {
+      if (!uname) {
+        this.$message.warning('当前系统无登录用户!')
+        return
+      } else {
+        this.username = uname
+        this.form.resetFields()
+        this.visible = true
       }
     },
-    methods: {
+    handleCancel() {
-      show(uname){
+      this.close()
-        if(!uname){
+    },
-          this.$message.warning("当前系统无登录用户!");
+    close() {
-          return
+      this.$emit('close')
-        }else{
+      this.visible = false
-          this.username = uname
+      this.disableSubmit = false
-          this.form.resetFields();
+      this.selectedRole = []
-          this.visible = true;
+    },
-        }
+    handleOk() {
-      },
+      const that = this
-      handleCancel () {
+      // 触发表单验证
-        this.close()
+      this.form.validateFields((err, values) => {
-      },
+        if (!err) {
-      close () {
+          that.confirmLoading = true
-        this.$emit('close');
+          let params = Object.assign({ username: this.username }, values)
-        this.visible = false;
+          console.log('修改密码提交数据', params)
-        this.disableSubmit = false;
+          putAction(this.url, params)
-        this.selectedRole = [];
+            .then((res) => {
-      },
+              if (res.success) {
-      handleOk () {
-        const that = this;
-        // 触发表单验证
-        this.form.validateFields((err, values) => {
-          if (!err) {
-            that.confirmLoading = true;
-            let params = Object.assign({username:this.username},values)
-            console.log("修改密码提交数据",params)
-            putAction(this.url,params).then((res)=>{
-              if(res.success){
                 console.log(res)
-                that.$message.success(res.message);
+                that.$message.success(res.message)
-                that.close();
+                that.close()
-              }else{
+              } else {
-                that.$message.warning(res.message);
+                that.$message.warning(res.message)
               }
-            }).finally(() => {
-              that.confirmLoading = false;
             })
-          }
+            .finally(() => {
-        })
+              that.confirmLoading = false
-      },
+            })
-      validateToNextPassword  (rule, value, callback) {
-        const form = this.form;
-        if (value && this.confirmDirty) {
-          form.validateFields(['confirm'], { force: true })
         }
-        callback();
+      })
-      },
+    },
-      compareToFirstPassword  (rule, value, callback) {
+    validateToNextPassword(rule, value, callback) {
-        const form = this.form;
+      const form = this.form
-        if (value && value !== form.getFieldValue('password')) {
+      if (value && this.confirmDirty) {
-          callback('两次输入的密码不一样！');
+        form.validateFields(['confirm'], { force: true })
-        } else {
-          callback()
-        }
-      },
-      handleConfirmBlur  (e) {
-        const value = e.target.value
-        this.confirmDirty = this.confirmDirty || !!value
       }
-
+      callback()
-    }
+    },
-  }
+    compareToFirstPassword(rule, value, callback) {
+      const form = this.form
+      if (value && value !== form.getFieldValue('password')) {
+        callback('两次输入的密码不一样！')
+      } else {
+        callback()
+      }
+    },
+    handleConfirmBlur(e) {
+      const value = e.target.value
+      this.confirmDirty = this.confirmDirty || !!value
+    },
+  },
+}
 </script>
 
 <style scoped>
-
 </style>