<style>
  .login-box {
    max-width: 420px;
    padding: 50px 40px;
    margin: 40px auto;
    background-color: #fff;
    border-radius: 5px;
    background-clip: padding-box;
    box-shadow: 0 2px 4px 0 rgba(10, 8, 8, .5);
  }

  .login-box .tw_logo {
    margin: 0 auto 20px;
    display: block;
    height: 45px;
    width: auto;
  }

  .login-box .tip-text {
    font-size: 16px;
    margin-bottom: 15px;
    color: #999;
    text-align: center;
  }

  .login-box .tip-text a {
    color: #00afff;
  }

  .login_row {
    width: 100%;
  }

  .form-group {
    position: relative;
    margin-bottom: 15px;
  }

  .login_labelName {
    margin-bottom: 10px;
    font-size: 15px;
  }

  .form-group i {
    position: absolute;
    right: 6px;
    bottom: 0;
    z-index: 2;
    width: 46px;
    height: 46px;
    text-align: center;
    line-height: 46px;
    color: #999;
    font-size: 28px;
    cursor: pointer;
  }

  .login-box .q-field__control {
    height: 46px;
  }

</style>
<template>
  <div class="login">
    <div class="login-box">
      <img :src="logo" class="tw_logo" />
      <p class="tip-text">
        還沒有帳號嗎？立即<a style="cursor:pointer;" @click="CommonJump('/register',{})">免費加入</a>
      </p>
      <div class="login_row">
        <div class="form-group">
          <div class="login_labelName">電子郵件</div>
          <q-input outlined v-model="loginMsg.account" class="bg-grey-1" />
        </div>
        <div class="form-group">
          <div class="login_labelName">密碼</div>
          <q-input v-if="flag==1" outlined v-model="loginMsg.password" type="text" ref="pwd"
            class="bg-grey-1 login_pwd" />
          <q-input v-if="flag==2" outlined v-model="loginMsg.password" type="password" ref="pwd"
            class="bg-grey-1 login_pwd" />
          <i class="iconfont iconyanjing_xianshi" v-if="flag==1" @click="flag=2"></i>
          <i class="iconfont iconbiyan" v-if="flag==2" @click="flag=1"></i>
        </div>
        <div>
          <q-btn color="primary" unelevated style="width:100%;height:50px;margin-top:20px;" filled :label="mylabel"
            @click="login" />
        </div>
      </div>
    </div>
  </div>
</template>

<script>
  export default {
    name: "Login",
    components: {

    },
    data() {
      return {
        loginMsg: {
          RB_Group_Id: 0,
          account: "",
          password: ""
        },
        logo: '',
        flag: 2,
        mylabel:'登入'
      };
    },
    created() {

    },
    mounted() {
      var jObj = JSON.parse(localStorage.getItem('groupinfo'));
      this.loginMsg.RB_Group_Id = jObj.GroupId;
      //获取网站基础配置
      if (localStorage.baseifo) {
        var jObj = JSON.parse(window.localStorage.getItem('baseifo'));
        this.logo = jObj.Config.Logo;
      }
    },
    methods: {
      login() {
        if (this.loginMsg.account == '') {
          this.$q.notify({
            type: 'negative',
            message: '请输入账号',
            position: 'top',
            timeout: 2000, // 以毫秒为单位; 0意味着没有超时
          })
          return;
        }
        if (this.loginMsg.password == '') {
          this.$q.notify({
            type: 'negative',
            message: '请输入密码',
            position: 'top',
            timeout: 2000, // 以毫秒为单位; 0意味着没有超时
          })
          return;
        }
        this.mylabel='提交中...';
        this.apipost(
          "b2b_post_Login", this.loginMsg,
          res => {
            this.mylabel='登入';
            if (res.data.resultCode == 1) {
              var jsonData = JSON.stringify(res.data.data);
              window.localStorage.setItem("b2bUser", jsonData);
              this.CommonJump('/index', {})
            } else {
              this.$q.notify({
                type: 'negative',
                message: res.data.message,
                position: 'top',
                timeout: 2000, // 以毫秒为单位; 0意味着没有超时
              })
            }
          },
          err => {}
        );
      }
    },
  };

</script>
