qgb-process 0.1.52 → 0.1.53

package/src/views/Login/components/FormLogin.vue

@@ -1,1001 +0,0 @@
-<!--
- * @Descripttion: 未描述
- * @version: 1.0.0
- * @Author: Chendajiang
- * @Date: 2019-08-09 11:22:34
- * @LastEditors: Yxj
- * @LastEditTime: 2020-10-09 19:36:39
- -->
-
-<template>
-  <div class="login-box-right" v-loading="loginloading">
-    <div class="QRcodeTab">
-      <img
-        v-if="logType==1"
-        @click="logTab(1)"
-        style="width:58px;height:58px;"
-        src="./image/qrcode.png"
-        alt
-      />
-      <img
-        v-if="logType==2"
-        @click="logTab(2)"
-        style="width:58px;height:58px;"
-        src="./image/diannao.png"
-        alt
-      />
-    </div>
-    <div class="toast" v-if="logType==1">
-      <section>
-        <img src="./image/anquan.png" alt />
-        <span>扫码登录更安全</span>
-      </section>
-    </div>
-    <div class="qrLog" v-show="logType==2">
-      <div class="tc-20"></div>
-      <div class="tc-15"></div>
-      <div class="titleText">
-        <span>手机扫码</span>
-        <span>安全登录</span>
-      </div>
-      <div class="tc-20"></div>
-      <div class="tc-11"></div>
-      <div class="QRCodeBox">
-        <canvas id="QRCode"></canvas>
-        <div v-show="shade" class="QRCodechenge">
-          <p>请重新刷新二维码</p>
-          <el-button type="primary" @click="getQRCode()">点击刷新</el-button>
-        </div>
-        <div v-show="successShade" class="QRCodechenge successShade">
-          <img src="./image/icon_success.png" alt />
-          <p>登录成功</p>
-        </div>
-      </div>
-      <div class="textBox">
-        <div class="left">
-          <img src="./image/sys.png" />
-        </div>
-        <div class="right">
-          <p>
-            打开
-            <span>企管帮APP</span>
-          </p>
-          <p>扫一扫</p>
-        </div>
-      </div>
-      <footer class="footer">
-        <div @click="logTab(2)">密码登录</div>
-        <div @click="$router.push({path:'/sign'})">用户注册</div>
-      </footer>
-    </div>
-    <div class="pasLog" v-show="logType==1">
-      <div class="tc-20"></div>
-      <div class="tc-20"></div>
-      <div class="login-box-right-tab">
-        <div :class="{'login-box-right-tab-click':tabClick == 1}" @click="clickTabClick(1)">账号登录</div>
-        <div :class="{'login-box-right-tab-click':tabClick == 2}" @click="clickTabClick(2)">短信登录</div>
-      </div>
-      <div class="tc-40"></div>
-      <div v-show="tabClick == 1">
-        <el-form ref="form1" :model="form1" :rules="rules1">
-          <el-form-item prop="username">
-            <div class="login-tel login-input">
-              <div class="bg-img"></div>
-              <div class="bg-line"></div>
-              <el-input
-                autocomplete="off"
-                v-model="form1.username"
-                placeholder="请输入手机号码"
-                @input="changeTel(1)"
-              ></el-input>
-            </div>
-          </el-form-item>
-          <el-form-item prop="password">
-            <div class="login-password login-input">
-              <div class="bg-img"></div>
-              <div class="bg-line"></div>
-              <div class="bg-eye" @click="showEye = !showEye">
-                <img v-if="showEye" src="@/assets/login/close-eye.png" alt />
-                <img v-if="!showEye" src="@/assets/login/eye.png" alt />
-              </div>
-              <input type="text" style="display: none;" />
-              <el-input
-                autocomplete="new-password"
-                ref="password"
-                v-if="showEye"
-                :type="type"
-                @focus="onFocus"
-                onpaste="return false"
-                oncontextmenu="return false"
-                oncopy="return false"
-                oncut="return false"
-                oninput="if(value.length>20)value=value.slice(0,20)"
-                v-model="form1.password"
-                placeholder="请输入密码"
-              ></el-input>
-              <el-input
-                v-if="!showEye"
-                autocomplete="new-password"
-                type="text"
-                onpaste="return false"
-                oncontextmenu="return false"
-                oncopy="return false"
-                oncut="return false"
-                oninput="if(value.length>20)value=value.slice(0,20)"
-                v-model="form1.password"
-                placeholder="请输入密码"
-              ></el-input>
-            </div>
-          </el-form-item>
-        </el-form>
-      </div>
-      <div v-show="tabClick == 2">
-        <el-form ref="form2" :model="form2" :rules="rules2">
-          <el-form-item prop="username">
-            <div class="login-tel login-input">
-              <div class="bg-img"></div>
-              <div class="bg-line"></div>
-              <el-input
-                autocomplete="off"
-                v-model="form2.username"
-                placeholder="请输入手机号码"
-                @input="changeTel(2)"
-              ></el-input>
-            </div>
-          </el-form-item>
-          <el-form-item prop="short">
-            <div class="login-short-box">
-              <div class="login-password login-input">
-                <div class="bg-img"></div>
-                <div class="bg-line"></div>
-                <el-input
-                  type="text"
-                  oninput="if(value.length>4)value=value.slice(0,4)"
-                  v-model="form2.short"
-                  placeholder="请输入验证码"
-                ></el-input>
-              </div>
-              <div>
-                <Button6 v-if="ifGetCode && codeFont == '获取验证码'" @click="getSMSLoginCode">获取验证码</Button6>
-                <Button6 v-if="!(ifGetCode && codeFont == '获取验证码')" :disabled="true">{{codeFont}}</Button6>
-              </div>
-            </div>
-          </el-form-item>
-        </el-form>
-      </div>
-      <div class="tc-40"></div>
-      <div class="login-button">
-        <!-- <el-button type="primary" @click="login">登录</el-button> -->
-        <Button6 @click="login">登录</Button6>
-      </div>
-      <div class="tc-10"></div>
-      <div class="login-font font14">
-        <div @click="$router.push({path:'/sign'})">用户注册</div>
-        <div @click="$router.push({path:'/passfind'})">忘记密码？</div>
-      </div>
-      <div class="tc-20"></div>
-      <div class="tc-30"></div>
-      <div class="tc-10"></div>
-    </div>
-  </div>
-</template>
-<script>
-import apiUser from "@/api/apiUser";
-import apiAuth from "@/api/apiAuth";
-import { isvalidPhone } from "@/components/form/validate";
-import apiMaterials from "@/api/apiMaterials/apiMaterials";
-import axios from "axios";
-import sessionStorage from "@/storage/sessionStorage.js";
-import cookie from "@/storage/cookies";
-import localStorage from "@/storage/localStorage";
-import { apiHome } from "@/api/apiHome";
-import qs from "qs";
-import QRCode from "qrcode";
-
-export default {
-  name: "FormLogin",
-  mixins: [],
-  extends: {},
-  props: {},
-  data() {
-    return {
-      successShade: false,
-      timeId: null,
-      time: 0,
-      shade: false,
-      QRCodeMsg: "生成二维码信息",
-      logType: 1,
-      loginloading: false,
-      codeFont: "获取验证码",
-      codeNum: 60,
-      ifGetCode: false,
-      tabClick: 1,
-      type: "text",
-      showEye: true,
-      showCode: false,
-      form1: {
-        username: "", // 17609321099
-        password: "", // 000qwer
-        code: "0000",
-        grant_type: "password",
-        randomStr: "",
-        remember_me: false,
-        short: ""
-      },
-      form2: {
-        username: "",
-        short: ""
-      },
-      img: `${process.env.VUE_APP_APIUSER}/code/`,
-      rules1: {
-        username: {
-          required: true,
-          validator: this.validPhone,
-          trigger: "blur"
-        },
-        password: [{ required: true, message: "密码不能为空", trigger: "blur" }]
-      },
-      rules2: {
-        username: {
-          required: true,
-          validator: this.validPhone,
-          trigger: "blur"
-        },
-        short: [{ required: true, validator: this.validShort, trigger: "blur" }]
-      }
-    };
-  },
-  computed: {},
-  components: {},
-  filter: {},
-  watch: {
-    QRCodeMsg(val) {
-      // 获取页面的canvas
-      const msg = document.getElementById("QRCode");
-      // 将获取到的数据（val）画到msg（canvas）上
-      QRCode.toCanvas(msg, val, { width: 225, height: 225 }, function(error) {
-        console.log(error);
-      });
-    },
-    tabClick(newVal, oldVal) {
-      if (newVal == 1) {
-        // this.$refs.form2.resetFields()
-        this.form1.username = this.form2.username;
-        // if (this.form2.username.length == 11) {
-        //   if (!isvalidPhone(this.form2.username)) {
-        //     this.ifGetCode = false
-        //   } else {
-        //     this.ifGetCode = true
-        //   }
-        // }
-      } else {
-        // this.$refs.form1.resetFields()
-        this.form2.username = this.form1.username;
-        if (this.form2.username.length == 11) {
-          if (!isvalidPhone(this.form2.username)) {
-            this.ifGetCode = false;
-          } else {
-            this.ifGetCode = true;
-          }
-        }
-      }
-    }
-  },
-  methods: {
-    async generateUUID() {
-      const res = await apiUser.createQrCode();
-      if (res.data.code == 200) {
-        this.uuid = res.data.data.key;
-        this.QRCodeMsg = res.data.data.content;
-      }
-    },
-    async isLogin(uuid) {
-      const res = await apiUser.queryQRCode({ uuid });
-      if (res.data.code == 200) {
-        if (res.data.data.resourceToken != "") {
-          this.successShade = true;
-          window.clearTimeout(this.timeId);
-          cookie.cookieSet("token", res.data.data.resourceToken);
-          this.$router.push({ path: "/" });
-        }
-      }
-    },
-    getQRCode() {
-      const that = this;
-      that.shade = false;
-      that.time = 0;
-      that.generateUUID();
-      if (that.logType == 1) return;
-      that.timeId = setInterval(() => {
-        that.time++;
-        that.isLogin(that.uuid);
-        if (that.time == 60) {
-          that.shade = true;
-          window.clearTimeout(that.timeId);
-        }
-      }, 1000);
-    },
-    logTab(type) {
-      const that = this;
-      if (type == 1) {
-        that.logType = 2;
-        this.getQRCode();
-      } else {
-        window.clearTimeout(that.timeId);
-        this.logType = 1;
-      }
-    },
-    clickTabClick(num) {
-      this.tabClick = num;
-      // // console.log(num)
-      // if (num == 2) {
-      //   this.changeTel(2)
-      // }
-    },
-    setTime() {
-      this.codeFont = --this.codeNum + "s";
-      const setInter = setInterval(
-        function() {
-          this.codeFont = --this.codeNum + "s";
-          if (this.codeNum == 0) {
-            this.codeFont = "获取验证码";
-            this.codeNum = 60;
-            clearInterval(setInter);
-          }
-        }.bind(this),
-        1000
-      );
-    },
-    changeTel(type) {
-      // console.log(this.form2.username)
-      // ifGetCode  是否可以点击获取验证码
-      // console.log(type)
-      if (type == 1) {
-        if (this.form1.username.length > 11) {
-          this.form1.username = this.form1.username.slice(0, 11);
-        }
-        // this.form2.username = this.form1.username
-
-        return;
-      }
-
-      if (this.form2.username.length > 11) {
-        this.form2.username = this.form2.username.slice(0, 11);
-      }
-      // this.form1.username = this.form2.username
-
-      if (this.form2.username.length == 11) {
-        if (!isvalidPhone(this.form2.username)) {
-          this.ifGetCode = false;
-          // callback(new Error('请输入正确的手机号'))
-        } else {
-          this.ifGetCode = true;
-          // callback()
-        }
-        // this.ifGetCode = true
-        return;
-      }
-      this.ifGetCode = false;
-    },
-
-    async getSMSLoginCode() {
-      this.setTime();
-      const data = {
-        uname: this.form2.username,
-        type: 2,
-        channel: 2
-      };
-      const res = await apiAuth.getSMSLoginCode(data);
-
-      if (res.data.code == 0) {
-        this.$_toast({ msg: "发送成功" });
-        return;
-      }
-      if (res.data.code == 500) {
-        this.$_toast({ msg: res.data.msg, type: "error" });
-        return;
-      }
-      this.$_toast({ msg: res.data.msg, type: "error" });
-      // this.$_toast
-      // let res = await apiHome.getSMSLoginCode(data)
-      // console.log(res.data.data)
-      // /authentication/mobile?mobile=18699155392&smsCode=7825
-    },
-    async shortLogin() {
-      const that = this;
-      this.$refs["form2"].validate(async valid => {
-        if (valid) {
-          this.clickEnter(false);
-          this.loginloading = true;
-          const form = qs.stringify({
-            username: this.form2.username,
-            password: this.form2.short,
-            grant_type: "sms"
-          });
-          axios
-            .request({
-              method: "post",
-              data: form,
-              headers: {
-                Authorization:
-                  "Basic MTE3NTI3Njk0NDMyNjAwNDczNjo2M2NkMzYwM2Q5YTc0ZTNiYmI4ZDhiOGE5NmQ3MWVlZA=="
-              },
-              url: `${process.env.VUE_APP_API}${process.env.VUE_APP_AUTHURLTYPE}/oauth/token`
-            })
-            .then(async res => {
-              const data = res;
-              if (!data.data.code || data.data.code !== 1) {
-                const token = data.data.access_token;
-                cookie.cookieSet("token", token);
-                // await that.getUser();
-                // that.$router.push({ path: '/home' })
-                if (process.env.NODE_ENV !== "development") {
-                  that.jump();
-                } else {
-                  // that.$router.push({ path: "/home" });
-                  that.$router.push({ path: "/" });
-                }
-              } else {
-                that.loginloading = false;
-                that.clickEnter(true);
-                // that.errType(data.data);
-                that.$_toast({ type: "error", msg: data.data.msg, time: 3000 });
-              }
-            })
-            .catch(err => {
-              // console.log('error')
-              that.loginloading = false;
-              that.clickEnter(true);
-              that.$_toast({ type: "error", msg: err.msg, time: 3000 });
-            });
-        } else {
-          this.loginloading = false;
-          return false;
-        }
-      });
-
-      // /authentication/mobile?mobile=18699155392&smsCode=7825
-      // http://192.168.100.213:9090/authentication/mobile?mobile=18609942548&smsCode=2420
-    },
-    onFocus() {
-      this.type = "password";
-      // console.log(this.$refs.password)
-    },
-    clickEnter(bol) {
-      const that = this;
-      document.onkeydown = function(e) {
-        const key = window.event.keyCode;
-        if (key === 13) {
-          if (bol) {
-            that.login();
-          }
-        }
-      };
-    },
-    login() {
-      if (this.tabClick == 2) {
-        this.shortLogin();
-        return;
-      }
-      this.$refs["form1"].validate(async valid => {
-        if (valid) {
-          this.clickEnter(false);
-          this.submit();
-        } else {
-          this.loginloading = false;
-          return false;
-        }
-      });
-    },
-    submit() {
-      this.loginloading = true;
-      const that = this;
-      const form = qs.stringify({
-        username: this.form1.username,
-        password: this.form1.password,
-        code: this.form1.code,
-        grant_type: this.form1.grant_type,
-        randomStr: this.form1.randomStr,
-        remember_me: false
-      });
-      //
-      axios
-        .request({
-          method: "post",
-          data: form,
-          headers: {
-            Authorization:
-              "Basic MTE3NTI3Njk0NDMyNjAwNDczNjo2M2NkMzYwM2Q5YTc0ZTNiYmI4ZDhiOGE5NmQ3MWVlZA=="
-          },
-          url: `${process.env.VUE_APP_API}${process.env.VUE_APP_AUTHURLTYPE}/oauth/token`
-        })
-        .then(async res => {
-          const data = res;
-          if (!data.data.code || data.data.code !== 1) {
-            const token = data.data.access_token;
-            cookie.cookieSet("token", token);
-            // await that.getUser();
-            // that.$router.push({ path: '/home' })
-            if (process.env.NODE_ENV !== "development") {
-              that.jump();
-            } else {
-              // that.$router.push({ path: "/home" });
-              that.$router.push({ path: "/index" });
-            }
-          } else {
-            that.clickEnter(true);
-            that.loginloading = false;
-            // that.errType(data.data);
-            that.$_toast({ type: "error", msg: data.data.msg, time: 3000 });
-          }
-        })
-        .catch(err => {
-          that.clickEnter(true);
-          // console.log('err,lkkkk')
-          that.loginloading = false;
-          // if (err.response) {
-          //   that.errType(err.response.data);
-          // } else {
-          //   that.errType(err);
-          // }
-        });
-    },
-    async jump() {
-      const referrer = document.referrer;
-      const host = document.location.host;
-      const fromPath = sessionStorage.read("fromPath");
-      // console.log(fromPath, 'fromPath')
-      if (referrer && referrer.indexOf(host) === -1) {
-        if (fromPath == "/") {
-          window.history.go(-1);
-          // window.history.back()
-        } else {
-          this.$router.push({ path: "/" });
-        }
-      } else {
-        // await this.getUser()
-        this.$router.push({ path: "/" });
-      }
-    },
-    async shopHasFinish() {
-      const res = await apiMaterials.shopHasFinish();
-      switch (res.data.code) {
-        case 0:
-          this.$store.commit("SET_STORE_TYPE", true);
-          break;
-        case 1:
-          this.$store.commit("SET_STORE_TYPE", false);
-          break;
-        default:
-          break;
-      }
-      // console.log(res.data.code, 'shopHasFinish') // 1 未完善 0 已完善
-    },
-    async getUser() {
-      // 获取用户信息
-      const res = await apiUser.getUserInfo();
-      const user = res.data.data;
-      // let { data } = await apiUser.getCompanyAuthInfo()
-      // console.log(data.data)
-      // user['cno'] = data.data.no
-      this.$store.commit("SET_USER", user);
-      this.getAuth();
-      if (user.userRole !== 0) {
-        // this.shopHasFinish()
-      }
-    },
-    async getAuth() {
-      const { data } = await apiAuth.getAuthList();
-      if (data.code === 0) {
-        this.$store.commit("SET_AUTH_USER", data.result);
-        localStorage.set("menu", JSON.stringify(data.result.routes));
-      } else {
-        this.$message.error(data.msg);
-      }
-    },
-    errType(response) {
-      console.log(response);
-      switch (response.code) {
-        case 1001: // 验证码为空
-          this.rules.code = {
-            required: false,
-            validator: this.validCode,
-            trigger: "blur"
-          };
-          if (!this.showCode) {
-            // this.$_toast({ type: "error", msg: "请输入验证码" });
-            //
-          }
-          this.showCode = true;
-          break;
-        case 1002: // 验证码错误
-          this.$_toast({ type: "error", msg: "验证码输入有误" });
-          break;
-        case 1003: // 验证码已过期，请重新获取
-          this.$_toast({ type: "error", msg: "验证码已过期，请重新获取" });
-          break;
-        case 2001: // 用户不存在
-          this.$_toast({ type: "error", msg: "该手机号未注册" });
-          break;
-        case 2002: // 用户或密码错误
-          this.$_toast({ type: "error", msg: "手机号或密码有误，请重新输入" });
-          this.form1.password = "";
-          break;
-        case 2003: // 用户被禁用
-          this.$_toast({ type: "error", msg: "用户被禁用" });
-          this.form1.password = "";
-          break;
-      }
-      this.clickEnter(true);
-    },
-    setRandomStr() {
-      let time = new Date().getTime();
-      time = "" + time + parseInt(Math.random() * 1000);
-      this.form1.randomStr = time;
-    },
-    validPhone(rule, value, callback) {
-      if (!value) {
-        // this.ifGetCode = false
-        callback(new Error("请输入电话号码"));
-      } else if (!isvalidPhone(value)) {
-        // this.ifGetCode = false
-        callback(new Error("请输入正确的手机号"));
-      } else {
-        // this.ifGetCode = true
-        callback();
-      }
-    },
-    validShort(rule, value, callback) {
-      if (!value) {
-        callback(new Error("请输入验证码"));
-      } else if (value.length != 4) {
-        callback(new Error("请输入正确的四位验证码"));
-      } else {
-        callback();
-      }
-    },
-    validCode(rule, value, callback) {
-      if (!value) {
-        callback(new Error("验证码不能为空"));
-      } else if (value.length !== 4) {
-        callback(new Error("验证码输入有误"));
-      } else {
-        callback();
-      }
-    }
-  },
-  created() {
-    this.setRandomStr();
-    this.clickEnter(true);
-  },
-  mounted() {}
-};
-</script>
-
-<style lang="scss" rel="stylesheet/scss" scoped>
-.login-box-right {
-  width: 420px;
-  height: 400px;
-  background: #fff;
-  overflow: hidden;
-  position: absolute;
-  top: 60px;
-  right: 0;
-  .pasLog {
-    .login-box-right-tab {
-      width: 420px;
-      height: 47px;
-      line-height: 47px;
-      position: relative;
-      left: -40px !important;
-      .login-box-right-tab-click {
-        font-weight: bold;
-        color: rgba(2, 134, 223, 1);
-        border-bottom: 2px solid rgba(2, 134, 223, 1);
-      }
-      > div {
-        width: 70px;
-        height: 47px;
-        color: #333333;
-        font-size: 16px;
-        font-weight: 400;
-        cursor: pointer;
-        position: absolute;
-        text-align: center;
-        border-bottom: 2px solid #fff;
-        &:nth-child(1) {
-          left: 110px;
-          top: 0;
-        }
-        &:nth-child(2) {
-          right: 110px;
-          top: 0;
-        }
-      }
-    }
-  }
-
-  > div {
-    width: 340px;
-    margin: 0 auto;
-  }
-  .login-type {
-    height: 40px;
-    top: 55px;
-    > div {
-      cursor: pointer;
-      display: inline-block;
-      vertical-align: middle;
-      &:nth-child(3) {
-        text-align: right;
-      }
-    }
-    .type-line {
-      background: rgba(223, 228, 234, 1);
-      width: 1px;
-      height: 28px;
-    }
-    .type-click {
-      font-size: 30px;
-      color: $default;
-      width: 218px;
-    }
-    .type-noclick {
-      font-size: 24px;
-      color: #000;
-      width: 178px;
-    }
-  }
-  .login-tel {
-    .bg-img {
-      background: url("../../../assets/login/login-tel.png") 16px 8px no-repeat;
-      background-size: 18px 26px;
-    }
-  }
-  .login-user {
-    .bg-img {
-      background: url("../../../assets/login/login-user.png") 16px 11px
-        no-repeat;
-      background-size: 18px 18px;
-    }
-  }
-  .login-password {
-    .bg-img {
-      background: url("../../../assets/login/login-password.png") 16px 11px
-        no-repeat;
-      background-size: 17px 19px;
-    }
-  }
-
-  .login-font {
-    cursor: pointer;
-
-    > div {
-      color: #0286df;
-      font-weight: 400;
-      display: inline-block;
-      &:nth-child(1) {
-        float: left;
-      }
-      &:nth-child(2) {
-        float: right;
-      }
-    }
-  }
-}
-.QRcodeTab {
-  width: 58px !important;
-  position: absolute;
-  right: 10px;
-  top: 10px;
-  z-index: 999;
-  cursor: pointer;
-}
-.toast {
-  width: 143px !important;
-  height: 28px;
-  background: rgba(2, 134, 223, 0.1);
-  position: absolute;
-  right: 68px;
-  top: 20px;
-  border: 1px solid #0286df;
-  section {
-    width: 100%;
-    height: 100%;
-    display: flex;
-    align-items: center;
-    position: relative;
-    img {
-      margin-left: 16px;
-      width: 12px;
-      height: 14px;
-    }
-    span {
-      margin-left: 9px;
-      font-size: 12px;
-      color: #0286df;
-    }
-  }
-  section:before {
-    content: "";
-    position: absolute;
-    width: 0;
-    height: 0;
-    border-top: 7px solid transparent;
-    border-left: 7px solid #0082df;
-    border-bottom: 7px solid transparent;
-    font-size: 0;
-    line-height: 0;
-    right: -7px;
-  }
-  section:after {
-    content: "";
-    position: absolute;
-    width: 0;
-    height: 0;
-    border-top: 6px solid transparent;
-    border-left: 6px solid #e5f3fc;
-    border-bottom: 6px solid transparent;
-    font-size: 0;
-    line-height: 0;
-    right: -6px;
-  }
-}
-.qrLog {
-  width: 420px !important;
-  .QRCodeBox {
-    width: 100%;
-    box-sizing: border-box;
-    padding: 0 99px;
-    position: relative;
-    .QRCodechenge,
-    .successShade {
-      width: 100%;
-      height: 100%;
-      box-sizing: border-box;
-      padding: 0 99px;
-      position: absolute;
-      left: 0;
-      top: 0;
-      background: rgba(255, 255, 255, 0.9);
-      display: flex;
-      flex-direction: column;
-      align-items: center;
-      justify-content: center;
-      & > p {
-        margin: 0;
-        padding: 0;
-        margin-bottom: 20px;
-        font-size: 12px;
-        color: #333333;
-      }
-    }
-    .successShade {
-      background: rgba(255, 255, 255, 0.9);
-      & > p {
-        font-size: 16px;
-        font-weight: bold;
-        margin-top: 10px;
-        margin-bottom: 0;
-      }
-    }
-  }
-
-  .titleText {
-    display: flex;
-    justify-content: space-between;
-    padding: 0 118px;
-    span {
-      color: #0286df;
-      font-weight: bold;
-      font-size: 20px;
-    }
-  }
-
-  .textBox {
-    width: 100%;
-    height: 40px;
-    display: flex;
-    align-items: center;
-    box-sizing: border-box;
-    padding: 0 126px;
-    .left {
-      img {
-        width: 32px;
-        height: 32px;
-      }
-    }
-    .right {
-      margin-left: 16px;
-      & > p {
-        margin: 0;
-        padding: 0;
-        color: #969696;
-        font-size: 16px;
-        span {
-          color: #0286df;
-        }
-      }
-    }
-  }
-  .footer {
-    margin-top: 15px;
-    display: flex;
-    color: #666666;
-    font-size: 14px;
-    box-sizing: border-box;
-    padding-right: 20px;
-    float: right;
-    div {
-      cursor: pointer;
-    }
-    & > div:last-child {
-      margin-left: 25px;
-    }
-  }
-}
-</style>
-<style lang="scss" rel="stylesheet/scss">
-.login-box-right {
-  .el-input__inner {
-    border-radius: 0px;
-  }
-  .login-short-box {
-    width: 100%;
-    height: 100%;
-    > div {
-      height: 100%;
-      &:nth-child(1) {
-        width: 200px;
-        float: left;
-      }
-      &:nth-child(2) {
-        width: 120px;
-        float: right;
-        > button {
-          float: right;
-          border-radius: 0;
-        }
-      }
-    }
-  }
-  .login-input {
-    // background: #fff;
-    [type="text"],
-    [type="password"] {
-      text-indent: 50px;
-    }
-  }
-  .bg-line {
-    background: #dfe4ea;
-    width: 1px;
-    height: 38px;
-    position: absolute;
-    left: 50px;
-    top: 1px;
-    z-index: 1;
-  }
-
-  .el-input__inner {
-    height: 40px;
-    line-height: 40px;
-    font-size: 14px;
-    border: 1px solid #dfe4ea;
-  }
-  .bg-img {
-    z-index: 1;
-    position: absolute;
-    left: 0px;
-    top: 0px;
-    width: 49px;
-    height: 36px;
-    line-height: 20px;
-  }
-  .bg-eye {
-    top: 0px;
-    right: 16px;
-    z-index: 1;
-    position: absolute;
-  }
-}
-</style>