优化手机号码登录时校验验证码的问题

sgzb-ui/prettier.config.js

@@ -0,0 +1,10 @@
+module.exports = {
+    tabWidth: 2,
+    semi: false,
+    vueIndentScriptAndStyle: true,
+    singleQuote: true,
+    trailingComma: 'all',
+    proseWrap: 'never',
+    htmlWhitespaceSensitivity: 'strict',
+    endOfLine: 'auto',
+}

sgzb-ui/src/views/claimAndRefund/return/apply.json

@@ -1,143 +0,0 @@
-/** 退料ID */
-@ApiModelProperty(value = "退料ID")
-private Long id;
-
-/** 退料ID-字符串 */
-@ApiModelProperty(value = "退料ID-字符串")
-private String ids;
-
-/** 退料单号 */
-@Excel(name = "退料单号")
-@ApiModelProperty(value = "退料单号")
-private String code;
-
-/** 任务ID */
-@ApiModelProperty(value = "任务ID")
-private Integer taskId;
-
-/** 任务ID */
-@ApiModelProperty(value = "任务类型")
-private Integer taskType;
-
-/** 签订日期 */
-@ApiModelProperty(value = "签订日期")
-private String signTime;
-
-/** 退料人员 */
-@Excel(name = "退料人员")
-@ApiModelProperty(value = "退料人员")
-private String backPerson;
-
-/** 联系电话 */
-@Excel(name = "退料人联系电话")
-@ApiModelProperty(value = "联系电话")
-private String phone;
-
-/** 机具公司审核人 */
-@ApiModelProperty(value = "机具公司审核人")
-private Integer directAuditBy;
-
-/** 机具公司审批时间 */
-@ApiModelProperty(value = "机具公司审批时间")
-private String directAuditTime;
-
-/** 机具公司审批备注 */
-@ApiModelProperty(value = "机具公司审批备注")
-private String directAuditRemark;
-
-
-/** 创建者 */
-@ApiModelProperty(value = "创建者")
-private String createBy;
-
-/** 创建时间 */
-@ApiModelProperty(value = "创建时间")
-private Date createTime;
-
-/** 更新者 */
-@ApiModelProperty(value = "更新者")
-private String updateBy;
-
-/** 更新时间 */
-@ApiModelProperty(value = "更新时间")
-private Date updateTime;
-
-/** 备注 */
-@ApiModelProperty(value = "备注")
-private String remark;
-
-/** 数据所属组织 */
-@ApiModelProperty(value = "数据所属组织")
-private Long companyId;
-
-@ApiModelProperty(value = "关键字")
-private String keyWord;
-
-@ApiModelProperty(value = "工程id")
-private Integer lotId;
-
-@Excel(name = "退料工程名称")
-@ApiModelProperty(value = "工程名称")
-private String lotName;
-
-@ApiModelProperty(value = "单位id")
-private Integer unitId;
-
-@Excel(name = "退料单位名称")
-@ApiModelProperty(value = "单位名称")
-private String unitName;
-
-@Excel(name = "退料申请时间")
-@ApiModelProperty(value = "退料日期")
-private String backTime;
-
-@Excel(name = "协议号")
-@ApiModelProperty(value = "协议编号")
-private String agreementCode;
-
-@Excel(name = "退料状态")
-@ApiModelProperty(value = "任务状态")
-private String taskStatus;
-
-@ApiModelProperty(value = "协议id")
-private Integer agreementId;
-
-@ApiModelProperty(value = "类型id")
-private String typeId;
-
-@Excel(name = "退料工机具类型")
-@ApiModelProperty(value = "类型名称")
-private String typeName;
-
-@ApiModelProperty(value = "规格编号")
-private String typeCode;
-
-@ApiModelProperty(value = "数量")
-private String num;
-
-@ApiModelProperty(value = "详情id和数量")
-private String detailsIdByNum;
-
-@ApiModelProperty(value = "类型id和数量")
-private String typeIdByNum;
-
-@ApiModelProperty(value = "详情id")
-private String detailsId;
-
-@ApiModelProperty(value = "编码")
-private String maCode;
-
-@ApiModelProperty(value = "在用数量")
-private String useNum;
-
-@ApiModelProperty(value = "操作人")
-private String createName;
-
-@ApiModelProperty(value = "审核人")
-private String examineName;
-
-@ApiModelProperty(value = "开始时间")
-private String startTime;
-
-@ApiModelProperty(value = "结束时间")
-private String endTime;

