<template>
  <div class="register-for-invite">
    <div class="">注册</div>
    <form @submit.prevent>
      <input v-model="form.phone" label="phone" name="phone" />
      <input v-model="form.code" label="code" name="code" maxlength="6" />
      <div class="">
        <button @click="register()">注册</button>
        <button @click="sendSmsCode()">发送验证码</button>
      </div>
    </form>
  </div>
</template>

<script>
import { registerForInvite } from '~/api/user/client.js';
import { sendSmsCode } from '~/api/message/phone.js';
export default {
  name: 'RegisterForInvite',
  data() {
    return {
      form: {
        phone: '17603013019',
        code: '',
        invitationUserName: null,
        activityId: null,
      },
    };
  },
  fetch() {
    this.form.invitationUserName = this.$route.query.invitationUserName;
    this.form.activityId = this.$route.query.activityId;
  },
  head: {
    title: '注册',
  },
  methods: {
    async register() {
      this.$tongji.trackEvent('活动', '注册', '', 0);
      await registerForInvite(this, this.form);
    },
    async sendSmsCode() {
      this.$tongji.trackEvent('活动', '发送短信', '', 0);
      const res = await sendSmsCode(this, {
        type: 'common',
        authorizationType: 4,
        phone: this.form.phone,
      });
      this.$message({ content: res.msg });
    },
  },
};
</script>


