zhangsiye/mini/components/UserIdentityBtn/index.vue

<template>
  <view
    class="user-identity-btn"
  >
    <template v-if="isVip">
      <!--会员-->
      <identity-type :price="vipPrice" :is-vip="true" :checked="true" />
      <!--普通用户-->
      <identity-type :price="normalPrice" />
    </template>
    <template v-else>
      <!--普通用户-->
      <identity-type :price="normalPrice" :is-normal="true" :checked="true" />
      <!--会员-->
      <identity-type :price="vipPrice" />
      <view class="open-card" @click="handleOpen">
        开通福卡会员，立享福卡特权
      </view>
    </template>
  </view>
</template>

<script>/**
 * 购买弹窗  显示会员身份
 */

import { mapState } from 'vuex'
import IdentityType from './IdentityType'

export default {
  name: 'UserIdentityBtn',
  components: { IdentityType },
  props: {
    vipPrice: {
      type: Number,
      default: 0
    },
    normalPrice: {
      type: Number,
      default: 0
    }
  },
  data() {
    return {

    }
  },
  computed: {
    ...mapState({
      userInfo: state => state.user.info
    }),
    isVip() {
      return this.userInfo.is_vip
    }
  },
  methods: {
    handleOpen() {
      uni.navigateTo({
        url: '/pages/index/index'
      })
    }
  }
}
</script>

<style lang="scss" scoped>
    .user-identity-btn {
      .open-card{
        text-align: center;
        text-decoration: underline;
        margin: 20rpx 0;
      }
    }
</style>