<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no">
  <title>酒鬼酒</title>
  <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
  <link href="https://cdn.bootcdn.net/ajax/libs/minireset.css/0.0.2/minireset.min.css" rel="stylesheet">
  <link href="/media/1/main.css" rel="stylesheet"/>
  <script src="https://cdn.bootcdn.net/ajax/libs/vue/2.6.9/vue.min.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/vant@2.10/lib/vant.min.js"></script>
  <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vant@2.10/lib/index.css" />
  <script src="/media/1/area.js"></script>
</head>
{% verbatim %}
<body>

  <!-- page=1 -->
  <div id="con">
    <div id="homepage" v-if="page==1">
      <img src="/media/1/assets/pattern-curtain.png" />
      <img src="/media/1/assets/logo.png" id="homepage-logo" />
      <div style="display:flex;justify-content: center;margin-top:-60px;">
        <img src="/media/1/assets/bottle2new.jpg" id="homepage-bottle" />
      </div>
      <div class="article-title">
        无上妙品
      </div>
      <div class="article-content">
        集酒鬼酒公司始创的馥郁香型白酒，色清透明、诸香馥郁、入口绵甜、醇厚丰满、香味协调、回味悠长。
        巧妙融合了”泸型之浓香“、”汾型之清香“、”茅型之酱香“于一身，乃中国白酒的集大成之作，堪为神奇之酿。
        酒鬼酒以其型而彰显文化魅力，以其质而凸显高端品味，内外兼修，相得益彰，被誉为”无上妙品“。
      </div>
      <div style="display:flex;justify-content: center;margin-top: 0.3rem;">
        <div @click="goWallet" class="btn">
          <img src="/media/1/assets/wallet.png" width="60px" />
          <div class="btn-text">我的卡包</div>
        </div>
      </div>
      <img src="/media/1/assets/pattern-bottom.png" class="homepage-bottom" />
    </div>

    <!-- page=2 -->
    <div id="wallet" v-if="page==2">
      <div style="display: flex;justify-content: center;">
        <div class="card-slot">
          <div class="card" @click="cardClick" data-item="2">
            <div class="card-text">励志鼠</div>
            <img src="/media/1/assets/wallet/励志鼠灰.png" v-if="cards[1]==0" style="margin-top:23px;width:70%;" />
            <img src="/media/1/assets/wallet/励志鼠.png" v-else style="margin-top:23px;width:70%;" />
            <div class="card-num"><div class="card-num-panel">拥有数量: {{cards[1]}}</div></div>
          </div>
          <div class="card" @click="cardClick" data-item="1">
            <div class="card-text">担当鼠</div>
            <img src="/media/1/assets/wallet/担当鼠灰.png" v-if="cards[0]==0" />
            <img src="/media/1/assets/wallet/担当鼠.png" v-else />
            <div class="card-num"><div class="card-num-panel">拥有数量: {{cards[0]}}</div></div>
          </div>
          <div class="card" @click="cardClick" data-item="6">
            <div class="card-text">回眸鼠</div>
            <img src="/media/1/assets/wallet/回眸鼠灰.png" v-if="cards[5]==0" style="width:70%;margin-top: 20px;" />
            <img src="/media/1/assets/wallet/回眸鼠.png" v-else style="width:70%;margin-top: 20px;" />
            <div class="card-num"><div class="card-num-panel">拥有数量: {{cards[5]}}</div></div>
          </div>
          <div class="card" @click="cardClick" data-item="4">
            <div class="card-text">结缘鼠</div>
            <img src="/media/1/assets/wallet/结缘鼠灰.png" v-if="cards[3]==0" />
            <img src="/media/1/assets/wallet/结缘鼠.png" v-else />
            <div class="card-num"><div class="card-num-panel">拥有数量: {{cards[3]}}</div></div>
          </div>
          <div class="card" @click="cardClick" data-item="5">
            <div class="card-text">守望鼠</div>
            <img src="/media/1/assets/wallet/守望鼠灰.png" v-if="cards[4]==0" />
            <img src="/media/1/assets/wallet/守望鼠.png" v-else />
            <div class="card-num"><div class="card-num-panel">拥有数量: {{cards[4]}}</div></div>
          </div>
          <div class="card" @click="cardClick" data-item="3">
            <div class="card-text">相知鼠</div>
            <img src="/media/1/assets/wallet/相知鼠灰.png" v-if="cards[2]==0" />
            <img src="/media/1/assets/wallet/相知鼠.png" v-else />
            <div class="card-num"><div class="card-num-panel">拥有数量: {{cards[2]}}</div></div>
          </div>
        </div>
      </div>
      <div class="wallet-btn">
        <div class="btn" @click="goMyAward">
          <img src="/media/1/assets/award.png" width="90px" />
          <div class="btn-text">我的奖品</div>
        </div>
        <div class="btn" style="margin-left: 1rem;" @click="openComposePanel">
          <img src="/media/1/assets/compose.png" width="90px" />
          <div class="btn-text">福鼠兑奖</div>
        </div>
        <div class="btn" style="margin-left: 1rem;" @click="openRulePanel">
          <img src="/media/1/assets/rule.png" width="90px" />
          <div class="btn-text">活动规则</div>
        </div>
      </div>
      <!-- <div class="wallet-text">
        <p>活动说明:</p>
        <p>集齐合成不同的卡获得相应的奖励</p>
        <p>1.合成3张不同的福鼠剪纸兑换价值125元的158mL红坛品鉴酒1瓶</p>
        <p>2.合成5张不同的福鼠剪纸兑换价值245元的250mL红坛品鉴酒1瓶</p>
        <p>3.合成6张不同的福鼠剪纸兑换价值699元的100mL五彩酒鬼酒1盒</p>
        <p>此次活动执行截止时间为2021年12月31日</p>
      </div> -->
      <img src="/media/1/assets/pattern-bottom.png" class="homepage-bottom" />
    </div>


    <!-- page=3 -->
    <div id="award" v-if="page==3">
      <div class="award-con">
        <div class="award-title">
          我的奖品
        </div>
        <div class="award-content-wrapper">
          <div class="award-content" v-for="v, i in awardItems">
            <div class="award-item">
              <div class="award-item-img">
                <img :src="v.img" width="70px" />
              </div>
              <div class="award-item-text">
                <div style="height: 50px;line-height: 50px;">
                  {{v.title}}
                </div>
                <div style="height: 50px;line-height: 50px;display:flex;align-items: center;">
                  数量: {{v.quantity}} 
                  <div class="btn-detail" v-if="v.redeem==1" @click="redeemDetail(v.id)">详细</div>
                </div>
              </div>
              <div class="award-item-btn">
                <div :class="v.redeem==0?'btn-award-item':'btn-award-item-gray'" @click="goRedeem(v.redeem, v.id)">
                  {{v.redeem==0?'兑换':'已兑换'}}
                </div>
              </div>
            </div>
          </div>
        </div>

        <div class="award-btn-group">
          <div style="width: 100%;display:flex;justify-content: center;">
            <!-- <div class="btn-award-bottom">
              修改收货地址
            </div> -->
            <div class="btn-award-bottom" style="margin-top:0px;" @click="goHomePage">
              返回主页
            </div>
          </div>
        </div>
      </div>
    </div>

    <!-- page=4 -->
    <div id="redeem" v-if="page==4">
      <div class="redeem-con">
        <div class="redeem-title">
          填写领奖信息
        </div>
        <div class="redeem-content-vant">
          <van-address-edit :area-list="areaList"
                          :show-postal="false"
                          :show-delete="false"
                          :show-set-default="false"
                          show-search-result
                          :search-result="searchResult"
                          @save="redeem"
                          :area-columns-placeholder="['请选择', '请选择', '请选择']" />
        </div>
        <div style="display:flex;justify-content: center;">
          <div class="btn-redeem-bottom" @click="goMyAward">
            返回
          </div>
        </div>
        <div class="redeem-btn-group">
          <div style="width: 90%;">
            
          </div>
        </div>
      </div>
    </div>

    <!-- page=5 -->
    <div id="getcard" v-if="page==5">
      <img src="/media/1/assets/pattern-curtain.png" style="position: relative;z-index:3;" />
      <div style="position: absolute;top: 22px;display:flex;justify-content: center;width:100%;z-index:3;">
        <img src="/media/1/assets/pattern-congrate.png" style="width:270px;height:104px;margin-left:10px;"/>
      </div>
      <div class="getcard-card">
        <img src="/media/1/assets/bg-rad.png" class="getcard-card-bg" />
        <img :src="getCardImage" width="247px" height="336px" 
        style="position: absolute;z-index: 3;top: 40px;left: 50%;margin-left:-125px;" />
      </div>
      <div class="getcard-btn-group">
        <div @click="share">
          <img src="/media/1/assets/share.png" width="75px" />
          <div class="getcard-btn-group-text">
            转赠
          </div>
        </div>
        <div @click="goHomePage">
          <img src="/media/1/assets/homepage.png" width="75px" />
          <div class="getcard-btn-group-text">
            返回主页
          </div>
        </div>
        <div @click="goWallet">
          <img src="/media/1/assets/wallet.png" width="75px" />
          <div class="getcard-btn-group-text">
            我的卡包
          </div>
        </div>
      </div>
    </div>

    <!-- panel -->
    <div class="panel-mask" v-if="panelOccasion>=0">
      <div class="panel-con">
        <div class="panel-compose-con" v-if="panelOccasion==0">
          <div class="panel-compose-close" style="margin-top:3rem;">
            <div class="panel-compose-close-btn" @click="closeComposePanel">
              <img src="/media/1/assets/close.png" width="40px" />
            </div>
          </div>
          <div style="display:flex;justify-content: center;">
            <div class="panel-compose-box">
              <div style="padding: 1rem;color: #fff;font-size: 1.2rem;">
                <svg t="1608351554972" style="width:20px;height:20px;position:relative;top:3px;" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2994" width="200" height="200"><path d="M512 1024C229.237622 1024 0 794.762378 0 512S229.237622 0 512 0 1024 229.237622 1024 512 794.762378 1024 512 1024z m-203.554595-430.661189l194.089514 205.021405a13.395027 13.395027 0 0 0 9.714162 4.234379h27.481946c4.538811 0 8.579459-2.352432 11.042595-5.977946l192.456648-203.277838a14.861838 14.861838 0 0 0 4.012973-10.24 14.861838 14.861838 0 0 0-4.012973-10.24l-19.428324-20.535352a13.339676 13.339676 0 0 0-9.686487-4.234378 13.339676 13.339676 0 0 0-9.686486 4.234378l-150.970811 159.467244V208.231784A14.114595 14.114595 0 0 0 539.731027 193.72973h-27.45427a14.114595 14.114595 0 0 0-13.727135 14.502054V712.095135l-151.275244-159.799351a13.339676 13.339676 0 0 0-9.686486-4.234379 13.339676 13.339676 0 0 0-9.714162 4.234379l-19.428325 20.507675a14.861838 14.861838 0 0 0-4.012973 10.24c0 4.012973 1.522162 7.638486 4.012973 10.267676z" p-id="2995" fill="#f4ea2a"></path></svg>
                选择兑换的奖品
              </div>
              <div class="radio-wrapper">
                <div class="radio-wrapper-title">
                  <input type="radio" style="height: 2.3rem;" id="radio0" v-model="radio" value="2" />
                  <div style="margin-left:0.5rem;"><label for="radio0">一等奖</label></div>
                </div>
                <div>集齐 6 张<b>不同的</b>福鼠卡</div>
              </div>
              <div class="radio-wrapper">
                <div class="radio-wrapper-title">
                  <input type="radio" style="height: 2.3rem;" id="radio1" v-model="radio" value="1" />
                  <div style="margin-left:0.5rem;"><label for="radio1">二等奖</label></div>
                </div> 
                <div>集齐 5 张福鼠卡</div>
              </div>
              <div class="radio-wrapper">
                <div class="radio-wrapper-title">
                  <input type="radio" style="height: 2.3rem;" id="radio2" v-model="radio" value="0" />
                  <div style="margin-left:0.5rem;"><label for="radio2">三等奖</label></div>
                </div>
                <div>集齐 3 张福鼠卡</div>
              </div>
            </div>
          </div>

          <div style="display:flex;justify-content: center;margin-top: 3rem;">
            <div class="panel-compose-btn" @click="compose" >
              兑奖
            </div>
          </div>

        </div>
        <div class="panel-compose-finish-con" v-if="panelOccasion==1">
          <div class="panel-compose-finish-text">
            <p>恭喜您获得</p>
            <p>{{composeFinishItemName}}1瓶</p>
          </div>
          <div style="text-align: center;">
            <img src="/media/1/assets/bottle.png" width="180px" style="margin-top: 2rem;" v-if="composeFinishItemName!='五彩酒鬼酒'"/>
            <img src="/media/1/assets/colorBottles.png" width="180px" style="margin-top: 2rem;" v-else/>
          </div>
          <div style="display:flex;justify-content: center;margin-top: 3rem;">
            <div class="panel-compose-btn" @click="closeComposePanel_goAward">
              立即领取
            </div>
          </div>
          
        </div>
        <div class="panel-taken-con" v-if="panelOccasion==2">
          <div style="display:flex;justify-content: center;">
            <div class="panel-taken-box" style="margin-top: 5rem;">
              此卡已领取
            </div>
          </div>
          <div style="display:flex;justify-content: center;margin-top: 3rem;">
            <div class="panel-compose-btn" @click="closeComposePanel">
              确定
            </div>
          </div>
        </div>
        <div class="panel-taken-con" v-if="panelOccasion==3">
          <div style="display:flex;justify-content: center;">
            <div class="panel-rule-box" style="margin-top: 5rem;">
              <p style="font-weight: bold;">活动说明:</p>
              <p><b>一等奖:</b>每集齐6幅各不相同的生肖鼠剪纸作品，奖励价值699元的五彩酒鬼酒一盒。</p>
              <p><b>二等奖:</b>每集齐任意5幅生肖鼠剪纸作品，奖励500mL红坛酒鬼酒(品鉴)1瓶</p>
              <p><b>三等奖:</b>每集齐任意3幅生肖鼠剪纸作品，奖励258mL红坛酒鬼酒(品鉴)1瓶</p>
              <p style="margin-top:0.5rem;">此次活动执行截止时间为2021年12月31日</p>
            </div>
          </div>
          <div style="display:flex;justify-content: center;margin-top: 3rem;">
            <div class="panel-compose-btn" @click="closeComposePanel">
              确定
            </div>
          </div>
        </div>
        <div class="panel-taken-con" v-if="panelOccasion==4">
          <div class="panel-compose-close">
            <div class="panel-compose-close-btn" @click="closeComposePanel">
              <img src="/media/1/assets/close.png" width="40px" />
            </div>
          </div>
          <div class="card-share-img-wrapper">
            <img src="/media/1/assets/担当鼠.png" v-if="cardShareItem==1"/>
            <img src="/media/1/assets/励志鼠.png" v-if="cardShareItem==2"/>
            <img src="/media/1/assets/相知鼠.png" v-if="cardShareItem==3"/>
            <img src="/media/1/assets/结缘鼠.png" v-if="cardShareItem==4"/>
            <img src="/media/1/assets/守望鼠.png" v-if="cardShareItem==5"/>
            <img src="/media/1/assets/回眸鼠.png" v-if="cardShareItem==6"/>
            <span style="background: #e80004;border-radius: 8px;color: #fff;height: 1.6rem;line-height:1.6rem;padding:0 0.4rem;">
              X<b>{{cards[cardShareItem-1]}}</b>
            </span>
          </div>
          <div style="display:flex;justify-content: center;margin-top: 3rem;">
            <div class="panel-compose-btn" @click="cardShare">
              转赠
            </div>
          </div>
        </div>
        <div class="panel-taken-con" v-if="panelOccasion==5">
          <div style="display:flex;justify-content: center;">
            <div class="panel-detail-box" style="margin-top: 5rem;">
              <div>
                兑奖序号: {{detail.id}}
              </div>
              <div v-if="detail.check">
                审核时间: {{detail.check}}
              </div>
              <div v-if="!detail.check">
                审核状态: 未审核
              </div>
              <div v-if="detail.send">
                发货状态: {{detail.send}}
              </div>
              <div v-if="!detail.send">
                发货状态: 未发货
              </div>
              <div v-if="detail.delivery">
                物流单号: {{detail.delivery}}
              </div>
              <div v-if="!detail.delivery">
                物流状态: 未发货
              </div>
            </div>
          </div>
          <div style="display:flex;justify-content: center;margin-top: 3rem;">
            <div class="panel-compose-btn" @click="closeComposePanel">
              确定
            </div>
          </div>
         
        </div>
        <div class="panel-card-choosing-con" v-if="panelOccasion==6">
          <div class="panel-compose-close" style="margin-top:0rem;">
            <div class="panel-compose-close-btn" @click="closeComposePanel">
              <img src="/media/1/assets/close.png" width="40px" />
            </div>
          </div>
          <div style="display: flex;justify-content: center;align-items: center;">
            <div class="panel-card-choosing">
              <div class="panel-card-choosing-title" v-if="radioLimit==5">
                二等奖兑奖
              </div>
              <div class="panel-card-choosing-title" v-else >
                三等奖兑奖
              </div>
              <div class="panel-card-choosing-topbar">
                <div style="width:30%;" >
                  卡片
                </div>
                <div style="width:30%;">
                  剩余
                </div>
                <div style="width:40%;">
                  使用数量
                </div>

              </div>
              <div class="panel-card-choosing-content">
                <div class="panel-card-choosing-item" v-for="(v,i) in items" :key="i">
                  <div style="width:30%;" >
                    {{v}}
                  </div>
                  <div style="width:30%;">
                    {{cards[i]-cardsUsed[i]}}
                  </div>
                  <div style="width: 40%;display: flex;justify-content: space-evenly;font-weight:bold;align-items: center;">
                    <div class="stepper" @click="stepper(0, i)">
                      -
                    </div>
                    <div>
                      {{cardsUsed[i]}}
                    </div>
                    <div class="stepper" @click="stepper(1, i)">
                      +
                    </div>
                  </div>
                </div>
                <div style="text-align:center;color: #fff;margin: 0.5rem 0;font-weight:bold;" v-if="radioLimit==5">
                  使用 {{cardsUsedSum}} / 5 张卡片兑换二等奖
                </div>
                <div style="text-align:center;color: #fff;margin: 0.5rem 0;font-weight:bold;" v-else>
                  使用 {{cardsUsedSum}} / 3 张卡片兑换三等奖
                </div>
                <div style="display: flex;justify-content: center;margin-bottom: 0.5rem;">
                  <div class="btn-compose-3" v-if="radioLimit != cardsUsedSum">
                    兑奖
                  </div>
                  <div class="btn-compose-2" @click="customCompose" v-else>
                    兑奖
                  </div>
                </div>
              </div>
            </div>
          </div>

        </div>

      </div>
    </div>

    <!--loading panel-->
    <div class="panel-mask" style="z-index:100;" v-if="panelLoading==1">
      <div class="panel-con" style="display:flex;justify-content:center;align-items: center;">
        <div class="loading-panel-wrapper">
          <div class="loading-panel">
            请稍候...
          </div>
        </div>
      </div>
    </div>
  </div>
  <script>
    wx.ready(function() {

    })
    /*
      {page}
      1: homepage
      2: wallet
      3: my award
      4: redeem
      5: new card get
      
      {panelOccasion}
      -1: close
      0: compose panel
      1: compose finish panel
      2: taken panel
      3: rule panel
      4: card share panel

      {panelLoading}
      0: close
      1: loading
    */
    var app = new Vue({
      el: '#con',
      data: {
        page: 1,
        panelOccasion: -1,
        radio: -1,
        cards: [],
        items: [
          '担当鼠',
          '励志鼠',
          '相知鼠',
          '结缘鼠',
          '守望鼠',
          '回眸鼠'
        ],
        cardsUsed: [0,0,0,0,0,0],
        cardsUsedSum: 0,
        bonus: [],
        redeemed: [],
        redeemData: {
          name: '',
          phone: '',
          province: '',
          city: '',
          street: '',
          address: ''
        },
        radioLimit: 0,
        awardItems: [],
        composeFinishItemName: "红坛品鉴酒",
        shareActivity: '',
        redeemActivity: '',
        consumer_id: '',
        winner_id: '',
        ecpid: '',
        getCardImage: '',
        areaList: arealist,
        searchResult: [],
        loading: false,
        panelLoading: 0,
        cardShareCode: '',
        cardShareItem: 0,
        detail: {
          id: '',
          check: '',
          delivery: '',
          send: ''
        }
      },
      
      methods: {
        openLoadingPanel() {
          this.panelLoading = 1;
        },
        closeLoadingPanel() {
          this.panelLoading = 0;
        },
        checkAndGet() {
          this.openLoadingPanel();

          // this.consumer_id = this.getQueryStringByName('consumer_id');
          // this.ecpid = this.getQueryStringByName('label_code');
            
          this.consumer_id = this.getCookie('TJWX_consumer_id');
          this.ecpid = this.getCookie('label_code');
          

          var ecpid = this.ecpid;
          var consumer_id = this.consumer_id;
          
          if(!ecpid || !consumer_id) {
            alert('数据丢失，请重新扫码');
          }

          var that = this;
          $.ajax({
            url: `/sales/promotioncode/check/?ecpid=${ecpid}&uid=${consumer_id}`,
            success: function(res) {
              that.closeLoadingPanel();
              console.log(res);
              if(res.msg && res.msg == '领取成功'){
                var item = res.item;
                var itemImage = "";
                switch(item) {
                  case 1: itemImage = "/media/1/assets/担当鼠.png";break;
                  case 2: itemImage = "/media/1/assets/励志鼠.png";break;
                  case 3: itemImage = "/media/1/assets/相知鼠.png";break;
                  case 4: itemImage = "/media/1/assets/结缘鼠.png";break;
                  case 5: itemImage = "/media/1/assets/守望鼠.png";break;
                  case 6: itemImage = "/media/1/assets/回眸鼠.png";break;
                }
                that.getCardImage = itemImage;
                that.getUserData();
                that.page = 5;
              }else if(res.msg && res.msg=='已被领取') {
                that.panelOccasion = 2;
                that.getUserData();
              }else if(res.msg && res.msg =='已被消耗'){
                that.panelOccasion = 2;
                that.getUserData();
              }else {
                alert('异常, 请扫码重试');
              }
            },
            fail: function() {
              that.closeLoadingPanel();
              alert('异常, 网络连接失败');
            }
          })
        },
        getCookie(name) {
            var arr, reg = new RegExp("(^| )" + name + "=([^;]*)(;|$)");
            if (arr = document.cookie.match(reg))
                return decodeURIComponent(arr[2]);
            else
                return "no";
        },
        customCompose() {
          var that = this;
          var radio = this.radio;
          if(this.loading) {
            return;
          }else {
            this.loading = true;
            setTimeout(function() {
              that.loading = false;
            }, 200);
          }
          if (radio == -1) {
            return;
          }

          this.openLoadingPanel();
          
          $.ajax({
              url: '/sales/promotioncode/compose/',
              method: 'POST',
              data: {
                uid: that.consumer_id,
                plan: radio,
                cardsUse: this.cardsUsed.join()
              },
              success: function(res) {
                console.log(res)
                that.closeLoadingPanel();
                if(res.e == 'lack of params') {
                  alert('兑奖发生错误, 请刷新后重试');
                  return;
                }
                if(res.code) {
                  if(res.code.startsWith('15')) {
                    alert('没有足够的卡片');
                  }else {
                    alert('合成失败');
                  }
                }else {
                  var res_plan = res.plan;
                  if(res_plan==2) {
                    that.composeFinishItemName = "五彩酒鬼酒"
                  }else {
                    that.composeFinishItemName = "红坛品鉴酒"
                  }
                  that.panelOccasion = 1;
                  that.getUserData();
                }
              },
              fail: function(err) {
                that.closeLoadingPanel();
                alert('网络连接失败');
              }
          });

        },
        getUserData() {
          var that = this;
          this.openLoadingPanel();
          $.ajax({
            url: '/sales/promotioncode/getdata/?uid=' + that.consumer_id,
            success(res) {
              that.closeLoadingPanel();
              var d = res;
              that.cards = d.cards;
              that.bonus = d.bonus;
              that.redeemed = d.redeemed;
              var awardItems = [];
              if(d.cards && d.redeemed) {
                for(let i = 0; i < d.bonus.length; i++) {
                  awardItems.push({
                    "id": d.bonus[i].id,
                    "img": d.bonus[i].award_name=="五彩酒鬼酒"?"/media/1/assets/colorBottles.png":"/media/1/assets/bottle.png",
                    "title": d.bonus[i].award_name,
                    "quantity": 1,
                    "redeem": d.bonus[i].tm_redeemed?1:0
                  })
                }
                for(let i = 0; i < d.redeemed.length; i++) {
                  awardItems.push({
                    "id": d.redeemed[i].id,
                    "img": d.bonus[i].award_name=="五彩酒鬼酒"?"/media/1/assets/colorBottles.png":"/media/1/assets/bottle.png",
                    "title": d.redeemed[i].award_name,
                    "quantity": 1,
                    "redeem": d.redeemed[i].tm_redeemed?1:0
                  })
                }
                that.awardItems = awardItems;
              }
              
            },
            fail(err) {
              that.closeLoadingPanel();
              alert('网络请求失败');
            }
          })
        },
        stepper(mode, idx) {
          console.log('mode,idx:', mode, idx)
          //mode == 0 minus
          //mode == 1 plus
          if(mode == 0) {
            let cardsUsed = this.cardsUsed;
            if(cardsUsed[idx] > 0) {
              cardsUsed[idx] -= 1;
              this.cardsUsed = cardsUsed;
              this.cardsUsedSum = this.cardsUsedSum - 1;
              this.$forceUpdate();
            }else {
              return;
            }
          }else {
            let cardsUsed = this.cardsUsed;
            if(cardsUsed[idx] < this.cards[idx] && this.cardsUsedSum < this.radioLimit) {
              cardsUsed[idx] += 1;
              this.cardsUsed = cardsUsed;
              this.cardsUsedSum = this.cardsUsedSum + 1;
              this.$forceUpdate();
            }else {
              return;
            }
          }
        },
        goHomePage() {
          this.page = 1;
        },
        goWallet() {
          this.page = 2;
        },
        goMyAward() {
          this.page = 3;
        },
        openComposePanel() {
          this.panelOccasion = 0;
        },
        openRulePanel() {
          this.panelOccasion = 3;
        },
        openCardSharePanel() {
          this.panelOccasion = 4;
        },
        openDetailPanel() {
          this.panelOccasion = 5;
        },
        openComposeCardChoosingPanel() {
          this.panelOccasion = 6;
        },
        closeCardSharePanel() {
          this.panelOccasion = -1;
        },
        closeComposePanel_goAward() {
          this.panelOccasion = -1;
          //重置选项
          this.radio = -1;
          this.cardsUsed = [0,0,0,0,0,0];
          this.cardsUsedSum = 0;
          this.goMyAward();
        },
        closeComposePanel() {
          this.panelOccasion = -1;
          //重置选项
          this.radio = -1;
          this.cardsUsed = [0,0,0,0,0,0];
          this.cardsUsedSum = 0;
        },
        cardClick(e) {
          var that = this;
          item = e.currentTarget.dataset.item;
          if(this.cards[item-1]==0) {
            return;
          }
          this.cardShareItem = item;
          this.openLoadingPanel();
          $.ajax({
            url: '/sales/promotioncode/getcard/',
            method: 'POST',
            data: {
              uid: that.consumer_id,
              item: item
            },
            success: function(res) {
              var ecpid = res.data;
              that.cardShareCode = ecpid;
              that.closeLoadingPanel();
              if(!ecpid) {return;}
              that.openCardSharePanel();
            }
          })
        },
        cardShare() {
          var that = this;
          var ecpid = this.cardShareCode;
          wx.updateAppMessageShareData({
              title: '卡片分享',
              desc: '酒鬼酒鼠年生肖纪念酒活动卡片分享',
              link: `https://davis.china315net.com/wx/label/scan/1/?cpid=${ecpid}`,
              imgUrl: 'https://davis.china315net.com/media/1/assets/logo2.png',
              success: function (res) {
                // alert('转赠成功, 您可以在右上角将链接分享给朋友');
              },
              cancel: function () {
                // alert('转赠失败');
              }
          })
          $.ajax({
            url: '/sales/promotioncode/share/',
            method: 'POST',
            data: {
              'ecpid': ecpid,
              'uid': that.consumer_id
            },
            success: function (res) {
              if(res.msg=='转赠成功') {
                alert('转赠成功, 您可以在右上角将链接分享给朋友');
              }else {
                alert(res.msg);
              }
              
              that.getUserData();
            },
            fail: function (err) {
              alert('网络连接失败');
            }
          })
          that.closeCardSharePanel();
        },
        redeemDetail(id){
          this.openLoadingPanel();
          var that = this;
          $.ajax({
            url: '/sales/promotioncode/redeem/status/',
            data: {
              id: id,
              uid: that.consumer_id
            },
            success: function(res) {
              that.closeLoadingPanel();
              if(res.e) {
                alert('详情获取异常')
                return;
              }
              that.openDetailPanel();
              that.detail = {
                id: res.id,
                check: res.check,
                send: res.send,
                delivery: res.delivery
              }
            },
            fail: function(err) {
              that.closeLoadingPanel();
            }
          })
        },
        compose() {
          var that = this;
          if(this.loading) {
            return;
          }else {
            this.loading = true;
            setTimeout(function() {
              that.loading = false;
            }, 200);
          }

          if (this.radio == -1) {
            return;
          } else if(this.radio == 2){
            this.openLoadingPanel();
            var radio = this.radio;
            console.log(that.consumer_id, radio)
            $.ajax({
              url: '/sales/promotioncode/compose/',
              method: 'POST',
              data: {
                uid: that.consumer_id,
                plan: radio,
                cardsUse: "1,1,1,1,1,1"
              },
              success: function(res) {
                console.log(res);
                that.closeLoadingPanel();
                if(res.e == 'lack of params') {
                  alert('兑奖发生错误, 请刷新后重试');
                  return;
                }
                if(res.code) {
                  if(res.code.startsWith('15')) {
                    alert('没有足够的卡片');
                  }else {
                    alert('合成失败');
                  }
                }else {
                  var res_plan = res.plan;
                  if(res_plan==2) {
                    that.composeFinishItemName = "五彩酒鬼酒"
                  }else {
                    that.composeFinishItemName = "红坛品鉴酒"
                  }
                  that.panelOccasion = 1;
                  that.getUserData();
                }
              },
              fail: function(err) {
                that.closeLoadingPanel();
                alert('网络连接失败');
              }
            })
          }else {
            var radio = this.radio;
            if(radio == 0) {
              this.radioLimit = 3;
            }else if(radio == 1) {
              this.radioLimit = 5;
            }
            this.openComposeCardChoosingPanel();
          }
        },
        goRedeem(e, winner_id) {
          if (e == 1) {
            return;
          }
          this.winner_id = winner_id;
          this.page = 4;
        },
        redeem(content) {
          this.openLoadingPanel();

          var that = this;
          this.saving = true;
          $.ajax({
            url: '/sales/promotioncode/redeem/',
            method: 'POST',
            data: {
              uid: that.consumer_id,
              winner_id: that.winner_id,
              name: content.name,
              province: content.province,
              phone: content.tel,
              city: content.city,
              county: content.county,
              address: content.addressDetail
            },
            success: function(res) {
              that.closeLoadingPanel();
              that.saving = false;
              
              if(res.msg == 'ok') {
                alert('领奖成功，您兑换的奖品酒鬼酒股份有限公司将于15个工作日内发货');
                that.page = 3;
                that.getUserData();
              }else {
                if(res.e=='已兑奖') {
                  alert('已兑奖');
                }else {
                  alert('领奖失败')
                }
              }
            },
            fail: function(err) {
              that.closeLoadingPanel();
              alert('网络连接失败')
            }
          })
        },
        share() {
          this.openLoadingPanel();
          var that = this;
          var ecpid = this.ecpid;
          wx.updateAppMessageShareData({
              title: '卡片分享',
              desc: '酒鬼酒鼠年生肖纪念酒活动卡片分享',
              link: `https://davis.china315net.com/wx/label/scan/1/?cpid=${ecpid}`,
              imgUrl: 'http://davis.china315net.com/media/1/assets/logo2.png',
              success: function (res) {
                 
              },
              cancel: function () {
                  
              }
          })
          $.ajax({
            url: '/sales/promotioncode/share/',
            method: 'POST',
            data: {
              'ecpid': ecpid,
              'uid': that.consumer_id
            },
            success: function(res) {
              that.closeLoadingPanel();
              alert(res.msg);
              if(res.msg == '转赠成功') {
                alert('转赠成功, 您可以在右上角将链接分享给朋友');
              }
            },
            fail: function(err) {
              that.closeLoadingPanel();
              alert('网络连接失败')
            }
          })
        },
        getQueryStringByName(name) {
          var result = location.search.match(new RegExp("[\?\&]" + name + "=([^\&]+)", "i"));
          if (result == null || result.length < 1) {
            return "";
          }
          return result[1];
        },
        wxconfig() {
          var that = this;
          // var lbcode = this.getQueryStringByName('label_code');
          var lbcode = this.getCookie('label_code');
          $.ajax({
            url: '/wx/ajax/js/sign/6/',
            method: 'GET',
            data: { url: window.location.href },
            success: function(res) {
                wx.config({
                    debug: false,
                    appId: res.appid,
                    timestamp: res.timestamp,
                    nonceStr: res.noncestr,
                    signature: res.signature,
                    jsApiList: ['updateAppMessageShareData','updateTimelineShareData', 'onMenuShareAppMessage', 'onMenuShareTimeline']
                });
                wx.ready(function () {
                  wx.updateAppMessageShareData({
                    title: '卡片分享',
                    desc: '酒鬼酒鼠年生肖纪念酒活动卡片分享',
                    link: `https://davis.china315net.com/wx/label/scan/1/?cpid=${lbcode}`,
                    imgUrl: 'http://davis.china315net.com/media/1/assets/logo2.png',
                    success: function (res) {
                      
                    },
                    cancel: function () {
                      
                    }
                  })
                })
            }
          });
        }
      },
      mounted() {
        this.wxconfig();
        this.checkAndGet();
      }

    })
  </script>
</body>
{% endverbatim %}
</html>
