sso-ssr/pages/sassLogin/index.vue

<template>
  <div class="x-container y-container">
   <!--登录窗口-->
    <template v-if="!loginIsSuccess">
      <div class="x-login-wrap">
        <div class="login-tab" v-show="loginWay != 2">
          <span @click="toggleTab(0)" v-bind:class="{'active': loginWay === 0 }">密码登录</span>
          <span @click="toggleTab(3)" v-bind:class="{'active': loginWay === 3 }">短信登录</span>
          <!--<span @click="ShowWechatCoe(1)" v-bind:class="{'active': loginWay === 1 }" id="weChatBtn">微信登录</span>-->
        </div>
        <!--账号密码登录-->
        <div class="x-login" v-show="loginWay === 0">
          <div id="form-wrap" class="x-login-form">
            <el-form :model="login" :rules="rules2" ref="login" class="demo-ruleForm login-form">
              <div style="opacity: 0; height: 0; overflow: hidden">
                <input type="text" name="hideUserName" id="hideUserName">
                <input type="password" name="hidePassword" id="hidePassword">
              </div>
              <el-form-item prop="username">
                <el-input type="text" v-model="login.username" auto-complete="off" placeholder="手机号/邮箱"></el-input>
                <i class="fa fa-user"></i>
              </el-form-item>
              <el-form-item prop="password">
                <el-input type="password"
                          v-model="login.password"
                          placeholder="密码"
                          auto-complete="off"
                          @keyup.enter.native="isLogin(true)"></el-input>
                <i class="fa fa-lock"></i>
              </el-form-item>
              <el-form-item prop="captcha" class="captcha" v-show="showCheckCode">
                <el-input type="text"
                          v-model="login.captcha"
                          auto-complete="off"
                          class="code-input"
                          @keyup.enter.native="isLogin(true)"></el-input>
                <img id="captchaImage" class="code-img" src="/sso/login/checkCode"/>
                <a class="code-click" @click="getCode">看不清换一张</a>
              </el-form-item>
              <el-form-item>
                <a class="btn login"
                   @click="isLogin(true)"
                   :disabled="isLoginDisabled">登录</a>
              </el-form-item>
              <el-form-item class="text-position" v-if="loginStyle.needRememberPwd">
                <el-checkbox v-model="checked">30天免登录</el-checkbox>
              </el-form-item>
            </el-form>
            <div class="link-go">
              <a class="forget" id='forget' @click="goForgetPassword">忘记密码?</a>
              <span class="line"></span>
              <a :href="`/sassLogin/register${this.queryLink ? '?' + this.queryLink : ''}`" class="second">免费注册</a>
            </div>
          </div>
        </div>
        <!--短信快捷登录-->
        <div class="x-login" v-show="loginWay === 3">
          <div id="form-wrap1" class="x-login-form">
            <el-form :model="fastLogin" :rules="rules3" ref="fastLogin" class="demo-ruleForm login-form loginForm">
              <el-form-item prop="mobile">
                <el-input type="text" v-model="fastLogin.mobile" auto-complete="off" placeholder="请输入手机号"></el-input>
              </el-form-item>
              <el-form-item prop="code" class="fastMsg">
                <el-input type="text" v-model="fastLogin.code"
                          auto-complete="off" placeholder="验证码"></el-input>
                <el-button type="primary" class="fastCode"
                           v-show="sendLoginCode"
                           @click="getCheckCode">获取验证码</el-button>
                <el-button type="primary"  v-show="!sendLoginCode" class="fastCode code-send">已发送({{login_time}}s)</el-button>
              </el-form-item>
              <el-form-item>
                <a class="btn login"
                   @click="fastToLogin(true)">登录</a>
              </el-form-item>
            </el-form>
            <div class="link-go">
              <a :href="`/sassLogin/register${this.queryLink ? '?' + this.queryLink : ''}`" class="second">免费注册</a>
            </div>
          </div>
        </div>
        <!--微信扫码登录-->
        <!--<div class="x-login scan-login" v-show="loginWay === 1">-->
          <!--<div class="x-login-form">-->
            <!--<div class="scan-body">-->
              <!--<div class="img">-->
                <!--<div id="login_container"></div>-->
              <!--</div>-->
            <!--</div>-->
            <!--<div class="link-go" style="padding: 0 18px 12px 0; margin-top: 0;">-->
              <!--<a :href="`/sassLogin/register${this.queryLink ? '?' + this.queryLink : ''}`" class="second">免费注册</a>-->
            <!--</div>-->
          <!--</div>-->
        <!--</div>-->
        <!--绑定账号-->
        <!--<div class="x-login bind-login" v-show="loginWay === 2">-->
          <!--<div class="x-login-form">-->
            <!--<div class="bind-header">-->
              <!--<span>绑定已有账号</span>-->
              <!--<span @click="loginWay = 0">返回</span>-->
            <!--</div>-->
            <!--<div class="bind-body">-->
              <!--<div class="img"><img :src="wxImg" alt=""/><div>{{wxName}}</div></div>-->
              <!--<div>-->
                <!--<el-form :model="bindAccount" :rules="rules4" ref="bindAccount" class="demo-ruleForm login-form">-->
                  <!--<el-form-item prop="username" style="margin: 0 auto 10px !important;">-->
                    <!--<el-input type="text"-->
                              <!--v-model="bindAccount.username"-->
                              <!--auto-complete="off"-->
                              <!--placeholder="请输入用户名、手机号或邮箱"></el-input>-->
                  <!--</el-form-item>-->
                  <!--<el-form-item prop="password" style="margin: 0 auto 10px !important;">-->
                    <!--<el-input type="password"-->
                              <!--v-model="bindAccount.password"-->
                              <!--auto-complete="new-password"-->
                              <!--placeholder="密码"-->
                              <!--@keyup.enter.native="wxBind"></el-input>-->
                  <!--</el-form-item>-->
                  <!--<el-form-item  style="margin: 0 auto!important;">-->
                    <!--<a class="btn login"-->
                       <!--@click="wxBind">确定绑定已有账号</a>-->
                  <!--</el-form-item>-->
                <!--</el-form>-->
              <!--</div>-->
              <!--<div class="set">还没有优软账号，直接 <a :href="`/sassLogin/register${this.$store.state.option.fullPath}&tk=${wxToken}`">创建新账号</a></div>-->
            <!--</div>-->
          <!--</div>-->
        <!--</div>-->
      </div>
      <!--选择企业弹框-->
      <div>
        <!--<el-dialog class="dialog"-->
                   <!--:visible.sync="dialogVisible"-->
                   <!--size="tiny">-->
          <!--<div class="x-floating x-list" v-show="dialogVisible">-->
            <!--<div class="x-list-header">您要登录的公司是：</div>-->
            <!--<div class="x-list-content">-->
              <!--<ul class="list-unstyled" >-->
                <!--<template v-for="space in this.enterprise">-->
                  <!--<li v-text="space.name" @click="chooseOneEnterprise(false, space.id)">华商龙科技有限公司</li>-->
                <!--</template>-->
              <!--</ul>-->
            <!--</div>-->
          <!--</div>-->
        <!--</el-dialog>-->
      </div>
    </template>
    <template v-else>
      <div class="login-success">
        <i class="iconfont icon-zhifuchenggong"></i>
        <p>登录成功</p>
      </div>
    </template>
    <loading v-show="isShowLoading"/>
  </div>
