caimei-authentic-manager/src/views/components/PermissionButton/index.vue

<template>
  <el-button v-bind="$attrs" @click="handleClick"><slot /></el-button>
</template>

<script>
export default {
  name: 'PermissionButton',
  data() {
    return {
      hasPermission: true
    }
  },
  methods: {
    handleClick($event) {
      const { freeUseFlag, vipStatus } = this.$store.getters.vipInfo
      // (已过期 or 非会员) and 非试用期
      this.hasPermission = !((vipStatus === 0 || vipStatus === 3) && freeUseFlag === 0)
      if (this.hasPermission) {
        this.$emit('click', $event)
      } else {
        this.$confirm('对不起，您的会员账号已到期，请尽快续费，以免影响正常使用！', '提示', {
          confirmButtonText: '开通会员',
          cancelButtonText: '取消'
        })
          .then(() => {
            // jumpAction()
            // console.log('开通会员')
            this.$router.push('/vip/vip-open')
          })
          .catch(() => {
            this.$message({
              type: 'info',
              message: '已取消操作'
            })
          })
      }
    }
  }
}
</script>