Merge branch 'develop' of git.dev.yoho.cn:web/yohobuy into develop

@@ -64,7 +64,7 @@
     {
         pageHeader: {
             //对应页面有就传，没有就不传
-            navBack: '',
+            navBack: true,
             navTitle: '',
             navHome: ''
         }

@@ -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 Wed Oct 21 18:23:04 2015
+Created by FontForge 20120731 at Wed Oct 21 19:30:11 2015
  By Ads
 </metadata>
 <defs>
@@ -19,7 +19,7 @@ Created by FontForge 20120731 at Wed Oct 21 18:23:04 2015
     bbox="0 -224 3943 812.871"
     underline-thickness="50"
     underline-position="-100"
-    unicode-range="U+0078-E623"
+    unicode-range="U+0078-E625"
   />
 <missing-glyph horiz-adv-x="374" 
 d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
@@ -142,5 +142,9 @@ d="M586 588q-64 150 -188 203q-114 47 -222 -7q-112 -56 -155 -192q-20 -67 -21 -144
 t57 38t55 43t47 48t39 56.5t25 66.5t8.5 78.5q0 75 -19.5 138t-52.5 105.5t-76.5 70.5t-91 37.5t-98 1t-96 -34.5t-85.5 -72.5t-67 -108.5z" />
     <glyph glyph-name="uniE623" unicode="&#xe623;" 
 d="M835 576l-60 63l-263 -275v0l-263 275l-60 -63l262 -276l-262 -276l60 -63l263 275v0l263 -275l60 63l-262 276z" />
+    <glyph glyph-name="uniE624" unicode="&#xe624;" horiz-adv-x="1000" 
+d="M459 754h22h23h20h22h22v-191v-191h191h191v-109h-191h-191v-191v-190h-109v190v191h-191h-190q-1 37 -1 109h128h127h127v116v150v116z" />
+    <glyph glyph-name="uniE625" unicode="&#xe625;" horiz-adv-x="1000" 
+d="M77 372h873v-109h-873v109z" />
   </font>
 </defs></svg>

+/**
+ * 购物车选择尺寸、颜色和数量面板
+ * @author: xuqi<qi.xu@yoho.cn>
+ * @date: 2015/10/21
+ */
+
+var $ = require('yoho.zepto');
+var Handlebars = require('yoho.handlebars');
+
+var $page = $('.yoho-page');
+
+var tpl;
+
+//读取partials
+$.ajax({
+    type: 'GET',
+    url: '/shoppingCart/tpl',
+    success: function(data) {
+        tpl = Handlebars.compile(data);
+    }
+});
+
+//显示
+function show(data) {
+    var html = tpl(data);
+
+    $page.append(html);
+}
+
+exports.show = show;
\ No newline at end of file

@@ -8,6 +8,8 @@ var $ = require('yoho.zepto'),
     ellipsis = require('mlellipsis'),
     lazyLoad = require('yoho.zeptolazyload');
 
+var chosePanel = require('./chose-panel');
+
 ellipsis.init();
 
 lazyLoad($('.lazy'));
@@ -24,3 +26,21 @@ $('.checkbox').bind('touchstart', function() {
         $this.removeClass('icon-checkbox').addClass('icon-cb-checked');
     }
 });
+
+$('.icon-edit').bind('touchstart', function() {
+    var id = $(this).closest('.shopping-cart-good').data('id');
+
+    $.ajax({
+        type: 'GET',
+        url: '/shoppingCart/goodinfo',
+        data: {
+            id: id
+        },
+        success: function(data) {
+            if (data.code === 200) {
+                chosePanel.show(data.data);
+            }
+        }
+    });
+});
+

@@ -22,7 +22,8 @@
       "yoho.iswiper": "3.0.1",
       "iscroll": "5.1.2",
       "import-style": "1.0.0",