</template>

<script>
  import Loading from '~components/common/loading/Loading.vue'
  var wxLogin = function () {}
  export default {
    layout: 'sass',
    components: {
      Loading
    },
    data () {
      // 用户名密码登录
      var validateUsername = (rule, value, callback) => {
        if (value === '') {
          this.checkUsername = false
          this.showCheckCode = false
        } else {
          if (this.login.username !== '') {
            //    获取密码输错次数
            this.$http.get(`/sso/login/getPwdErrorCount`, {params: {username: this.login.username}})
              .then(response => {
                if (response.data.success) {
                  this.showCheckCode = false
                  let getPasswordErrorCount = response.data.content || ''
                  if (getPasswordErrorCount >= 5) {
                    this.$message.error('密码错误次数已达上限，今日无法登录')
                    this.isLoginDisabled = true
                    this.showCheckCode = false
                  } else if (getPasswordErrorCount < 3) {
                    this.isLoginDisabled = false
                    this.checkUsername = true
                    this.showCheckCode = false
                  } else if (getPasswordErrorCount >= 3 && getPasswordErrorCount < 5) {
                    if (getPasswordErrorCount === 3) {
                      this.$message.error('当前已输错密码3次，若达到5次今日将无法登录')
                    }
                    if (getPasswordErrorCount === 4) {
                      this.$message.error('当前已输错密码4次，若达到5次今日将无法登录')
                    }
                    this.isLoginDisabled = false
                    this.checkUsername = true
                    this.showCheckCode = true
                  } else {
                    this.checkUsername = false
                    this.showCheckCode = false
                  }
                } else {
                  return Promise.reject(response.data)
                }
              }).catch(err => {
                this.isShowLoading = false
                this.$message.error(err.errMsg)
              })
          }
          callback()
        }
      }
      var validatePassword = (rule, value, callback) => {
        if (value === '') {
          this.checkPassword = false
        } else {
          if (this.login.password !== '') {
            this.checkPassword = true
          }
          callback()
        }
      }
      // 短信便捷登录
      var validateMobile = (rule, value, callback) => {
        if (value === '') {
          this.checkMobile = false
        } else {
          if (this.fastLogin.mobile) {
            this.checkMobile = true
          }
          callback()
        }
      }
      var validateCode = (rule, value, callback) => {
        if (value === '') {
          this.checkCode = false
        } else {
          if (this.fastLogin.code !== '') {
            this.checkCode = true
          }
          callback()
        }
      }
      // 微信扫码登录
      var validateWeiUsername = (rule, value, callback) => {
        if (value === '') {
          this.checkWeiUsername = false
        } else {
          if (this.bindAccount.username !== '') {
            this.checkWeiUsername = true
          }
          callback()
        }
      }
      var validateWeiPassword = (rule, value, callback) => {
        if (value === '') {
          this.checkWeiPassword = false
        } else {
          if (this.bindAccount.password !== '') {
            this.checkWeiPassword = true
          }
          callback()
        }
      }
      return {
        login: {
          username: '',
          password: '',
          captcha: '',
          spaceUU: ''
        },
        fastLogin: {
          mobile: '',
          code: ''
        },
        bindAccount: {
          username: '',
          password: ''
        },
        loginIsSuccess: false,
        loginWay: 0,
        checked: true,
        isShowLoading: false,
        checkUsername: false,
        checkPassword: false,
        showCheckCode: false,
        isLoginDisabled: false,
        dialogVisible: false,
        queryLink: '',
        checkMobile: false,
        getCodeBtnIsDisabled: true,
        sendLoginCode: true,
        login_time: 0,
        token: '',
        checkCode: false,
        checkWeiUsername: false,
        checkWeiPassword: false,
        wxToken: '',
        wxImg: '',
        wxName: '',
        wxUrl: '',
        // 用户名密码登录
        rules2: {
          username: [
            {validator: validateUsername, trigger: 'blur'}
          ],
          password: [
            {validator: validatePassword, trigger: 'blur'}
          ]
        },
        // 短信快捷登录
        rules3: {
          mobile: [
            {validator: validateMobile, trigger: 'blur'}
          ],
          code: [
            {validator: validateCode, trigger: 'blur'}
          ]
        },
        // 微信扫码登录
        rules4: {
          username: [
            {validator: validateWeiUsername, trigger: 'blur'}
          ],
          password: [
            {validator: validateWeiPassword, trigger: 'blur'}
          ]
        }
      }
    },
    mounted () {
      this.$nextTick(() => {
        this.getUrl()
        this.validUserName()
        if (this.$route.query.code) {
          this.wxEnterprise()
        }
      })
    },
    computed: {
      enterprise () {
        let chooseEnterprise = this.$store.state.login.chooseRegisterEnterprise.choose.data
        return chooseEnterprise
      },
      loginStyle () {
        return this.$store.state.login.loginStyle.data.content ? this.$store.state.login.loginStyle.data.content : ''
      }
    },
    methods: {
      toggleTab (type) {
        this.loginWay = type
        this.login.username = ''
        this.login.password = ''
        this.fastLogin.mobile = ''
        this.fastLogin.code = ''
      },
      ShowWechatCoe () {
        wxLogin()
        this.loginWay = 1
      },
      // 获取用户错误次数
      validUserName () {
        if (this.login.username) {
          //    获取密码输错次数
          this.$http.get(`/sso/login/getPwdErrorCount`, {params: {username: this.login.username}})
            .then(response => {
              if (response.data.success) {
                let getPasswordErrorCount = response.data.content || ''
                if (getPasswordErrorCount >= 5) {
                  this.$message.error('密码错误次数已达上限，今日无法登录')
                  this.isLoginDisabled = true
                  this.showCheckCode = false
                } else if (getPasswordErrorCount < 3) {
                  this.isLoginDisabled = false
                  this.checkUsername = true
                  this.showCheckCode = false
                } else if (getPasswordErrorCount >= 3 && getPasswordErrorCount < 5) {
                  if (getPasswordErrorCount === 3) {
                    this.$message.error('当前已输错密码3次，若达到5次今日将无法登录')
                  }
                  if (getPasswordErrorCount === 4) {
                    this.$message.error('当前已输错密码4次，若达到5次今日将无法登录')
                  }
                  this.isLoginDisabled = false
                  this.checkUsername = true
                  this.showCheckCode = true
                } else {
                  this.checkUsername = false
                  this.showCheckCode = false
                }
              } else {
                return Promise.reject(response.data)
              }
            }).catch(err => {
              this.$message.error(err.errMsg)
            })
        }
      },
      // 更换管理员
      changeManage () {
        window.location.href = `appeals/changeManagerAppeal${this.$store.state.option.fullPath}`
      },
//      获取url参数
      getUrl () {
        let wUrl = ''
        if (this.$route.query) {
          for (var key in this.$route.query) {
            if (key !== 'code' && key !== 'state' && key !== 'type') {
              wUrl += `${key}=${encodeURIComponent(this.$route.query[key])}&`
            }
          }
        }
        if (this.$route.query) {
          this.wxUrl = `${window.location.origin}?${wUrl.substr(0, wUrl.length - 1)}`
        } else {
          this.wxUrl = `${window.location.origin}`
        }
        var url = window.location.search
        var request = {}
        if (url.indexOf('?' !== -1)) {
          var str = url.substr(1)
          var strs = str.split('&')
          this.queryLink = str
          for (var i = 0; i < strs.length; i++) {
            request[strs[i].split('=')[0]] = decodeURI(strs[i].split('=')[1])
          }
        }
        this.appId = request['appId'] || ''
        this.returnUrl = request['returnURL'] || ''
        this.baseUrl = request['baseUrl'] || ''
      },
      goForgetPassword () {
        let url = `/reset/forgetPasswordValidationAccount${this.queryLink ? '?' + this.queryLink : ''}`
        window.open(url)
      },
      //    获取验证码
      getCode () {
        var imgSrc = document.getElementById('captchaImage')
        imgSrc.setAttribute('src', '/sso/login/checkCode?timestamp=' + (new Date()).valueOf())
      },
//      登录
      isLogin (flag) {
        this.isShowLoading = true
        if (!this.login.username) {
          this.isShowLoading = false
          this.$message.error('请填写账号')
        } else if (!this.login.password) {
          this.isShowLoading = false
          this.$message.error('请填写密码')
        } else {
          let param = new FormData()
          param.append('username', this.login.username)
          param.append('password', this.login.password)
          param.append('captcha', this.login.captcha)
          param.append('spaceUU', '1')
          param.append('appId', this.appId ? this.appId : '')
          param.append('returnUrl', this.returnUrl ? this.returnUrl : '')
          param.append('baseUrl', this.baseUrl ? this.baseUrl : '')
          param.append('maxage', this.checked ? 2592000 : '')
          let config = {
            headers: {'Content-Type': 'multipart/form-data'}
          }
          this.$http.post('/sso/login', param, config)
            .then(response => {
              this.isShowLoading = false
              if (response.data.success) {
                if (response.data.content.spaces) {
//                   弹框让用户选择企业
                  this.$store.commit('login/chooseRegisterEnterprise/GET_ENTERPRISE_SUCCESS', response.data.content.spaces)
                  this.dialogVisible = flag
                } else if (response.data.content.loginUrls) {
//                  遍历登录url循环让各应用登录(需要跨域)
                  let param = response.data.content.data
                  let a = ''
                  for (let n in param) {
                    a += (n + '=' + encodeURIComponent(param[n]) + '&')
                  }
                  let params = a.substr(0, a.length - 1)
                  this.isShowLoading = true
                  if (response.data.content.currentUrl) {
                    this.loginOther(response, params, 3000)
                  }
                }
              } else {
                this.$message.error(response.data)
                var count = response.data.errorCount
                if (count < 3) {
                  this.showCheckCode = false
                  this.isLoginDisabled = false
                } else if (count >= 5) {
                  this.$message.error('密码错误次数已达上限，今日无法登录')
                  this.isLoginDisabled = true
                  this.showCheckCode = false
                } else if (count >= 3 && count < 5) {
                  this.getCode()
                  if (count === 3) {
                    this.$message.error('当前已输错密码3次，若达到5次今日将无法登录')
                  }
                  this.showCheckCode = true
                  this.isLoginDisabled = false
                }
                return Promise.reject(response.data)
              }
            }).catch(err => {
              this.isShowLoading = false
              let _this = this
              setTimeout(function () {
                _this.getCode()
              }, 100)
              this.$message.error(err.errMsg)
            })
        }
      },
      // 选择账套
      // chooseOneEnterprise (flag, spaceUU) {
      //   this.login.spaceUU = spaceUU
      //   this.dialogVisible = false
      //   if (this.$route.query.code) {
      //     this.wxEnterprise(flag)
      //   } else {
      //     if (this.loginWay === 0) {
      //       this.isLogin(flag)
      //     }
      //     if (this.loginWay === 3) {
      //       this.fastToLogin(flag)
      //     }
      //   }
      // },
      // 短信快捷登录
      fastToLogin (flag) {
        this.isShowLoading = true
        if (!this.fastLogin.mobile) {
          this.isShowLoading = false
          this.$message.error({
            message: '请填写手机号',
            showClose: true
          })
        } else {
          let param = new FormData()
          param.append('mobile', this.fastLogin.mobile)
          param.append('code', this.fastLogin.code)
          param.append('appId', this.appId)
          param.append('token', this.token)
          param.append('spaceUU', 1)
          param.append('returnUrl', this.returnUrl ? this.returnUrl : '')
          param.append('baseUrl', this.baseUrl ? this.baseUrl : '')
          let config = {
            headers: {'Content-Type': 'multipart/form-data'}
          }
          this.$http.post('/sso/login/sms', param, config)
            .then(response => {
              this.isShowLoading = false
              if (response.data.success) {
                if (response.data.content.spaces) {
//                   弹框让用户选择企业
                  this.$store.commit('login/chooseRegisterEnterprise/GET_ENTERPRISE_SUCCESS', response.data.content.spaces)
                  this.dialogVisible = flag
                } else if (response.data.content.loginUrls) {
//                  遍历登录url循环让各应用登录(需要跨域)
                  let param = response.data.content.data
                  let a = ''
                  for (let n in param) {
                    a += (n + '=' + encodeURIComponent(param[n]) + '&')
                  }
                  let params = a.substr(0, a.length - 1)
                  this.isShowLoading = true
                  if (response.data.content.currentUrl) {
                    this.loginOther(response, params, 1000)
                  }
                }
              } else {
                this.$message.error(response.data)
                return Promise.reject(response.data)
              }
            }).catch(err => {
              this.isShowLoading = false
              let _this = this
              setTimeout(function () {
                _this.getCode()
              }, 100)
              this.$message.error(err.errMsg)
            })
        }
      },
      getJsonp: function (url, timeout = 500) {
        return new Promise((resolve, reject) => {
          this.$jsonp(url, {
            name: 'successCallback',
            timeout: timeout
          }, function (err, data) {
            if (err) {
              reject(err)
              throw err
            } else {
              resolve(data)
            }
          })
        })
      },
      // crossAfter (url) {
      //   try {
      //     window.location.href = url
      //   } catch (err) {
      //     console.log(err)
      //   }
      // },
      loginOther (response, a, timeout) {
        // const crossAfter = this.crossAfter
        let promises = []
        for (let i in response.data.content.loginUrls) {
          if (response.data.content.currentUrl !== response.data.content.loginUrls[i]) {
            promises.push(this.getJsonp(`${response.data.content.loginUrls[i]}?${a}`))
          }
        }

        Promise.all(promises).then(() => {
          this.loginCurrent(response, a)
        }).catch(() => {
          this.loginCurrent(response, a)
        })
      },
      loginCurrent (response, a) {
        let baseContent = response.data.content.currentUrl
        let flag = '?'
        if (baseContent.indexOf('?') !== -1) {
          flag = '&'
        }
        this.$jsonp(`${response.data.content.currentUrl}${flag}${a}`, {
          name: 'successCallback',
          timeout: 3000
        }, (err, data) => {
          if (err) {
            this.$message.error('登录超时，请重试')
            this.isShowLoading = false
            throw err
          } else {
            this.loginIsSuccess = true
            this.isShowLoading = false
          }
        })
      },
      getCheckCode () {
        this.isShowLoading = true
        if (!this.fastLogin.mobile) {
          this.isShowLoading = false
          this.$message.error('请先填写手机号')
        } else {
          if (this.checkMobile) {
            this.$http.get(`/sso/login/sendSmsCode`, {params: {mobile: this.fastLogin.mobile}})
              .then(response => {
                this.isShowLoading = false
                if (response.data) {
                  if (response.data.success) {
                    this.token = response.data.content.token
                    this.$message({
                      message: '验证码已经发送到您的手机，请注意查收',
                      type: 'success'
                    })
                    this.sendLoginCode = false
                    this.login_time = 60
                    var loginTime = setInterval(() => {
                      this.login_time--
                      if (this.login_time <= 0) {
                        this.sendLoginCode = true
                        clearInterval(loginTime)
                      }
                    }, 1000)
                  } else {
                    this.$message.error(response.data.errMsg)
                  }
                } else {
                  return Promise.reject(response.data)
                }
              }).catch(err => {
                this.isShowLoading = false
                this.$message.error(err.errMsg)
              })
          } else {
            this.isShowLoading = false
          }
        }
      },
      // 微信判断绑定和账套选择
      wxEnterprise () {
        this.isShowLoading = true
        if (this.$route.query.code) {
          let param = new FormData()
          param.append('code', this.$route.query.code ? this.$route.query.code : '')
          param.append('type', 'wx')
          param.append('state', this.$route.query.state ? this.$route.query.state : '')
          param.append('appId', this.$route.query.appId ? this.$route.query.appId : '')
          param.append('returnUrl', this.$route.query.returnURL ? this.$route.query.returnURL : '')
          param.append('baseUrl', this.$route.query.baseUrl ? this.$route.query.baseUrl : '')
          param.append('spaceUU', 1)
          let config = {
            headers: {'Content-Type': 'multipart/form-data'}
          }
          this.$http.post('/sso/login/foreignLogin', param, config)
            .then(response => {
              this.isShowLoading = false
              if (response.data.success) {
                if (!response.data.content.hasRegister && response.data.content.token) {
                  this.loginWay = 2
                  this.wxToken = response.data.content.token
                  this.$http.get(`/foreign/userInfo/${this.wxToken}`, {params: {token: this.wxToken}})
                    .then(response => {
                      if (response.data.success) {
                        this.wxImg = response.data.content.foreignUserImg
                        this.wxName = response.data.content.foreignUserName
                      } else {
                        return Promise.reject(response.data)
                      }
                    }).catch(err => {
                      this.$message.error(err.errMsg)
                    })
                } else if (response.data.content.spaces) {
//                   弹框让用户选择企业
                  this.$store.commit('login/chooseRegisterEnterprise/GET_ENTERPRISE_SUCCESS', response.data.content.spaces)
                  this.dialogVisible = true
                } else if (response.data.content.loginUrls) {
//                  遍历登录url循环让各应用登录(需要跨域)
                  let param = response.data.content.data
                  let a = ''
                  for (let n in param) {
                    a += (n + '=' + encodeURIComponent(param[n]) + '&')
                  }
                  let params = a.substr(0, a.length - 1)
                  this.isShowLoading = true
                  if (response.data.content.currentUrl) {
                    this.$jsonp(`${response.data.content.currentUrl}?${params}`, {
                      name: 'successCallback',
                      timeout: 3000
                    }, (err, data) => {
                      if (err) {
                        this.$message.error('登录超时，请重试')
                        this.isShowLoading = false
                        throw err
                      } else {
                        this.loginOther(response, params)
                      }
                    })
                  }
                }
              } else {
                this.$message.error(response.data)
                return Promise.reject(response.data)
              }
            }).catch(err => {
              this.isShowLoading = false
              let _this = this
              setTimeout(function () {
                _this.getCode()
              }, 100)
              this.$message.error(err.errMsg)
            })
        }
      },
      // 微信扫码登录
      getScan () {
        // this.loginWay = 1
        this.isShowLoading = true
        this.$http.get('/weChat/getQrUrl', {params: {appId: this.$route.query.appId, url: this.wxUrl}})
          .then(response => {
            this.isShowLoading = false
            if (response.data.success) {
              window.location.href = response.data.content
            } else {
              return Promise.reject(response.data)
            }
          }).catch(err => {
            this.isShowLoading = false
            this.$message.error(err.errMsg)
          })
      },
      // 绑定企业
      wxBind () {
        this.isShowLoading = true
        if (!this.bindAccount.username) {
          this.isShowLoading = false
          this.$message.error('请填写账号')
        } else if (!this.bindAccount.password) {
          this.isShowLoading = false
          this.$message.error('请填写密码')
        } else {
          let param = new FormData()
          param.append('_operate', 'account')
          param.append('t', this.wxToken)
          param.append('username', this.bindAccount.username)
          param.append('password', this.bindAccount.password)
          let config = {
            headers: {'Content-Type': 'multipart/form-data'}
          }
          this.$http.post('/foreign/addAccount', param, config)
            .then(response => {
              this.isShowLoading = false
              if (response.data.success) {
                this.wxEnterprise()
              } else {
                return Promise.reject(response.data)
              }
            }).catch(err => {
              this.isShowLoading = false
              this.$message.error(err.errMsg)
            })
        }
      }
    }
  }