sgzb-ui/src/views/login.vue

@@ -3,22 +3,33 @@
     <div class="login-bar">
       <div class="form-bar">
         <h3 class="title">智慧仓储管理平台</h3>
-        <el-tabs v-model="activeName" style="width: 82%;margin: 0 auto">
+        <el-tabs
-          <el-tab-pane label="账号登录" name="account"></el-tab-pane>
+          v-model="activeName"
-          <el-tab-pane label="手机登录" name="phone"></el-tab-pane>
+          style="width: 400px; padding: 25px 25px 5px 25px"
-        </el-tabs>
+        >
-        <el-form ref="loginForm" :model="loginForm" :rules="loginRules" class="login-form">
+          <el-tab-pane label="账号登录" name="account">
-          <el-form-item prop="username" v-if="activeName=='account'">
+            <!-- 账户密码登录 -->
+            <el-form
+              ref="loginForm"
+              :model="loginForm"
+              :rules="loginRules"
+              class="login-form"
+            >
+              <el-form-item prop="username">
                 <el-input
                   v-model="loginForm.username"
                   type="text"
                   auto-complete="off"
                   placeholder="账号"
                 >
-              <svg-icon slot="prefix" icon-class="user" class="el-input__icon input-icon"/>
+                  <svg-icon
+                    slot="prefix"
+                    icon-class="user"
+                    class="el-input__icon input-icon"
+                  />
                 </el-input>
               </el-form-item>
-          <el-form-item prop="password" v-if="activeName=='account'">
+              <el-form-item prop="password">
                 <el-input
                   v-model="loginForm.password"
                   type="password"
@@ -27,131 +38,274 @@
                   show-password
                   @keyup.enter.native="handleLogin"
                 >
-              <svg-icon slot="prefix" icon-class="password" class="el-input__icon input-icon"/>
+                  <svg-icon
+                    slot="prefix"
+                    icon-class="password"
+                    class="el-input__icon input-icon"
+                  />
                 </el-input>
               </el-form-item>
-          <el-form-item prop="code" v-if="captchaEnabled && activeName=='account'">
+              <el-form-item
+                prop="code"
+                v-if="captchaEnabled"
+                class="code-container"
+              >
                 <el-input
                   v-model="loginForm.code"
                   auto-complete="off"
-              placeholder="验证码"
+                  placeholder="图形验证码"
-              style="width: 63%"
                   @keyup.enter.native="handleLogin"
                 >
-              <svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon"/>
+                  <svg-icon
+                    slot="prefix"
+                    icon-class="validCode"
+                    class="el-input__icon input-icon"
+                  />
                 </el-input>
                 <div class="login-code">
-              <img :src="codeUrl" @click="getCode" class="login-code-img"/>
+                  <img
+                    :src="codeUrl"
+                    @click="getCode(1)"
+                    class="login-code-img"
+                  />
                 </div>
               </el-form-item>
-          <el-form-item style="width:100%;" v-if="activeName=='account'">
+              <el-form-item style="width: 100%">
                 <el-button
                   :loading="loading"
                   size="medium"
                   type="primary"
-              style="width:100%;"
+                  style="width: 100%"
-              
                   @click.native.prevent="handleLogin"
                 >
                   <span v-if="!loading">登 录</span>
                   <span v-else>登 录 中...</span>
                 </el-button>
