<!--pages/pandaBonus/pandaBonus.wxml-->
<view>
  <auth wx:if="{{!userInfo}}" bind:getAuth="getAuth"></auth>
  <!-- 活动未开始 -->
  <view class="default_container" wx:if="{{bonus_state == 'unstart'}}">
    <view class="dot_left"></view>
    <view class="dot_right"></view>
    <image class="cloud_left" src="../../image/bonus/cloud.png"></image>
    <image class="cloud_right" src="../../image/bonus/cloud.png"></image>
    <view class="bg_content">
      <image class="top_bg" src="../../image/bonus/top_bg.png"></image>
      <view class="msg_box pos_rel">
        <view class="name line_h68">让红包飞一会儿</view>
        <view class="name line_h68">距离开抢时间还有</view>
      </view>
      <view class="time_box">
        <image class="top_bg" src="../../image/bonus/time_bg.png"></image>
        <view class="count_box">
          <view class="count_text" wx:for="{{renderCount}}" wx:for-index="idx" wx:key="idx">
            <view class="count_single" wx:for="{{item}}" wx:for-index="n" wx:key="n" wx:for-item="num">{{num}}</view>
          </view>
        </view>
      </view>
    </view>
    <view class="bottom_pro">
      <view class="line_h30">独家运营70多个知名化妆品品牌的天猫官方旗舰店</view>
      <view class="flex_center ht30">
        <image src="../../image/bonus/icon_logo.png" class="icon_logo"></image>
        <view>上海丽人丽妆化妆品股份有限公司</view>
      </view>
    </view>
  </view>
  <!-- 活动未开始 -->

  <!-- 活动开始 -->

  <view class="default_container" wx:if="{{bonus_state == 'open'}}">
    <view class="dot_left"></view>
    <view class="dot_right"></view>
    <image class="cloud_left" src="../../image/bonus/cloud.png"></image>
    <image class="cloud_right" src="../../image/bonus/cloud.png"></image>
    <view class="bg_content">
      <image class="top_bg" src="../../image/bonus/top_bg.png"></image>
      <view class="msg_box pos_rel">
        <view class="name line_h68">{{type_info['sender_name']}}</view>
        <view class="msg line_h68" wx:if="{{type_info['send_type'] == 1}}">发了一个红包，金额随机</view>
        <view class="msg line_h68" wx:else>发了一个红包，金额固定</view>
      </view>
      <view class="mgs_bottom pos_rel">
        <view class="f40" catchtap="open">{{type_info['type_bless']}}</view>
      </view>
      <image wx:if="{{openAnimation}}" src="../../image/bonus/icon_open.png" class="open" catchtap="open"></image>
      <image wx:else src="../../image/bonus/coin.png" class="open current_open"></image>
    </view>
    <view class="bottom_pro">
      <view class="line_h30">独家运营70多个知名化妆品品牌的天猫官方旗舰店</view>
      <view class="flex_center ht30">
        <image src="../../image/bonus/icon_logo.png" class="icon_logo"></image>
        <view>上海丽人丽妆化妆品股份有限公司</view>
      </view>
    </view>
  </view>
  <!-- 活动开始 -->



  <view class="default_container" wx:if="{{bonus_state == 'over'}}">
    <view class="dot_left"></view>
    <view class="dot_right"></view>
    <image class="cloud_left" src="../../image/bonus/cloud.png"></image>
    <image class="cloud_right" src="../../image/bonus/cloud.png"></image>
    <view class="bg_content">
      <image class="top_bg" src="../../image/bonus/top_bg.png"></image>
      <view class="mgs_bottom pos_rel over">
        <view class="f56">{{msg}}</view>
      </view>
      <view class="look" catchtap="detail">查看领取详情></view>
    </view>

    <view class="bottom_pro">
      <view class="line_h30">独家运营70多个知名化妆品品牌的天猫官方旗舰店</view>
      <view class="flex_center ht30">
        <image src="../../image/bonus/icon_logo.png" class="icon_logo"></image>
        <view>上海丽人丽妆化妆品股份有限公司</view>
      </view>
    </view>
  </view>

  <view class="default_container" wx:if="{{bonus_state == 'end'}}">
    <view class="dot_left"></view>
    <view class="dot_right"></view>
    <image class="cloud_left" src="../../image/bonus/cloud.png"></image>
    <image class="cloud_right" src="../../image/bonus/cloud.png"></image>
    <view class="bg_content">
      <image class="top_bg" src="../../image/bonus/top_bg.png"></image>
      <view class="msg_box pos_rel">
        <view class="name">{{type_info['sender_name']}}</view>
        <view class="msg mt20">该红包已过期。如已领取,</view>
        <view class="msg">请在APP中“我的红包”中查看～</view>
      </view>
    </view>
    <view class="bottom_pro">
      <view class="line_h30">独家运营70多个知名化妆品品牌的天猫官方旗舰店</view>
      <view class="flex_center ht30">
        <image src="../../image/bonus/icon_logo.png" class="icon_logo"></image>
        <view>上海丽人丽妆化妆品股份有限公司</view>
      </view>
    </view>
  </view>

  <!-- 开了后的样式 ， 即为 details -->
  <view class="grab_container" wx:if="{{bonus_state == 'detail'}}">
    <view class="pos_rel" style="height: 182rpx;">
      <image class="common_bg" src="../../image/bonus/detail_bg.png"></image>
      <view class="top_title">红包</view>
      <image class="sender_head" src="{{sender_head_src}}"></image>
    </view>
    <view class="grab_header">
      <view class="grab_bonus_name">{{type_info['type_name']}}
        <image class="icon_pin" wx:if="{{type_info['send_type'] == 1}}" src="../../image/bonus/icon_pin.png"></image>
      </view>
      <view class="grab_prompt">{{type_info['type_bless']}}</view>
    </view>

    <view class="grab_bonus_price flex_center" wx:if="{{mine_bonus}}">{{mine_bonus['bonus_value']}}<text class="ml4 f30">元</text></view>

    <view class="receive_info tb_line mt60">{{reveive_info}}</view>

    <block wx:if="{{binded_info.length}}">
      <view class="receive_list">
        <view class="receive_item" wx:for="{{binded_info}}" wx:for-index="idx" wx:key="idx">
          <image class="personal_image" src="{{item['avatar']}}"></image>
          <view class="personal_content">
            <view class="item_paragraph f30 col333"><text>{{item['user_name']}}</text></view>
            <view class="item_paragraph f24 col666" wx:if="{{item['discount'] != 0}}">
              <text>已累计节省{{item['discount']}}元</text>
            </view>
            <view class="item_paragraph f24 col666" wx:if="{{item['user_comment']}}">
              <text>{{item['user_comment']}}</text>
            </view>
            <block wx:else>
              <view wx:if="{{item['user_id'] == mineid}}" class="item_paragraph f24 {{result_msg == '留言' ? 'col2c71c6' : 'col666'}}" catchtap="message_tap"
                data-flag="true">{{result_msg}}</view>
            </block>
          </view>

          <view class="text_right">
            <view class="item_paragraph f30 col333" style="justify-content: flex-end">{{item['bonus_value']}}元</view>
            <view wx:if="{{item['is_king']}}" class="item_paragraph f24 cole73636" style="justify-content: flex-end">
              <image class="icon_king" src="../../image/bonus/king.png"></image>手气最佳
            </view>
            <view class="item_paragraph f24 col666" style="justify-content: flex-end">{{item['format_time']}}</view>

          </view>
        </view>
      </view>
    </block>

    <!-- 热卖商品 -->

    <block wx:if="{{summarys}}">
      <view class="receive_info tb_line mt20">热卖商品</view>
      <view class="hot_summarys">
        <block wx:for="{{summarys}}" wx:for-item="summary" wx:for-index="idx" wx:key="idx">
          <twoColumns summary="{{summary}}"></twoColumns>
        </block>
      </view>
    </block>

    <image class="briefing_address" src="../../image/bonus/advert.png"></image>
  </view>

  <!--留言弹窗 -->

  <view class="message_modal" wx:if="{{message_flag == 'true'}}">
    <view class="modal_bg" catchtouchstart="message_tap" data-flag="false"></view>
    <view class="message_content">
      <textarea class="message_info" auto-focus placeholder="写下你想说的话" bindinput="bindKeyInput"></textarea>
      <view class="btn_group flex_center">
        <view class="cancel_btn r_line" catchtap="message_tap" data-flag="false">取消</view>
        <view class="submit_btn" catchtap="send_msg">发送</view>
      </view>
    </view>
  </view>

  <image src="../../image/back-home.png" class="ball-top" catchtap='backHome' wx:if="{{bonus_state == 'detail'}}"></image>


</view>