<template>
  <div>
    <div ref='copy' class="btn" @click="onClick">
      立即邀请
    </div>
  </div>
</template>

<script>
import {createNamespacedHelpers} from 'vuex';
import { get } from 'lodash';
import Clipboard from 'clipboard';

const {mapActions} = createNamespacedHelpers('gain');

export default {
  name: 'GainFooter',
  data() {
    return {
      isUnionType: false,
      shareUrl: 'https://activity.yoho.cn/feature/5475.html?share_id=8169&title=新人礼遇'
    };
  },
  mounted() {
    let vm = this;

    this.copyBtn = new Clipboard(this.$refs.copy, {
      text() {
        return vm.shareUrl + `&union_type=${vm.isUnionType}`;
      }
    });

    this.copyBtn.on('success', function() {
      if (vm.isUnionType) {
        vm.$createToast({
          txt: '邀请链接已复制，快去粘贴吧~',
          type: 'txt'
        }).show();
      }
    });

    this.copyBtn.on('error', function() {
    });

    this.fetchUnionStatus().then(result => {
      this.isUnionType = get(result, 'data.unionType', false);
    });
  },
  methods: {
    ...mapActions(['fetchUnionStatus']),

    async onClick() {
      let vm = this;

      const user = await this.$sdk.getUser();

      if (!user.uid) {
        this.$sdk.goLogin();
        return;
      }

      if (!vm.isUnionType) {
        this.$yoho.goNewPage({
          url: 'http://m.yohobuy.com/activity/have-gain/apply?title=有货有赚介绍&openby:yohobuy={"action":"go.h5","params":{"title":"有货有赚介绍","url":"http://m.yohobuy.com/activity/have-gain/apply"}}'
        });
        return;
      }
    },
  }

};
</script>

<style lang="scss" scoped>
  .btn {
    font-size: 32px;
    width: 100%;
    height: 98px;
    line-height: 98px;
    color: white;
    text-align: center;
    background: #444;
  }
</style>