{include file='front/common/head.tpl'}

<script src="/assets/baba/lib/jquery-1.10.2.js"></script>
<script src="/assets/baba/dist/dialog.js"></script>
<script src="/assets/baba/dist/clipboard.min.js"></script>

</div>
<div class="productPageHeaderContainer container-fluid">
  <div class="row" style="height:100%;">
    <div class="productPageHeaderInner col-sm-8 col-sm-offset-2" style="background: url('/assets/baba/default_files/img_barbar/Hero_SSL.svg') no-repeat center center;">
    </div>
  </div>
</div>


<div id="homePagePricingContainer" class="row homepageSectionContainer" style="margin-right: 0px; margin-left: 0px;">
  <div class="col-md-12">
      <center>
        <div class="homepageSectionHeaderContainer">
          <h1 class="homepageSectionHeading">{{$year}}年优惠卷</h1>
        </div>
      </center>
      <div class="container homepageSectionContent">
        <div id="homePagePricingOptions" class="row" style="margin-top: 40px;">

            <div class="col-md-12 featuresFlexContainer textLeft" style="justify-content:left;">
            
                {foreach $coupons as $key => $value}
                <div class="centerWrapflexBoxItem productPricingBox" style="float: left; margin-bottom:30px;">
                  <div class="productPricingBoxLabel">{$value->name}</div>
                  <div class="productPricingBoxPrice" style="">{$value->expire_time}</div><br>
                  <div class="productPricingBoxDiscount">
                      <button saleCode="{$value->code}" class="showSaleCode btn btn-lg btn-xiaofu"
                      style="display: block; height: 42px; font-size: 14px; margin-top: 20px; width:110px; border-radius:3px;">
                          <span>查看优惠卷</span>
                      </button>
                  </div>
                </div>
                {/foreach}
                
          </div>
        </div>
      </div>
  </div>
</div>

<div hidden>
    <div id='dialogShadow'>
        <!-- <p id='dialogTitle' style="font-size:16px;"></p> -->
        <div class='copyText' style='border: 1px solid #bbb; font-size: 16px; width:100%; padding:8px; border-radius: 5px;'></div>
        <!-- <input class='copyInput' type='text' value="777" disabled style='border: 1px solid #bbb; font-size: 16px; width:100%; padding:8px; border-radius: 5px;'> -->
        <!-- <div class="sanOkBtnMini toCopy" style="margin-top:20px; width:110px;float:left;">
            <span>复制到剪贴板123</span>
        </div> -->
        <button id='2' class="toCopy btn btn-lg btn-xiaofu"
        style="display: block; height: 42px; font-size: 14px; margin-top: 20px; width:120px; border-radius:3px;float:left;">
            <span>复制到剪贴板</span>
        </button>
        <a href='/user/product' target="_blank" rel="noopener noreferrer">
            <div style="width: 90px;float:left; margin-top:30px; margin-left:10px; color:#E07E7B;">
                前去下单 >
            </div>
        </a>
    </div>
</div>

<script>

var clipboard = new ClipboardJS('.toCopy', {

  target: function () {
      return document.querySelector('.copyText');
  },
});



$('.showSaleCode').on('click', function(){

    var title = $(this).parent().siblings(".productPricingBoxLabel").html();
    
    $('.copyText').html($(this).attr('saleCode'));

    var d = dialog({
        title: title,
        content: $('#dialogShadow'),
        okValue: '确 定',
        width: 260
    });

    d.showModal();
});

</script>

{include file='front/common/foot.tpl'}