Authored by biao

咨询页面增加点赞/有用功能。 code review by Zhang Zhen

... ... @@ -11,30 +11,17 @@
var goodsConsultsEle = $('#goods-consults')[0],
goodsConsultsHammer = goodsConsultsEle && new Hammer(goodsConsultsEle);
// $favBtn.on('click', function() {
// var id = $(this).closest('.consult-item').data('id'),
// $that = $(this),
// count = $that.find('.count').html() - 0;
// if (!$(this).hasClass('highlight')) {
// $.ajax({
// method: 'post',
// url: '/home/upxxDown',
// data: {
// consult_id: id
// }
// }).done(function(data) {
// if (data.code === 200) {
// $that.addClass('highlight');
// $that.find('.count').html(count+1);
// } else if (data.code === 400) {
// location.href = data.data;//未登录跳转登录页
// }
// }).fail(function(data) {
// $that.addClass('highlight');
// $that.find('.count').html(count+1);
// });
// }
// });
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) {
... ... @@ -48,22 +35,23 @@ if (goodsConsultsHammer) {
if (!$this.hasClass('highlight')) {
if ($this.hasClass('fav')) {
url = '/product/opt/fav';
} else if ($this.hasClass('usefull')) {
url = '/product/opt/usefull';
url = '/product/detail/consultupvote';
} else if ($this.hasClass('useful')) {
url = '/product/detail/consultuseful';
}
$.ajax({
method: 'post',
url: url,
data: {
consult_id: id
id: id
}
}).done(function(data) {
if (data.code === 200) {
showCountPlus($this);
$this.addClass('highlight');
$this.find('.count').html(count + 1);
} else if (data.code === 400) {
} else if (data.code === 401) {
location.href = data.data;//未登录跳转登录页
}
}).fail(function(data) {
... ...
... ... @@ -55,6 +55,7 @@
height: pxToRem(120px);
background-color: #ffffff;
border-bottom: 1px solid $borderC;
z-index: 10;
i,
span,
a {
... ... @@ -137,8 +138,32 @@
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{
... ...
... ... @@ -8,7 +8,7 @@
{{# consults}}
<div class="goods-consults" id="goods-consults">
{{#list}}
<div class="consult-item" data-id="{{consult-id}}">
<div class="consult-item" data-id="{{id}}">
<div class="question">
<span class="iconfont">&#xe639;</span>
<p>
... ... @@ -23,21 +23,22 @@
</div>
<ul class="operation">
<li class="fav {{#if fav}}highlight{{/if}}">
<li class="fav {{#if isLike}}highlight{{/if}}">
<i class="iconfont ">&#xe601;</i>
<i class="count">{{#if favNum}}{{favNum}}{{/if}}</i>
<i class="count">{{#if like}}{{like}}{{/if}}</i>
<span class="animate-count">+1</span>
</li>
<li class="usefull {{#if usefull}}highlight{{/if}}">
<li class="useful {{#if isUseful}}highlight{{/if}}">
<i class="iconfont ">&#xe605;</i>
有用
<i class="count">{{#if usefullNum}}{{usefullNum}}{{/if}}</i>
<i class="count">{{#if useful}}{{useful}}{{/if}}</i>
<span class="animate-count">+1</span>
</li>
</ul>
</div>
{{/list}}
</div>
{{/ consults}}
... ...