-      "yoho.zeptolazyload": "0.0.1"
+      "yoho.zeptolazyload": "0.0.1",
+      "yoho.handlebars": "3.0.3"
     },
     "devDependencies": {
       "expect.js": "0.3.1"

+.chose-panel {
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    background: rgba(0,0,0,.3);
+
+    .main {
+        position: absolute;
+        height: 718rem / $pxConvertRem;
+        bottom: 0;
+        left: 0;
+        right: 0;
+        background: #fff;
+    }
+
+    .infos {
+        height: 546rem / $pxConvertRem;
+        padding: 30rem / $pxConvertRem 22rem / $pxConvertRem 20rem / $pxConvertRem;
+    }
+
+    .basic-info {
+        margin-bottom: 30rem / $pxConvertRem;
+    }
+
+    .thumb {
+        float: left;
+        width: 80rem / $pxConvertRem;
+        height: 106rem / $pxConvertRem;
+    }
+
+    .text-info {
+        margin-left: 102rem / $pxConvertRem;
+
+        .name {
+            font-size: 28rem / $pxConvertRem;
+        }
+
+        .sale-price {
+            color: #e10;
+
+            &.no-price {
+                color: #000;
+            }
+        }
+
+        .market-price {
+            color: #b0b0b0;
+            text-decoration: line-through;
+        }
+    }
+
+    .color-list, .size-list, .num {
+        position: relative;
+        font-size: 28rem / $pxConvertRem;
+        padding-left: 80rem / $pxConvertRem;
+
+        > span {
+            position: absolute;
+            left: 0;
+            top: 20rem / $pxConvertRem;
+        }
+    }
+
+    .block {
+        float: left;
+        display: block;
+        width: 80rem / $pxConvertRem;
+        height: 80rem / $pxConvertRem;
+        border: 1px solid #000;
+        margin-right: 30rem / $pxConvertRem;
+        margin-bottom: 30rem / $pxConvertRem;
+        line-height: 80rem / $pxConvertRem;
+        text-align: center;
+
+        &.chosed {
+            border-color: #e10;
+            background: image-url('shopping-cart/right.png') no-repeat;
+            background-size: 38rem / $pxConvertRem;
+            background-position: bottom right;
+            color: #e10;
+        }
+    }
+
+    .num .btn {
+        float: left;
+        display: block;
+        height: 80rem / $pxConvertRem;
+        width: 80rem / $pxConvertRem;
+        text-align: center;
+        line-height: 80rem / $pxConvertRem;
+        border: 1px solid #e6e6e6;
+
+        &.disable {
+            color: #e6e6e6;
+        }
+    }
+
+    .good-num {
+        float: left;
+        width: 106rem / $pxConvertRem;
+        height: 80rem / $pxConvertRem;
+        line-height: 80rem / $pxConvertRem;
+        padding: 0;
+        border: none;
+        border-top: 1px solid #e6e6e6;
+        border-bottom: 1px solid #e6e6e6;
+        text-align: center;
+    }
+
+    .btn-wrap {
+        height: 80rem / $pxConvertRem;
+        border-top: 1px solid #e6e6e6;
+        padding: 21rem / $pxConvertRem;
+        text-align: center;
+
+        .btn-sure {
+            width: 260rem / $pxConvertRem;
+            height: 80rem / $pxConvertRem;
+            background: #e10;
+            color: #fff;
+            font-size: 32rem / $pxConvertRem;
+            border: none;
+        }
+    }
+}
\ No newline at end of file

-@import "good";
+@import "good", "chose-panel";
 
 
 .icon-checkbox:before { content: "\e61c"; }

+<div class="chose-panel">
+    <div class="main">
+        <div class="infos">
+            <div class="basic-info">
+                <img class="thumb" src={{thumb}}>
+                <div class="text-info">
+                    <p class="name">{{name}}</p>
+                    <p class="price">
+                        <span class="sale-price{{^price}} no-price{{/price}}">￥{{salePrice}}</span>
+                        {{#if price}}
+                            <span class="market-price">￥{{price}}</span>
+                        {{/if}}
+                    </p>
+                </div>
+            </div>
+            <div class="color-list">
+                <span>颜色</span>
+                <ul class="clearfix" data-type="color">
+                    {{# colors}}
+                        <li class="block {{#if chosed}}chosed{{/if}}" data-id={{id}}>
+                            {{name}}
+                        </li>
+                    {{/ colors}}
+                </ul>
+            </div>
+            <div class="size-list">
+                <span>尺码</span>
+                <ul class="clearfix" data-type="size">
+                    {{# sizes}}
+                        <li class="block {{#if chosed}}chosed{{/if}}" data-id={{id}}>
+                            {{name}}
+                        </li>
+                    {{/ sizes}}
+                </ul>
+            </div>
+            <div class="num">
+                <span>数量</span>
+                <div class="clearfix">
+                    <a class="btn btn-minus" href="javascript:void(0);">
+                        <span class="iconfont">&#xe625;</span>
+                    </a>
+                    <input id="good-num" class="good-num" type="text" value={{num}}>
+                    <a class="btn btn-plus" href="javascript:void(0);">
+                        <span class="iconfont">&#xe624;</span>
+                    </a>
+                </div>
+            </div>
+        </div>
+        <div class="btn-wrap">
+            <button id="chose-btn-sure" class="btn btn-sure">确定</button>
+        </div>
+    </div>
+</div>
\ No newline at end of file

-<div class="shopping-cart-good clearfix">
+<div class="shopping-cart-good clearfix" data-id={{id}}>
     <span class="checkbox icon-cb-checked iconfont"></span>
     <div class="info">
         <img class="thumb lazy" data-original={{thumb}}>

@@ -15,6 +15,7 @@ class ShoppingCartController extends AbstractAction
             'presellGoodsCount' => 2,
             'goods' => array(
                 array(
+                    'id' => 1,
                     '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' => '黄色',
@@ -25,6 +26,7 @@ class ShoppingCartController extends AbstractAction
                     'lowStocks' => true
                 ),
                 array(
+                    'id' => 2,
                     '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' => '黄色',
@@ -52,4 +54,69 @@ class ShoppingCartController extends AbstractAction
         $this->_view->display('index', array('shoppingCartPage' => true, 'pageHeader' => array(
             'navBack' => 'http://m.yohobuy.com', 'navTitle' => '购物车'), 'shoppingCart' => $data));
     }
+ 
+    /**
+     * 读取chose-panel内容
+     */
+    public function tplAction()
+    {
+        if($this->isAjax()) {
+            $data = file_get_contents('../../../template/m.yohobuy.com/partials/shopping-cart/chose-panel.phtml');
+
+            echo($data);
+        }
+    }
+
+    public function goodinfoAction()
+    {
+        if ($this->isAjax()) {
+            $data = array(
+                'thumb' => 'http://img11.static.yhbimg.com/goodsimg/2015/09/17/03/014cacfa5c458b9732c68adf1af15d7a45.jpg?imageMogr2/thumbnail/120x120/extent/120x120/background/d2hpdGU=/position/center/quality/90',
+                'name' => '黄伟文Wyman X y yohood 联名商品YYYOHOOD圆领卫衣',
+                'price' => 289,
+                'salePrice' => 241,
+                'colors' => array(
+                    array(
+                        'id' => 1,
+                        'name' => '黄色'
+                    ),
+                    array(
+                        'id' => 2,
+                        'chosed' => true,
+                        'name' => '白色'
+                    )
+                ),
+                'sizes' => array(
+                    array(
+                        'id' => 1,
+                        'name' => 'XS'
+                    ),
+                    array(
+                        'id' => 2,
+                        'name' => 'S'
+                    ),
+                    array(
+                        'id' => 3,
+                        'chosed' => true,
+                        'name' => 'M'
+                    ),
+                    array(
+                        'id' => 4,
+                        'name' => 'L'
+                    ),
+                    array(
+                        'id' => 5,
+                        'name' => 'XL'
+                    ),
+                    array(
+                        'id' => 6,
+                        'name' => 'XXL'
+                    )
+                ),
+                'num' => 1
+            );
+            
+            $this->echoJson(array('code' => 200, 'data' => $data));
+        }
+    }
 }