-            <div style="float: right;" v-if="register">
+                <div style="float: right" v-if="register">
                   <!--          <el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;">记住密码</el-checkbox>-->
-              <router-link class="link-type" :to="'/register'">立即注册</router-link>
+                  <router-link class="link-type" :to="'/ '"
+                    >立即注册</router-link
+                  >
                 </div>
               </el-form-item>
-
+            </el-form>
-          <el-form-item prop="phone" v-if="activeName=='phone'">
+          </el-tab-pane>
+          <el-tab-pane label="手机登录" name="phone">
+            <!-- 手机验证码登录 -->
+            <el-form
+              ref="phoneLoginFormRef"
+              :model="phoneLoginParams"
+              :rules="phoneLoginRules"
+              class="login-form"
+            >
+              <el-form-item prop="phone">
                 <el-input
-              v-model="loginForm.phone"
+                  v-model="phoneLoginParams.phone"
                   type="text"
                   :readonly="readonlyFlag"
                   @focus="handleInputClick"
                   auto-complete="off"
                   placeholder="手机号"
                 >
-              <svg-icon slot="prefix" icon-class="phone" class="el-input__icon input-icon"/>
+                  <svg-icon
+                    slot="prefix"
+                    icon-class="phone"
+                    class="el-input__icon input-icon"
+                  />
                 </el-input>
               </el-form-item>
-          <el-form-item prop="textCode" v-if="activeName=='phone'">
+
+              <!-- 5.27 新增发送短信验证时 增加图形验证码校验 -->
+              <el-form-item
+                prop="code"
+                v-if="captchaEnabled"
+                class="code-container"
+              >
                 <el-input
-              v-model="loginForm.textCode"
+                  v-model="phoneLoginParams.code"
                   auto-complete="off"
-              placeholder="验证码"
+                  placeholder="图形验证码"
+                  @keyup.enter.native="textLogin"
                   style="width: 63%"
                 >
-              <svg-icon slot="prefix" icon-class="validCode" class="el-input__icon input-icon"/>
+                  <svg-icon
+                    slot="prefix"
+                    icon-class="validCode"
+                    class="el-input__icon input-icon"
+                  />
+                </el-input>
+                <div class="login-code">
+                  <img
+                    :src="phoneCodeUrl"
+                    @click="getCode(2)"
+                    class="login-code-img"
+                    style="width: 100%"
+                  />
+                </div>
+              </el-form-item>
+              <el-form-item prop="textCode" class="code-container">
+                <el-input
+                  v-model="phoneLoginParams.textCode"
+                  auto-complete="off"
+                  placeholder="短信验证码"
+                  style="width: 63%"
+                >
+                  <svg-icon
+                    slot="prefix"
+                    icon-class="validCode"
+                    class="el-input__icon input-icon"
+                  />
                 </el-input>
                 <div class="login-code">
                   <!-- <div class="login-code-img" style="border: 1px solid rgb(220, 223, 230);" @click="getTextCode">获取验证码</div> -->
-              <div class="login-code-img" style="border: 1px solid rgb(220, 223, 230);" v-show="show === 1" @click="getTextCode">获取验证码</div>
+                  <div
-              <div class="login-code-img" style="border: 1px solid rgb(220, 223, 230);" v-show="show === 2">{{ count }} s</div>
+                    class="login-code-img"
-              <div class="login-code-img" style="border: 1px solid rgb(220, 223, 230);" v-show="show === 3" @click="getTextCode">重发</div>
+                    style="border: 1px solid rgb(220, 223, 230)"
+                    v-show="show === 1"
+                    @click="getTextCode"
+                  >
+                    获取验证码
+                  </div>
+                  <div
+                    class="login-code-img"
+                    style="border: 1px solid rgb(220, 223, 230)"
+                    v-show="show === 2"
+                  >
+                    {{ count }} s
+                  </div>
+                  <div
+                    class="login-code-img"
+                    style="border: 1px solid rgb(220, 223, 230)"
+                    v-show="show === 3"
+                    @click="getTextCode"
+                  >
+                    重发
+                  </div>
                 </div>
               </el-form-item>
