Authored by 毕凯

添加优惠券搜索

@@ -13,6 +13,24 @@ var conponTmpl = Handlebars.compile($('#tmpl-coupon').html()), @@ -13,6 +13,24 @@ var conponTmpl = Handlebars.compile($('#tmpl-coupon').html()),
13 13
14 ellipsis.init(); 14 ellipsis.init();
15 15
  16 +$('#search-coupon').on('submit', function() {
  17 + $.ajax({
  18 + method: 'POST',
  19 + url: '',
  20 + data: $(this).serialize()
  21 + }).then(function(res) {
  22 + if (res.avaliable) {
  23 + $('#coupon-list').html(conponTmpl({
  24 + coupons: res.coupons
  25 + }));
  26 + $('#coupon-list-not').html('');
  27 + } else {
  28 + tip.show(res.msg);
  29 + }
  30 + });
  31 + return false;
  32 +});
  33 +
16 function getCouponDate() { 34 function getCouponDate() {
17 if (!canGetCoupon) { 35 if (!canGetCoupon) {
18 return; 36 return;
@@ -2,6 +2,32 @@ @@ -2,6 +2,32 @@
2 margin-top: pxToRem(30px); 2 margin-top: pxToRem(30px);
3 margin-bottom: pxToRem(30px); 3 margin-bottom: pxToRem(30px);
4 4
  5 + #new-coupon {
  6 + margin-bottom: pxToRem(30px);
  7 + padding-left: pxToRem(30px);
  8 + padding-right: pxToRem(30px);
  9 +
  10 + input {
  11 + padding: 0 pxToRem(12px);
  12 + width: pxToRem(384px);
  13 + height: pxToRem(80px);
  14 + border: 1px solid #b0b0b0;
  15 + border-radius: .1rem;
  16 + outline: 0;
  17 + }
  18 +
  19 + .submit {
  20 + margin-left: pxToRem(30px);
  21 + width: pxToRem(130px);
  22 + height: pxToRem(80px);
  23 + color: #fff;
  24 + background: #b0b0b0;
  25 + border-radius: .1rem;
  26 + border: none;
  27 + outline: 0;
  28 + }
  29 + }
  30 +
5 .coupon-list { 31 .coupon-list {
6 .employ-main:first-child { 32 .employ-main:first-child {
7 margin-top: 0; 33 margin-top: 0;
1 {{> layout/header}} 1 {{> layout/header}}
2 <div class="yoho-page select-coupon-page my-coupon-page"> 2 <div class="yoho-page select-coupon-page my-coupon-page">
  3 + <form id="new-coupon" method="POST" action="">
  4 + <input type="text" name="coupon-code" value="" placeholder="输入优惠券码">
  5 + <button type="submit" class="submit">确定</button>
  6 + </form>
3 <div id="coupon-list" class="coupon-list"></div> 7 <div id="coupon-list" class="coupon-list"></div>
4 <div class="not-avaliable-coupon-line hide">不可使用的优惠券</div> 8 <div class="not-avaliable-coupon-line hide">不可使用的优惠券</div>
5 <div id="coupon-list-not" class="coupon-list"></div> 9 <div id="coupon-list-not" class="coupon-list"></div>