Authored by xuqi

good detail logic

{{> layout/header}}
<div class="product-detail-page yoho-page">
{{# detail}}
{{# banner}}
<div class="brand-banner" style="background:{{bgColor}}{{#if bgImg}} url({{bgImg}}){{/if}}">
<div class="center-content clearfix">
... ... @@ -25,7 +24,7 @@
{{> layout/path-nav}}
{{# goodInfo}}
<div class="main clearfix">
<div class="main clearfix" data-skn="{{skn}}">
<div class="pull-left imgs clearfix">
<div class="pull-left img">
<div class="tags clearfix">
... ... @@ -56,14 +55,26 @@
{{/ isFew}}
{{/ tags}}
</div>
<img class="img-show" src="{{img}}">
<img id="img-show" class="img-show" src="{{img}}">
</div>
<div class="pull-right thumbs">
{{# thumbs}}
<a href="{{url}}">
<img class="thumb" src="{{img}}">
</a>
{{/ thumbs}}
<div id="thumbs" class="pull-right thumbs">
{{# colors}}
<div class="thumb-wrap{{#unless focus}} hide{{/unless}}">
{{#if focus}}
{{# thumbs}}
<a href="{{url}}">
<img class="thumb" src="{{img}}" data-shower="{{shower}}">
</a>
{{/ thumbs}}
{{^}}
{{# thumbs}}
<a href="{{url}}">
<img class="thumb lazy" data-original="{{img}}" data-shower="{{shower}}">
</a>
{{/ thumbs}}
{{/if}}
</div>
{{/ colors}}
</div>
</div>
<div class="pull-right infos">
... ... @@ -99,83 +110,106 @@
</ul>
{{/if}}
<div class="chose-color row clearfix">
<span class="title pull-left">选颜色:</span>
<ul class="colors pull-left">
{{#each colors}}
<li class="{{#if focus}}focus{{/if}} {{#if disable}}disable{{/if}}" title="{{title}}">
<img src="{{src}}">
</li>
{{/each}}
</ul>
</div>
<div class="trade-content">
<div id="type-chose" class="type-chose">
<div class="chose-color row clearfix">
<span class="title pull-left">选颜色:</span>
<ul class="colors pull-left clearfix">
{{#each colors}}
<li class="{{#if focus}}focus{{/if}} {{#if disable}}disable{{/if}} pull-left" title="{{title}}">
<img src="{{src}}">
</li>
{{/each}}
</ul>
</div>
<div class="chose-size row clearfix">
<span class="title pull-left">选尺码:</span>
<div class="chose-size row clearfix">
<span class="title pull-left">选尺码:</span>
<div class="size-wrapper pull-left">
{{#each colors}}
<ul class="size {{#unless focus}}hide{{/unless}} clearfix">
{{#each size}}
<li {{#if disable}}class="disable"{{/if}} data-title="{{title}}" data-sku="{{sku}}">{{name}}</li>
<div id="sizes" class="size-wrapper pull-left clearfix">
{{#each colors}}
<ul class="size {{#unless focus}}hide{{/unless}} clearfix">
{{#each size}}
<li {{#unless num}}class="disable"{{/unless}} data-title="{{title}}" data-sku="{{sku}}" data-num="{{num}}">{{name}}</li>
{{/each}}
</ul>
{{/each}}
</ul>
{{/each}}
<span class="size-ruler"></span>
<span class="size-ruler"></span>
<span class="size-warn hide">
<i></i>
请选择尺码
</span>
<span class="size-warn hide">
<i class="iconfont">&#xe62c;</i>
请选择尺码
</span>
<span class="color-size-tip hide"></span>
</div>
</div>
<p class="color-size-tip hide"></p>
</div>
</div>
<div class="chose-count row clearfix">
<span class="title pull-left">选数量:</span>
<div class="num-wraper pull-left clearfix">
<span id="num" class="num pull-left">1</span>
<span class="minus-plus pull-left">
<i class="plus iconfont">&#xe610;</i>
<i class="minus iconfont">&#xe600;</i>
</span>
<span class="num-warn hide">
<i></i>
库存不足
</span>
</div>
</div>
<div class="chose-count row clearfix">
<span class="title pull-left">选数量:</span>
<div class="num-wraper pull-left clearfix">
<span id="num" class="num pull-left">1</span>
<span class="minus-plus pull-left">
<i id="plus-num" class="plus iconfont">&#xe610;</i>
<i id="minus-num" class="minus iconfont">&#xe600;</i>
</span>
<span id="num-warn" class="num-warn hide">
<i class="iconfont">&#xe62c;</i>
库存不足
</span>
</div>
</div>
<p class="row">
<span id="add-to-cart" class="add-to-cart">
<i class="iconfont">&#xe628;</i>
添加到购物车
</span>
<p class="row">
<span id="add-to-cart" class="add-to-cart">
<i class="iconfont">&#xe628;</i>
添加到购物车
</span>
<span id="collect-product" class="collect-product">
{{#if coled}}
<i class="coled iconfont">&#xe616;</i>
已收藏
{{^}}
<i class="iconfont">&#xe616;</i>
收藏商品
{{/if}}
</span>
</p>
<span id="sold-out" class="sold-out hide">
<i class="iconfont">&#xe62d;</i>
已售罄
</span>
<p class="share-row">
<span class="title pull-left">分享商品:</span>
<span class="share-wrapper pull-left clearfix">
<i class="weibo" data-type="weibo" title="分享到新浪微博"></i>
<i class="weixin" data-type="weixin" title="分享到微信朋友圈"></i>
<i class="qweibo" data-type="qweibo" title="分享到腾讯微博"></i>
<i class="qzone" data-type="qzone" title="分享到QQ空间"></i>
<i class="qq" data-type="qq" title="分享到QQ好友"></i>
<i class="renren" data-type="renren" title="分享到人人"></i>
<i class="douban" data-type="douban" class="分享到豆瓣"></i>
</span>
</p>
<span id="collect-product" class="{{#if coled}}coled {{/if}}collect-product">
<i class="iconfont">&#xe616;</i>
{{#if coled}}
<em>已收藏</em>
{{^}}
<em>收藏商品</em>
{{/if}}
</span>
</p>
<p class="share-row">
<span class="title pull-left">分享商品:</span>
<span class="share-wrapper pull-left clearfix">
<i class="weibo" data-type="weibo" title="分享到新浪微博"></i>
<i class="weixin" data-type="weixin" title="分享到微信朋友圈"></i>
<i class="qweibo" data-type="qweibo" title="分享到腾讯微博"></i>
<i class="qzone" data-type="qzone" title="分享到QQ空间"></i>
<i class="qq" data-type="qq" title="分享到QQ好友"></i>
<i class="renren" data-type="renren" title="分享到人人"></i>
<i class="douban" data-type="douban" class="分享到豆瓣"></i>
</span>
</p>
</div>
<div id="balance" class="balance">
<p class="success-tip">商品已成功添加到购物车!</p>
<p class="cart-total">购物车一共有<span id="cart-num">0</span>件商品</p>
<p class="balance-btns">
<a class="go-cart" href="{{goCartUrl}}">
去购物车结算
<i class="iconfont">&#xe601;</i>
</a>
<span id="keep-shopping" class="keep-shopping">
继续购物
</span>
</p>
</div>
</div>
</div>
</div>
{{/ goodInfo}}
... ... @@ -212,7 +246,7 @@
{{/if}}
{{/ description}}
</div>
<div class="material-content hide">
<div class="material-content">
{{# material}}
{{#if detail}}
<ul class="material-detail clearfix">
... ... @@ -345,23 +379,25 @@
</li>
{{/ comments}}
</ul>
<p class="more-wrap">
<span id="load-more-comments" class="load-more">
加载更多
<i class="iconfont">&#xe61d;</i>
</span>
</p>
{{#if hasMoreComments}}
<p class="more-wrap">
<span class="load-more-comments load-more">
加载更多
<i class="iconfont">&#xe61d;</i>
</span>
</p>
{{/if}}
<p class="btn-wrap">
<span id="comment-btn" class="btn">
<a class="btn" href="{{commentUrl}}" target="_blank">
<i class="iconfont">&#xe62a;</i>
我要评论
</span>
</a>
</p>
</div>
<div class="consults content hide">
<div class="consults content">
<h2>顾客咨询({{consultNum}})</h2>
<ul id="consult-ul">
<ul id="consults-ul">
{{# consults}}
<li>
<div class="user-info clearfix">
... ... @@ -376,18 +412,36 @@
</li>
{{/ consults}}
</ul>
<p class="more-wrap">
<span id="load-more-consults" class="load-more">
加载更多
<i class="iconfont">&#xe61d;</i>
</span>
</p>
{{#if hasMoreConsults}}
<p class="more-wrap">
<span class="load-more-consults load-more">
加载更多
<i class="iconfont">&#xe61d;</i>
</span>
</p>
{{/if}}
<p class="btn-wrap">
<span id="consults-btn" class="btn">
<i class="iconfont">&#xe62a;</i>
我要咨询
</span>
</p>
<div class="new-consult hide">
<textarea class="my-consult"></textarea>
<span class="warn-tip">
<i class="iconfont">&#xe62c;</i>
请输入咨询内容
</span>
<div class="captcha-row">
<input class="captcha" type="text">
<img class="captcha-img" src="http://www.yohobuy.com/passport/images?g=consult">
<span class="warn-tip">
<i class="iconfont">&#xe62c;</i>
请输入验证码
</span>
</div>
<span id="submit-consult" class="btn submit-consult">提交咨询</span>
</div>
</div>
</div>
{{/ consultComment}}
... ...
... ... @@ -26,6 +26,13 @@
</script>
{{/if}}
{{!-- 商品详情页 --}}
{{#if productDetailPage}}
<script>
seajs.use('js/product/item');
</script>
{{/if}}
{{!-- 逛 --}}
{{#if guangIndexPage}}
<script>
... ...
... ... @@ -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 Dec 21 21:30:54 2015
Created by FontForge 20120731 at Wed Dec 23 15:19:53 2015
By Ads
</metadata>
<defs>
... ... @@ -19,7 +19,7 @@ Created by FontForge 20120731 at Mon Dec 21 21:30:54 2015
bbox="0 -214 1172.1 864"
underline-thickness="50"
underline-position="-100"
unicode-range="U+0078-E62B"
unicode-range="U+0078-E62E"
/>
<missing-glyph horiz-adv-x="374"
d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
... ... @@ -150,5 +150,14 @@ q-82 0 -156 -32t-127.5 -85.5t-85.5 -127.5t-32 -155q0 -109 54 -201.5t146 -146t200
q10 12 24 26l35 33q15 13 25.5 29.5t10.5 39.5q0 15 -5 27.5t-14 23.5q-5 5 -10.5 8.5t-12.5 6.5t-14.5 4t-16.5 1q-18 0 -32 -6q-5 -3 -9 -5.5t-8 -5.5t-8 -7q-1 -2 -2.5 -3.5t-3 -3.5t-2.5 -3.5t-2 -3.5l-2 -4l-2 -4l-2 -4q-1 -5 -2.5 -10t-2.5 -10t-1 -10l-95 8
q5 37 20 66t39 49q12 10 25.5 18t29.5 13q31 10 66 10q33 0 63 -9.5t53 -28.5q6 -5 11 -10t9.5 -11t8 -12.5t7.5 -13.5q13 -27 13 -64q0 -12 -1.5 -23t-3.5 -20q-2 -4 -3 -7.5t-3 -7.5l-2 -6q-2 -4 -4 -7l-4 -6q-10 -16 -24 -30q-5 -5 -10 -9.5t-11 -10t-11 -10.5
q-16 -13 -25.5 -23t-15.5 -20t-8 -22q-1 -5 -1.5 -12.5t-0.5 -15.5v-20h-92zM450 56q0 25 18 43t44 18q24 0 43 -17q18 -18 19 -42q0 -13 -5 -23.5t-14 -19.5q-18 -17 -43 -17q-12 0 -23.5 4.5t-20.5 12.5q-8 7 -13 18t-5 23z" />
<glyph glyph-name="uniE62C" unicode="&#xe62c;"
d="M505 776q77 0 148.5 -23.5t129 -67t101 -101.5t67.5 -129.5t24 -147.5q0 -64 -17 -125t-47.5 -112t-74 -94.5t-94.5 -74t-112 -47.5t-125 -17q-95 0 -182 37.5t-150 100.5t-100 150t-37 182t37 182t100 150t150 100t182 37zM505 -104q112 0 206.5 55t149.5 149.5
t55 206.5q0 37 -6.5 73.5t-19.5 69.5t-30.5 64t-40.5 57.5t-49.5 49.5t-57.5 40.5t-64 30t-69.5 19t-73.5 6.5q-111 0 -205.5 -55t-149.5 -149.5t-55 -206t55 -206t149.5 -149.5t205.5 -55zM528 138v-59h-58v59h58zM470 564h58v-349h-58v349z" />
<glyph glyph-name="uniE62D" unicode="&#xe62d;"
d="M828 618q65 -65 98 -148t33 -169t-33 -169t-98 -148q-66 -66 -149 -99q-16 -6 -33 -11.5t-33.5 -9t-33.5 -6.5t-34 -4t-35 -1q-43 0 -85 8t-84 24q-82 33 -148 98q-66 66 -98.5 149t-32.5 169t32.5 169t98.5 149q66 65 148.5 97.5t168.5 32.5q15 0 29 -0.5t28 -2.5
t28.5 -4.5t28.5 -6.5t27.5 -8.5t27.5 -9.5q83 -33 149 -99v0zM258 49q53 -53 118.5 -79t134.5 -26q34 0 68 6.5t67 19.5q65 26 117.5 78.5t78.5 118t26 134.5q0 35 -6.5 68.5t-19.5 66.5q-26 65 -78 118q-53 53 -119 79t-135 26q-23 0 -45.5 -3t-44.5 -9t-44 -14
q-66 -26 -118 -78.5t-78.5 -118t-26.5 -134.5t26.5 -134.5t78.5 -118.5v0zM748 602l69 -72l-531 -530l-70 70zM748 602z" />
<glyph glyph-name="uniE62E" unicode="&#xe62e;" horiz-adv-x="1025"
d="M491 6q9 -10 21.5 -10t21.5 10l357 407q4 5 5.5 9.5t0 8t-6 5.5t-11.5 2h-133q-14 0 -23.5 9.5t-9.5 22.5v261q0 9 -4.5 16.5t-12.5 11.5t-17 4h-333q-14 0 -24 -9.5t-10 -22.5v-261q0 -13 -9.5 -22.5t-23.5 -9.5h-133q-14 0 -17.5 -7.5t5.5 -17.5z" />
</font>
</defs></svg>
... ...
/**
* 商品详情页
* @author: xuqi<qi.xu@yoho.cn>
* @date: 2015/12/23
*/
var $ = require('yoho.jquery'),
lazyLoad = require('yoho.lazyload');
var $imgShow = $('#img-show'),
$thumbs = $('#thumbs > .thumb-wrap');
var $size = $('#sizes'),
$sizes = $size.children('.size'),
$sizeWarn = $size.children('.size-warn'),
$colorSizeTip = $size.children('.color-size-tip');
var $num = $('#num'),
$plusNum = $('#plus-num'),
$minusNum = $('#minus-num'),
$numWarn = $('#num-warn');
var $addToCart = $('#add-to-cart'),
$soldOut = $('#sold-out');
var thumbsLoaded = {};
var skn = $('.main').data('skn');
var maxStock = -1; //记录当前选中的颜色-尺码的库存量,若为-1,代表未选择尺码
var SLIDETIME = 200;
var colTxt = {
default: '收藏商品',
coled: '已收藏',
hover: '取消收藏'
};
//咨询和评价页数
var page = {
comments: 1,
consults: 1
};
function imgShow(src) {
$imgShow.attr('src', src);
}
/**
* 获取当前选择的商品数目
* @return [Number]
*/
function getNum() {
return +$num.text();
}
//重置Num显示为1
function resetNum() {
$num.text('1');
$numWarn.addClass('hide');
}
//加入购物车和已售罄状态控制
function switchBtnStatus() {
if (maxStock === 0) {
$addToCart.addClass('hide');
$soldOut.removeClass('hide');
} else {
//包括默认的-1情况下
$addToCart.removeClass('hide');
$soldOut.addClass('hide');
}
}
//初始化thumbsLoaded
thumbsLoaded[$('.colors .focus').index()] = true;
//颜色
$('.colors').on('click', 'li', function() {
var $this = $(this),
index = $this.index();
var $imgs;
if ($this.hasClass('focus')) {
return;
}
$this.siblings('.focus').removeClass('focus');
$this.addClass('focus');
//切换图片显示
$thumbs.not('.hide').addClass('hide');
$imgs = $thumbs.eq(index).removeClass('hide').find('img');
if (typeof thumbsLoaded[index] === 'undefined') {
//trigger layLoad
lazyLoad($imgs, {
event: 'sporty'
});
$imgs.trigger('sporty');
thumbsLoaded[index] = true;
}
imgShow($imgs.first().data('shower'));
//切换尺码显示
$sizes.not('.hide').addClass('hide');
$sizes.eq(index).removeClass('hide').children('li').removeClass('focus');
$colorSizeTip.addClass('hide');
maxStock = -1;
resetNum();
switchBtnStatus();
});
//尺码
$size.on('click', 'li', function() {
var $this = $(this);
if ($this.hasClass('focus')) {
return;
}
maxStock = +$this.data('num');
$this.siblings('.focus').removeClass('focus');
$this.addClass('focus');
$colorSizeTip.html($this.data('title')).removeClass('hide');
$sizeWarn.addClass('hide');
switchBtnStatus();
resetNum();
}).on('click', '.size-ruler', function() {
//尺码帮助
});
//数量
$plusNum.click(function() {
var num = getNum();
if (maxStock === -1) {
$sizeWarn.removeClass('hide');//显示选择尺码提示
return;
}
//已售罄
if (maxStock === 0) {
return;
}
if (num >= maxStock) {
$numWarn.removeClass('hide');
} else {
$num.text(num + 1);
}
});
$minusNum.click(function() {
var num = getNum();
if (num === 1) {
return;
}
if (num <= maxStock) {
$numWarn.addClass('hide');
}
$num.text(num - 1);
});
//加入购物车
$addToCart.click(function() {
if (maxStock === -1) {
$sizeWarn.removeClass('hide');
return;
}
$.ajax({
type: 'GET',
url: '/product/item/addToCart',
data: {
skn: skn
}
}).then(function(data) {
var code = data.code;
if (code === 200) {
$('#type-chose').slideUp(SLIDETIME);
$('#balance').slideDown(SLIDETIME);
$('#cart-num').text(data.num); //更新数目
}
});
});
//收藏
$('#collect-product').click(function() {
var $this = $(this),
status = 'collect';
if ($this.hasClass('coled')) {
status = 'cancel';
}
$.ajax({
type: 'GET',
url: '/product/item/collect',
data: {
skn: skn,
status: status
}
}).then(function(data) {
var code = data.code;
if (code === 200) {
$this.toggleClass('coled');
if (status === 'cancel') {
$this.find('em').text(colTxt.default);
} else {
$this.find('em').text(colTxt.coled);
}
} else if (code === 400) {
window.location.href = data.data;
}
});
}).hover(function() {
var $this = $(this);
if ($this.hasClass('coled')) {
$this.find('em').text(colTxt.hover);
}
}, function() {
var $this = $(this);
if ($this.hasClass('coled')) {
$this.find('em').text(colTxt.coled);
}
});
//继续购物
$('#keep-shopping').click(function() {
$('#type-chose').slideDown(SLIDETIME);
$('#balance').slideUp(SLIDETIME);
});
//商品详情/材质洗涤切换
$('.description-material').on('click', '.title', function() {
var $this = $(this),
index = $this.index();
var $description = $('.description-content'),
$material = $('.material-content');
if ($this.hasClass('cur')) {
return;
}
$this.addClass('cur');
$this.siblings('.cur').removeClass('cur');
if (index === 0) {
//商品信息
$description.slideDown(SLIDETIME);
$material.slideUp(SLIDETIME);
} else {
$description.slideUp(SLIDETIME);
$material.slideDown(SLIDETIME);
}
});
//评价和咨询切换
$('.consult-comment').on('click', '.title', function() {
var $this = $(this),
index = $this.index();
var $comments = $('.comments'),
$consults = $('.consults');
if ($this.hasClass('cur')) {
return;
}
$this.addClass('cur');
$this.siblings('.cur').removeClass('cur');
if (index === 0) {
//咨询
$consults.slideDown(SLIDETIME);
$comments.slideUp(SLIDETIME);
} else {
$consults.slideUp(SLIDETIME);
$comments.slideDown(SLIDETIME);
}
}).on('click', '.load-more', function() {
var $this = $(this),
type;
if ($this.hasClass('load-more-comments')) {
type = 'comments';
} else {
type = 'consults';
}
$.ajax({
type: 'GET',
url: '/product/item/' + type,
data: {
page: page[type] + 1
}
}).then(function(html) {
if (html === ' ') {
$this.closest('.more-wrap').addClass('hide');
} else {
$(type + '-ul').append(html);
page[type]++;
}
});
});
//我要咨询
$('#consults-btn').click(function() {
$('.new-consult').removeClass('hide');
});
//售后服务
$('.after-service-switch').click(function() {
var $this = $(this),
$content = $this.next('.after-service-content');
var html = {
default: '&#xe604;',
spread: '&#xe603;'
};
if ($content.css('display') === 'none') {
$content.slideDown(SLIDETIME);
$this.find('.triangle').html(html.spread);
} else {
$content.slideUp(SLIDETIME);
$this.find('.triangle').html(html.default);
}
});
\ No newline at end of file
... ...
... ... @@ -173,10 +173,14 @@
margin-top: 10px;
}
.chose-color {
.trade-content {
padding-top: 20px;
margin-top: 20px;
border-top: 1px solid #eaeceb;
}
.chose-color {
font-size: 12px;
.title {
margin-top: 14px;
... ... @@ -192,6 +196,12 @@
.focus img {
border-color: #222;
}
li {
margin-right: 5px;
margin-bottom: 5px;
cursor: pointer;
}
}
.chose-size {
... ... @@ -207,10 +217,11 @@
height: 22px;
line-height: 22px;
width: 38px;
padding-top: 0 5px;
margin-right: 5px;
margin-bottom: 5px;
border: 1px solid #eaeceb;
text-align: center;
cursor: pointer;
&.disable {
opacity: 0.5;
... ... @@ -225,14 +236,35 @@
}
.size {
display: inline-block;
float: left;
color: #666;
}
.size-ruler {
display: inline-block;
float: left;
display: block;
width: 57px;
height: 24px;
background: image-url('product/size-ruler.jpg');
margin-bottom: 5px;
cursor: pointer;
}
.size-warn, .num-warn {
display: inline-block;
height: 24px;
line-height: 24px;
color: #e01;
margin-left: 7px;
font-size: 12px;
i {
font-size: 14px;
}
}
.color-size-tip {
color: #999;
}
.chose-count .title {
... ... @@ -246,6 +278,9 @@
line-height: 23px;
text-align: center;
border: 1px solid #eaeceb;
color: #333;
font-size: 12px;
background: #ebebe4;
}
.minus-plus {
... ... @@ -255,6 +290,7 @@
border: 1px solid #eaeceb;
border-left: none;
text-align: center;
cursor: pointer;
i {
display: block;
... ... @@ -270,7 +306,7 @@
font-size: 13px;
}
.add-to-cart {
.add-to-cart, .sold-out, .go-cart {
display: inline-block;
margin-right: 10px;
height: 48px;
... ... @@ -280,9 +316,14 @@
color: #fff;
background: #e92601;
font-size: 14px;
cursor: pointer;
}
.sold-out {
background: #ccc;
}
.collect-product {
.collect-product, .keep-shopping {
display: inline-block;
width: 127px;
height: 48px;
... ... @@ -293,13 +334,14 @@
border: 1px solid #ccc;
font-weight: bold;
font-size: 12px;
cursor: pointer;
.iconfont {
color: #ccc;
font-size: 12px;
}
.coled {
&.coled .iconfont{
color: #fa5252;
}
}
... ... @@ -329,6 +371,25 @@
$left: $left - 16px;
}
}
.balance {
display: none;
.success-tip {
color: #222;
font-size: 18px;
margin-bottom: 10px;
}
.cart-total {
color: #999;
font-size: 12px;
}
.balance-btns {
margin-top: 20px;
}
}
}
.other-infos {
... ... @@ -403,6 +464,10 @@
font-weight: bold;
}
}
.material-content {
display: none;
}
.material-detail {
width: 860px;
... ... @@ -506,6 +571,10 @@
}
}
.consults {
display: none;
}
.consult-comment .title {
color: #666;
... ... @@ -573,6 +642,10 @@
border-top: 1px solid #eaeceb;
}
.load-more {
cursor: pointer;
}
.btn {
display: block;
width: 140px;
... ... @@ -583,6 +656,7 @@
text-align: center;
font-size: 12px;
margin: 0 auto;
cursor: pointer;
.iconfont {
font-size: 14px;
... ... @@ -592,12 +666,62 @@
.comment, .consult {
margin-top: 10px;
}
.consults {
display: none;
}
.new-consult {
padding: 20px 0;
border-top: 1px solid #eaeceb;
textarea {
width: 590px;
height: 80px;
margin-top: 8px;
padding: 5px;
color: #ccc;
}
.captcha-row {
margin: 10px 0;
}
.captcha {
width: 70px;
height: 20px;
line-height: 20px;
border: 1px solid #ccc;
margin-right: 5px;
padding: 5px;
color: #ccc;
}
.captcha-img {
border: 0;
height: 32px;
width: 96px;
vertical-align: middle;
}
.submit-consult {
display: block;
width: 140px;
height: 32px;
line-height: 32px;
margin: 0;
}
}
}
.after-service {
text-align: center;
margin-top: 30px;
.after-service-content {
display: none;
}
.after-service-switch {
height: 44px;
line-height: 44px;
... ...
... ... @@ -37,18 +37,13 @@ class ItemController extends AbstractAction
)
),
'goodInfo' => array(
'skn' => '',
'img' => 'http://img11.static.yhbimg.com/goodsimg/2015/12/08/06/013ded7a84dbd3087594553e4333c92f80.jpg?imageMogr2/thumbnail/420x560/extent/420x560/background/d2hpdGU=/position/center/quality/90',
'tags' => array(
'isNew' => true,
'isLimit' => true,
'isNewFestival' => true
),
'thumbs' => array(
array(
'url' => '',
'img' => 'http://img11.static.yhbimg.com/goodsimg/2015/12/08/06/013ded7a84dbd3087594553e4333c92f80.jpg?imageMogr2/thumbnail/75x100/extent/75x100/background/d2hpdGU=/position/center/quality/90'
)
),
'name' => 'BRISTON 手表Clubmaster CHRONO black Silver - Black dial基本系列黑盘',
'brandUrl' => '',
'brandName' => 'BRISTON',
... ... @@ -76,9 +71,50 @@ class ItemController extends AbstractAction
'focus' => true,
'title' => 'BRISTON 手表Clubmaster CHRONO black Silver - Black dial基本系列黑盘 黑色',
'src' => 'http://img11.static.yhbimg.com/goodsimg/2015/12/08/06/013ded7a84dbd3087594553e4333c92f80.jpg?imageMogr2/thumbnail/40x40/extent/40x40/background/d2hpdGU=/position/center/quality/90',
'thumbs' => array(
array(
'url' => '',
'shower' => 'http://img11.static.yhbimg.com/goodsimg/2015/12/08/06/013ded7a84dbd3087594553e4333c92f80.jpg?imageMogr2/thumbnail/420x560/extent/420x560/background/d2hpdGU=/position/center/quality/90',
'img' => 'http://img11.static.yhbimg.com/goodsimg/2015/12/08/06/013ded7a84dbd3087594553e4333c92f80.jpg?imageMogr2/thumbnail/75x100/extent/75x100/background/d2hpdGU=/position/center/quality/90'
)
),
'size' => array(
array(
'name' => 'F',
'title' => '胸围 106cm / 肩宽 43cm',
'sku' => '956638',
'num' => 5
),
array(
'name' => 'L',
'title' => '胸围 110cm / 肩宽 45cm',
'sku' => '956634',
'num' => 2, //num为数字0或者不传则售罄
)
)
),
array(
'title' => 'GOGO HARRIS 圆圈手势套头卫衣 灰色',
'src' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/25/03/02b0d2195e1f1a285c4473a581e03f2e79.jpg?imageMogr2/thumbnail/40x40/extent/40x40/background/d2hpdGU=/position/center/quality/90',
'thumbs' => array(
array(
'url' => '',
'shower' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/25/03/02b0d2195e1f1a285c4473a581e03f2e79.jpg?imageMogr2/thumbnail/420x560/extent/420x560/background/d2hpdGU=/position/center/quality/90',
'img' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/25/03/02b0d2195e1f1a285c4473a581e03f2e79.jpg?imageMogr2/thumbnail/75x100/extent/75x100/background/d2hpdGU=/position/center/quality/90'
)
),
'size' => array(
array(
'name' => 'F'
'name' => 'L',
'title' => '胸围 106cm / 肩宽 43cm',
'sku' => '956638',
'num' => 0
),
array(
'name' => 'XL',
'title' => '胸围 110cm / 肩宽 45cm',
'sku' => '956634',
'num' => 2,
)
)
)
... ... @@ -277,6 +313,8 @@ class ItemController extends AbstractAction
'consultComment' => array(
'consultNum' => 125,
'commentNum' => 122,
'commentUrl' => '',
'hasMoreComments' => true,
'comments' => array(
array(
'avatar' => 'http://static.yohobuy.com/images/v3/boy.jpg',
... ... @@ -315,5 +353,25 @@ class ItemController extends AbstractAction
);
$this->_view->display('index', $data);
}
}
public function collectAction()
{
$this->echoJson(array(
'code' => 200
));
}
public function addToCartAction()
{
$this->echoJson(array(
'code' => 200,
'num' => 5
));
}
public function commentsAction()
{
echo(' ');
}
}
\ No newline at end of file
... ...