zhaoxiaoqiang
2021-09-16 dcc61fc4b536f672d36508b6a2717a12ca6cc8cb
src/views/user/loginByWx.vue
@@ -9,35 +9,13 @@
  <div class="login-by-wx">
    <div class="height-44" v-if="showContent">登录</div>
    <div class="info-box" v-if="showContent">
      <van-field
        v-model="phoneNum"
        type="tel"
        clearable
        maxlength="11"
        left-icon="phone-o left-icon"
        placeholder="请输入手机号码"
      />
      <van-field
        v-model="code"
        type="number"
        clearable
        maxlength="4"
        left-icon="envelop-o left-icon"
        input-align="left"
        placeholder="请输入短信验证码"
      >
      <van-field v-model="phoneNum" type="tel" clearable maxlength="11" left-icon="phone-o left-icon" placeholder="请输入手机号码" />
      <van-field v-model="code" type="number" clearable maxlength="4" left-icon="envelop-o left-icon" input-align="left" placeholder="请输入短信验证码">
        <template #button>
          <van-button color="#896EDB" style="width:60px" size="mini" @click="getCode" :disabled="isDisabled" plain type="info">{{btnText}}</van-button>
          <van-button color="#896EDB" style="width:60px" size="mini" @click="getCode" :disabled="isDisabled" plain type="info">{{ btnText }}</van-button>
        </template>
      </van-field>
      <van-button
        round
        type="info"
        color="#896EDB"
        style="width: 100%; margin-top: 150px"
        @click="loginhanld"
        >登录</van-button
      >
      <van-button round type="info" color="#896EDB" style="width: 100%; margin-top: 150px" @click="loginhanld">登录</van-button>
    </div>
    <div v-if="!showContent"></div>
  </div>