-          <el-form-item style="width:100%;"  v-if="activeName=='phone'">
+              <el-form-item style="width: 100%">
                 <el-button
                   :loading="loading"
                   size="medium"
                   type="primary"
-              style="width:100%;"
+                  style="width: 100%"
                   @click.native.prevent="textLogin"
                 >
                   <span v-if="!loading">登 录</span>
                   <span v-else>登 录 中...</span>
                 </el-button>
-            <div style="float: right;" v-if="register">
+                <div style="float: right" v-if="register">
-              <!--          <el-checkbox v-model="loginForm.rememberMe" style="margin:0px 0px 25px 0px;">记住密码</el-checkbox>-->
+                  <router-link class="link-type" :to="'/register'"
-              <router-link class="link-type" :to="'/register'">立即注册</router-link>
+                    >立即注册</router-link
+                  >
                 </div>
               </el-form-item>
-
-
-
-
             </el-form>
+          </el-tab-pane>
+        </el-tabs>
       </div>
     </div>
     <!--        底部  -->
-    <div class="el-login-footer">
+    <!--       <div class="el-login-footer"> -->
-      <span>Copyright © 2018-2023 ruoyi.vip All Rights Reserved.</span>
+    <!--       <span>Copyright © 2018-2023 ruoyi.vip All Rights Reserved.</span> -->
-    </div>
+    <!--       </div> -->
+
+    <!-- 图形验证码弹框 -->
+    <el-dialog
+      title="提示"
+      :visible.sync="dialogVisible"
+      width="30%"
+      :before-close="handleClose"
+    >
+      <span>这是一段信息</span>
+      <span slot="footer" class="dialog-footer">
+        <el-button @click="dialogVisible = false">取 消</el-button>
+        <el-button type="primary" @click="dialogVisible = false"
+          >确 定</el-button
+        >
+      </span>
+    </el-dialog>
   </div>
 </template>
 
 <script>
