uni-Identify-quality/pages/login/login.vue

<template>
  <view class="main">
    <image src="@/static/image/logo.png" mode="scaleToFill" class="logo" />
    <button
      class="btn"
      v-if="isShow"
      open-type="getPhoneNumber"
      @getphonenumber="getPhoneNumber"
    >点击登录</button>
    <button class="btn" v-if="isLogoutShow" @click="login">点击登录</button>
  </view>
</template>

<script>
export default {
  data() {
    return {
      code: "",
      openId: "",
      isShow: false,
      isLogoutShow: false
    };
  },
  methods: {
    async getPhoneNumber(e) {
      if (e.detail.errMsg == "getPhoneNumber:ok") {
        // 用户允许或去手机号
        let res = await this.$api.user.loginToken({
          wxPhoneCode: e.detail.code,
          openid: this.openId
        });
        if (res.status == 0) {
          uni.setStorageSync("token", res.data.token);
          uni.redirectTo({
            url: "/pages/register/register"
          });
        }
      } else {
        this.$common.msgToast("请不要拒绝哟~重新点击登录");
      }
    },
    async login() {
      // 获取code
      uni.login({
        provider: "weixin",
        success: async res => {
          this.code = res.code;
          let res1 = await this.$api.user.loginToken({ wxLoginCode: res.code });
          if (res1.status == 0) {
            if (res1.data.code == 2) {
              this.isShow = true;
              this.openId = res1.data.openid;
            } else {
              uni.setStorageSync("token", res1.data.token);
              uni.redirectTo({
                url: "/pages/register/register"
              });
            }
          } else {
            this.$common.msgToast(res1.msg);
          }
        }
      });
    }
  },
  onLoad() {
    this.isLogoutShow = true;
    if (!this.isLogoutShow) {
      // 获取code
      uni.login({
        provider: "weixin",
        success: async res => {
          this.code = res.code;
          let res1 = await this.$api.user.loginToken({ wxLoginCode: res.code });
          if (res1.status == 0) {
            if (res1.data.code == 2) {
              this.isShow = true;
              this.openId = res1.data.openid;
            } else {
              uni.setStorageSync("token", res1.data.token);
              uni.redirectTo({
                url: "/pages/register/register"
              });
            }
          } else {
            this.$common.msgToast(res1.msg);
          }
        }
      });
    }
  }
};
</script>

<style lang="scss" scoped>
.main {
  background: url("@/static/image/login-bg.png") no-repeat;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  .logo {
    width: 237rpx;
    height: 390rpx;
  }
  uni-button:after {
    border: 0px;
  }
  .btn {
    background: transparent;
    width: 200rpx;
    position: fixed;
    bottom: 15%;
    color: #fff;
    left: 50%;
    transform: translateX(-50%);
    font-size: 30rpx;
    transition: all 1s;
    animation: jump 1s ease-in-out infinite alternate;
  }
  @keyframes jump {
    from {
      bottom: 16%;
    }
    to {
      bottom: 15%;
    }
  }
}
</style>