Authored by weiqingting

商品部分修改替换

<div class="commodity clearfix" id="newarrivals">
{{> index/floor-header}}
<div class="commodity-list">
<ul class="g-list clearfix">
</ul>
<div class="goods-container clearfix">
</div>
<div class="loading">
<a href="{{href}}">Loading...</a>
... ...
... ... @@ -89,7 +89,7 @@ InfiniteLoad.prototype.__directionCalculation = function() {
};
module.exports = function(data) {
var $container = $('#newarrivals .commodity-list ul');
var $container = $('#newarrivals .goods-container');
var $load = $('.loading a');
var load = new InfiniteLoad({
offset: {
... ... @@ -122,7 +122,7 @@ module.exports = function(data) {
myTemplate = Handlebars.compile(load.tpl);
$container.append(myTemplate(data.commodity));
$container.append(myTemplate(data.goods));
//懒加载插件貌似有点问题,图片先直接展示
//Lazyload($container.find('img.lazy'));
... ... @@ -147,19 +147,73 @@ module.exports = function(data) {
load.on('before', function() {
//请求模板
// load.tpl = '{{#each this}}';
// load.tpl += '<li>';
// load.tpl += ' <a href="{{url}}"><div class="commodity-img">';
// load.tpl += ' {{# tip}}';
// load.tpl += ' <i class="commodity-tag">{{.}}</i>';
// load.tpl += ' {{/ tip}}';
// load.tpl += ' <img class="lazy" data-original="{{img}}" src="{{img}}"/></div>';
// load.tpl += ' <p class="commodity-name">{{name}}</p>';
// load.tpl += ' <p class="commodity-price"><span>¥{{price}}</span></p>';
// load.tpl += ' </a>';
// load.tpl += '</li>';
// load.tpl += '{{/each}}';
load.tpl = '{{#each this}}';
load.tpl += '<li>';
load.tpl += ' <a href="{{url}}"><div class="commodity-img">';
load.tpl += ' {{# tip}}';
load.tpl += ' <i class="commodity-tag">{{.}}</i>';
load.tpl += ' {{/ tip}}';
load.tpl += ' <img class="lazy" data-original="{{img}}" src="{{img}}"/></div>';
load.tpl += ' <p class="commodity-name">{{name}}</p>';
load.tpl += ' <p class="commodity-price"><span>¥{{price}}</span></p>';
load.tpl += ' </a>';
load.tpl += '</li>';
load.tpl += '<div class="good-info" data-skn="{{skn}}">';
load.tpl += ' <div class="tag-container clearfix">';
load.tpl += ' {{# tags}}';
load.tpl += ' {{# isNew}}';
load.tpl += ' <span class="good-tag new-tag">NEW</span>';
load.tpl += ' {{/ isNew}}';
load.tpl += ' {{# isReNew}}';
load.tpl += ' <span class="good-tag renew-tag">再到着</span>';
load.tpl += ' {{/ isReNew}}';
load.tpl += ' {{# isSale}}';
load.tpl += ' <span class="good-tag sale-tag">SALE</span>';
load.tpl += ' {{/ isSale}}';
load.tpl += ' {{# isNewFestival}}';
load.tpl += ' <span class="good-tag new-festival-tag">新品节</span>';
load.tpl += ' {{/ isNewFestival}}';
load.tpl += ' {{# isLimit}}';
load.tpl += ' <span class="good-tag limit-tag">限量商品</span>';
load.tpl += ' {{/ isLimit}}';
load.tpl += ' {{# isYearEndPromotion}}';
load.tpl += ' <span class="good-tag yep-tag">年终大促</span>';
load.tpl += ' {{/ isYearEndPromotion}}';
load.tpl += ' {{# isYearMidPromotion}}';
load.tpl += ' <span class="good-tag ymp-tag">年中热促</span>';
load.tpl += ' {{/ isYearMidPromotion}}';
load.tpl += ' {{/ tags}}';
load.tpl += ' </div>';
load.tpl += ' <div class="good-detail-img">';
load.tpl += ' <a class="good-thumb" href="{{url}}">';
load.tpl += ' <img class="lazy" data-original="{{thumb}}">';
load.tpl += ' </a>';
load.tpl += ' {{# isFew}}';
load.tpl += ' <p class="few-tag">即将售罄</p>';
load.tpl += ' {{/ isFew}}';
load.tpl += ' {{#if showColBtn}}';
load.tpl += ' <span class="col-btn iconfont{{#if coled}} coled{{/if}}">&#xe616;</span>';
load.tpl += ' {{/if}}';
load.tpl += ' </div>';
load.tpl += ' <div class="good-detail-text">';
load.tpl += ' <a href="{{url}}">{{name}}</a>';
load.tpl += ' <p class="price">';
load.tpl += ' <span class="sale-price{{#unless marketPrice}}prime-cost{{/unless}}">';
load.tpl += ' ¥{{salePrice}}';
load.tpl += ' </span>';
load.tpl += ' {{# marketPrice}}';
load.tpl += ' <span class="market-price">¥{{.}}</span>';
load.tpl += ' {{/ marketPrice}}';
load.tpl += ' </p>';
load.tpl += ' </div>';
load.tpl += '</div>';
load.tpl += '{{/each}}';
load.emit();
});
... ...
... ... @@ -178,11 +178,20 @@
height: 129px;
}
}
.goods-container{
margin-right:-10px;
.good-info{
width: 240px;
.good-detail-img{
height: 320px;
}
}
.price{
text-align: center;
}
}
}
/**
* 新品上架模板样式
*/
.home-page{
.commodity{
.commodity-list{
... ... @@ -289,6 +298,7 @@
}
}
.home-page{
.slide-accordion{
overflow: hidden;
... ... @@ -335,23 +345,15 @@
.tpl-brands{
margin-top:-8px!important;
}
.commodity{
.commodity-list{
a{
height: 360px!important;
width: 188px!important;
}
.commodity-img{
height: 255px!important;
}
i.top{
height: 52px!important;
width: 52px!important;
line-height: 52px!important;
font-size: 14px!important;
.goods-container{
.good-info{
width: 188px;
.good-detail-img{
height: 255px;
}
}
}
}
... ... @@ -399,6 +401,7 @@
}
}
}
.singlehot{
li a{
width: 185px;
... ... @@ -414,6 +417,25 @@
height: 150px;
}
}
.slide-accordion{
height: 400px;
li{
a{
width: 650px;
height: 400px;
}
}
}
.goods-container{
.good-info{
width: 280px;
.good-detail-img{
height: 374px;
}
}
}
.commodity{
.commodity-list{
a{
... ... @@ -437,15 +459,6 @@
}
}
}
.slide-accordion{
height: 400px;
li{
a{
width: 650px;
height: 400px;
}
}
}
}
.boys{
... ... @@ -466,23 +479,15 @@
}
}
}
.commodity{
.commodity-list{
a{
height: 408px!important;
width: 222px!important;
}
.commodity-img{
.goods-container{
.good-info{
width: 222px!important;
.good-detail-img{
height: 298px!important;
}
i.top{
height: 60px!important;
width: 60px!important;
line-height: 60px!important;
font-size: 20px!important;
}
}
}
}
}
... ...
<?php
use Action\WebAction;
use Index\HomeModel;
/**
* 男首
*/
class CommonController extends WebAction
{
/**
* 男装首页 新品上架 接口数据
*
* @param int pageIndex 当前页数
* @param int pageCount 一页显示个数
* @param string flag 类型(男装/女装等,用于区分)
* @return json
*/
public function getNewArrivalAction()
{
$result = array();
do {
/* 判断是不是AJAX请求 */
if (!$this->isAjax()) {
break;
}
$pageIndex = $this->post('pageIndex');
if($pageIndex>=3){
break;
}
$imgsrc='http://img11.static.yhbimg.com/goodsimg/2015/10/19/10/01b312c3b7a7efebcd671e73495ff3e306.jpg';
$data=array(
'url' =>'http://www.muji.com.cn/cn/store/goods/4547315967308' ,
'img'=> $imgsrc,
'name'=> '优显led触控台灯',
'price'=> 168,
'tip'=> "" //提示
);
$result=array(
'code'=>200,
'goods' => array(
array(
'tags' => array(
'isNew' => true,
'isYearEndPromotion' => true
),
'url' => 'http://adidas.yohobuy.com/?gender=1,3',
'thumb' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/22/03/02c17af44dc23aa5a62d61cb59a05380bc.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'adidas Originals FORUM 中帮拼色休闲板鞋',
'salePrice' => '899',
'isFew' => true
),
array(
'tags' => array(
'isNew' => true,
'isReNew' => true
),
'url' => 'http://adidas.yohobuy.com/?gender=1,3',
'thumb' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/22/03/02c17af44dc23aa5a62d61cb59a05380bc.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'adidas Originals FORUM 中帮拼色休闲板鞋',
'salePrice' => '899',
'showColBtn' => true
),
array(
'tags' => array(
'isNew' => true,
'isReNew' => true
),
'url' => 'http://adidas.yohobuy.com/?gender=1,3',
'thumb' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/22/03/02c17af44dc23aa5a62d61cb59a05380bc.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'adidas Originals FORUM 中帮拼色休闲板鞋',
'salePrice' => '899'
),
array(
'url' => 'http://adidas.yohobuy.com/?gender=1,3',
'thumb' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/22/03/02c17af44dc23aa5a62d61cb59a05380bc.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'adidas Originals FORUM 中帮拼色休闲板鞋',
'salePrice' => '899'
),
array(
'tags' => array(
'isNew' => true,
'isReNew' => true
),
'url' => 'http://adidas.yohobuy.com/?gender=1,3',
'thumb' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/22/03/02c17af44dc23aa5a62d61cb59a05380bc.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'adidas Originals FORUM 中帮拼色休闲板鞋',
'salePrice' => '899'
),
array(
'tags' => array(
'isNew' => true,
'isReNew' => true
),
'url' => 'http://adidas.yohobuy.com/?gender=1,3',
'thumb' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/22/03/02c17af44dc23aa5a62d61cb59a05380bc.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'adidas Originals FORUM 中帮拼色休闲板鞋',
'salePrice' => '899'
),
array(
'tags' => array(
'isNew' => true,
'isReNew' => true
),
'url' => 'http://adidas.yohobuy.com/?gender=1,3',
'thumb' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/22/03/02c17af44dc23aa5a62d61cb59a05380bc.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'adidas Originals FORUM 中帮拼色休闲板鞋',
'salePrice' => '899'
),
array(
'url' => 'http://adidas.yohobuy.com/?gender=1,3',
'thumb' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/22/03/02c17af44dc23aa5a62d61cb59a05380bc.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'adidas Originals FORUM 中帮拼色休闲板鞋',
'salePrice' => '899'
),
array(
'tags' => array(
'isNew' => true,
'isReNew' => true
),
'url' => 'http://adidas.yohobuy.com/?gender=1,3',
'thumb' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/22/03/02c17af44dc23aa5a62d61cb59a05380bc.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'adidas Originals FORUM 中帮拼色休闲板鞋',
'salePrice' => '899'
),
array(
'tags' => array(
'isNew' => true,
'isReNew' => true
),
'url' => 'http://adidas.yohobuy.com/?gender=1,3',
'thumb' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/22/03/02c17af44dc23aa5a62d61cb59a05380bc.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'adidas Originals FORUM 中帮拼色休闲板鞋',
'salePrice' => '899'
),
array(
'tags' => array(
'isNew' => true,
'isYearEndPromotion' => true
),
'url' => 'http://adidas.yohobuy.com/?gender=1,3',
'thumb' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/22/03/02c17af44dc23aa5a62d61cb59a05380bc.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'adidas Originals FORUM 中帮拼色休闲板鞋',
'salePrice' => '899',
'isFew' => true
),
array(
'tags' => array(
'isNew' => true,
'isReNew' => true
),
'url' => 'http://adidas.yohobuy.com/?gender=1,3',
'thumb' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/22/03/02c17af44dc23aa5a62d61cb59a05380bc.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'adidas Originals FORUM 中帮拼色休闲板鞋',
'salePrice' => '899',
'showColBtn' => true
),
array(
'tags' => array(
'isNew' => true,
'isReNew' => true
),
'url' => 'http://adidas.yohobuy.com/?gender=1,3',
'thumb' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/22/03/02c17af44dc23aa5a62d61cb59a05380bc.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'adidas Originals FORUM 中帮拼色休闲板鞋',
'salePrice' => '899'
),
array(
'url' => 'http://adidas.yohobuy.com/?gender=1,3',
'thumb' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/22/03/02c17af44dc23aa5a62d61cb59a05380bc.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'adidas Originals FORUM 中帮拼色休闲板鞋',
'salePrice' => '899'
),
array(
'tags' => array(
'isNew' => true,
'isReNew' => true
),
'url' => 'http://adidas.yohobuy.com/?gender=1,3',
'thumb' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/22/03/02c17af44dc23aa5a62d61cb59a05380bc.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'adidas Originals FORUM 中帮拼色休闲板鞋',
'salePrice' => '899'
),
array(
'tags' => array(
'isNew' => true,
'isReNew' => true
),
'url' => 'http://adidas.yohobuy.com/?gender=1,3',
'thumb' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/22/03/02c17af44dc23aa5a62d61cb59a05380bc.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'adidas Originals FORUM 中帮拼色休闲板鞋',
'salePrice' => '899'
),
array(
'tags' => array(
'isNew' => true,
'isReNew' => true
),
'url' => 'http://adidas.yohobuy.com/?gender=1,3',
'thumb' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/22/03/02c17af44dc23aa5a62d61cb59a05380bc.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'adidas Originals FORUM 中帮拼色休闲板鞋',
'salePrice' => '899'
),
array(
'url' => 'http://adidas.yohobuy.com/?gender=1,3',
'thumb' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/22/03/02c17af44dc23aa5a62d61cb59a05380bc.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'adidas Originals FORUM 中帮拼色休闲板鞋',
'salePrice' => '899'
),
array(
'tags' => array(
'isNew' => true,
'isReNew' => true
),
'url' => 'http://adidas.yohobuy.com/?gender=1,3',
'thumb' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/22/03/02c17af44dc23aa5a62d61cb59a05380bc.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'adidas Originals FORUM 中帮拼色休闲板鞋',
'salePrice' => '899'
),
array(
'tags' => array(
'isNew' => true,
'isReNew' => true
),
'url' => 'http://adidas.yohobuy.com/?gender=1,3',
'thumb' => 'http://img12.static.yhbimg.com/goodsimg/2015/11/22/03/02c17af44dc23aa5a62d61cb59a05380bc.jpg?imageMogr2/thumbnail/235x314/extent/235x314/background/d2hpdGU=/position/center/quality/90',
'name' => 'adidas Originals FORUM 中帮拼色休闲板鞋',
'salePrice' => '899'
)
)
);
} while (false);
$this->echoJson($result);
}
}
\ No newline at end of file
... ...