import { defineComponent } from 'vue'
import { Button, Popup } from 'vant'
import state from '/src/pages/detail/state'
import appState from '/src/state'
import { postMessage } from '/src/helpers/native-message'
import TipsIcon from './tips.png'
import { setTongjiTag } from '/src/helpers/utils'
import styles from './index.module.less'

export default defineComponent({
  name: 'vip-popup',
  data() {
    return {
      content: '您尚未开通云练习服务，请联系乐团老师开通',
    }
  },
  methods: {
    open() {
      state.vipShow = false
      // setTongjiTag(['_trackEvent', '云练习', 'VIP曲目', '前往购买页面'])
      // postMessage({
      //   api: 'openWebView',
      //   content: {
      //     url: location.origin + '/#/member',
      //     orientation: 1,
      //   }
      // })
    },
    getContent() {
      // 是否有待未激活会员
      const isExistPendingMember = appState.user?.isExistPendingMember
      if (isExistPendingMember) {
        this.content = '您购买的云练习尚未激活，请联系乐团老师进行激活'
      }
      return this.content
    },
  },
  render() {
    return (
      <Popup show={state.vipShow} get-container="body" closeable onClickCloseIcon={() => (state.vipShow = false)} round>
        <div class={styles.vip}>
          <img src={TipsIcon} />
          {/* <p>当前曲目需付费使用，开通会员<br/>即可自由畅享</p> */}
          <p>{this.getContent()}</p>
          <Button class={styles.btn} onClick={this.open} round color="#01C1B5">
            确定
          </Button>
        </div>
      </Popup>
    )
  },
})
