wangshusheng / YOHOBUYPC · Commits

Go to a project

Authored by 毕凯
Commit 5ef04dc4c927b71b10e7f4b9d5ce292827f5066f 2 parents 2b532f38 af4b8c6c

Merge branch 'feature/cart' of http://git.dev.yoho.cn/web/yohobuy into feature/cart

Inline Side-by-side
Showing 4 changed files with 100 additions and 14 deletions
@@ -12,7 +12,25 @@ var $ = require('jquery'); @@ -12,7 +12,25 @@ var $ = require('jquery');
12 // var $page = $('.yoho-page'); 12 // var $page = $('.yoho-page');
13 13
14 var $num, 14 var $num,
15 - $chosed; 15 + $chosed,
  16 + re = /\d+/,
  17 + leftNum,
  18 + $colorList = $('.color-list ul>li'),
  19 + $sizeList = $('.size-list ul>li'),
  20 + firstColorId = $colorList.eq(0).data('id'),
  21 + colorIndex;
  22 +
  23 +//初始化购物车面板显示
  24 +$sizeList.each(function() {
  25 + colorIndex = $(this).data('colorid');
  26 +
  27 +
  28 + if (colorIndex === firstColorId) {
  29 + $(this).removeClass('hide');
  30 + }
  31 +});
  32 +
  33 +// confirm;
16 34
17 // var tpl; 35 // var tpl;
18 36
@@ -35,8 +53,11 @@ var $num, @@ -35,8 +53,11 @@ var $num,
35 // $num = $('#good-num'); 53 // $num = $('#good-num');
36 // } 54 // }
37 55
  56 +
  57 +
