diff --git a/static/font/iconfont.eot b/static/font/iconfont.eot
index 99b9cea..c09dc8e 100644
Binary files a/static/font/iconfont.eot and b/static/font/iconfont.eot differ
diff --git a/static/font/iconfont.svg b/static/font/iconfont.svg
index 6dbfebf..d4fef41 100644
--- a/static/font/iconfont.svg
+++ b/static/font/iconfont.svg
@@ -2,7 +2,7 @@
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
<svg xmlns="http://www.w3.org/2000/svg">
<metadata>
-Created by FontForge 20120731 at Mon Oct 19 17:33:26 2015
+Created by FontForge 20120731 at Tue Oct 20 15:11:31 2015
By Ads
</metadata>
<defs>
@@ -19,7 +19,7 @@ Created by FontForge 20120731 at Mon Oct 19 17:33:26 2015
bbox="0 -224 3943 812"
underline-thickness="50"
underline-position="-100"
- unicode-range="U+0078-E61A"
+ unicode-range="U+0078-E621"
/>
<missing-glyph horiz-adv-x="374"
d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
@@ -117,5 +117,25 @@ q16 -8 34 -8zM899.5 225q30.5 0 51 21.5t20.5 52.5q0 9 -2 18t-5.5 16.5t-8 14t-11 1
<glyph glyph-name="uniE61A" unicode=""
d="M511 -84q-102 0 -188.5 50t-137 137t-50.5 189t50.5 188.5t137 137t188.5 50.5t189 -50.5t137 -137t50 -188.5t-50 -189t-137 -137t-189 -50zM676 421q7 6 0 12l-6 7q-2 2 -5.5 2t-6.5 -2l-138 -139l-137 137q-6 6 -12 0l-6 -6q-6 -6 0 -12l136 -137l-138 -138
q-6 -6 0 -12l6 -6q7 -7 13 0l138 138l138 -139q6 -6 13 0l6 6q6 6 0 13l-139 138zM676 421z" />
+ <glyph glyph-name="uniE61B" unicode=""
+d="M437 41h-193q-27 2 -41.5 22.5t-17.5 45.5q3 25 17.5 41t41.5 18h193v63l-193 1q-27 2 -41.5 19t-17.5 43q3 25 17.5 41t41.5 18h144l-134 236q-10 12 -19 30.5t-8 40.5q5 28 20 45.5t56 22.5q24 -2 43 -16.5t31 -31.5l152 -278l167 280q12 17 31 30t43 16q15 -1 27.5 -4
+t22 -10t16 -20t9.5 -34q0 -29 -20 -55l-155 -252h147q26 -2 41 -18t17 -41q-2 -26 -17.5 -44t-41.5 -20l-191 -1v-61h192q26 -2 41 -20t17 -43q-2 -26 -17 -43.5t-41 -19.5l-192 1v-106q-4 -85 -93 -85q-44 0 -68.5 21t-26.5 64v104z" />
+ <glyph glyph-name="uniE61C" unicode=""
+d="M946 -196h-868q-26 0 -44 18t-18 44v868q0 26 18 44t44 18h868q26 0 44 -18t18 -44v-868q0 -26 -18 -44t-44 -18zM946 703q0 13 -9 22t-22 9h-806q-13 0 -22 -9t-9 -22v-806q0 -13 9 -22t22 -9h806q13 0 22 9t9 22v806z" />
+ <glyph glyph-name="uniE61D" unicode=""
+d="M939 -202h-876q-17 0 -31.5 8.5t-23 23t-8.5 31.5v876q0 26 18.5 44.5t44.5 18.5h876q26 0 44.5 -18.5t18.5 -44.5v-876q0 -39 -35 -57q-14 -6 -28 -6zM814 612l-376 -438l-250 188l-63 -126l313 -250l439 501z" />
+ <glyph glyph-name="uniE61E" unicode=""
+d="M224 211l416 410l179 -179l-416 -410zM659 525l-19 19l-333 -333l19 -19zM698 486l-20 20l-332 -333l19 -19zM736 448l-19 19l-333 -333l19 -19zM717 704q14 14 38 14t39 -14l102 -102q6 -6 9.5 -14t4.5 -16.5t0 -17t-4.5 -16.5t-9.5 -13l-64 -58l-173 173zM211 186
+l167 -167l-148 -51l-70 70zM205 -45l-83 -32l32 83z" />
+ <glyph glyph-name="uniE61F" unicode=""
+d="M512 812q-138 0 -256 -69t-187 -187t-69 -256t69 -256t187 -187t256 -69t256 69t187 187t69 256t-69 256t-187 187t-256 69zM563 44h-102v307h102v-307zM563 454h-102v102h102v-102z" />
+ <glyph glyph-name="uniE620" unicode=""
+d="M938 276h-400v274h-50v-274h-399q-15 0 -29 5.5t-24 15.5t-16 24t-6 29v175q0 31 22 53t53 22h90q-18 21 -29 46t-11 54q0 27 10 47.5t25 30t29.5 15t24.5 6.5l11 1q53 0 100 -15.5t81 -42t56 -50t39 -50.5q17 27 39.5 51t56 50t79.5 41.5t98 15.5h4q2 0 8.5 -1.5
+t13.5 -3t16 -5.5t16.5 -9t15.5 -13t13.5 -17.5t9 -23.5t3.5 -30q0 -28 -9.5 -52t-25.5 -45h85q31 0 53 -22t22 -53v-175q0 -44 -39 -65q-17 -9 -36 -9zM264 725q-15 0 -26 -2.5t-15.5 -6t-6.5 -7.5t-2 -6v-3q0 -49 66 -100h173q-14 30 -30 52.5t-34 35.5t-33 21t-34.5 11.5
+t-30 4t-27.5 0.5zM763 723q-13 0 -20 -0.5t-21.5 -1.5t-24.5 -4.5t-24 -9t-25.5 -14.5t-24 -21.5t-24.5 -30.5t-22 -41h177q59 50 59 97v3q0 2 -2 6.5t-7 7.5t-15.5 6t-25.5 3zM488 -224h-349q-15 0 -29 6t-24 16t-16 24t-6 29v375h424v-450zM538 226h400v-375
+q0 -31 -22 -53t-53 -22h-325v450z" />
+ <glyph glyph-name="uniE621" unicode=""
+d="M160 492v-640q0 -26 19 -45t45 -19h576q26 0 45 19t19 45v640h-704zM352 -84h-64v448h64v-448zM480 -84h-64v448h64v-448zM608 -84h-64v448h64v-448zM736 -84h-64v448h64v-448zM880 684h-208v80q0 20 -14 34t-34 14h-224q-8 0 -15 -2.5t-13 -7t-10.5 -10.5t-7 -13
+t-2.5 -15v-80h-208q-20 0 -34 -14t-14 -34v-80h832v80q0 6 -1.5 11t-3.5 10t-5.5 9t-7.5 7.5t-9 5.5t-10 3.5t-11 1.5zM608 684h-192v63h192v-63z" />
</font>
</defs></svg>
diff --git a/static/font/iconfont.ttf b/static/font/iconfont.ttf
index 77f9308..931eb7b 100644
Binary files a/static/font/iconfont.ttf and b/static/font/iconfont.ttf differ
diff --git a/static/font/iconfont.woff b/static/font/iconfont.woff
index 8d2abc1..dc54b76 100644
Binary files a/static/font/iconfont.woff and b/static/font/iconfont.woff differ
diff --git a/static/js/shopping-cart/good.js b/static/js/shopping-cart/good.js
new file mode 100644
index 0000000..ddea89d
--- /dev/null
+++ b/static/js/shopping-cart/good.js
@@ -0,0 +1,26 @@
+/**
+ * 购物车商品
+ * @author: xuqi<qi.xu@yoho.cn>
+ * @date: 2015/10/20
+ */
+
+var $ = require('yoho.zepto'),
+ ellipsis = require('mlellipsis'),
+ lazyLoad = require('yoho.zeptolazyload');
+
+ellipsis.init();
+
+lazyLoad($('.lazy'));
+
+$('.name')[0].mlellipsis(2);
+
+//checkbox toggle status
+$('.checkbox').bind('touchstart', function() {
+ var $this = $(this);
+
+ if ($this.hasClass('icon-cb-checked')) {
+ $this.removeClass('icon-cb-checked').addClass('icon-checkbox');
+ } else {
+ $this.removeClass('icon-checkbox').addClass('icon-cb-checked');
+ }
+});
\ No newline at end of file
diff --git a/static/js/shopping-cart/index.js b/static/js/shopping-cart/index.js
new file mode 100644
index 0000000..e38a506
--- /dev/null
+++ b/static/js/shopping-cart/index.js
@@ -0,0 +1,20 @@
+/**
+ * 购物车Logic
+ * @author: xuqi<qi.xu@yoho.cn>
+ * @date: 2015/10/20
+ */
+
+var $ = require('yoho.zepto');
+
+require('./good');
+
+$('.cart-nav').delegate('li', 'touchstart', function() {
+ var $this = $(this);
+
+ if ($this.hasClass('active')) {
+ return;
+ }
+
+ $this.siblings('.active').removeClass('active');
+ $this.addClass('active');
+});
\ No newline at end of file
diff --git a/static/sass/index.scss b/static/sass/index.scss
index 16b9ee4..370be56 100644
--- a/static/sass/index.scss
+++ b/static/sass/index.scss
@@ -74,6 +74,16 @@ a {
-moz-osx-font-smoothing: grayscale;
}
+.icon-checkbox:before { content: "\e61c"; }
+.icon-cb-checked:before { content: "\e61d"; }
+.icon-gift:before { content: "\e620"; }
+.icon-del:before { content: "\e621"; }
+.icon-money:before { content: "\e61b"; }
+.icon-edit:before { content: "\e61e"; }
+.icon-yoho-like:before { content: "\e605"; }
+.icon-close:before { content: "\e61a"; }
+.icon-right-arrow:before { content: "\e614"; }
+
.yoho-tip {
position: absolute;
display: none;
@@ -92,4 +102,4 @@ a {
@include border-radius(10px);
}
-@import "layout/header", "layout/footer", "good", "filter", "passport/index", "guang/index", "home/index", "category/index", "product/index", "index/index";
\ No newline at end of file
+@import "layout/header", "layout/footer", "good", "filter", "passport/index", "guang/index", "home/index", "category/index", "product/index", "index/index", "shopping-cart/index";
\ No newline at end of file
diff --git a/static/sass/shopping-cart/_good.scss b/static/sass/shopping-cart/_good.scss
new file mode 100644
index 0000000..c211eb8
--- /dev/null
+++ b/static/sass/shopping-cart/_good.scss
@@ -0,0 +1,123 @@
+.shopping-cart-good {
+ position: relative;
+ padding-left: 16rem / $pxConvertRem;
+
+ .checkbox {
+ position: absolute;
+ top: 50%;
+ margin-top: -14rem / $pxConvertRem;
+ font-size: 28rem / $pxConvertRem;
+ color: #f0f0f0;
+
+ &.icon-cb-checked {
+ color: #000;
+ }
+ }
+
+ .info {
+ float: left;
+ margin-left: 50rem / $pxConvertRem;
+ padding: 16rem / $pxConvertRem 0;
+ border-bottom: 1px solid #e0e0e0;
+ }
+
+ .thumb {
+ float: left;
+ width: 120rem / $pxConvertRem;
+ height: 160rem / $pxConvertRem;
+ }
+
+ .deps {
+ margin-left: 135rem / $pxConvertRem;
+ padding-right: 20rem / $pxConvertRem;
+ }
+
+ .name {
+ font-size: 28rem / $pxConvertRem;
+ }
+
+ .row:nth-child(2) {
+ font-size: 22rem / $pxConvertRem;
+ height: 45rem / $pxConvertRem;
+ line-height: 45rem / $pxConvertRem;
+
+ > span {
+ margin-right: 15rem / $pxConvertRem;
+ }
+ }
+
+ .row:nth-child(3) {
+ position: relative;
+ }
+
+ .color, .size {
+ color: #b6b6b6;
+ }
+
+ .appear-date {
+ color: #e01;
+ }
+
+ .price {
+ font-size: 24rem / $pxConvertRem;
+ color: #000;
+ }
+
+ .count {
+ font-size: 20rem / $pxConvertRem;
+ color: #999;
+ margin-left: 22rem / $pxConvertRem;
+ }
+
+ .sold-out, .low-stocks {
+ display: inline-block;
+ width: 100rem / $pxConvertRem;
+ height: 30rem / $pxConvertRem;
+ line-height: 30rem / $pxConvertRem;
+ font-size: 22rem / $pxConvertRem;
+ border: none;
+ color: #fff;
+ text-align: center;
+ margin-left: 16rem / $pxConvertRem;
+ }
+
+ .sold-out {
+ background: #999;
+ }
+
+ .low-stocks {
+ background: #e01;
+ }
+
+ .icon-del,
+ .icon-edit {
+ position: absolute;
+ color: #ccc;
+ font-size: 30rem / $pxConvertRem;
+ }
+
+ .icon-del {
+ right: 14rem / $pxConvertRem;
+ }
+
+ .icon-edit {
+ right: 72rem / $pxConvertRem;
+ }
+
+ .opt-panel {
+ display: none;
+
+ width: 220rem / $pxConvertRem;
+ height: 190rem / $pxConvertRem;
+
+ color: #fff;
+
+ .put-in-favorite {
+ background: #bbb;
+ }
+
+ .del {
+ background: #999;
+ }
+ }
+}
\ No newline at end of file
diff --git a/static/sass/shopping-cart/_index.scss b/static/sass/shopping-cart/_index.scss
new file mode 100644
index 0000000..94c6664
--- /dev/null
+++ b/static/sass/shopping-cart/_index.scss
@@ -0,0 +1,131 @@
+@import "good";
+
+.cart-nav {
+ height: 30rem / $pxConvertRem;
+ color: #c6c6c6;
+ border-bottom: 1px solid #e0e0e0;
+ padding: 30rem / $pxConvertRem 0;
+
+ li {
+ float: left;
+ width: 50%;
+ }
+
+ li.active {
+ color: #000;
+ }
+
+ span {
+ display: block;
+ box-sizing: border-box;
+ width: 100%;
+ height: 30rem / $pxConvertRem;
+ line-height: 30rem / $pxConvertRem;
+ font-size: 30rem / $pxConvertRem;
+ text-align: center;
+ }
+
+ li:first-child span {
+ border-right: 1px solid #e0e0e0;
+ }
+}
+
+.cart-goods {
+ border-bottom: 1px solid #e0e0e0;
+
+ .shopping-cart-good:last-child .info {
+ border-bottom: none;
+ }
+}
+
+.freebie-and-advance-buy {
+ padding: 20rem / $pxConvertRem;
+ font-size: 24rem / $pxConvertRem;
+ border-bottom: 1px solid #e0e0e0;
+
+ > li {
+ box-sizing: border-box;
+ height: 90rem / $pxConvertRem;
+ line-height: 90rem / $pxConvertRem;
+ margin-bottom: 10rem / $pxConvertRem;
+ background: #f8f8f8;
+ padding: 0 20rem / $pxConvertRem;
+
+ &:last-child {
+ margin-bottom: 0;
+ }
+
+ a {
+ float: right;
+ }
+ }
+
+ .count {
+ color: #f00;
+ }
+
+ .icon-right-arrow {
+ color: #8f8f8f;
+ }
+}
+
+.price-compute {
+ padding: 20rem / $pxConvertRem;
+ border-bottom: 1px solid #e0e0e0;
+ font-size: 26rem / $pxConvertRem;
+
+ .title {
+ display: inline-block;
+ width: 175rem / $pxConvertRem;
+ }
+
+ .minus {
+ float: right;
+ }
+}
+
+.balance {
+ position: fixed;
+ box-sizing: border-box;
+ bottom: 0;
+ width: 100%;
+ padding: 20rem / $pxConvertRem;
+ height: 120rem / $pxConvertRem;
+ border-top: 1px solid #e0e0e0;
+
+ .iconfont {
+ position: absolute;
+ top: 50%;
+ margin-top: -14rem / $pxConvertRem;
+ font-size: 28rem / $pxConvertRem;
+ }
+
+ p {
+ float: left;
+ margin-left: 50rem / $pxConvertRem;
+ font-size: 26rem / $pxConvertRem;
+
+ span {
+ display: block;
+ height: 40rem / $pxConvertRem;
+ line-height: 40rem / $pxConvertRem;
+ }
+
+ .tip {
+ color: #666;
+ font-size: 22rem / $pxConvertRem;
+ }
+ }
+
+ .btn-balance {
+ float: right;
+ width: 140rem / $pxConvertRem;
+ height: 80rem / $pxConvertRem;
+ line-height: 80rem / $pxConvertRem;
+ text-align: center;
+ background: #e01;
+ color: #fff;
+ border: none;
+ font-size: 28rem / $pxConvertRem;
+ }
+}
\ No newline at end of file
diff --git a/template/m.yohobuy.com/actions/index/shoppingCart/index.phtml b/template/m.yohobuy.com/actions/index/shoppingCart/index.phtml
new file mode 100644
index 0000000..400056d
--- /dev/null
+++ b/template/m.yohobuy.com/actions/index/shoppingCart/index.phtml
@@ -0,0 +1,78 @@
+{{> layout/header}}
+<div class="shopping-cart-page yoho-page">
+ {{# shoppingCart}}
+ {{#if cartNav}}
+ <ul class="cart-nav">
+ <li class="active">
+ <span>
+ 普通商品({{commonGoodsCount}})
+ </span>
+ </li>
+ <li>
+ <span>
+ 预售商品({{presellGoodsCount}})
+ </span>
+ </li>
+ </ul>
+ {{/if}}
+
+ <div class="cart-goods">
+ {{# goods}}
+ {{> shopping-cart/good}}
+ {{/ goods}}
+ </div>
+
+ {{#if freebieOrAdvanceBuy}}
+ <ul class="freebie-and-advance-buy">
+ {{# freebie}}
+ <li class="freebie">
+ <span class="iconfont icon-gift"></span>
+ 赠品
+ <a href={{url}}>
+ <span class="count">{{count}}</span>
+ <span class="iconfont icon-right-arrow"></span>
+ </a>
+ </li>
+ {{/ freebie}}
+ {{# advanceBuy}}
+ <li class="advance-buy">
+ <span class="iconfont icon-money"></span>
+ 加价购
+ <a href={{url}}>
+ <span class="count">{{count}}</span>
+ <span class="iconfont icon-right-arrow"></span>
+ </a>
+ </li>
+ {{/ advanceBuy}}
+ </ul>
+ {{/if}}
+
+ <div class="price-compute">
+ <p class="sum-price">
+ <span class="title">总价</span>
+ ￥{{price}}
+ </p>
+ <p class="activity-price">
+ <span class="title">
+ 活动价
+ <i class="minus">-</i>
+ </span>
+ ￥{{activityPrice}}
+ </p>
+ </div>
+
+ <div class="balance">
+ <span class="iconfont icon-cb-checked"></span>
+ <p>
+ <span>
+ {{count}}件总计:￥{{sumPrice}}
+ </span>
+ <span class="tip">(不含运费)</span>
+ </p>
+ <button class="btn-balance">
+ 结算
+ </button>
+ </div>
+ {{/ shoppingCart}}
+</div>
+{{> layout/footer}}
\ No newline at end of file
diff --git a/template/m.yohobuy.com/partials/layout/use.phtml b/template/m.yohobuy.com/partials/layout/use.phtml
index fcd7fb0..3024259 100644
--- a/template/m.yohobuy.com/partials/layout/use.phtml
+++ b/template/m.yohobuy.com/partials/layout/use.phtml
@@ -129,4 +129,11 @@
<script>
seajs.use('js/index/search');
</script>
+{{/if}}
+
+{{!-- 购物车 --}}
+{{#if shoppingCartPage}}
+ <script>
+ seajs.use('js/shopping-cart/index');
+ </script>
{{/if}}
\ No newline at end of file
diff --git a/template/m.yohobuy.com/partials/shopping-cart/good.phtml b/template/m.yohobuy.com/partials/shopping-cart/good.phtml
new file mode 100644
index 0000000..be9d972
--- /dev/null
+++ b/template/m.yohobuy.com/partials/shopping-cart/good.phtml
@@ -0,0 +1,60 @@
+<div class="shopping-cart-good clearfix">
+ <span class="checkbox icon-cb-checked iconfont"></span>
+ <div class="info">
+ <img class="thumb lazy" data-original={{thumb}}>
+ <div class="deps">
+ <p class="name row">{{name}}</p>
+ <p class="row">
+ {{#if color}}
+ <span class="color">
+ 颜色:{{color}}
+ </span>
+ {{/if}}
+
+ {{#if size}}
+ <span class="size">
+ 尺码:{{size}}
+ </span>
+ {{/if}}
+
+ {{#if appearDate}}
+ <span class="appear-date">
+ 上市期:{{appearDate}}
+ </span>
+ {{/if}}
+ </p>
+ <p class="row">
+ <span class="price">
+ ￥{{price}}
+ </span>
+ <span class="count">
+ ×{{count}}
+ </span>
+ {{#if soldOut}}
+ <span class="sold-out">
+ 已售罄
+ </span>
+ {{/if}}
+
+ {{#if lowStocks}}
+ <span class="low-stocks">
+ 库存不足
+ </span>
+ {{/if}}
+
+ <span class="iconfont icon-edit"></span>
+ <span class="iconfont icon-del"></span>
+ </p>
+ </div>
+ </div>
+ <div class="opt-panel">
+ <div class="put-in-favorite">
+ <span class="iconfont icon-yoho-like"></span>
+ 移入收藏夹
+ </div>
+ <div class="del">
+ <span class="iconfont icon-close"></span>
+ 删除
+ </div>
+ </div>
+</div>
\ No newline at end of file
diff --git a/yohobuy/m.yohobuy.com/application/controllers/ShoppingCart.php b/yohobuy/m.yohobuy.com/application/controllers/ShoppingCart.php
new file mode 100644
index 0000000..08a74d8
--- /dev/null
+++ b/yohobuy/m.yohobuy.com/application/controllers/ShoppingCart.php
@@ -0,0 +1,55 @@
+<?php
+
+use Action\AbstractAction;
+
+/**
+ * 购物车
+ */
+class ShoppingCartController extends AbstractAction
+{
+ public function indexAction()
+ {
+ $data = array(
+ 'cartNav' => true,
+ 'commonGoodsCount' => 2,
+ 'presellGoodsCount' => 2,
+ 'goods' => array(
+ array(
+ 'name' => '黄伟文Wyman X y yohood 联名商品YYYOHOOD圆领卫衣',
+ 'thumb' => 'http://img11.static.yhbimg.com/goodsimg/2015/09/17/03/014cacfa5c458b9732c68adf1af15d7a45.jpg?imageMogr2/thumbnail/120x120/extent/120x120/background/d2hpdGU=/position/center/quality/90',
+ 'color' => '黄色',
+ 'size' => 'F',
+ 'appearDate' => '12月',
+ 'price' => 399.00,
+ 'count' => 8,
+ 'lowStocks' => true
+ ),
+ array(
+ 'name' => 'TYAKSHA圣诞树凭借三角领蓝色白条毛衣',
+ 'thumb' => 'http://img11.static.yhbimg.com/goodsimg/2015/10/03/10/01bc1878f9154e77ac4f7a6003c954f1b8.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
+ 'color' => '黄色',
+ 'size' => 'F',
+ 'price' => 553.00,
+ 'count' => 1,
+ 'soldOut' => true
+ )
+ ),
+ 'freebieOrAdvanceBuy' => true,
+ 'freebie' => array(
+ 'url' => '',
+ 'count' => 2
+ ),
+ 'advanceBuy' => array(
+ 'url' => '',
+ 'count' => 3
+ ),
+ 'price' => 3192,
+ 'activityPrice' => 0,
+ 'count' => 8,
+ 'sumPrice' => 3192
+ );
+ // 渲染模板
+ $this->_view->display('index', array('shoppingCartPage' => true, 'pageHeader' => array(
+ 'navBack' => 'http://m.yohobuy.com', 'navTitle' => '购物车'), 'shoppingCart' => $data));
+ }
+}