-import {getCodeImg,sendCode,loginByMall} from "@/api/login";
+import { getCodeImg, sendCode } from '@/api/login'
-import Cookies from "js-cookie";
+import Cookies from 'js-cookie'
 import { encrypt, decrypt } from '@/utils/jsencrypt'
 
 export default {
-  name: "Login",
+  name: 'Login',
   data() {
     return {
-      codeUrl: "",
+      codeUrl: '', // 账号登录显示的验证码
+      phoneCodeUrl: '', // 手机验证码登录显示的验证码
       loginForm: {
-        username: "",
+        username: '',
-        password: "",
+        password: '',
-        phone: '',
         rememberMe: false,
-        code: "",
+        code: '', // 账户密码登录时的图片验证码
-        uuid: ""
+        uuid: '',
       },
+
+      /* 手机号码登录时参数 */
+      phoneLoginParams: {
+        phone: '',
+        code: '',
+        textCode: '',
+        uuid: '',
+      },
+      // 账户密码登录时的校验规则
       loginRules: {
         username: [
-          {required: true, trigger: "blur", message: "请输入您的账号"}
+          {
-        ],
+            required: true,
-        phone: [
+            trigger: 'blur',
-          {required: true, trigger: "blur", message: "请输入您的手机号"}
+            message: '请输入您的账号',
-        ],
+          },
-        textCode: [
-          {required: true, trigger: "blur", message: "请输入短信验证码"}
         ],
         password: [
-          {required: true, trigger: "blur", message: "请输入您的密码"}
+          {
+            required: true,
+            trigger: 'blur',
+            message: '请输入您的密码',
+          },
+        ],
+        code: [
+          {
+            required: true,
+            trigger: 'change',
+            message: '请输入验证码',
+          },
+        ],
+      },
+      // 手机号登录时的校验规则
+      phoneLoginRules: {
+        phone: [
+          {
+            required: true,
+            trigger: 'blur',
+            message: '请输入您的手机号',
+          },
+          {
+            pattern: /^1[3456789]\d{9}$/,
+            message: '请输入正确的手机号码',
+            trigger: 'blur',
+          },
+        ],
+        textCode: [
+          {
+            required: true,
+            trigger: 'blur',
+            message: '请输入短信验证码',
+          },
+        ],
+        code: [
+          {
+            required: true,
+            trigger: 'blur',
+            message: '请输入图形验证码',
+          },
         ],
-        code: [{required: true, trigger: "change", message: "请输入验证码"}]
       },
       loading: false,
       // 验证码开关
@@ -164,42 +318,45 @@ export default {
       show: 1,
       count: '',
       timer: null,
-      loginParams:{}//登录页面地址栏参数
+    }
-    };
   },
   watch: {
-    $route: {
+    /* 账户，手机号登录切换时，清空表单的校验  5.27 删除之前南网跳转的监听 */
-      handler: function (route) {
+    activeName: {
-        this.redirect = route.query && route.query.redirect;
+      handler(newVal) {
-        // console.log(this.$route.query.redirect.split("?"))
+        this.$refs['loginForm'].clearValidate()
-        // console.log(this.$route.query.redirect.split("?")[1].split("&"))
+        this.$refs['phoneLoginFormRef'].clearValidate()
-        if(this.$route.query.redirect.split("?").length>1){
+
-          let arr = this.$route.query.redirect.split("?")[1].split("&")||[]
+        // 切换登录方式时 根据切换方式 自动获取新的图形验证码
-          arr.forEach((item,index)=>{
+        if (newVal === 'account') {
-            this.$set(this.loginParams, item.split("=")[0]+"", item.split("=")[1]);
+          this.getCode(1)
-          })
+        } else {
+          this.getCode(2)
         }
       },
-      immediate: true
+      deep: true,
-    }
+    },
   },
   created() {
-    // console.log(this.$route.query.redirect.split("?")[1])
+    this.getCode(1) // 默认账号密码登录 type 传1
-    if(JSON.stringify(this.loginParams) != '{}'){
+    this.getCookie()
-      this.jumpLogin()
-    }
-    this.getCode();
-    this.getCookie();
   },
   methods: {
-    getCode() {
+    getCode(type) {
-      getCodeImg().then(res => {
+      getCodeImg().then((res) => {
-        this.captchaEnabled = res.captchaEnabled === undefined ? true : res.captchaEnabled;
+        /* 根据 type 判断当前获取的图形验证码如何赋值  1 账号登录 2 手机验证码登录 */
+        this.captchaEnabled =
+          res.captchaEnabled === undefined ? true : res.captchaEnabled
         if (this.captchaEnabled) {
-          this.codeUrl = "data:image/gif;base64," + res.img;
+          if (type === 1) {
-          this.loginForm.uuid = res.uuid;
+            this.codeUrl = 'data:image/gif;base64,' + res.img
+            this.loginForm.uuid = res.uuid
+          } else {
+            this.phoneCodeUrl = 'data:image/gif;base64,' + res.img
+            this.phoneLoginParams.uuid = res.uuid
           }
-      });
+        }
+      })
     },
     //防止手机号自动充填
     handleInputClick() {
@@ -207,12 +364,20 @@ export default {
     },
     //获取短信验证码
     getTextCode() {
-      const regExp = /^1[3456789]\d{9}$/;
+      this.$refs.phoneLoginFormRef.validateField(
-      if (regExp.test(this.loginForm.phone)) {
+        ['phone', 'code'],
-        console.log('手机号格式正确');
+        async (valid) => {
-        sendCode({phone:this.loginForm.phone}).then(res => {
+          if (!valid) {
+            const sendParams = {
+              phone: this.phoneLoginParams.phone,
+              code: this.phoneLoginParams.code,
+              uuid: this.phoneLoginParams.uuid,
+            }
+
+            const res = await sendCode(sendParams)
+
             if (res.code == 200) {
-            this.$modal.msgSuccess("发送成功");
+              this.$modal.msgSuccess('发送成功')
               const TIME_COUNT = 60
               if (!this.timer) {
                 this.count = TIME_COUNT
@@ -228,97 +393,118 @@ export default {
                 }, 1000)
               }
             }
-        });
-      } else {
-        this.$modal.msgError("请输入正确手机号");
           }
+        },
+      )
+      // if (regExp.test(this.loginForm.phone)) {
+      //   sendCode({ phone: this.loginForm.phone }).then((res) => {
+      //     if (res.code == 200) {
+      //       this.$modal.msgSuccess('发送成功')
+      //       const TIME_COUNT = 60
+      //       if (!this.timer) {
+      //         this.count = TIME_COUNT
+      //         this.show = 2
+      //         this.timer = setInterval(() => {
+      //           if (this.count > 0 && this.count <= TIME_COUNT) {
+      //             this.count--
+      //           } else {
+      //             this.show = 3
+      //             clearInterval(this.timer)
+      //             this.timer = null
+      //           }
+      //         }, 1000)
+      //       }
+      //     }
+      //   })
+      // } else {
+      //   this.$modal.msgError('请输入正确手机号')
+      // }
+    },
 
-    },
-    //短信登录
-    textLogin(){
-      // checkCode
-      console.log(this.loginForm)
-      this.$refs.loginForm.validate(valid => {
-        if (valid) {
-          this.loading = true;
-          if (this.loginForm.rememberMe) {
-            Cookies.set("username", this.loginForm.username, {expires: 30});
-            Cookies.set("password", encrypt(this.loginForm.password), {expires: 30});
-            Cookies.set('rememberMe', this.loginForm.rememberMe, {expires: 30});
-          } else {
-            Cookies.remove("username");
-            Cookies.remove("password");
-            Cookies.remove('rememberMe');
-          }
-          console.log(this.loginForm)
-          this.$store.dispatch("textLogin", this.loginForm).then(() => {
-            this.$router.push({path:"/"}).catch(() => {
-            });
-          }).catch(() => {
-            this.loading = false;
-             
-          });
-        }
-      });
-    },
-    //南网登录
-    jumpLogin(){
-      this.loading = true;
-      let param = {
-        token:this.loginParams.token,
-        username:this.loginParams.userName
-      }
-      // console.log(param)
-      this.$store.dispatch("ssoLogin", param).then(() => {
-        //成功后会跳转页面入首页
-        this.$router.push({path:"/"}).catch(() => {
-        });
-      }).catch(() => {
-        this.loading = false;
-        //失败返回南网登录页面
-        // window.location.replace('https://test-sso.csgmall.com.cn/?client_id=549OWptc&theme=zhgc_storage&response_type=code&redirect_uri=https%3A%2F%2Ftest-cc.zhgkxt.com')
-      });
-    },
     getCookie() {
-      const username = Cookies.get("username");
+      const username = Cookies.get('username')
-      const password = Cookies.get("password");
+      const password = Cookies.get('password')
       const rememberMe = Cookies.get('rememberMe')
       this.loginForm = {
         username: username === undefined ? this.loginForm.username : username,
-        password: password === undefined ? this.loginForm.password : decrypt(password),
+        password:
-        rememberMe: rememberMe === undefined ? false : Boolean(rememberMe)
+          password === undefined ? this.loginForm.password : decrypt(password),
-      };
+        rememberMe: rememberMe === undefined ? false : Boolean(rememberMe),
-    },
-    handleLogin() {
-      this.$refs.loginForm.validate(valid => {
-        if (valid) {
-          this.loading = true;
-          if (this.loginForm.rememberMe) {
-            Cookies.set("username", this.loginForm.username, {expires: 30});
-            Cookies.set("password", encrypt(this.loginForm.password), {expires: 30});
-            Cookies.set('rememberMe', this.loginForm.rememberMe, {expires: 30});
-          } else {
-            Cookies.remove("username");
-            Cookies.remove("password");
-            Cookies.remove('rememberMe');
       }
-          this.$store.dispatch("Login", this.loginForm).then(() => {
+    },
+
+    // 账户密码登录-------------------------------------------------------------
+    handleLogin() {
+      this.$refs.loginForm.validate((valid) => {
+        if (valid) {
+          this.loading = true
+          if (this.loginForm.rememberMe) {
+            Cookies.set('username', this.loginForm.username, {
+              expires: 30,
+            })
+            Cookies.set('password', encrypt(this.loginForm.password), {
+              expires: 30,
+            })
+            Cookies.set('rememberMe', this.loginForm.rememberMe, {
+              expires: 30,
+            })
+          } else {
+            Cookies.remove('username')
+            Cookies.remove('password')
+            Cookies.remove('rememberMe')
+          }
+          this.$store
+            .dispatch('Login', this.loginForm)
+            .then(() => {
               if (localStorage.getItem('isCode') == 1) {
                 this.$router.push({ path: '/resetPassword' }).catch(() => {})
               } else {
                 this.$router.push({ path: '/' }).catch(() => {})
               }
-          }).catch(() => {
+            })
-            this.loading = false;
+            .catch(() => {
+              this.loading = false
               if (this.captchaEnabled) {
-              this.getCode();
+                this.getCode()
               }
-          });
+            })
         }
-      });
+      })
+    },
+    // 短信验证码登录-----------------------------------------------------------
+    textLogin() {
+      console.log(this.loginForm)
+      this.$refs.phoneLoginFormRef.validate((valid) => {
+        if (valid) {
+          this.loading = true
+          // if (this.loginForm.rememberMe) {
+          //   Cookies.set('username', this.loginForm.username, {
+          //     expires: 30,
+          //   })
+          //   Cookies.set('password', encrypt(this.loginForm.password), {
+          //     expires: 30,
+          //   })
+          //   Cookies.set('rememberMe', this.loginForm.rememberMe, {
+          //     expires: 30,
+          //   })
+          // } else {
+          //   Cookies.remove('username')
+          //   Cookies.remove('password')
+          //   Cookies.remove('rememberMe')
+          // }
+          this.$store
+            .dispatch('textLogin', this.phoneLoginParams)
+            .then(() => {
+              this.$router.push({ path: '/' }).catch(() => {})
+            })
+            .catch(() => {
+              this.loading = false
+            })
         }
+      })
+    },
+  },
 }
-};
 </script>
 
 <style rel="stylesheet/scss" lang="scss">
@@ -328,7 +514,7 @@ export default {
   //align-items: center;
   position: relative;
   height: 100%;
-  background-image: url("../assets/images/login.png");
+  background-image: url('../assets/images/login.png');
   background-size: 100% 100%;
   //background: #1891FF;
 }
@@ -362,11 +548,9 @@ export default {
   //border-radius: 6px;
   //height: 100%;
   background: #ffffff;
-  width: 400px;
+  margin-top: 25px;
-  padding: 25px 25px 5px 25px;
-
   .el-input {
-    height: 45px;
+    // height: 45px;
 
     input {
       height: 38px;
@@ -387,11 +571,11 @@ export default {
 }
 
 .login-code {
-  width: 33%;
   height: 38px;
-  float: right;
+  margin-left: 15px;
-
+  flex: 1;
   img {
+    height: 38px;
     cursor: pointer;
     vertical-align: middle;
   }
@@ -412,5 +596,12 @@ export default {
 
 .login-code-img {
   height: 38px;
+  cursor: pointer;
+  border-radius: 3px;
+}
+
+/* 解决验证码输入框与密码输入框对齐问题 */
+.code-container .el-form-item__content {
+  display: flex;
 }
 </style>