bn-q-icon/pages/login/register.vue

<template>
  <view class="register-box">
    <view class="register-logo"></view>
    <header class="header">
      <image class="hd-logo" src="/static/img/icon/logow.png?=1" mode="aspectFill"/>
    </header>
    <view class="register-from">
      <view class="from-input"><input v-model="inviteCode" :placeholder="$t('index.index.affirm')"></view>
      <view class="from-but">
        <button @click="register">{{$t('index.index.affirm')}}</button>
      </view>
    </view>
  </view>
</template>
<script>
import {register} from "@/api/member";
import tools from "@/common/js/tools";

export default {
  name: "register",
  props: {},
  components: {},
  data() {
    return {
      address: '',
      inviteCode: '',
      isAjax: false
    }
  },
  onLoad(query) {
    if (query.address !== undefined) {
      this.address = query.address
      let inviteCode = uni.getStorageSync('inviteCode');
      if (inviteCode) {
        this.inviteCode = inviteCode
      }
    } else {
      tools.leftClick()
    }
  },
  mounted() {

  },
  methods: {
    register() {
      if (this.inviteCode === '') {
        tools.error(this.$t('index.error.errorMsg.noInvite'))
        return;
      }
      if (this.isAjax) {
        return;
      }
      this.isAjax = true
      register({'inviteCode': this.inviteCode, 'address': this.address}).then((res) => {
        if (res.code) {
          tools.setLoginInfo(res.data)
          setTimeout(() => {
            uni.reLaunch({
              url: '/pages/index/index'
            })
          }, 50)
        } else {
          tools.error(res.msg)
          this.isAjax = false
        }
      }).catch((e) => {
        this.isAjax = false
      })
    }
  }

}
</script>

<style scoped lang="scss">
.register-box {
  width: 100vw;
  height: 100vh;
  max-height: 100vh;
  background-image: url("/static/img/bg/dlbg.jpg");
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  //padding-top: 400rpx;
  .register-logo {
    height: 100rpx;
  }

  .header {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 54px;
    background: #131E30;
    z-index: 10;
    overflow: hidden;

    .hd-logo {
      display: block;
      max-width: 52%;
      height: 34px;
      margin: 10px auto;
    }
  }

  .register-from {
    border-radius: 20rpx;
    width: calc(100vw - 214rpx);
    margin: auto;
    height: 300rpx;
    background: #131E30;
    padding: 80rpx 64rpx 0 64rpx;

    .from-input {

      input {
        border-radius: 6rpx;
        height: 100rpx;
        border: 2rpx solid #3e526b;
        color: #7388a7;
        font-size: 42rpx;
        line-height: 100rpx;
        text-align: center;
      }

      input::placeholder {

      }
    }

    .from-but {
      margin-top: 40rpx;

      button {
        height: 82rpx;
        line-height: 82rpx;
        border: 2rpx solid #146AF0;
        border-radius: 6rpx;
        background: #146AF0;
        color: #FFFFFF;
      }
    }
  }
}

</style>