payProject/pages/vipCard/vipCard.wxml

<view class="tabs">
  <view class="tabs-wrap flex-align-center tabs-radius">
    <view class="item flex-center line {{current == 0 ? 'active' : ''}}" bindtap="onTabsChange" data-id="0">未激活</view>
    <view class="item flex-center line {{current == 1 ? 'active' : ''}}" bindtap="onTabsChange" data-id="1">已激活</view>
    <view class="item flex-center {{current == 2 ? 'active' : ''}}" bindtap="onTabsChange" data-id="2">已退款</view>
  </view>
  <view class="tabs-content">
    <view class="item tabs-radius" wx:for="{{list}}" wx:key="index">
      <view class="item-top flex-align-center">
        <text class="ellipsis">订单编号：{{item.order_sn}}</text>
        <text wx:if="{{item.status == 0}}">未激活</text>
        <text wx:if="{{item.status == 1}}">已激活</text>
        <text wx:if="{{item.status == -2}}">退款中</text>
        <text wx:if="{{item.status == -3}}">已退款</text>
      </view>
      <view class="item-content flex">
        <image src="{{item.cover_url}}"></image>
        <view class="content flex-column">
          <text style="font-family: PingFangSC-Medium;color:#000;">{{item.card_name}}</text>
          <text style="font-size: 14px;color: #333333;">微信支付  实付￥{{item.price}}</text>
          <text style="font-size: 14px;color: #666666;">下单时间：{{item.create_time}}</text>
        </view>
      </view>
      <view class="item-btn flex-align-center" wx:if="{{item.status == 0}}">
        <view class="btn cancel-btn" bindtap="onCancelOrder" data-id="{{item.order_id}}">申请退款</view>
        <view class="btn use-btn flex-center" bindtap="onOpenPopup" data-id="{{item.order_id}}">立即激活</view>
      </view>
    </view>
    <view class="no-data" style="display: {{list.length == 0 ? 'block' : 'none'}};">暂无数据~</view>
  </view>
</view>

<wux-landscape visible="{{ visible }}"  maskClosable="{{ true }}" closable="{{ false }}" bind:close="onCancelUse">
  <view class="use-popup flex-column">
    <text style="font-size: 36rpx;">激活会员卡</text>
    <text style="color: #666666;margin: 28rpx 0 78rpx;">会员卡确认激活后，立即生效。</text>
    <!-- <view class="tips flex-column">
      <text class="red">[温馨提示]</text>
      <text class="red">确认激活后，该会员卡将立即生效；</text>
      <text class="red">如暂不激活，可在“已购会员卡”中去选择激活。</text>
    </view> -->
    <view class="use-btn">
      <view class="btn cancel flex-center" bindtap="onCancelUse">取消</view>
      <view class="btn confirm flex-center" bindtap="onConfirmUse">确定</view>
    </view>
    <!-- [温馨提示] 确认激活后，该会员卡将立即生效； 如暂不激活，可在“已购会员卡”中去选择激活。 -->
  </view>
</wux-landscape>