@@ -45,9 +23,9 @@
<script>
import LoginBox from "../../components/common/h-login-box.vue";
import { GoWeChat } from "../../utils/wechat";
import { mapActions } from 'vuex';
import Vue from 'vue';
import { Toast } from 'vant';
import { mapActions } from "vuex";
import Vue from "vue";
import { Toast } from "vant";
Vue.use(Toast);
export default {
@@ -63,76 +41,70 @@
      showContent: false, //显示内容或者输入框
      urlCode: "", //授权后回调链接上截取的code值
      timer: "", //定时器
      isDisabled:false,
      isDisabled: false,
    };
  },
  created() {
    if(!sessionStorage.sib_wx_merId || typeof sessionStorage.sib_wx_merId == 'undefined'){
      sessionStorage.sib_wx_merId = location.href.split('?')[1].split('=')[1]
    if (!sessionStorage.sib_wx_merId || typeof sessionStorage.sib_wx_merId == "undefined") {
      sessionStorage.sib_wx_merId = location.href.split("?")[1].split("=")[1];
    }
    clearTimeout(this.timer);
    this.urlCode = this.getUrlCode("code");
    console.log(this.urlCode);
    this.init();
  },
  methods: {
    ...mapActions(['loginByOpenId']),
    ...mapActions(["loginByOpenId"]),
    /**
     * @description:初始化授权
     * @returns void
     * **/
    init() {
      this.openId = localStorage.sib_wx_openId;
      console.log(this.openId)
      this.showContent = false;
      // 模拟数据本地调试
      // this.openId = "oJbj21YwUatdNaYf3iEPwwGtWuUg";
      //this.urlCode = "021qXn000q9GCK1xU7300xMP1p0qXn0A";
      if (
        (!this.openId && !this.urlCode) ||
        (typeof this.openId == "undefined" && !this.urlCode)
      ) {
        console.log(111);
      if ((!this.openId && !this.urlCode) || (typeof this.openId == "undefined" && !this.urlCode)) {
        let url = location.host;
        // url = "t.finlean.com";
        var str = encodeURIComponent(`https://${url}/sib_wx_scoref/#/loginByWx`);
        var str = encodeURIComponent(`https://${url}/sib_wx_scorep/#/loginByWx`);
        var fn = new GoWeChat("wx594ab33e0466eccf", str);
        fn.gocontract();
      } else {
        if(!this.openId && this.urlCode){
          this.$api.getWeChatUserInfo({
            code:this.urlCode
          }).then(res=>{
            this.openId = res.body
        if (!this.openId && this.urlCode) {
          this.$api
            .getWeChatUserInfo({
              code: this.urlCode,
            })
            .then((res) => {
              this.openId = res.body;
            this.showContent = true;
          })
        }
        else if(this.openId && !this.urlCode){
          this.$api.checkOpenIdIsBind({
            wechatOpenId:this.openId,
            merId:sessionStorage.sib_wx_merId
          }).then(res=>{
              this.showContent = true;
              if(res.body.isBind === 1){
                  localStorage.sib_wx_mblNo = res.body.mblNo
                  localStorage.sib_wx_userId = res.body.userId
                  this.loginByOpenId({
                      vm: this,
                      loginType:2,
                      verCode:this.code,
                      mblNo:res.body.mblNo,
                      merId:sessionStorage.sib_wx_merId,
                      wechatOpenId:this.openId,
                      userId:res.body.userId
                  })
                  // this.$router.push('/mine/toggle-identity?title=选择门店')
            });
        } else if (this.openId && !this.urlCode) {
          this.$api
            .checkOpenIdIsBind({
              wechatOpenId: this.openId,
              merId: sessionStorage.sib_wx_merId,
            })
            .then((res) => {
              this.showContent = true;
              if (res.body.isBind === 1) {
                localStorage.sib_wx_mblNo = res.body.mblNo;
                localStorage.sib_wx_userId = res.body.userId;
                this.loginByOpenId({
                  vm: this,
                  loginType: 2,
                  verCode: this.code,
                  mblNo: res.body.mblNo,
                  merId: sessionStorage.sib_wx_merId,
                  wechatOpenId: this.openId,
                  userId: res.body.userId,
                });
                // this.$router.push('/mine/toggle-identity?title=选择门店')
              }
          })
            });
        }
      }
    },
    /**
@@ -140,13 +112,7 @@
     * @returns void
     * **/
    getUrlCode(name) {
      return (
        decodeURIComponent(
          (new RegExp("[?|&]" + name + "=" + "([^&;]+?)(&|#|;|$)").exec(
            location.href
          ) || [, ""])[1].replace(/\+/g, "%20")
        ) || null
      );
      return decodeURIComponent((new RegExp("[?|&]" + name + "=" + "([^&;]+?)(&|#|;|$)").exec(location.href) || [, ""])[1].replace(/\+/g, "%20")) || null;
    },
    /**
     * @description:倒计时
@@ -157,38 +123,38 @@
      time = time - 1;
      if (time === 0) {
        clearTimeout(this.timer);
        this.btnText = '重新获取'
        this.isDisabled = false
        this.btnText = "重新获取";
        this.isDisabled = false;
      } else {
        this.isDisabled = true
        this.isDisabled = true;
        this.timer = setTimeout(() => {
          this.btnText = `${time}S`;
          this.timeOut(time);
        }, 1000);
      }
    },
    loginhanld(){
    loginhanld() {
      let v = this.$tool;
      if(v.checkValEmpty(this.phoneNum)){
        Toast.fail('请输入手机号');
      if (v.checkValEmpty(this.phoneNum)) {
        Toast.fail("请输入手机号");
        return;
      }
      if(!v.checkPhone(this.phoneNum)){
        Toast.fail('请输入姓名');
      if (!v.checkPhone(this.phoneNum)) {
        Toast.fail("请输入姓名");
        return;
      }
      if(v.checkValEmpty(this.code)){
        Toast.fail('请输入验证码');
      if (v.checkValEmpty(this.code)) {
        Toast.fail("请输入验证码");
        return;
      }
      this.loginByOpenId({
          vm: this,
          loginType:1,
          verCode:this.code,
          mblNo:this.phoneNum,
          merId:sessionStorage.sib_wx_merId,
          wechatOpenId:this.openId
      })
        vm: this,
        loginType: 1,
        verCode: this.code,
        mblNo: this.phoneNum,
        merId: sessionStorage.sib_wx_merId,
        wechatOpenId: this.openId,
      });
      // this.$api.loginByOpenId({
      //   loginType:1,
@@ -203,14 +169,16 @@
      //   this.$router.push('/mine/toggle-identity?title=选择门店')
      // })
    },
    getCode(){
      this.$api.userSendMsg({
        verCodeType:2,
        mblNo:this.phoneNum
      }).then(res=>{
        this.timeOut(60)
      })
    }
    getCode() {
      this.$api
        .userSendMsg({
          verCodeType: 2,
          mblNo: this.phoneNum,
        })
        .then((res) => {
          this.timeOut(60);
        });
    },
  },
};
</script>