@lambo-design/login-form 1.0.0-beta.16 → 1.0.0-beta.18

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lambo-design/login-form",
-  "version": "1.0.0-beta.16",
+  "version": "1.0.0-beta.18",
   "description": "",
   "main": "index.js",
   "author": "lambo",
@@ -10,8 +10,8 @@
     "registry": "https://registry.npmjs.org/"
   },
   "devDependencies": {
-    "@lambo-design/shared": "^1.0.0-beta.285",
-    "@lambo-design/core": "^4.7.1-beta.167"
+    "@lambo-design/core": "^4.7.1-beta.167",
+    "@lambo-design/shared": "^1.0.0-beta.287"
   },
   "scripts": {
     "release": "pnpm release-beta && git push --follow-tags && pnpm re-publish",

package/src/login-form.vue

@@ -3,32 +3,32 @@
         :model="form" :rules="rules" :label-width="0"
         @keydown.enter.native="handleSubmit">
     <FormItem prop="userName">
-      <Input v-model="form.userName" placeholder="请输入用户名">
+      <Input v-model="form.userName" :placeholder="t('login-form.box.form-user-name')">
         <span slot="prepend">
           <Icon :size="16" type="ios-person"></Icon>
         </span>
       </Input>
     </FormItem>
     <FormItem prop="password">
-      <Input v-model="form.password" placeholder="请输入密码" type="password">
+      <Input v-model="form.password" :placeholder="t('login-form.box.form-user-pas')" type="password">
         <span slot="prepend">
           <Icon :size="14" type="md-lock"></Icon>
         </span>
       </Input>
     </FormItem>
-    <FormItem prop="validCode" v-if="captchaMethod === '图片'">
-      <Input v-model="form.validCode" class="captcha" placeholder="请输入验证码">
+    <FormItem prop="validCode" v-if="captchaMethod === t('login-form.other.captcha-method-image')">
+      <Input v-model="form.validCode" class="captcha" :placeholder="t('login-form.box.form-user-valid-code')">
         <template slot="prepend">
           <img class="prefix" src="@/assets/images/captcha.svg">
         </template>
       </Input>
       <div class="Imgbox"><img :src="captchaUrl" class="captchaImg" @click="getCaptcha"></div>
     </FormItem>
-    <FormItem prop="validCode" v-if="captchaMethod === '短信'">
+    <FormItem prop="validCode" v-if="captchaMethod === t('login-form.other.captcha-method-sms')">
       <Input
           search
           :enter-button="ValidNumText"
-          placeholder="请查收短信并输入验证码"
+          :placeholder="t('login-form.box.form-user-sms-code')"
           v-model="form.validCode"
           @on-search="getVaildCode">
         <template slot="prepend">
@@ -36,11 +36,11 @@
         </template>
       </Input>
     </FormItem>
-    <FormItem prop="validCode" v-if="captchaMethod === '邮箱'">
+    <FormItem prop="validCode" v-if="captchaMethod === t('login-form.other.captcha-method-mail')">
       <Input
           search
           :enter-button="ValidNumText"
-          placeholder="请查收邮件并输入验证码"
+          :placeholder="t('login-form.box.form-user-mail-code')"
           v-model="form.validCode"
           @on-search="getVaildCode">
         <template slot="prepend">
@@ -48,15 +48,15 @@
         </template>
       </Input>
     </FormItem>
-    <FormItem v-if="captchaMethod === '滑动图片'">
+    <FormItem v-if="captchaMethod === t('login-form.other.captcha-method-slide-image')">
       <Button long :disabled="isDisabled" @click="showSlideVerify">{{ buttonText }}</Button>
     </FormItem>
     <FormItem>
-      <Checkbox v-if="showRememberMe === '1'" v-model="rememberMe"><span class="remember">记住用户名</span></Checkbox>
-      <label v-if="showForgetPassword === '1'" style="float: right;"><router-link to="/forgetPasswordForget">忘记密码？</router-link></label>
+      <Checkbox v-if="showRememberMe === '1'" v-model="rememberMe"><span class="remember">{{ t('login-form.box.form-remember') }}</span></Checkbox>
+      <label v-if="showForgetPassword === '1'" style="float: right;"><router-link to="/forgetPasswordForget">{{ t('login-form.box.form-forget') }}</router-link></label>
     </FormItem>
     <FormItem>
-      <Button :loading="loading" long type="primary" @click="handleSubmit">登录</Button>
+      <Button :loading="loading" long type="primary" @click="handleSubmit">{{ t('login-form.box.form-login') }}</Button>
     </FormItem>
   </Form>
 </template>
@@ -66,9 +66,12 @@ import {getLocalStorage, removeLocalStorage, setLocalStorage} from "@lambo-desig
 import {guid} from "@lambo-design/shared/utils/number";
 import crypto from "@lambo-design/shared/utils/crypto"
 import ajax from "@lambo-design/shared/utils/ajax";
+import Locale from "@lambo-design/core/src/mixins/locale";
+import { t } from '@lambo-design/core/src/locale';
 
 export default {
   name: 'LoginForm',
+  mixins: [Locale],
   components:{
   },
   props: {
@@ -76,7 +79,7 @@ export default {
       type: Array,
       default: () => {
         return [
-          {required: true, message: '账号不能为空', trigger: 'blur'}
+          {required: true, message: t('login-form.box.form-rule-user-name'), trigger: 'blur'}
         ]
       }
     },
@@ -84,7 +87,7 @@ export default {
       type: Array,
       default: () => {
         return [
-          {required: true, message: '密码不能为空', trigger: 'blur'}
+          {required: true, message: t('login-form.box.form-rule-user-pas'), trigger: 'blur'}
         ]
       }
     },
@@ -92,7 +95,7 @@ export default {
       type: Array,
       default: () => {
         return [
-          {required: true, message: '验证码不能为空', trigger: 'blur'}
+          {required: true, message: t('login-form.box.form-rule-valid-code'), trigger: 'blur'}
         ]
       }
     },
@@ -124,7 +127,7 @@ export default {
   },
   data() {
     return {
-      ValidNumText: "获取验证码",
+      ValidNumText: this.t('login-form.other.get-valid-code'),
       form: {
         userName: '',
         password: '',
@@ -168,20 +171,20 @@ export default {
     },
     getVaildCode() {
       let self = this;
-      if (self.ValidNumText == "获取验证码") {
-        self.ValidNumText = self.countDown + "s后再次获取";
+      if (self.ValidNumText == self.t('login-form.other.get-valid-code')) {
+        self.ValidNumText = self.countDown + self.t('login-form.other.get-valid-code-later');
         self.clock = window.setInterval(() => {
           self.countDown--;
-          self.ValidNumText = self.countDown + "s后再次获取";
+          self.ValidNumText = self.countDown + self.t('login-form.other.get-valid-code-later');
           if (self.countDown <= 0) {
             window.clearInterval(self.clock);
-            self.ValidNumText = "获取验证码";
+            self.ValidNumText = self.t('login-form.other.get-valid-code');
             self.countDown = self.countDownNum;
           }
         }, 1000);
         let param
         let url
-        if(self.captchaMethod === '邮箱'){
+        if(self.captchaMethod === self.t('login-form.other.captcha-method-mail')){
           url = config.upmsServerContext + "/anon/user/sendMailForLogin"
           param = {
             userId: self.form.userName,
@@ -190,7 +193,7 @@ export default {
             mailConfigId: self.mailConfigId
           };
         }
-        if(self.captchaMethod === '短信'){
+        if(self.captchaMethod === self.t('login-form.other.captcha-method-sms')){
           url = config.upmsServerContext + "/anon/user/sendSmsForLogin"
           param = {
             userId: self.form.userName,
@@ -206,19 +209,19 @@ export default {
               .then(function(resp) {
                     if (resp.data.code == 200) {
                       self.$Message.success({
-                        content: "发送成功",})
+                        content: self.t('login-form.other.send-success'),})
                     } else {
                       self.$Message.error(resp.data.data);
                       window.clearInterval(self.clock);
-                      self.ValidNumText = "获取验证码";
+                      self.ValidNumText = self.t('login-form.other.get-valid-code');
                       self.countDown = self.countDownNum;
                     }
                   }
               );
         }else{
-          self.$Message.error("请输入用户名");
+          self.$Message.error(self.t('login-form.box.form-user-name'));
           window.clearInterval(self.clock);
-          self.ValidNumText = "获取验证码";
+          self.ValidNumText = self.t('login-form.other.get-valid-code');
           self.countDown = self.countDownNum;
         }
       }
@@ -248,15 +251,17 @@ export default {
           this.clearLocalStorage();
         }
       }else{
-        this.$Message.error("请输入用户名");
+        this.$Message.error(this.t('login-form.box.form-user-name'));
       }
     },
     handleSubmit() {
       this.$refs.loginForm.validate((valid) => {
-        if(valid && this.captchaMethod == '滑动图片' && !this.isSlideVerify){
-          this.$Message.error("请点击验证进行登录验证");
+        if(valid && this.captchaMethod == this.t('login-form.other.captcha-method-slide-image')
+            && !this.isSlideVerify){
+          this.$Message.error(this.t('login-form.box.form-rule-click-login'));
         }
-        if (valid && ((this.captchaMethod == '滑动图片' && this.isSlideVerify) || this.captchaMethod != '滑动图片')) {
+        if (valid && ((this.captchaMethod == this.t('login-form.other.captcha-method-slide-image')
+            && this.isSlideVerify) || this.captchaMethod != this.t('login-form.other.captcha-method-slide-image'))) {
           let params = {
             userName: this.form.userName,
             password: this.form.password,

package/src/login-page.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="lambo-login" :style="backGroundStyle">
     <div class="lambo-login-con" :style="formStyle">
-      <Card :bordered="false" icon="log-in" title="欢迎登录">
+      <Card :bordered="false" icon="log-in" :title="t('login-page.box.welcome-login')">
         <div class="lambo-form-con">
           <LamboLoginForm ref="login" :loading="formLoading"
                           :captcha-img-url="formCaptchaImgUrl"
@@ -15,9 +15,11 @@
 
 <script>
 import LamboLoginForm from './login-form'
+import Locale from "@lambo-design/core/src/mixins/locale";
 
 export default {
   name: 'LamboLoginPage',
+  mixins: [Locale],
   components: {
     LamboLoginForm
   },