</script>
<style lang="scss" type="text/scss">
  .y-container {
    position: relative;
    bottom: -30px;
    width: 346px !important ;
    margin: 0 auto;
    text-align: center;
    /*background: #FFFFFF;*/
    /*box-shadow: 0 22px 24px 0 rgba(0,0,0,0.08);*/
    /*border-radius: 3px;*/
    .x-login-wrap{
      margin: 20px 0 0!important ;
      height: auto;
      .scan-body{
        .img{
          height: 200px!important ;
          .login_container{
            height: 200px!important ;
            iframe {
              height: 200px!important ;
            }
          }
        }
      }
    }
    .login-tab {
      margin-bottom: 30px;
      width: 100%;
      height: 50px;
      line-height: 50px;
      border-bottom: 1px solid #dcdcdc;
      span{
        display: inline-block;
        width: 45%;
        font-size: 16px;
        color: #999;
        cursor: pointer;
        &.active{
          color: #333;
          border-bottom: 2px solid #282828;
        }
      }
    }
    .x-login {
      width: 100%;
      .x-login-form {
        .btn.login{
          width: 306px;
          height: 34px;
          background: #5078cb;
          color: #fff;
          font-weight: 700;
          letter-spacing: 4px;
          border-radius: 0;
        }
        .text-position{
          .el-form-item__content .el-checkbox{
            margin-left: 0!important;
          }
        }
      }
      .link-go {
        position: relative;
        text-align: right;
        margin-top: 35px;
        padding: 0 21px 20px 0;
        a{
          margin-left: 20px;
          font-size: 14px;
          color: #999;
          background: 0 0;
          text-decoration: none;
          outline: 0;
          cursor: pointer;
        }
        span{
          position: absolute;
          top: 1px;
          display: inline-block;
          margin: 0 10px;
          width: 2px;
          height: 15px;
          background-color: #ddd;
        }
      }
    }
    .login-success {
      padding-top: 95px;
      width: 100%;
      height: 400px;
      margin: 0 auto;
      text-align: center;
      i{
        font-size: 125px;
        color: #22ac38;
      }
      p{
        margin-top: 20px;
        font-size: 28px;
        color: #333;
      }
    }
  }
</style>