<wxs module="filter" src="../../../../utils/filter.wxs"></wxs>
<com_top_nav title="会员权益"></com_top_nav>
<view class="xc-userqy-frame">
  <!-- 顶部 -->
  <view class='user-frame rel'>
    <view class="arc" style="background:{{userqy_color.first_bgcolor}}"></view>
    <image class="user-img circle abs" src="{{userinfo.head_pic?userinfo.head_pic:defaultAvatar}}"> </image>
    <view class="user-name abs "  style="color:{{userqy_color.font_color}}">
        {{userinfo.nickname}} <view class="hvip"><image class="vip-mem" src="{{iurl}}/miniapp/images/vip_hg0.png"></image>{{GradeName}}</view>
    </view>
    <!-- 当前是什么等级卡 -->
    
    <view class='flex abs xc-grow-frame' bindtap='go_cz'>
      <view class="four-level-word new xc-grow-val" style="color:{{userqy_color.font_color}}; background:{{userqy_color.secord_bgcolor}}">{{rfmName}}</view>
      <view class="progress-bar-not">
          <view class="progress-bar-yes"  wx:if="{{cz_val>full_cz_val}}" style='width:100%;background:{{userqy_color.secord_bgcolor}}'></view>
          <view class="progress-bar-yes"  wx:else  style='width:{{cz_val/need_money*100}}%;background:{{userqy_color.secord_bgcolor}}'></view>
      </view>

      <view class="progress-bar-val four-level-word new" style="color:{{userqy_color.font_color}}; " wx:if="{{cz_val<full_cz_val}}" >{{filter.pInt(cz_val)}} / {{need_money}}</view>
      <view class="progress-bar-val four-level-word new"  style="color:{{userqy_color.font_color}}; "  wx:else>{{filter.pInt(cz_val)}}</view>

    </view>

    <!-- 卡片滑动 -->
    <view class="swiper-frame abs">
      <swiper class="swiper" next-margin="130rpx" current-item-id="{{currentItemId}}" previous-margin="130rpx" bindchange="swiperChange">
          <block wx:for="{{backClass}}">
             <swiper-item item-id="{{index}}" data-item-id="{{index}}" bindtap='clickChange'>
              <view class='li rel'>
              <image class="vip-img li1 {{currentItemId == index ? 'selected' : ''}}" src="{{item.ImageUrl}}">
                <image class="vip-huangguan abs " src="{{iurl}}/miniapp/images/userqy/user_userqy_huang.png"> </image>
                <view class="white emerald abs" style="color:#{{item.FontColor}};">{{item.GradeName}}</view>

                <!--  上部分的文字判断 -->
                <view class=" abs white discounts four-level-word" wx:if="{{cz_val<item.BuyGradeSum && gradeId!=item.Id}}"  style="color:#{{item.FontColor}};">
                    <block wx:if="{{index!=backClass.length-1}}">
                        [{{item.GradeName}}]365天累计{{rfmName}}≥{{backClass[index+1].BuyGradeSum }}可升级[{{ backClass[index+1].GradeName}}]
                    </block>
                    <block wx:else>
                        [{{item.GradeName}}]365天累计{{rfmName}}≥{{item.BuyGradeSum }}可保级
                    </block>
                </view>
                <view class=" abs white discounts four-level-word" wx:if="{{gradeId==item.Id}}"  style="color:#{{item.FontColor}};">会员将在{{filter.replace_time2(gradeEndDate)}}到期，<text wx:if="{{need_money>0}}">365天累计{{rfmName}}≥{{need_money}}可升级[{{ backClass[index+1].GradeName}}]</text><text wx:else >[{{item.GradeName}}]365天累计{{rfmName}}≥{{item.BuyGradeSum}}可保级</text>
                </view>
                <view class=" abs white discounts four-level-word" wx:if="{{gradeId!=item.Id && cz_val>item.BuyGradeSum }}"  style="color:#{{item.FontColor}};">
                    [{{item.GradeName}}]365天累计{{rfmName}}≥{{backClass[index+1].BuyGradeSum }}可升级[{{ backClass[index+1].GradeName}}]
                </view>

                <!--  下部分的文字判断 -->
                  <view wx:if="{{cz_val>item.BuyGradeSum && gradeId!=item.Id }}" class=" abs white money four-level-word"  style="color:#{{item.FontColor}};">
                      加入会员尽享优惠
                  </view>

                <view wx:if="{{cz_val<item.BuyGradeSum && gradeId!=item.Id }}" class=" abs white money four-level-word"  style="color:#{{item.FontColor}};">
                     距离{{item.GradeName}}还需{{ filter.pInt(item.BuyGradeSum-cz_val)}}{{rfmName}}
                </view>
                <view wx:if="{{gradeId==item.Id}}" class=" abs white money four-level-word new curword"  style="color:#{{item.FontColor}};">
                    <view class="rel">
                         <view class='text'></view>
                         <text class='text2 abs'>您当前是此会员</text>
                    </view>   
                </view>

              </image>
            </view>
          </swiper-item>
        </block>
      </swiper>
    </view>
  </view>

  <!-- 下部 -->
  <view class="mar-bottem">
    <view class="xc-privilege-img-frame t-c">
    <image class="xc-privilege-img" src="{{iurl}}/miniapp/images/userqy/user_userqy_fy.png"></image>
  </view>
    <view class="privilege-frame t-c flex flex-center">
    <view class="xc-user-privileg t-r">
      <view class="xc-users-frame"></view>
      <view class="xc-users-frame-two"></view>
      <view class="xc-users-frame"></view>
    </view>
    <view class=" user-word" style='font-size:32rpx'>会员特权</view>
    <view class="xc-user-privileg-right t-l">
      <view class="xc-users-frame-right"></view>
      <view class="xc-users-frame-two"></view>
      <view class="xc-users-frame-right"></view>
    </view>
  </view>


   <view class="project-frame">
        <view class="item t-c" wx:for="{{qy_list}}" data-no="{{item.PrivilegeType}}"
              data-img="{{item.PrivilegeImageUrl}}"
              bindtap="go_url"  data-ind="{{index}}" data-name='{{item.PrivilegeName}}' >
          <image class="xc-project-img  {{item.ishas==1?'':'img_gray'}} " src="{{item.PrivilegeICOUrl}}"></image>
          <view class="three-level-word xc-project-word ellipsis-1">{{item.PrivilegeName}}</view>
        </view>
    </view>
  </view>
</view>

<pop_txt id="pop_txt"></pop_txt>