Merge branch 'feature/consultUpdate' into 'feature/wap323'

购买咨询页面更新。code review by 张振

1.加入点赞／喜欢功能
2.查看更多功能优化。
code review by 张振

See merge request !92

@@ -9,11 +9,18 @@ var $ = require('jquery'),
 
 
 var commentsNum,consultsNum;
 var commentsNum,consultsNum;
 
 
-var navtabEle = document.getElementById('nav-tab'),
+var consultFooterEle = $('.consult-content-footer')[0],
+    consultFooterHammer = consultFooterEle && new Hammer(consultFooterEle),
+
+    navtabEle = document.getElementById('nav-tab'),
     navtabHammer = navtabEle && new Hammer(navtabEle),
     navtabHammer = navtabEle && new Hammer(navtabEle),
 
 
     gotoConsultEle = document.getElementById('goto-consult'),
     gotoConsultEle = document.getElementById('goto-consult'),
-    gotoConsultHammer = gotoConsultEle && new Hammer(gotoConsultEle);
+    gotoConsultHammer = gotoConsultEle && new Hammer(gotoConsultEle),
+
+    readmore = document.getElementById('readmore'),
+    readmoreHammer = readmore && new Hammer(readmore);
+
 
 
 
 
 (function() {
 (function() {
@@ -63,6 +70,12 @@ if (navtabHammer) {
     });
     });
 }
 }
 
 