38 function show() { 58 function show() {
39 $('.chose-panel').show(); 59 $('.chose-panel').show();
  60 +
40 $('body').css('overflow', 'hidden'); 61 $('body').css('overflow', 'hidden');
41 $num = $('#good-num'); 62 $num = $('#good-num');
42 } 63 }
@@ -58,10 +79,43 @@ $('.yoho-page').on('touchstart', '.chose-panel', function(e) { @@ -58,10 +79,43 @@ $('.yoho-page').on('touchstart', '.chose-panel', function(e) {
58 remove(); 79 remove();
59 }).on('touchstart', '#chose-btn-sure', function() { 80 }).on('touchstart', '#chose-btn-sure', function() {
60 81
61 - //确定  
62 -}).on('touchstart', '.block', function(e) { 82 + // var productSku,
  83 + // buyNumber = $('#good-num') - 0;
  84 + // promotionId,
  85 + // goodsType,
  86 + // isEdit;
  87 +
  88 + // //确定
  89 + // $chosed = $('.block-list>ul>li.chosed');
  90 +
  91 + // if (2 === $chosed.length && 2 !== $chosed.closest('.zero-stock').length) {
  92 +
  93 + // if (confirm) {
  94 + // return false;
  95 + // }
  96 +
  97 + // confirm = true;
  98 + // loading.showLoadingMask();
  99 + // $.ajax({
  100 + // method: 'POST',
  101 + // url: '/cart/index/add',
  102 + // data: {
  103 + // product_id: productId,
  104 + // content: content
  105 + // }
  106 + // }).done(function(res) {
  107 + // if (res.code === 200) {
  108 + // loading.hideLoadingMask();
  109 + // confirm = false;
  110 + // remove();
  111 + // }
  112 + // }).fail(function() {
  113 + // tip.show('网络出了点问题~');
  114 + // confirm = false;
  115 + // });
  116 + // }
63 117
64 - //尺寸颜色点选 118 +}).on('touchstart', '.block', function(e) {
65 var $this = $(this), 119 var $this = $(this),
66 $that = $(e.target).closest('.chose-items'), 120 $that = $(e.target).closest('.chose-items'),
67 numArray, 121 numArray,
@@ -96,6 +150,19 @@ $('.yoho-page').on('touchstart', '.chose-panel', function(e) { @@ -96,6 +150,19 @@ $('.yoho-page').on('touchstart', '.chose-panel', function(e) {
96 } 150 }
97 }); 151 });
98 } else if ($chosed.length === 1 && $this.hasClass('chosed')) { 152 } else if ($chosed.length === 1 && $this.hasClass('chosed')) {
  153 + if ($this.closest('.block-list').hasClass('color-list')) {
  154 +
  155 + $sizeList.addClass('hide');
  156 +
  157 + //切换尺码信息
  158 + $sizeList.each(function() {
  159 + colorIndex = $(this).data('colorid');
  160 + if (colorIndex === $this.data('id')) {
  161 + $(this).removeClass('hide');
  162 + }
  163 + });
  164 + }
  165 +
99 numArray = $chosed.data('numstr').split('/'); 166 numArray = $chosed.data('numstr').split('/');
100 $siblingBlock.find('.block').removeClass('zero-stock'); 167 $siblingBlock.find('.block').removeClass('zero-stock');
101 for (i = 0; i < numArray.length; i++) { 168 for (i = 0; i < numArray.length; i++) {
@@ -104,6 +171,9 @@ $('.yoho-page').on('touchstart', '.chose-panel', function(e) { @@ -104,6 +171,9 @@ $('.yoho-page').on('touchstart', '.chose-panel', function(e) {
104 } 171 }
105 } 172 }
106 } else if ($chosed.length === 1 && !$this.hasClass('chosed')) { 173 } else if ($chosed.length === 1 && !$this.hasClass('chosed')) {
  174 + $('#chose-btn-sure').css('background-color', '#eb0313');
  175 + $('#chose-btn-sure').html('确定');
  176 +
107 $siblingBlock.find('ul>li').each(function() { 177 $siblingBlock.find('ul>li').each(function() {
108 $(this).removeClass('zero-stock'); 178 $(this).removeClass('zero-stock');
109 if (0 === $(this).data('num') - 0) { 179 if (0 === $(this).data('num') - 0) {
@@ -123,19 +193,23 @@ $('.yoho-page').on('touchstart', '.chose-panel', function(e) { @@ -123,19 +193,23 @@ $('.yoho-page').on('touchstart', '.chose-panel', function(e) {
123 if (2 === $chosed.closest('.zero-stock').length) { 193 if (2 === $chosed.closest('.zero-stock').length) {
124 $('#chose-btn-sure').css('background-color', '#c0c0c0'); 194 $('#chose-btn-sure').css('background-color', '#c0c0c0');
125 $('#chose-btn-sure').html('已售罄'); 195 $('#chose-btn-sure').html('已售罄');
  196 + } else {
  197 + $('#chose-btn-sure').css('background-color', '#eb0313');
  198 + $('#chose-btn-sure').html('确定');
126 } 199 }
127 } 200 }
128 201
129 }).on('touchstart', '.btn-minus', function() { 202 }).on('touchstart', '.btn-minus', function() {
130 var num = +$num.val(), 203 var num = +$num.val(),
131 - $chosed = $('.block-list>ul>li.chosed'); 204 + $chosed = $('.block-list>ul>li.chosed'),
  205 + leftNum = re.exec($('.num .left-num').html());
132 206
133 //若颜色和尺码没有被同时选中，则不能点击 207 //若颜色和尺码没有被同时选中，则不能点击
134 if ($chosed.length < 2) { 208 if ($chosed.length < 2) {
135 return; 209 return;
136 } 210 }
137 211
138 - if (num === 0) { 212 + if (num === 1 || 0 === leftNum - 0) {
139 return; 213 return;
140 } 214 }
141 215
@@ -147,6 +221,10 @@ $('.yoho-page').on('touchstart', '.chose-panel', function(e) { @@ -147,6 +221,10 @@ $('.yoho-page').on('touchstart', '.chose-panel', function(e) {
147 if ($('.block-list>ul>li.chosed').length < 2) { 221 if ($('.block-list>ul>li.chosed').length < 2) {
148 return; 222 return;
149 } 223 }
  224 + leftNum = re.exec($('.num .left-num').html());
  225 + if (num - 0 === leftNum - 0 || 0 === leftNum - 0) {
  226 + return;
  227 + }
150 228
151 //TODO:库存数验证 229 //TODO:库存数验证
152 $num.val(num + 1); 230 $num.val(num + 1);
@@ -8,7 +8,8 @@ @@ -8,7 +8,8 @@
8 right: 0; 8 right: 0;
9 background: rgba(0,0,0,.3); 9 background: rgba(0,0,0,.3);
10 z-index:3; 10 z-index:3;
11 - 11 +
  12 +
12 .main { 13 .main {
13 position: absolute; 14 position: absolute;
14 height: pxToRem(610px); 15 height: pxToRem(610px);
@@ -85,6 +86,10 @@ @@ -85,6 +86,10 @@
85 top: 20rem / $pxConvertRem; 86 top: 20rem / $pxConvertRem;
86 } 87 }
87 } 88 }
  89 +
  90 + .size-list li.hide {
  91 + display: none;
  92 + }
88 93
89 .block { 94 .block {
90 float: left; 95 float: left;
1 - 1 +{{#cartInfo}}
2 <div class="chose-panel"> 2 <div class="chose-panel">
3 <div class="main"> 3 <div class="main">
4 <div class="infos"> 4 <div class="infos">
5 - <div class="basic-info"> 5 + <div class="basic-info" >
6 {{#thumbs}} 6 {{#thumbs}}
7 {{#if @first}} 7 {{#if @first}}
8 <img class="thumb" src={{img}}> 8 <img class="thumb" src={{img}}>
@@ -25,17 +25,18 @@ @@ -25,17 +25,18 @@
25 <span>颜色</span> 25 <span>颜色</span>
26 <ul class="clearfix" data-type="color"> 26 <ul class="clearfix" data-type="color">
27 {{# colors}} 27 {{# colors}}
28 - <li class="block {{#if chosed}}chosed{{/if}} {{#unless colorNum}}zero-stock{{/unless}}" data-num="{{colorNum}}" data-numstr="{{sizeNumStr}}" data-skcid="{{skcId}}"> 28 + <li class="block {{#if chosed}}chosed{{/if}} {{#unless colorNum}}zero-stock{{/unless}}" data-num="{{colorNum}}" data-id="{{id}}" data-numstr="{{sizeNumStr}}" data-skcid="{{skcId}}">
29 {{name}} 29 {{name}}
30 </li> 30 </li>
31 {{/ colors}} 31 {{/ colors}}
32 </ul> 32 </ul>
33 </div> 33 </div>
34 <div class="size-list block-list"> 34 <div class="size-list block-list">
35 - <span>尺码</span> 35 + <span>尺码</span>
  36 +
36 <ul class="clearfix" data-type="size" > 37 <ul class="clearfix" data-type="size" >
37 {{# sizes}} 38 {{# sizes}}
38 - <li class="block {{#if chosed}}chosed{{/if}} {{#unless sizeNum}}zero-stock{{/unless}}" data-id={{id}} data-num="{{sizeNum}}" data-numstr="{{colorNumStr}}" data-skuid="{{skuId}}" data-goodid="{{goodId}}"> 39 + <li class="block hide {{#if chosed}}chosed{{/if}} {{#unless sizeNum}}zero-stock{{/unless}}" data-id={{id}} data-colorid="{{colorId}}" data-num="{{sizeNum}}" data-numstr="{{colorNumStr}}" data-skuid="{{skuId}}" data-goodid="{{goodsId}}">
39 {{name}} 40 {{name}}
40 </li> 41 </li>
41 {{/ sizes}} 42 {{/ sizes}}
@@ -47,7 +48,7 @@ @@ -47,7 +48,7 @@
47 <a class="btn btn-minus" href="javascript:void(0);"> 48 <a class="btn btn-minus" href="javascript:void(0);">
48 <span class="iconfont">&#xe625;</span> 49 <span class="iconfont">&#xe625;</span>
49 </a> 50 </a>
50 - <input id="good-num" class="good-num" type="text" value={{num}}> 51 + <input id="good-num" class="good-num" type="text" value="1">
51 <a class="btn btn-plus" href="javascript:void(0);"> 52 <a class="btn btn-plus" href="javascript:void(0);">
52 <span class="iconfont">&#xe624;</span> 53 <span class="iconfont">&#xe624;</span>
53 </a> 54 </a>
@@ -57,7 +58,8 @@ @@ -57,7 +58,8 @@
57 </div> 58 </div>
58 </div> 59 </div>
59 <div class="btn-wrap"> 60 <div class="btn-wrap">
60 - <button id="chose-btn-sure" class="btn btn-sure">加入购物车</button> 61 + <button id="chose-btn-sure" class="btn btn-sure">确定</button>
61 </div> 62 </div>
62 </div> 63 </div>
63 </div> 64 </div>
  65 +{{/cartInfo}}
@@ -75,6 +75,7 @@ @@ -75,6 +75,7 @@
75 ×{{count}} 75 ×{{count}}
76 </span> 76 </span>
77 </div> 77 </div>
  78 + </div>
78 <!--<div class="opt-panel hide"> 79 <!--<div class="opt-panel hide">
79 <div class="put-in-favorite"> 80 <div class="put-in-favorite">
80 <span class="iconfont">&#xe622;</span> 81 <span class="iconfont">&#xe622;</span>