Merge remote-tracking branch 'origin/feature/detailFix' into feature/hf

@@ -106,6 +106,20 @@ function rePosFooter() {
     }
 }
 
+/**
+ *
+ * add extra margin-bottom for footer to show yoho copyright when there is fixed bottom element on page
+ * @param {String} The jquery selecor of the fixed bottom element
+ * @return undefined
+ */
+function reMarginFooter(fixedElement) {
+    var fixedElH = $(fixedElement).outerHeight();
+
+    if (fixedElement) {
+        $footer.css('margin-bottom', fixedElH + 'px');
+    }
+}
+
 //页面通用底部位置及status设置
 (function() {
     var $op = $footer.children('.op-row');
@@ -213,3 +227,5 @@ window.getUid = getUid;
 window.getShoppingKey = getShoppingKey;
 
 window.rePosFooter = rePosFooter;
+
+window.reMarginFooter = reMarginFooter;

@@ -69,7 +69,7 @@ $('.overlay').on('touchstart', function(e) {
 });
 
 //点击一级导航，弹出二级导航
-$sideNav.on('touchstart', 'li', function (e) {
+$sideNav.on('touchstart', 'li', function(e) {
     if ($(this).find('.sub-nav').size() > 0) {
         $('.sub-nav').removeClass('show');
         $(this).find('.sub-nav').addClass('show');
@@ -82,8 +82,8 @@ $sideNav.on('touchstart', 'li', function (e) {
 });
 
 //返回一级导航，收起二级导航
-$subNav.each(function () {
-    $(this).find('li').eq(0).on('touchstart', function (e) {
+$subNav.each(function() {
+    $(this).find('li').eq(0).on('touchstart', function(e) {
         $('.sub-nav').removeClass('show');
         e.stopPropagation();
         return false;
@@ -145,7 +145,7 @@ if ($('.trend-topic-swiper').find('li').size() > 1) {
 }
 
 //潮流上装/经典裤装等轮播
-$('.category-swiper').each(function (i, index) {
+$('.category-swiper').each(function(i, index) {
     swiperClass = 'category-swiper' + i;
     $(this).addClass(swiperClass);
     if ($('.' + swiperClass).find('.swiper-slide').size() > 1) {
@@ -161,7 +161,7 @@ $('.category-swiper').each(function (i, index) {
 });
 
 //logo动画
-requestFrame = (function () {
+requestFrame = (function() {
     var tempFunc = null,
         prefixList = ['webkit', 'moz', 'ms'];
 
@@ -174,11 +174,11 @@ requestFrame = (function () {
     }
 
     if (supportCss3) {
-        return function (callback) {
+        return function(callback) {
             window[tempFunc](callback);
         };
     }
-    return function (callback) {
+    return function(callback) {
         window.setTimeout(callback, 67);
     };
 })();
@@ -205,7 +205,7 @@ function tsAnimate() {
         if (start % 360 === 0) {
             window.setTimeout(tsAnimate, 60 * 1000);
         } else {
-            requestFrame(function () {
+            requestFrame(function() {
                 tsAnimate();
             });
         }
@@ -221,9 +221,7 @@ $('.home-header .iconfont').on('touchstart', function() {
 });
 
 // 底部留出tab 的高度
-$('#yoho-footer').css({
-    'margin-bottom': '2.5rem'
-});
+window.reMarginFooter('.footer-tab');
 
 //set cookie
 exports.set = function(c) {
@@ -231,4 +229,4 @@ exports.set = function(c) {
         expires: 365,
         domain: '.m.yohobuy.com'
     });
-};
\ No newline at end of file
+};

+/**
+ * 物流信息页面
+ * @author: 赵彪<bill.zhao@yoho.cn>
+ * @date: 2015/12/02
+ */
+
+var $ = require('jquery'),
+    $footer = $('#yoho-footer');
+
+var winH = window.outerHeight,
+    bodyH = document.body.offsetHeight,
+    footH = $footer.height();
+
+function addFooterTopBorder() {
+    if (footH + bodyH > winH) {
+        window.rePosFooter();
+    }else{
+        $footer.css('border-top', '1px solid #f1f1f1');
+    }
+}
+
+$(document).ready(addFooterTopBorder);
+
+
+
+
+
+
+

@@ -15,7 +15,8 @@ var goodsSwiper,
 require('./desc');
 require('./comments-consults');
 
-
+//add extra marign-bottom for footer to show the yoho copyright
+window.reMarginFooter('.cart-bar');
 
 lazyLoad($('img.lazy'));
 
@@ -46,4 +47,4 @@ $('.goodsDiscount .dropdown').on('click', function() {
         $discountFolder.slideUp();
     }
 });
-require('./like');
\ No newline at end of file
+require('./like');

+$logistic_gray: #f0f0f0;
+$border_color_strong: #e3e3e3;
+$border_color_light: #eee;
+
+@mixin set-singleBorder($side, $c) {
+  border-#{$side}: 1px solid $c;
+}
+
+.logistic-page {
+  background-color: $logistic_gray;
+
+  @include set-singleBorder("bottom", $border_color_light);
+
+  .overview {
+    height: 120rem / $pxConvertRem;
+    line-height: 120rem / $pxConvertRem;
+    width: 100%;
+    margin-bottom: 40rem / $pxConvertRem;
+    background-color: #fff;
+    color: #464646;
+
+    @include set-singleBorder("bottom", $border_color_strong);
+
+    .left {
+      width: 19%;
+      float: left;
+      text-align: center;
+      height: 100%;
+
+      .icon {
+        width: 88rem / $pxConvertRem;
+        height: 88rem / $pxConvertRem;
+        margin: 0 auto;
+        background-size: 100%;
+        background-repeat: no-repeat;
+        background-position: center;
+        margin-top: 16rem / $pxConvertRem;
+      }
+    }
+
+    .right {
+      width: 81%;
+      float: left;
+      padding-top: 20rem / $pxConvertRem;
+      padding-bottom: 20rem / $pxConvertRem;
+      height: 80rem / $pxConvertRem;
+
+      div {
+        height: 40rem / $pxConvertRem;
+        line-height: 44rem / $pxConvertRem;
+        color: #595959;
+        font-size: 24rem / $pxConvertRem;
+      }
+    }
+
+    .info {
+      padding-right: 4rem / $pxConvertRem;
+    }
+  }
+
+  .title {
+    height: 112rem / $pxConvertRem;
+    line-height: 112rem / $pxConvertRem;
+    background-color: #fff;
+    padding-left: 40rem / $pxConvertRem;
+    font-size: 40rem / $pxConvertRem;
+    color: #4f4f4f;
+
+    @include set-singleBorder("top", $border_color_strong);
+
+    @include set-singleBorder("bottom", $border_color_light);
+  }
+
+  .detail {
+    background-color: #fff;
+    padding-left: 80rem / $pxConvertRem;
+  }
+
+  .timeline-box {
+    @include set-singleBorder("left", $border_color_strong);
+
+    position: relative;
+    padding-left: 52rem / $pxConvertRem;
+  }
+
+  .timeline-node {
+    position: absolute;
+    top: 32rem / $pxConvertRem;
+    left: -9.04444rem / $pxConvertRem;
+    display: inline-block;
+    width: 16.4rem / $pxConvertRem;
+    height: 16.4rem / $pxConvertRem;
+    background-color: $border_color_strong;
+    border-radius: 100%;
+  }
+
+  .timeline-box:first-child {
+    .timeline-node {
+      background-color: #989898;
+    }
+
+    .timeline-info-row {
+      color: #606060;
+    }
+  }
+
+  .timeline-info {
+    padding: (20rem / $pxConvertRem) 0;
+
+    @include set-singleBorder("bottom", $border_color_light);
+  }
+
+  .timeline-box:last-child {
+    .timeline-info {
+      border: none;
+    }
+  }
+
+  .timeline-info-row {
+    min-height: 40rem / $pxConvertRem;
+    line-height: 40rem / $pxConvertRem;
+    font-size: 28rem / $pxConvertRem;
+    color: #bababa;
+    padding-right: 32rem / $pxConvertRem;
+  }
+}

@@ -48,18 +48,34 @@
                 // width: 100%;
                 // border-bottom:1px solid $borderC;
                 img {
-                    position:absolute; 
-                    top:0; 
-                    bottom:0; 
-                    left:0; 
+                    position:absolute;
+                    top:0;
+                    bottom:0;
+                    left:0;
                     margin:auto;
-                    width: pxToRem(90px);
+                    //width: pxToRem(90px);
                     height: auto;
                     padding-right: pxToRem(20px);
                 }
+                .material-image {
+                    display: inline-block;
+                    width: 23%;
+                    min-height: pxToRem(136px);
+                    float: left;
+                    //background-size: 100%;
+                    background-position-x: center;
+                    background-repeat: no-repeat;
+                }
                 .material-desc {
-                    padding-left:pxToRem(120px);
+                    //padding-left:pxToRem(120px);
                     font-size: pxToRem(24px);
+                    text-align: left;
+                    display: inline-block;
+                    width: 75%;
+                    padding-left: 2%;
+                    height: auto;
+                    line-height: pxToRem(40px);
+                    color: #4b4b4b;
                 }
                 &:last-child{
                     border-bottom: none;
@@ -68,13 +84,13 @@
         }
     }
     .wash-tips{
-        padding-top:pxToRem(18px); 
+        padding-top:pxToRem(18px);
         &.page-block{
             // border-top: 0px;
             padding-left: pxToRem(15px);
             padding-right: pxToRem(15px);
         }
-        // padding-bottom:pxToRem(18px); 
+        // padding-bottom:pxToRem(18px);
             .tip{
             display: inline-block;
             width: 16.6%;
@@ -83,7 +99,7 @@
             img{
                 width: pxToRem(48px);
                 height: pxToRem(48px);
-                margin-bottom: pxToRem(10px); 
+                margin-bottom: pxToRem(10px);
             }
             .caption{
                 display: block;
@@ -93,7 +109,7 @@
                 margin-bottom: pxToRem(18px);
             }
         }
-        
+
     }
     .product-detail {
         .detail {
@@ -150,4 +166,4 @@
             }
         }
     }
-}
\ No newline at end of file
+}

+{{> layout/header}}
+<div class="logistic-page yoho-page">
+    <div class="overview">
+        <div class="left" >
+            <div class="icon" style='background-image:url("{{logisticImg}}")'> </div>
+        </div>
+
+        <div class="right">
+            <div>
+               <span class='info'>物流公司:</span>
+               <span >{{logisticCompany}}</span>
+            </div>
+            <div>
+               <span class='info'>快递单号:</span>
+               <span>{{logisticNumber}}</span>
+            </div>
+        </div>
+
+    </div>
+
+    <div class="title">
+       <span>物流详情</span>
+    </div>
+
+    <div class="detail">
+       {{# logisticDetail}}
+       <div class="timeline-box ">
+            <span class="timeline-node"></span>
+            <div class="timeline-info">
+                <div class="timeline-info-row">
+                  {{ city}}&nbsp;&nbsp;&nbsp;{{ status}}
+                </div>
+                <div class="timeline-info-row">
+                  {{date}}
+                </div>
+            </div>
+       </div>
+       {{/ logisticDetail}}
+    </div>
+</div>
+{{> layout/footer}}

@@ -275,4 +275,4 @@
 <script>
     seajs.use('js/me/browse-record');
 </script>
-{{/if}}
\ No newline at end of file
+{{/if}}

@@ -69,10 +69,10 @@
                 {{#list}}
                 {{#if @first}}
                 <div class="swiper-slide first-group" >
-                     {{#params}}          
+                     {{#params}}
                         {{#if @first}}
-                        {{else}}                         
-                              <img class="avatar lazy" data-original="{{param}}" alt=""> 
+                        {{else}}
+                              <img class="avatar lazy" data-original="{{param}}" alt="">
                         {{/if}}
                      {{/params}}
                 </div>
@@ -101,10 +101,14 @@
     <div class="detail">
         {{#list}}
         <div class="material-item">
-            <img class="lazy" data-original="{{img}}" alt="">
+           <!-- <img class="lazy" data-original="{{img}}" alt="">
             <p class="material-desc">
                 {{desc}}
-            </p>
+            </p>-->
+            <div class="material-image" style="background-image:url({{img}})"></div>
+            <div class="material-desc">
+                    {{desc}}
+            </div>
         </div>
         {{/list}}
     </div>
@@ -137,4 +141,4 @@
         {{/list}}
     </div>
 </div>
-{{/productDetail}}
\ No newline at end of file
+{{/productDetail}}