+if (consultFooterHammer) {
+    consultFooterHammer.on('tap', function() {
+        location.href = $(consultFooterEle).data('href');
+    });
+}
+
 if (gotoConsultHammer) {
 if (gotoConsultHammer) {
     gotoConsultHammer.on('tap', function() {
     gotoConsultHammer.on('tap', function() {
         location.href = $(gotoConsultEle).find('a').attr('href');
         location.href = $(gotoConsultEle).find('a').attr('href');
@@ -74,3 +87,16 @@ if ($('.goods-consults-page').length > 0) {
     $('#yoho-header').css('position', 'fixed').css('top', '0');
     $('#yoho-header').css('position', 'fixed').css('top', '0');
 }
 }
 
 
+if ($('.goods-consults-page').length > 0) {
+    $('#yoho-footer').css('border-top', '1px solid #e0e0e0');
+}
+
+if (readmoreHammer) {
+    readmoreHammer.on('tap', function() {
+        $('.readmore').hide();
+        $('.goods-consults .consult-item').show();
+        return false;
+    });
+}
+
+require('./fav');

+/**
+ *  商品详情咨询页  --点赞和帮助功能
+ * @author: Lynnic
+ * @date: 2015/12/09
+ */
+
+ var $ = require('jquery'),
+     Hammer = require('yoho.hammer'),
+     tip = require('../../plugin/tip');
+
+var goodsConsultsEle = $('#goods-consults')[0],
+    goodsConsultsHammer = goodsConsultsEle && new Hammer(goodsConsultsEle);
+
+function showCountPlus($el) {
+    var $count = $el.find('.animate-count');
+
+    $count.css('display', 'inline');
+    $count.animate({
+        opacity: 0.25,
+        fontSize: '0.7rem',
+        right: '-=5'
+    }, 300, function() {
+        $count.css('display', 'none');
+    });
+}
+
+if (goodsConsultsHammer) {
+
+    goodsConsultsHammer.on('tap', function(e) {
+
+        var $this = $(e.target).closest('li'),
+            id = $this.closest('.consult-item').data('id'),
+            count = $this.find('.count').html() - 0,
+            url;
+
+        if (!$this.hasClass('highlight')) {
+
+            if ($this.hasClass('fav')) {
+                url = '/product/detail/consultupvote';
+            } else if ($this.hasClass('useful')) {
+                url = '/product/detail/consultuseful';
+            }
+
+            $.ajax({
+                method: 'post',
+                url: url,
+                data: {
+                    id: id
+                }
+            }).done(function(data) {
+                if (data.code === 200) {
+                    showCountPlus($this);
+                    $this.addClass('highlight');
+                    $this.find('.count').html(count + 1);
+                } else if (data.code === 401) {
+                    location.href = data.data;//未登录跳转登录页
+                }
+            }).fail(function(data) {
+                tip.show('网络断开连接了~');
+            });
+
+        }
+    });
+}

@@ -55,6 +55,7 @@
         height: pxToRem(120px);
         height: pxToRem(120px);
         background-color: #ffffff;
         background-color: #ffffff;
         border-bottom: 1px solid $borderC;
         border-bottom: 1px solid $borderC;
+        z-index: 10;
         i,
         i,
         span,
         span,
         a {
         a {
@@ -73,12 +74,20 @@
     .goods-consults {
     .goods-consults {
         margin-top: 5.25rem;
         margin-top: 5.25rem;
         overflow: hidden;
         overflow: hidden;
+        .consult-item:nth-child(1) {
+            display: block;
+        }
+        .consult-item:nth-child(2) {
+            display: block;
+        }
+
         .consult-item {
         .consult-item {
             margin-top: pxToRem(30px);
             margin-top: pxToRem(30px);
             padding: pxToRem(20px) pxToRem(28px);
             padding: pxToRem(20px) pxToRem(28px);
             background-color: #fff;
             background-color: #fff;
             border-bottom: 1px solid $borderC;
             border-bottom: 1px solid $borderC;
             border-top: 1px solid $borderC;
             border-top: 1px solid $borderC;
+            display:none;
             .question {
             .question {
                 font-size: pxToRem(24px);
                 font-size: pxToRem(24px);
                 color: $mainFontC;
                 color: $mainFontC;
@@ -114,6 +123,84 @@
                     overflow: hidden;
                     overflow: hidden;
                 }
                 }
             }
             }
+            .operation {
+                width: 120%;
+                height: pxToRem(60px);
+                line-height: pxToRem(80px);
+                position: relative;
+                right: 12%;
+                border-top: 1px solid #e0e0e0;
+                margin-top: pxToRem(20px);
+
+                li{
+                    &.highlight{
+                        color: $basicBtnC;
+                    }
+                    font-size:pxToRem(28px);
+                    float:left;
+                    width: 50%;
+                    text-align: center;
+                    color:$subFontC;
+                    .iconfont{
+                        display: inline-block;
+                        padding-right: 5px;
+                        font-size: inherit;
+                    }
+                    position: relative;
+                    .animate-count {
+                        display: none;
+                        position: absolute;
+                        top: 0;
+                        font-size: pxToRem(20px);
+                        z-index: 5;
+                    }
+                    i.count {
+                        position: absolute;
+                    }
+                }
+                li.fav {
+                    .animate-count {
+                        right: 65px;
+                    }
+                }
+
+                li.useful {
+                    .animate-count {
+                        right: 57px;
+                    }
+                }
+            }
+
+
+        }
+    }
+    .readmore{
+        display: block;
+        height: pxToRem(88px);
+        line-height: pxToRem(88px);
+        background-color: #fff;
+        text-align: center;
+        color: $subFontC;
+        margin-top: pxToRem(30px);
+        border-top: 1px solid $borderC;
+        border-bottom: 1px solid $borderC;
+        font-size: pxToRem(28px);
+        i{
+            font-size: inherit;
+        }
+    }
+    .faq-title{
+        height: pxToRem(88px);
+        line-height: pxToRem(88px);
+        text-align: center;
+        font-size: pxToRem(32px);
+    }
+    .goods-consults .faq-item{
+        @extend .consult-item;
+        margin-top: 0;
+        margin-bottom: pxToRem(30px);
+        .answer{
+            border-bottom: none;
         }
         }
     }
     }
     // .gap-block {
     // .gap-block {
@@ -174,6 +261,9 @@
             &.focus {
             &.focus {
                 color: #000;
                 color: #000;
             }
             }
+                .comments-num {
+                    display: none;
+                }
         }
         }
         .comment-nav {
         .comment-nav {
             border-right: 1px solid #ccc;
             border-right: 1px solid #ccc;

@@ -8,7 +8,7 @@
          {{# consults}}
          {{# consults}}
         <div class="goods-consults" id="goods-consults">
         <div class="goods-consults" id="goods-consults">
             {{#list}}
             {{#list}}
-             <div class="consult-item">
+            <div class="consult-item" data-id="{{id}}">
                <div class="question">
                <div class="question">
                    <span class="iconfont">&#xe639;</span>
                    <span class="iconfont">&#xe639;</span>
                    <p>
                    <p>
@@ -21,10 +21,57 @@
                        <span class="iconfont">&#xe63f;</span>
                        <span class="iconfont">&#xe63f;</span>
                        <p>{{answer}}</p>
                        <p>{{answer}}</p>
                </div>
                </div>
+
+               <ul class="operation">
+                   <li class="fav {{#if isLike}}highlight{{/if}}">
+                       <i class="iconfont ">&#xe601;</i>
+                       赞
+                       <i class="count">{{#if like}}{{like}}{{/if}}</i>
+                       <span class="animate-count">+1</span>
+                   </li>
+
+                   <li class="useful {{#if isUseful}}highlight{{/if}}">
+                       <i class="iconfont ">&#xe605;</i>
+                       有用
+                       <i class="count">{{#if useful}}{{useful}}{{/if}}</i>
+                       <span class="animate-count">+1</span>
+                   </li>
+               </ul>
+
             </div>
             </div>
             {{/list}}
             {{/list}}
         </div>
         </div>
         {{/ consults}}
         {{/ consults}}
 
 
+        {{#showReadMore}}
+        <a href="javascript:;" id="readmore" class="readmore tap-hightlight" >查看更多 <i class="iconfont">&#xe604;</i></a>
+        {{/showReadMore}}
+
+        {{#faq}}
+        <h1 class="faq-title">
+          常见问题
+        </h1>
+        {{/faq}}
+
+         {{#faq}}
+         <div class="goods-consults" style="margin-top:0">
+          {{#list}}
+          <div class="faq-item">
+              <div class="question">
+                            <span class="iconfont">&#xe639;</span>
+                            <p>
+                                {{question}}
+                            </p>
+                    </div>
+
+                    <div class="answer">
+                            <span class="iconfont">&#xe63f;</span>
+                            <p>{{answer}}</p>
+                    </div>
+          </div>
+          {{/list}}
+        </div>
+        {{/faq}}
+
 </div>
 </div>
 {{> layout/footer}}
 {{> layout/footer}}

@@ -150,12 +150,14 @@ class DetailController extends AbstractAction
         }
         }
         $this->setTitle('购买咨询');
         $this->setTitle('购买咨询');
 
 
+        $consults = \Product\DetailModel::getConsults($productId);
         $data = array(
         $data = array(
             'goodsConsultsPage' => true,
             'goodsConsultsPage' => true,
             'pageFooter' => true,
             'pageFooter' => true,
             'consults' => array(
             'consults' => array(
-                'list' => \Product\DetailModel::getConsults($productId),
+                'list' => $consults
             ),
             ),
+            'showReadMore' => count($consults) > 2,
             'link' => Helpers::url('/product/detail/consultform', array('product_id' => $productId)),
             'link' => Helpers::url('/product/detail/consultform', array('product_id' => $productId)),
         );
         );