<template>
  <div class="share">
    <cr-share
      v-model="showShare"
      :types="types"
      @close="shareCloseChange"
      @click-share-item="bundleShareClickItem"
    />
  </div>
</template>
<script>
import MpBridge from '@/service/mp';
import { mapState } from 'vuex';
export default {
  name: 'GroupShare',
  components: {},
  props: {},
  data() {
    return {
      showFlag: false,
      shareOptions: null,
      nativeBridge: null,
      types: [
        { value: 'weixin', disabled: false },
        { value: 'pic', disabled: false }
      ]
    };
  },
  computed: {
    ...mapState({
      shareInfo: state => state.pay.shareInfo
    }),
    showShare: {
      get() {
        return this.$store.state.pay.showShare;
      },
      set() {
        this.$store.dispatch('goods_share_close');
      }
    }
  },
  watch: {},
  created() {
    // 如果是小程序直接调用postMessage像小程序派发事件监听
    this.nativeBridge = new MpBridge();
  },
  methods: {
    shareCloseChange() {},
    bundleShareClickItem(ev) {
      if (ev === 'pic') {
        this.nativeBridge.openNewUrl({
          newUrl: `/pages/goodshare/index?ev=${ev}`
        });
      }
      if (ev === 'weixin') {
        this.nativeBridge.run({
          event: 'showShareView',
          data: {
            shareDic: this.shareInfo
          }
        });
        this.shareDialogConfirm();
      }
    },
    shareDialogConfirm() {
      this.$dialog({
        message: '请在微信小程序中参与此活动哦~',
        showCancelButton: false,
        confirmButtonText: '我知道了哦～',
        onConfirm: () => {
          // todo 跳转到小程序
          this.$toast('确定');
        }
      });
    }
    // shareAppChange() {}
  }
};
</script>
<style lang="less"></style>
