wangshusheng / YOHOBUYPC · Commits

Go to a project

Authored by lore-w
Commit 623ef3c9050a846263106db6aada2b7cd58b8755 2 parents c3917c64 54fdf1fc

Merge branch 'feature/web' of git.dev.yoho.cn:web/yohobuy into feature/web 

Conflicts:
	web-static/js/product/list.js
	web-static/sass/product/_index.scss
Inline Side-by-side
Showing 22 changed files with 2043 additions and 361 deletions
# WEB数据结构定义
\ No newline at end of file
# WEB数据结构定义
## 公共定义
### 商品
## 搜索页
{
products: {
//筛选相关
filters: {
checkedConditions: {
clearUrl: '', //清空筛选链接
conditions: [
//正常情况下文字显示
{
href: '',
name: '暗黑'
},
//特殊情况下颜色显示
{
href: '',
'color': '#f00'
},
...
]
},
//-- 筛选项数据Start(需要显示就传，不显示不传) --
channel: [
{
href: '',
name: 'Boys'
},
...
],
sort: [
{
name: '上衣',
sub: [
{
href: '',
name: 'T恤'
},
...
]
},
...
],
brand: {
default: [
{
href: '',
name: ''
},
...
],
//索引：index为索引键值（字母转化为小写）
brandIndex: [
{
index: 'all',
name: '全部'
},
{
index: '0-9',
name: '0 ~ 9'
},
{
index: 'a',
name: 'A'
},
...
],
brandShow: [
{
id: 1,
href: '',
index:'0-9', //与brandIndex中索引一致
name: '5cm',
key: '5cm' //key为品牌关键字，用于搜索和索引，保持小写
},
{
id: 2,
href: '',
index: 'k',
name: 'KTZ',
key: 'ktz'
},
...
],
price: [
{
href: '',
name: '0-239'
},
...
],
color: [
{
href: '',
name: '黑色',
rgb: '#000' //此处若为彩色和银色，需要传图片路径字符串：url('path/to/img')
},
...
],
size: [
{
href: '',
name: ''
},
...
],
seniorChose: [
{
attr: 'style', //查找的键值
name: '风格',
showMulti: true, //是否显示多选按钮
sub: [
{
id: '',
href: '',
name: ''
},
...
]
},
...
]
}
},
//操作Banner相关
opts: {
sortType: [
{
href: '',
name: '默认'
},
{
active: true, //当前选中
href: '',
name: '最新',
hasSortOrient: true, //是否有正逆序
desc: true //逆序排序（默认不传为正序）
},
{
href: '',
name: '价格',
hasSortOrient: true
},
{
href: '',
name: '折扣',
hasSortOrient: true
}
],
checks: [
{
name: '新品',
checked: true,
href: ''
},
{
name: '打折',
href: ''
},
{
name: '限量',
href: ''
}
],
fivePerLine: true,
sixPerLineHref: '',
//or
sixPerLine: true,
fivePerLineHref: '',
countPerPage => 120,
pageCounts => [
{
href: '',
count: 60
},
...
],
curPage: 1,
pageCount: 30,
preHref: '', //若当前为第一页，不传此参数
nexHref: '' //若当前为最后一页，不传此参数
},
//商品列表
}
}
\ No newline at end of file
... ...
{{> layout/header}}
<div class="home-page yoho-page">
I am boys page
{{# boy}}
<div class="slide-container">
{{#if bigSlide}}
<div class="big-slide">
<ul>
{{# bigSlide}}
<li>
<a href="{{href}}">
<img src="{{img}}" alt="">
</a>
</li>
{{/ bigSlide}}
</ul>
<div class="slide-switch">
<a class="prev" href="javascript:;">
<span class="iconfont">&#xe60c;</span>
</a>
<a class="next" href="javascript:;">
<span class="iconfont">&#xe60b;</span>
</a>
</div>
</div>
{{/if}}
{{#if smallSlide}}
<div class="small-slide">
<ul class="clearfix">
{{# smallSlide}}
<li>
<a href="{{href}}"></a>
<img src="{{img}}" alt="">
</li>
{{/ smallSlide}}
</ul>
</div>
{{/if}}
</div>
{{# newReport}}
<div class="new-report clearfix">
{{> index/floor_header}}
<ul class="report-list clearfix">
{{# list}}
{{#unless @last}}
<li>
<a href="{{href}}">
<img src="{{img}}" alt="">
</a>
</li>
{{/unless}}
{{/ list}}
</ul>
{{# list}}
{{#if @last}}
<div class="last-item">
<a href="{{href}}">
<img src="{{img}}" alt="">
</a>
</div>
{{/if}}
{{/ list}}
</div>
{{/ newReport}}
{{# preferenceBrand}}
<div class="preference-brand">
{{> index/floor_header}}
<div class="img-brand">
<ul class="img-list clearfix">
{{# imgBrand}}
<li class="img-item">
<a href="{{href}}">
<img src="{{img}}" alt="">
</a>
</li>
{{/ imgBrand}}
</ul>
<div class="img-brand-switch">
<a class="prev" href="javascript:;">
<span class="iconfont">&#xe60c;</span>
</a>
<a class="next" href="javascript:;">
<span class="iconfont">&#xe60b;</span>
</a>
</div>
</div>
<div class="logo-brand">
<ul class="clearfix">
{{# logoBrand}}
{{#if switch}}
<li class="logo-brand-switch">
<a class="prev iconfont" href="javascript:;">&#xe60f;</a>
<a class="next iconfont" href="javascript:;">&#xe60e;</a>
</li>
{{else}}
{{#if more}}
<li class="brand-more">
<a href="{{href}}">MORE ></a>
</li>
{{else}}
<li>
<a href="{{href}}">
<img src="{{img}}" alt="">
</a>
</li>
{{/if}}
{{/if}}
{{/ logoBrand}}
</ul>
</div>
</div>
{{/ preferenceBrand}}
{{! 品类推荐}}
{{#each recommend}}
{{> index/recommend}}
{{/ recommend}}
{{! 新品上架}}
{{# newArrivls}}
{{> index/commodity}}
{{/ newArrivls}}
{{/ boy}}
</div>
{{> layout/footer}}
\ No newline at end of file
... ...
{{> layout/header}}
<div class="products-page yoho-page">
<div class="filter-box">
{{# filters}}
{{# checkedConditons}}
<div class="checked-conditions section">
<span class="title">已选条件：</span>
<div class="attr-content clearfix">
{{#each conditions}}
<a class="tag" href="{{href}}">
{{#if name}}
{{name}}
{{^}}
<i class="color-block" style="background: {{color}}"></i>
{{/if}}
<i class="close iconfont">&#xe602;</i>
</a>
{{/each}}
<a class="clear-checked" href="{{clearUrl}}">清空筛选条件</a>
</div>
</div>
{{/ checkedConditons}}
{{# products}}
<div class="filter-box">
{{# filters}}
{{# checkedConditions}}
<div class="checked-conditions section">
<span class="title">已选条件：</span>
{{#if channel}}
<div class="channel section">
<span class="title">频道：</span>
<div class="attr-content clearfix">
{{#each conditions}}
<a class="tag" href="{{href}}">
{{#if name}}
{{name}}
{{^}}
<i class="color-block" style="background: {{color}}"></i>
{{/if}}
<i class="close iconfont">&#xe602;</i>
</a>
{{/each}}
<div class="attr-content clearfix">
{{#each channel}}
<a class="attr" href="{{href}}">
{{name}}
</a>
{{/each}}
<a class="clear-checked" href="{{clearUrl}}">清空筛选条件</a>
</div>
</div>
</div>
{{/if}}
{{/ checkedConditions}}
{{#if sort}}
<div class="sort section">
<span class="title">分类：</span>
{{#if channel}}
<div class="channel section">
<span class="title">频道：</span>
<div class="attr-content">
<ul class="sort-pre clearfix">
{{#each sort}}
<li>
<span class="attr" data-id="{{id}}">
{{name}}
</span>
</li>
{{/each}}
</ul>
<div class="sort-sub-wrap">
{{#each sort}}
<ul class="sort-sub clearfix hide">
{{#each sub}}
<li class="attr">
<a href="{{href}}">{{name}}</a>
</li>
{{/each}}
</ul>
<div class="attr-content clearfix">
{{#each channel}}
<a class="attr" href="{{href}}">
{{name}}
</a>
{{/each}}
</div>
</div>
</div>
{{/if}}
{{/if}}
{{# brand}}
<div class="brand section">
<span class="title">品牌：</span>
{{#if sort}}
<div class="sort section">
<span class="title">分类：</span>
<div class="attr-content">
<ul class="default clearfix">
{{# default}}
<li class="attr">
<a href="{{href}}" title="{{name}}">{{name}}</a>
</li>
{{/ default}}
</ul>
<div class="attr-content">
<ul class="sort-pre clearfix">
{{#each sort}}
<li>
<span class="attr">
{{name}}
</span>
</li>
{{/each}}
</ul>
<div class="brand-opt">
<span id="brand-more" class="brand-more">
<em>更多</em>
<i class="iconfont">&#xe600;</i>
</span>
<span id="brand-multi" class="multi-select">多选 +</span>
<div class="sort-sub-wrap">
{{#each sort}}
<ul class="sort-sub clearfix hide">
{{#each sub}}
<li class="attr">
<a href="{{href}}">{{name}}</a>
</li>
{{/each}}
</ul>
{{/each}}
</div>
</div>
</div>
{{/if}}
<div class="brand-panel hide">
<div class="panel-head clearfix">
<p class="brands-index">
{{#each brandIndex}}
<span data-index="{{index}}">{{name}}</span>
{{/each}}
</p>
<div class="brand-search">
<input id="brand-search-input" type="text">
<span class="btn">
<i class="iconfont">&#xe611;</i>
</span>
</div>
</div>
{{# brand}}
<div class="brand section">
<span class="title">品牌：</span>
<ul class="panel-body check-container clearfix">
{{# brandsShow}}
<li class="attr" data-index="{{index}}" data-key="{{key}}">
<a href="{{href}}">
<span class="iconfont checkbox" data-id="{{id}}">&#xe613;</span>
<span title="{{name}}">{{name}}</span>
</a>
<div class="attr-content">
<ul class="default clearfix">
{{# default}}
<li class="attr">
<a href="{{href}}" title="{{name}}">{{name}}</a>
</li>
{{/ brandsShow}}
{{/ default}}
</ul>
<div class="btns">
<button id="brand-multi-ok" class="multi-select-ok dis">确定</button>
<button class="multi-select-cancel">取消</button>
<div class="brand-opt">
<span id="brand-more" class="brand-more">
<em>更多</em>
<i class="iconfont">&#xe600;</i>
</span>
<span id="brand-multi" class="multi-select">多选 +</span>
</div>
<div class="brand-panel hide">
<div class="panel-head clearfix">
<p class="brands-index">
{{#each brandIndex}}
<span data-index="{{index}}">{{name}}</span>
{{/each}}
</p>
<div class="brand-search">
<input id="brand-search-input" type="text">
<span class="btn">
<i class="iconfont">&#xe611;</i>
</span>
</div>
</div>
<ul class="panel-body check-container clearfix">
{{# brandsShow}}
<li class="attr" data-index="{{index}}" data-key="{{key}}">
<a href="{{href}}">
<span class="iconfont checkbox" data-id="{{id}}">&#xe613;</span>
<span title="{{name}}">{{name}}</span>
</a>
</li>
{{/ brandsShow}}
</ul>
<div class="btns">
<button id="brand-multi-ok" class="multi-select-ok dis">确定</button>
<button class="multi-select-cancel">取消</button>
</div>
</div>
</div>
</div>
</div>
{{/ brand}}
{{/ brand}}
{{#if price}}
<div class="price section">
<span class="title">价格：</span>
{{#if price}}
<div class="price section">
<span class="title">价格：</span>
<div class="attr-content clearfix">
{{# price}}
<a class="attr" href="{{href}}">¥{{name}}</a>
{{/ price}}
<div class="attr-content clearfix">
{{# price}}
<a class="attr" href="{{href}}">¥{{name}}</a>
{{/ price}}
<div class="ud-price-range">
¥
<input type="text" class="min limit">
<span class="price-sep">-</span>
<input type="text" class="max limit">
<div class="ud-price-range">
¥
<input type="text" class="min limit">
<span class="price-sep">-</span>
<input type="text" class="max limit">
<button class="price-sure hide">确定</button>
<button class="price-sure hide">确定</button>
</div>
</div>
</div>
</div>
{{/if}}
{{#if color}}
<div class="color section">
<span class="title">颜色：</span>
<div class="attr-content clearfix">
{{# color}}
<a class="attr" href="{{href}}">
<i class="color-block" style="background: {{rgb}}"></i>
{{name}}
</a>
{{/ color}}
{{/if}}
{{#if color}}
<div class="color section">
<span class="title">颜色：</span>
<div class="attr-content clearfix">
{{# color}}
<a class="attr" href="{{href}}">
<i class="color-block" style="background: {{rgb}}"></i>
{{name}}
</a>
{{/ color}}
</div>
</div>
</div>
{{/if}}
{{/if}}
{{#if size}}
<div class="size section">
<span class="title">尺码：</span>
{{#if size}}
<div class="size section">
<span class="title">尺码：</span>
<div class="attr-content clearfix">
{{# size}}
<a class="attr" href="{{href}}">{{name}}</a>
{{/ size}}
<div class="attr-content clearfix">
{{# size}}
<a class="attr" href="{{href}}">{{name}}</a>
{{/ size}}
</div>
</div>
</div>
{{/if}}
{{/if}}
{{#if seniorChose}}
<div class="senior section">
<span class="title">高级选项：</span>
{{#if seniorChose}}
<div class="senior section">
<span class="title">高级选项：</span>
<div class="attr-content">
<ul class="clearfix senior-attr-wrap">
{{#each seniorChose}}
<li class="attr">
{{name}}
<span class="iconfont">&#xe600;</span>
<div class="attr-content">
<ul class="clearfix senior-attr-wrap">
{{#each seniorChose}}
<li class="attr">
{{name}}
<span class="iconfont">&#xe600;</span>
<div class="senior-up-icon"></div>
<div class="senior-up-icon"></div>
</li>
{{/each}}
</ul>
<div class="senior-sub-wrap">
{{#each seniorChose}}
<div class="senior-sub hide" data-attr="{{attr}}">
{{#if showMulti}}
<span class="multi-select">多选 +</span>
... ... @@ -205,23 +211,128 @@
<button class="multi-select-cancel">取消</button>
</div>
</div>
{{/each}}
</div>
</div>
</div>
{{/if}}
{{/ filters}}
</div>
<div class="opt-banner">
{{# opts}}
{{# sortType}}
<a class="sort-type{{#if active}} active{{/if}}" href="{{href}}">
{{name}}
{{#if hasSortOrient}}
{{#if active}}
{{#if desc}}
<span class="active-icon iconfont">&#xe603;</span>
{{^}}
<span class="active-icon iconfont">&#xe604;</span>
{{/if}}
{{^}}
<span class="iconfont">&#xe614;</span>
{{/if}}
{{^}}
<span class="iconfont">&#xe604;</span>
{{/if}}
</a>
{{/ sortType}}
{{# checks}}
<a class="checks{{#if checked}} checked{{/if}}" href="{{href}}">
{{#if checked}}
<span class="iconfont">&#xe612;</span>
{{^}}
<span class="iconfont">&#xe613;</span>
{{/if}}
{{name}}
</a>
{{/ checks}}
<div class="pager-wrap">
{{#if fivePerLine}}
<div class="line-count active">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</div>
<a class="line-count" href="{{sixPerLineHref}}">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</a>
{{^}}
<a class="line-count" href="{{fivePerLineHref}}">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</a>
<div class="line-count active">
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
<span></span>
</div>
{{/if}}
<div class="page-count">
<span id="count-per-page">
{{countPerPage}}
<i class="iconfont">&#xe604;</i>
</span>
每页
<ul>
{{# pageCounts}}
<li>
<a href="{{href}}">{{count}}</a>
</li>
{{/each}}
{{/ pageCounts}}
</ul>
</div>
<p class="pager">
{{#if preHref}}
<a href="{{preHref}}">
<span class="iconfont">&#xe615;</span>
</a>
{{^}}
<span class="dis-icon iconfont">&#xe615;</span>
{{/if}}
<span>
<i>{{curPage}}</i>/{{pageCount}}
</span>
{{#if nextHref}}
<a href="{{nextHref}}">
<span class="iconfont">&#xe601;</span>
</a>
{{^}}
<span class="dis-icon iconfont">&#xe601;</span>
{{/if}}
</p>
</div>
{{/if}}
{{/ filters}}
</div>
<div class="opt-banner">
</div>
<div class="goods-container">
{{#each goods}}
{{> product/good}}
{{/each}}
</div>
{{/opts}}
</div>
<div class="goods-container">
{{#each goods}}
{{> product/good}}
{{/each}}
</div>
{{/ products}}
</div>
{{> layout/footer}}
\ No newline at end of file
... ...
{{> index/floor_header}}
<div class="commodity">
<ul class="clearfix">
{{#each commodity}}
<li>
{{# state}}
<i class="commodity-tag{{.}}"></i>
{{/ state}}
<a href="{{url}}"><div class="commodity-img"><img class="lazy" data-original="{{img}}"/></div>
<p class="commodity-name">{{name}}</p>
<p class="commodity-price"><span>¥{{price}}</span></p>
</a>
</li>
{{/each}}
</ul>
<div class="loading">
<p>Loading...</p>
</div>
</div>
\ No newline at end of file
... ...
<div class="floor-header clearfix">
<h2 class="floor-title">{{name}}</h2>
{{#if navs}}
<ul class="header-navs">
{{# navs}}
<li data-classify="{{id}}">
<a target="_blank" href="{{href}}">{{name}}</a>
</li>
{{/ navs}}
</ul>
{{/if}}
</div>
\ No newline at end of file
... ...
{{# tplrecommend}}
{{> index/floor_header}}
<div class="tpl-recommend clearfix">
<div class="tpl-body clearfix">
<div class="tpl-nav">
<div class="tpl-keywords">
{{#each keyword}}
<a class="keywords{{@index}}" title="{{name}}" href="{{url}}"><img class="lazy" data-original="{{img}}"/></a>
{{/ keyword}}
</div>
<div class="tpl-category clearfix">
{{#each category}}
<a href="{{url}}">{{name}}</a>
{{/ category}}
</div>
</div>
<div class="tpl-brands clearfix">
<ul>
{{#each brands}}
<li><a title="{{name}}" href="{{url}}"><img class="lazy" data-original="{{img}}"/></a></li>
{{/each}}
</ul>
</div>
<div class="tpl-types clearfix">
<ul>
{{#each types}}
<li><a title="{{name}}" href="{{url}}"><img class="lazy" data-original="{{img}}"/></a></li>
{{/each}}
</ul>
</div>
</div>
<div class="tpl-products clearfix">
<ul>
{{#each products}}
<li><a href="{{url}}" title="{{name}}"><img class="lazy" data-original="{{img}}"/></a></li>
{{/each}}
</ul>
</div>
</div>
{{/ tplrecommend}}
... ...
... ... @@ -5,9 +5,10 @@
{{!-- 首页 --}}
{{#if boysHomePage}}
<script>
seajs.use('js/home/entrey', function(h) {
/*seajs.use('js/home/entrey', function(h) {
h.set('boys');
});
});*/
seajs.use('js/home/home');
</script>
{{/if}}
... ...
dist
_site
sea-modules
spm_modules
node_modules
.git
tests
examples
test
coverage
... ...
... ... @@ -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 Thu Nov 26 10:18:10 2015
Created by FontForge 20120731 at Tue Dec 1 11:00:27 2015
By Ads
</metadata>
<defs>
... ... @@ -16,10 +16,10 @@ Created by FontForge 20120731 at Thu Nov 26 10:18:10 2015
ascent="896"
descent="-128"
x-height="792"
bbox="0 -214 1024 812"
bbox="0 -214 1024 864"
underline-thickness="50"
underline-position="-100"
unicode-range="U+0078-E613"
unicode-range="U+0078-E615"
/>
<missing-glyph horiz-adv-x="374"
d="M34 0v682h272v-682h-272zM68 34h204v614h-204v-614z" />
... ... @@ -77,5 +77,9 @@ d="M939 -212h-854q-23 0 -42.5 11.5t-31 31t-11.5 42.5v854q0 35 25 60t60 25h854q23
M457 99q-5 -6 -13 -9t-17 -3q-21 0 -30 12l-171 171q-13 10 -13 30q0 18 12.5 30.5t30.5 12.5q10 0 17.5 -3.5t12.5 -9.5l141 -141l311 312q13 12 30 12q18 0 30.5 -12.5t12.5 -29.5q0 -21 -13 -30z" />
<glyph glyph-name="uniE613" unicode="&#xe613;"
d="M877 812h-730q-61 0 -104 -43t-43 -104v-730q0 -61 43 -104t104 -43h730q61 0 104 43t43 104v730q0 61 -43 104t-104 43zM939 -65q0 -26 -18 -44t-44 -18h-730q-26 0 -44 18t-18 44v730q0 17 8.5 31t22.5 22.5t31 8.5h730q26 0 44 -18t18 -44v-730z" />
<glyph glyph-name="uniE614" unicode="&#xe614;"
d="M160 996zM865 247q0 -18 -13 -31l-308 -308q-13 -13 -31 -13t-31 13l-309 308q-13 13 -13 31t13.5 31t30.5 13h617q18 0 31 -13t13 -31zM865 511q0 -18 -13 -31t-31 -13h-617q-18 0 -31 13t-13 31t13 31l309 309q13 13 31 13t31 -13l308 -309q13 -13 13 -31z" />
<glyph glyph-name="uniE615" unicode="&#xe615;"
d="M704 569l-41 39l-343 -320l343 -320l41 39l-301 281z" />
</font>
</defs></svg>
... ...
var $ = require('jquery');
(function($) {
var LinkageSlider = function(element, options) {
this.$element = $(element);
this.options = $.extend({}, $.fn.linkageSlider.defaults, options);
this.bigItem = this.$element.find('.big-slide').find('li');
this.smallItem = this.$element.find('.small-slide').find('li');
this.len = this.bigItem.size();
this.index = 0;
this.timer = null;
this.init();
};
LinkageSlider.prototype = {
init: function() {
this._slideShow();
if (this.len <= 1) {
this.$element.find('.slide-switch').hide();
return;
}
this._bindEvent();
this._autoplay();
},
_bindEvent: function() {
var that = this;
this.$element.find('.slide-switch').on('click', '.next', function() {
that._nextSlide();
clearInterval(that.timer);
that.timer = setInterval(function() {
that._nextSlide();
}, that.options.time);
}).on('click', '.prev', function() {
that._prevSlide();
clearInterval(that.timer);
that.timer = setInterval(function() {
that._nextSlide();
}, that.options.time);
});
this.smallItem.on('mouseenter', function() {
that.index = $(this).index();
clearInterval(that.timer);
that._slideShow();
}).on('mouseleave', function() {
that._autoplay();
});
},
_nextSlide: function() {
if (this.index === this.len - 1) {
this.index = 0;
} else {
this.index++;
}
this._slideShow();
},
_prevSlide: function() {
if (this.index === 0) {
this.index = this.len - 1;
} else {
this.index--;
}
this._slideShow();
},
_slideShow: function() {
this.smallItem.eq(this.index).addClass('focus').siblings().removeClass('focus');
this.bigItem.eq(this.index).fadeIn().siblings().fadeOut();
},
_autoplay: function() {
var that = this;
clearInterval(this.timer);
this.timer = setInterval(function() {
that._nextSlide();
}, this.options.time);
}
};
$.fn.linkageSlider = function(option) {
return this.each(function() {
var $this = $(this),
data = $this.data('linkageSlider'),
options = typeof option === 'object' && option;
if (!data) {
$this.data('linkageSlider', (data = new LinkageSlider(this, options)));
}
if (typeof option === 'string') {
data[option]();
}
});
};
$.fn.linkageSlider.Constructor = LinkageSlider;
$.fn.linkageSlider.defaults = {
time: 5000
};
})($);
\ No newline at end of file
... ...
/**
* (品牌优选)图片幻灯片插件
* @author: wangqing(robin.wang@yoho.cn)
* @date: 205/7/2
*/
var $ = require('jquery');
(function($) {
$.fn.slider2 = function(options) {
$.fn.slider2.defaults = {
index: 0,
shownum: 3,
autoplay: false,
delaytime: 3000
};
return this.each(function() {
var opts = $.extend({}, $.fn.slider2.defaults, options);
var mr = parseInt($('.img-item').css('margin-right'));
var $banneritems = $('.img-item');
var bannerarr = [];
var _width = $banneritems.outerWidth() + mr,
_size = $banneritems.length,
j = 0;
if (_size <= 3) {
return;
}
for (j = 0; j < $banneritems.length; j++) {
bannerarr.push($banneritems[j]);
}
_size = bannerarr.length;
$(this).find('.img-list').css({
width: (_width * _size)
});
$(this).find('.next').on('click', function(e) {
var i = 0,
_obj = null;
e.preventDefault();
changePic(3, _width, function() {
for (i = 0; i < 3; i++) {
_obj = bannerarr.shift();
$('.img-item').parent().append(_obj.outerHTML);
bannerarr.push(_obj);
}
$('.img-item').first().remove();
$('.img-item').first().remove();
$('.img-item').first().remove();
$('.img-list').css({
'margin-left': '0'
});
});
});
$(this).find('.prev').on('click', function(e) {
var i = 0,
_obj = null,
offersetleft = '';
e.preventDefault();
for (i = 0; i < 3; i++) {
_obj = bannerarr.pop();
$('.img-item').parent().prepend(_obj.outerHTML);
bannerarr.unshift(_obj);
}
offersetleft = 3 * _width;
$('.img-item').last().remove();
$('.img-item').last().remove();
$('.img-item').last().remove();
$('.img-list').css({
'margin-left': -offersetleft + 'px'
});
changePic(0, _width);
});
if (opts.autoplay === true) {
autoplayrecycle(opts.index, _size, true);
}
});
function autoplay(index, limit, toright) {
if (toright === true) {
$('.next').trigger('click');
if (index === (limit - 3)) {
autoplayrecycle(--index, limit, false);
} else {
autoplayrecycle(++index, limit, true);
}
} else {
$('.prev').trigger('click');
if (index === 0) {
autoplayrecycle(++index, limit, true);
} else {
autoplayrecycle(--index, limit, false);
}
}
}
function autoplayrecycle(index, limit, toright) {
window.setTimeout(autoplay, $.fn.slider2.defaults.delaytime, index, limit, toright);
}
function changePic(index, width, callback) {
var offersetleft = -(index * width);
$('.img-list')
.animate({
'margin-left': offersetleft + 'px'
}, 'slow', callback);
}
};
}($));
\ No newline at end of file
... ...
... ... @@ -2,4 +2,12 @@
* 首页
* @author: xuqi<qi.xu@yoho.cn>
* @date: 2015/11/23
*/
\ No newline at end of file
*/
var $ = require('jquery');
require('../common/linkage-slider');
require('../common/slider2');
$('.slide-container').linkageSlider();
$('.img-brand').slider2();
\ No newline at end of file
... ...
... ... @@ -36,6 +36,12 @@ var $udPrice = $('.ud-price-range'),
//分类相关变量
var $sortSub = $('.sort-sub-wrap');
//高级选项相关变量
var $seniorSubWrap = $('.senior-sub-wrap'),
$seniorAttrWrap = $('.senior-attr-wrap');
var seniorHoverTime, hoveredIndex;
//清除checkbox选中状态
function clearChecked($checkbox) {
$checkbox.removeClass('checked').html(checkUnicode.unchecked);
... ... @@ -68,6 +74,13 @@ function uriLoc(attr, val) {
window.location.href = newHref;
}
//隐藏高级选项面板
function hideSeniorPanel(index) {
$seniorSubWrap.children('.senior-sub:eq(' + hoveredIndex + ')').addClass('hide');
$seniorAttrWrap.children('.attr:eq(' + hoveredIndex + ')').removeClass('hover');
hoveredIndex = -1;
}
//屏蔽筛选项双击文字选中
$('.filter-box').on('selectstart', '.attr, .brands-index span', function() {
return false;
... ... @@ -245,15 +258,24 @@ if ($udPrice.length > 0) {
}
//【高级选项】鼠标移入显示子项
$('.senior-attr-wrap').on('mouseenter', '.attr', function() {
$(this).children('.senior-sub').removeClass('hide');
$seniorAttrWrap.on('mouseenter', '.attr', function() {
var index = $(this).addClass('hover').index();
$seniorSubWrap.children('.senior-sub:eq(' + index + ')').removeClass('hide');
}).on('mouseleave', '.attr', function() {
$(this).children('.senior-sub').addClass('hide');
var $this = $(this),
index = $this.index();
hoveredIndex = index;
seniorHoverTime = setTimeout(function() {
hideSeniorPanel();
}, 100);
});
//【高级选项】多选
$('.senior-sub').on('click', '.multi-select', function() {
$(this).closest('.sub').addClass('multi');
$(this).closest('.senior-sub').addClass('multi');
}).on('click', '.multi-select-ok', function() {
var $btn = $(this),
$sub = $btn.closest('.senior-sub'),
... ... @@ -270,8 +292,37 @@ $('.senior-sub').on('click', '.multi-select', function() {
});
uriLoc($sub.data('attr'), val);
}).on('mouseenter', function() {
clearTimeout(seniorHoverTime);
}).on('mouseleave', function() {
hideSeniorPanel();
});
//操作栏
(function() {
var $countPerPage = $('#count-per-page'),
$countChose = $countPerPage.next('ul');
var SLIDETIME = 200;
$(document).click(function(e) {
if ($(e.target).closest('.page-count').length > 0) {
return;
}
$countChose && $countChose.slideUp(SLIDETIME);
});
$countPerPage.click(function() {
if ($countChose.css('display') === 'none') {
$countChose.slideDown(SLIDETIME);
} else {
$countChose.slideUp(SLIDETIME);
}
});
}());
/*
* Description: 商品列表移入效果
* Added by wangchenglong at 2015/12/1
... ... @@ -304,8 +355,8 @@ $goodItem.hover(function() {
$cloneStr = $(this).clone();
$goodItemWrapper =
'<div class="good-item-wrapper" style="left:' + left + 'px;top:' + top + 'px;position:absolute;">' +
'<div class="good-select-color">' +
'</div>' +
'<div class="good-select-color">' +
'</div>' +
'</div>';
... ...
... ... @@ -13,7 +13,7 @@
"spm": {
"main": "index.js",
"dependencies": {
"jquery": "2.1.4"
"jquery": "1.8.3"
},
"devDependencies": {
"expect.js": "0.3.1"
... ...
.home-page {
width: 1150px;
margin: 0 auto;
.slide-container {
margin: 10px 0 0;
img {
display: block;
}
}
.big-slide {
position: relative;
height: 450px;
overflow: hidden;
ul {
position: relative;
height: 100%;
}
&:hover {
.slide-switch {
display: block;
}
}
li {
display: none;
position: absolute;
top: 0;
right: 0;
width: 100%;
height: 100%;
&:first-child {
display: block;
}
}
.slide-switch {
display: none;
/* @include opacity(0);
@include transition-property(opacity);
@include transition-duration(.2s);
@include transition-timing-function(ease-in); */
a {
position: absolute;
top: 50%;
margin: -30px 0 0;
width: 60px;
height: 60px;
line-height: 56px;
text-align: center;
z-index: 2;
background: #fff;
@include opacity(0.55);
&.prev {
left: 0;
}
&.next {
right: 0;
}
&:hover{
@include opacity(0.9);
}
.iconfont {
font-size: 32px;
color: #59585a;
}
}
}
}
.small-slide {
margin: 6px 0 0;
padding: 0 0 0 2px;
li {
position: relative;
float: left;
margin: 0 0 0 6px;
width: 138px;
height: 54px;
&:first-child {
margin: 0;
}
&.focus {
a {
@include opacity(0);
}
}
a {
position: absolute;
left: 0;
right: 0;
bottom: 0;
top: 0;
background: #000;
@include opacity(0.3);
}
img {
width: 100%;
height: 100%;
}
}
}
.new-report {
img {
display: block;
}
.report-list {
float: left;
width: 868px;
li {
float: left;
margin: 0 8px 8px 0;
width: 185px;
height: 248px;
overflow: hidden;
&:first-child {
margin-right: 7px;
width: 282px;
height: 504px;
}
}
}
.last-item {
float: left;
width: 282px;
height: 504px;
overflow: hidden;
}
}
.img-brand {
position: relative;
width: 100%;
height: 175px;
overflow: hidden;
&:hover {
.img-brand-switch {
display: block;
}
}
ul {
width: 1158px;
}
li {
float: left;
margin: 0 8px 0 0;
width: 378px;
height: 175px;
line-height: 175px;
overflow: hidden;
font-size: 0;
text-align: center;
img {
max-width: 100%;
max-height: 100%;
vertical-align: middle;
}
}
.img-brand-switch {
display: none;
a {
position: absolute;
top: 50%;
margin: -20px 0 0;
width: 40px;
height: 40px;
line-height: 40px;
text-align: center;
z-index: 2;
background: #fff;
@include opacity(0.55);
&.prev {
left: 0;
}
&.next {
right: 0;
}
&:hover {
@include opacity(0.9);
}
}
}
}
.logo-brand {
ul {
width: 1158px;
}
li {
float: left;
margin: 8px 8px 0 0;
width: 185px;
height: 86px;
line-height: 86px;
font-size: 0;
text-align: center;
img {
max-width: 100%;
max-height: 100%;
vertical-align: middle;
}
}
.logo-brand-switch {
position: relative;
background: image-url('index/logo-brand-line.png') no-repeat center center;
line-height: normal;
.iconfont {
position: absolute;
left: 50%;
font-size: 32px;
&.prev {
top: 10px;
margin: 0 0 0 -48px;
}
&.next {
bottom: 12px;
margin: 0 0 0 20px;
}
}
}
.brand-more {
font-size: 16px;
&:hover {
text-decoration: underline;
}
}
}
.tpl-recommend{
a{
display: block;
background-color: #f8f8f8;
img{display: block;width: 100%;}
}
.tpl-nav{
float: left;
width: 185px;
height: 512px;
overflow: hidden;
.tpl-keywords{
.keywords0{
img{
height: 152px;
}
margin-bottom: 10px;
}
.keywords1{
img{
height: 86px;
}
margin-bottom: 8px;
}
}
.tpl-category{
padding: 10px 0;
background-color: #f8f8f8;
a{
float: left;
width: 50%;
height: 38px;
line-height: 38px;
text-align: center;
color: #000;
font-size: 14px;
overflow: hidden;
}
}
}
.tpl-brands{
float: left;
margin-left: 8px;
width: 378px;
height: 512px;
overflow: hidden;
li{
margin-bottom: 8px;
img{
height: 248px;
width: 100%;
}
}
}
.tpl-types{
float: left;
width: 579px;
height: 512px;
overflow: hidden;
li{
float: left;
margin-left: 8px;
margin-bottom: 8px;
img{
width: 185px;
height:248px;
}
}
}
.tpl-products{
ul{margin-left:-10px;
li{
float: left;
margin-left:10px;
img{
width: 222px;
height: 298px;
}
}
}
}
}
.commodity{
margin-left: -10px;
position: relative;
li{
float: left;
margin-left: 10px;
margin-bottom:28px;
padding-top:20px;
position: relative;
i{
position: absolute;
top: 0px;
display: block;
width: 64px;
height: 20px;
}
a{
display: block;
height: 360px;
width: 222px;
.commodity-img{
img{
display: block;
height: 298px;
width: 222px;
}
}
p.commodity-name{
font-size: 12px;
color: #000;
line-height: 40px;
text-align: center;
}
p.commodity-price{
font-size: 12px;
text-align: center;
}
}
}
.loading{
position: absolute;
bottom: 0;
width: 100%;
p{
text-align: center;
font-size: 20px;
}
}
}
.floor-header {
position: relative;
margin: 50px 0 30px;
.floor-title {
margin: 0 auto;
width: 298px;
height: 31px;
line-height: 31px;
border: 1px solid #000;
font-size: 16px;
text-align: center;
}
.header-navs {
position: absolute;
padding: 10px 0;
top: 0;
right: 0;
font-size: 14px;
li {
float: left;
padding: 1px 10px;
border-left: 1px solid #ccc;
&:first-child {
border-left: none;
}
&:hover {
text-decoration: underline;
}
a {
color: #333;
}
}
}
}
@media screen and (min-width: 1150px) {
.floor-header {
margin: 80px 0 40px;
.header-navs {
li {
padding: 1px 15px;
}
}
}
}
}
\ No newline at end of file
... ...
... ... @@ -218,18 +218,27 @@
margin-bottom: -6px;
margin-right: 5px;
}
.senior-attr-wrap > .attr {
.senior {
padding-bottom: 6px;
.attr-content {
position: relative;
}
}
.senior-attr-wrap {
position: relative;
&:hover {
> .iconfont {
visibility: hidden;
}
}
.senior-up-icon {
display: block;
}
.senior-attr-wrap > .attr:hover,
.senior-attr-wrap > .attr.hover {
> .iconfont {
visibility: hidden;
}
.senior-up-icon {
visibility: visible;
}
}
... ... @@ -238,7 +247,7 @@
position: absolute;
padding: 15px 0;
left: 0;
width: 1050px;
right: 0;
top: 39px;
background: #fff;
border: 1px solid #eaeceb;
... ... @@ -259,15 +268,14 @@
}
.senior-up-icon {
position: absolute;
width: 15px;
width: 100%;
height: 9px;
z-index: 1;
left: 50%;
margin-left: -18px;
display: none;
margin-left: -11px;
visibility: hidden;
background: image-url('product/senior-up.png') no-repeat;
background-position-x: 50%;
}
.checkbox {
... ... @@ -291,7 +299,7 @@
width: 1150px;
.good-info {
height: 400px;//todo
height: 400px; //todo
margin-bottom: 35px;
width: 222px;
margin-right: 10px;
... ... @@ -351,13 +359,13 @@
font-size: 12px;
text-align: center;
>a {
> a {
margin-top: 16px;
line-height: 1.5;
display: block;
}
>.price {
> .price {
margin-top: 10px;
}
}
... ... @@ -369,6 +377,116 @@
padding-left: 20px;
padding-top: 18px;
}
}
/*商品列表end*/
.opt-banner {
height: 48px;
background: #f5f7f6;
line-height: 48px;
margin: 10px 0;
.sort-type,
.checks {
color: #ccc;
font-size: 14px;
padding: 0 10px;
.iconfont {
font-size: 14px;
}
&.active,
&.checked {
color: #000;
}
}
.pager-wrap {
float: right;
padding: 15px 0;
}
.line-count {
float: left;
padding: 3px 1px 3px 3px;
border: 1px solid #ccc;
margin-right: 10px;
span {
float: left;
width: 5px;
height: 10px;
background: #ccc;
margin-right: 2px;
}
&.active {
border-color: #222;
span {
background: #222;
}
}
}
.page-count {
position: relative;
height: 18px;
float: left;
font-size: 12px;
line-height: 18px;
> span {
float: left;
display: block;
width: 42px;
height: 10px;
line-height: 10px;
padding: 3px;
border: 1px solid #ccc;
color: #222;
cursor: pointer;
margin-right: 10px;
}
.iconfont {
font-size: 14px;
color: #ccc;
float: right;
}
> ul {
position: absolute;
display: none;
width: 42px;
padding: 0 3px;
border-left: 1px solid #ccc;
border-right: 1px solid #ccc;
}
li {
border-bottom: 1px solid #ccc;
}
a {
display: block;
width: 100%;
}
}
.pager {
float: left;
font-size: 14px;
line-height: 15px;
margin: 0 20px;
.dis-icon {
color: #e6e6e6;
}
i {
color: #f00;
}
}
}
}
\ No newline at end of file
... ...
... ... @@ -9,6 +9,280 @@ class BoysController extends AbstractAction
public function indexAction()
{
$this->setTitle('男生首页');
$this->_view->display('index');
$tpldata = array(
'name'=>'潮人配饰 ORNAMENT',
'navs' => array(
array(
'id' => '',
'href' => '',
'name' => 'MORE'
)
),
'tplrecommend'=>array(
'keyword'=>array(array('name'=>'工装短裤','img'=>'','url'=>''),array('name'=>'英伦风','img'=>'','url'=>'')),
'category'=>array(array('name'=>'衣服','url'=>''),array('name'=>'裤子','url'=>''),array('name'=>'衣服','url'=>''),array('name'=>'裤子','url'=>''),array('name'=>'衣服','url'=>''),array('name'=>'裤子','url'=>''),array('name'=>'衣服','url'=>''),array('name'=>'裤子','url'=>''),array('name'=>'衣服','url'=>''),array('name'=>'裤子','url'=>''),array('name'=>'衣服','url'=>''),array('name'=>'裤子','url'=>'')),
'brands'=>array(array('name'=>'工装短裤','img'=>'','url'=>''),array('name'=>'英伦风','img'=>'','url'=>'')),
'types'=>array(array('name'=>'工装短裤','img'=>'','url'=>''),array('name'=>'英伦风','img'=>'','url'=>''),array('name'=>'工装短裤','img'=>'','url'=>''),array('name'=>'英伦风','img'=>'','url'=>''),array('name'=>'工装短裤','img'=>'','url'=>''),array('name'=>'英伦风','img'=>'','url'=>'')),
'products'=>array(
array(
'url' =>'http://www.muji.com.cn/cn/store/goods/4547315967308' ,
'img'=> 'http://img11.static.yhbimg.com/yhb-img01/2015/12/01/02/01c21e6610eefdc5ebd7ad890e49b09c2d.jpg',
'name'=> '优显led触控台灯',
'price'=> 168
),
array(
'url' =>'http://www.muji.com.cn/cn/store/goods/4547315967308' ,
'img'=> 'http://img11.static.yhbimg.com/yhb-img01/2015/12/01/02/01c21e6610eefdc5ebd7ad890e49b09c2d.jpg',
'name'=> '优显led触控台灯',
'price'=> 168
),
array(
'url' =>'http://www.muji.com.cn/cn/store/goods/4547315967308' ,
'img'=> 'http://img11.static.yhbimg.com/yhb-img01/2015/12/01/02/01c21e6610eefdc5ebd7ad890e49b09c2d.jpg',
'name'=> '优显led触控台灯',
'price'=> 168
),
array(
'url' =>'http://www.muji.com.cn/cn/store/goods/4547315967308' ,
'img'=> 'http://img11.static.yhbimg.com/yhb-img01/2015/12/01/02/01c21e6610eefdc5ebd7ad890e49b09c2d.jpg',
'name'=> '优显led触控台灯',
'price'=> 168
),
array(
'url' =>'http://www.muji.com.cn/cn/store/goods/4547315967308' ,
'img'=> 'http://img11.static.yhbimg.com/yhb-img01/2015/12/01/02/01c21e6610eefdc5ebd7ad890e49b09c2d.jpg',
'name'=> '优显led触控台灯',
'price'=> 168
)
)
)
);
$data = array(
'boysHomePage' => true,
'boy' => array(
'bigSlide' => array(
array(
'href' => '/?gender=1,3',
'img' => 'http://img10.static.yhbimg.com/taobaocms/2015/11/26/12/01c3b99f554ad50d9e5a9900719715c94c.jpg'
),
array(
'href' => '/?gender=1,3',
'img' => 'http://img12.static.yhbimg.com/taobaocms/2015/11/27/09/02a4f1c10e1e81574520e5c0239741a076.jpg'
)
),
'smallSlide' => array(
array(
'href' => 'http://sale.yohobuy.com/?specialsale_id=13&gender=1,3',
'img' => 'http://img13.static.yhbimg.com/taobaocms/2015/11/26/12/024a810cfa89d67569c6c3bacedba8869a.jpg?imageMogr2/thumbnail/138x54/extent/138x54/background/d2hpdGU=/position/center/quality/90'
),
array(
'href' => 'http://sale.yohobuy.com/?specialsale_id=13&gender=1,3',
'img' => 'http://img10.static.yhbimg.com/taobaocms/2015/11/27/09/015b6a29ee526edeaacd13f4a7c81475f0.jpg?imageMogr2/thumbnail/138x54/extent/138x54/background/d2hpdGU=/position/center/quality/90'
)
),
'newReport' => array(
'name' => '最新速报 NEW!',
'list' => array(
array(
'href' => '',
'img' => 'http://img11.static.yhbimg.com/yhb-img01/2015/11/27/03/0140fd98fd1c15c206d198d458e1c8e96f.jpg?imageView/1/w/377/h/504'
),
array(
'href' => '',
'img' => 'http://img11.static.yhbimg.com/yhb-img01/2015/11/30/03/01b2bd814ed65013e06790a301a0eb6408.jpg?imageView/1/w/185/h/248'
),
array(
'href' => '',
'img' => 'http://img11.static.yhbimg.com/yhb-img01/2015/11/30/03/01b2bd814ed65013e06790a301a0eb6408.jpg?imageView/1/w/185/h/248'
),
array(
'href' => '',
'img' => 'http://img11.static.yhbimg.com/yhb-img01/2015/11/30/03/01b2bd814ed65013e06790a301a0eb6408.jpg?imageView/1/w/185/h/248'
),
array(
'href' => '',
'img' => 'http://img11.static.yhbimg.com/yhb-img01/2015/11/30/03/01b2bd814ed65013e06790a301a0eb6408.jpg?imageView/1/w/185/h/248'
),
array(
'href' => '',
'img' => 'http://img11.static.yhbimg.com/yhb-img01/2015/11/30/03/01b2bd814ed65013e06790a301a0eb6408.jpg?imageView/1/w/185/h/248'
),
array(
'href' => '',
'img' => 'http://img11.static.yhbimg.com/yhb-img01/2015/11/30/03/01b2bd814ed65013e06790a301a0eb6408.jpg?imageView/1/w/185/h/248'
),
array(
'href' => '',
'img' => 'http://img11.static.yhbimg.com/yhb-img01/2015/11/27/03/0140fd98fd1c15c206d198d458e1c8e96f.jpg?imageView/1/w/377/h/504'
)
)
),
'preferenceBrand' => array(
'name' => '优选品牌 BRAND',
'imgBrand' => array(
array(
'href' => '',
'img' => 'http://img11.static.yhbimg.com/taobaocms/2015/11/30/01/01ebe6968476da9e79ddddfd28f60496c7.jpg'
),
array(
'href' => '',
'img' => 'http://img11.static.yhbimg.com/taobaocms/2015/11/30/01/01ebe6968476da9e79ddddfd28f60496c7.jpg'
),
array(
'href' => '',
'img' => 'http://img11.static.yhbimg.com/taobaocms/2015/11/30/01/01ebe6968476da9e79ddddfd28f60496c7.jpg'
),
array(
'href' => '',
'img' => 'http://img11.static.yhbimg.com/yhb-img01/2015/11/30/06/0124c4e16548b0d7aff4f0fa4ad7b13481.jpg?imageView/1/w/1150/h/450'
),
array(
'href' => '',
'img' => 'http://img11.static.yhbimg.com/yhb-img01/2015/11/30/06/0124c4e16548b0d7aff4f0fa4ad7b13481.jpg?imageView/1/w/1150/h/450'
),
array(
'href' => '',
'img' => 'http://img11.static.yhbimg.com/yhb-img01/2015/11/30/06/0124c4e16548b0d7aff4f0fa4ad7b13481.jpg?imageView/1/w/1150/h/450'
),
),
'logoBrand' => array(
array(
'href' => '',
'img' => 'http://img12.static.yhbimg.com/brandLogo/2015/03/18/16/020d4fec29ade8ccb6bc8e23b02c958a9d.jpg?imageView/2/w/185/h/86'
),
array(
'href' => '',
'img' => 'http://img12.static.yhbimg.com/brandLogo/2015/03/18/16/020d4fec29ade8ccb6bc8e23b02c958a9d.jpg?imageView/2/w/185/h/86'
),
array(
'href' => '',
'img' => 'http://img12.static.yhbimg.com/brandLogo/2015/03/18/16/020d4fec29ade8ccb6bc8e23b02c958a9d.jpg?imageView/2/w/185/h/86'
),
array(
'href' => '',
'img' => 'http://img12.static.yhbimg.com/brandLogo/2015/03/18/16/020d4fec29ade8ccb6bc8e23b02c958a9d.jpg?imageView/2/w/185/h/86'
),
array(
'href' => '',
'img' => 'http://img12.static.yhbimg.com/brandLogo/2015/03/18/16/020d4fec29ade8ccb6bc8e23b02c958a9d.jpg?imageView/2/w/185/h/86'
),
array(
'switch' => true
),
array(
'href' => '',
'img' => 'http://img12.static.yhbimg.com/brandLogo/2015/03/18/16/020d4fec29ade8ccb6bc8e23b02c958a9d.jpg?imageView/2/w/185/h/86'
),
array(
'href' => '',
'img' => 'http://img12.static.yhbimg.com/brandLogo/2015/03/18/16/020d4fec29ade8ccb6bc8e23b02c958a9d.jpg?imageView/2/w/185/h/86'
),
array(
'href' => '',
'img' => 'http://img12.static.yhbimg.com/brandLogo/2015/03/18/16/020d4fec29ade8ccb6bc8e23b02c958a9d.jpg?imageView/2/w/185/h/86'
),
array(
'href' => '',
'img' => 'http://img12.static.yhbimg.com/brandLogo/2015/03/18/16/020d4fec29ade8ccb6bc8e23b02c958a9d.jpg?imageView/2/w/185/h/86'
),
array(
'href' => '',
'img' => 'http://img12.static.yhbimg.com/brandLogo/2015/03/18/16/020d4fec29ade8ccb6bc8e23b02c958a9d.jpg?imageView/2/w/185/h/86'
),
array(
'href' => '',
'img' => 'http://img12.static.yhbimg.com/brandLogo/2015/03/18/16/020d4fec29ade8ccb6bc8e23b02c958a9d.jpg?imageView/2/w/185/h/86'
),
array(
'href' => '',
'img' => 'http://img12.static.yhbimg.com/brandLogo/2015/03/18/16/020d4fec29ade8ccb6bc8e23b02c958a9d.jpg?imageView/2/w/185/h/86'
),
array(
'href' => '',
'img' => 'http://img12.static.yhbimg.com/brandLogo/2015/03/18/16/020d4fec29ade8ccb6bc8e23b02c958a9d.jpg?imageView/2/w/185/h/86'
),
array(
'href' => '',
'img' => 'http://img12.static.yhbimg.com/brandLogo/2015/03/18/16/020d4fec29ade8ccb6bc8e23b02c958a9d.jpg?imageView/2/w/185/h/86'
),
array(
'href' => '',
'img' => 'http://img12.static.yhbimg.com/brandLogo/2015/03/18/16/020d4fec29ade8ccb6bc8e23b02c958a9d.jpg?imageView/2/w/185/h/86'
),
array(
'href' => '',
'img' => 'http://img12.static.yhbimg.com/brandLogo/2015/03/18/16/020d4fec29ade8ccb6bc8e23b02c958a9d.jpg?imageView/2/w/185/h/86'
),
array(
'more' => true,
'href' => 'http://www.yohobuy.com'
),
)
),
'recommend'=>array($tpldata,$tpldata,$tpldata),
'newArrivls' => array(
'name' => '最新上架 NEW ARRIVALS',
'navs' => array(
array(
'id' => '',
'href' => '',
'name' => 'MORE'
)
),
'commodity'=>array(
array(
'url' =>'http://www.muji.com.cn/cn/store/goods/4547315967308' ,
'img'=> 'http://img11.static.yhbimg.com/yhb-img01/2015/12/01/02/01c21e6610eefdc5ebd7ad890e49b09c2d.jpg',
'name'=> '优显led触控台灯',
'price'=> 168,
'state'=> 1 //状态
),
array(
'url' =>'http://www.muji.com.cn/cn/store/goods/4547315967308' ,
'img'=> 'http://img11.static.yhbimg.com/yhb-img01/2015/12/01/02/01c21e6610eefdc5ebd7ad890e49b09c2d.jpg',
'name'=> '优显led触控台灯',
'price'=> 168,
'state'=> 1 //状态
),
array(
'url' =>'http://www.muji.com.cn/cn/store/goods/4547315967308' ,
'img'=> 'http://img11.static.yhbimg.com/yhb-img01/2015/12/01/02/01c21e6610eefdc5ebd7ad890e49b09c2d.jpg',
'name'=> '优显led触控台灯',
'price'=> 168,
'state'=> 1 //状态
),
array(
'url' =>'http://www.muji.com.cn/cn/store/goods/4547315967308' ,
'img'=> 'http://img11.static.yhbimg.com/yhb-img01/2015/12/01/02/01c21e6610eefdc5ebd7ad890e49b09c2d.jpg',
'name'=> '优显led触控台灯',
'price'=> 168,
'state'=> 1 //状态
),
array(
'url' =>'http://www.muji.com.cn/cn/store/goods/4547315967308' ,
'img'=> 'http://img11.static.yhbimg.com/yhb-img01/2015/12/01/02/01c21e6610eefdc5ebd7ad890e49b09c2d.jpg',
'name'=> '优显led触控台灯',
'price'=> 168,
'state'=> 1 //状态
),
array(
'url' =>'http://www.muji.com.cn/cn/store/goods/4547315967308' ,
'img'=> 'http://img11.static.yhbimg.com/yhb-img01/2015/12/01/02/01c21e6610eefdc5ebd7ad890e49b09c2d.jpg',
'name'=> '优显led触控台灯',
'price'=> 168,
'state'=> 1 //状态
),
array(
'url' =>'http://www.muji.com.cn/cn/store/goods/4547315967308' ,
'img'=> 'http://img11.static.yhbimg.com/yhb-img01/2015/12/01/02/01c21e6610eefdc5ebd7ad890e49b09c2d.jpg',
'name'=> '优显led触控台灯',
'price'=> 168,
'state'=> 1 //状态
)
)
)
)
);
$this->_view->display('index', $data);
}
}
\ No newline at end of file
... ...
... ... @@ -12,231 +12,295 @@ class IndexController extends AbstractAction
{
$data = array(
'searchListPage' => true,
'filters' => array(
'checkedConditons' => array(
'conditions' => array(
'products' => array(
'filters' => array(
'checkedConditions' => array(
'conditions' => array(
array(
'href' => '',
'name' => '暗黑'
),
array(
'href' => '',
'color' => '#f00'
),
array(
'href' => '',
'name' => 'CLOT'
)
),
'clearUrl' => ''
),
'channel' => array(
array(
'href' => '',
'name' => '暗黑'
'href' => '/?gender=1,3',
'name' => 'BOYS'
),
array(
'href' => '/?gender=2,3',
'name' => 'GIRLS'
),
array(
'href' => '',
'color' => '#f00'
'name' => 'KIDS'
),
array(
'href' => '',
'name' => 'CLOT'
'name' => 'LIFESTYLE'
)
),
'clearUrl' => ''
),
'channel' => array(
array(
'href' => '/?gender=1,3',
'name' => 'BOYS'
),
array(
'href' => '/?gender=2,3',
'name' => 'GIRLS'
),
array(
'href' => '',
'name' => 'KIDS'
'sort' => array(
array(
'id' => '1',
'name' => '上衣',
'sub' => array(
array(
'href' => '',
'name' => 'T恤'
),
array(
'href' => '',
'name' => '棉袄'
),
array(
'href' => '',
'name' => '外套'
)
)
),
array(
'id' => '2',
'name' => '裤子'
),
array(
'id' => '3',
'name' => '连衣裙'
),
array(
'id' => '4',
'name' => '鞋'
)
),
array(
'href' => '',
'name' => 'LIFESTYLE'
)
),
'sort' => array(
array(
'id' => '1',
'name' => '上衣',
'sub' => array(
'brand' => array(
'default' => array(
array(
'href' => '',
'name' => 'CLOT'
),
array(
'href' => '',
'name' => 'ABLE JEANS'
),
array(
'href' => '',
'name' => 'Eight Guys'
),
array(
'href' => '',
'name' => 'FAIRWHALE JEANS'
),
array(
'href' => '',
'name' => '鬼洗'
),
array(
'href' => '',
'name' => '金银帝国Imperial Taels'
),
array(
'href' => '',
'name' => 'F.L.Y.D'
),
array(
'href' => '',
'name' => 'Tapenade特芙娜'
),
array(
'href' => '',
'name' => 'Adidas Originals'
)
),
'brandIndex' => array(
array(
'index' => 'all',
'name' => '全部'
),
array(
'index' => '0-9',
'name' => '0 ~ 9'
),
array(
'index' => 'a',
'name' => 'A'
)
),
'brandsShow' => array(
array(
'id' => '1',
'href' => '',
'index' => '0-9',
'name' => '5cm',
'key' => '5cm'
),
array(
'id' => '2',
'href' => '',
'name' => 'T恤'
'index' => 'k',
'name' => 'KTZ',
'key' => 'ktz'
),
array(
'id' => '3',
'href' => '',
'name' => '棉袄'
'index' => 't',
'name' => 'Tapenade特芙娜',
'key' => 'tapenade特芙娜'
),
array(
'id' => '4',
'href' => '',
'name' => '外套'
'index' => 'j',
'name' => '金银帝国Imperial Taels',
'key' => '金银帝国imperial taels'
),
array(
'id' => '5',
'href' => '',
'index' => 'a',
'name' => 'ABLE JEANS',
'key' => 'able jeans'
)
)
),
array(
'id' => '2',
'name' => '裤子'
),
array(
'id' => '3',
'name' => '连衣裙'
),
array(
'id' => '4',
'name' => '鞋'
)
),
'brand' => array(
'default' => array(
'price' => array(
array(
'href' => '',
'name' => 'CLOT'
'name' => '0-239'
),
array(
'href' => '',
'name' => 'ABLE JEANS'
),
'name' => '240-329'
)
),
'color' => array(
array(
'href' => '',
'name' => 'Eight Guys'
'name' => '黑色',
'rgb' => '#000'
),
array(
'href' => '',
'name' => 'FAIRWHALE JEANS'
'name' => '红色',
'rgb' => '#f00'
)
),
'size' => array(
array(
'href' => '',
'name' => 'S'
),
array(
'href' => '',
'name' => '鬼洗'
'name' => 'L'
)
),
'seniorChose' => array(
array(
'attr' => 'style',
'name' => '风格',
'showMulti' => true,
'sub' => array(
array(
'id' => '1',
'href' => '',
'name' => '街头'
),
array(
'id' => '2',
'href' => '',
'name' => '简约'
)
)
),
array(
'attr' => 'weather',
'name' => '适用季节',
'sub' => array(
array(
'id' => '1',
'href' => '',
'name' => '春天'
),
array(
'id' => '2',
'href' => '',
'name' => '夏天'
)
)
)
)
),
'opts' => array(
'sortType' => array(
array(
'href' => '',
'name' => '金银帝国Imperial Taels'
'name' => '默认'
),
array(
'active' => true,
'href' => '',
'name' => 'F.L.Y.D'
'name' => '最新',
'hasSortOrient' => true,
'desc' => true
),
array(
'href' => '',
'name' => 'Tapenade特芙娜'
'name' => '价格',
'hasSortOrient' => true
),
array(
'href' => '',
'name' => 'Adidas Originals'
'name' => '折扣',
'hasSortOrient' => true
)
),
'brandIndex' => array(
'checks' => array(
array(
'index' => 'all',
'name' => '全部'
'name' => '新品',
'checked' => true,
'href' => ''
),
array(
'index' => '0-9',
'name' => '0 ~ 9'
'name' => '打折',
'href' => ''
),
array(
'index' => 'a',
'name' => 'A'
'name' => '限量',
'checked' => true,
'href' => ''
)
),
'brandsShow' => array(
array(
'id' => '1',
'href' => '',
'index' => '0-9',
'name' => '5cm',
'key' => '5cm'
),
array(
'id' => '2',
'href' => '',
'index' => 'k',
'name' => 'KTZ',
'key' => 'ktz'
),
'fivePerLine' => true,
'sixPerLineHref' => '',
'countPerPage' => '120',
'pageCounts' => array(
array(
'id' => '3',
'href' => '',
'index' => 't',
'name' => 'Tapenade特芙娜',
'key' => 'tapenade特芙娜'
'count' => 60
),
array(
'id' => '4',
'href' => '',
'index' => 'j',
'name' => '金银帝国Imperial Taels',
'key' => '金银帝国imperial taels'
'count' => 100
),
array(
'id' => '5',
'href' => '',
'index' => 'a',
'name' => 'ABLE JEANS',
'key' => 'able jeans'
)
)
),
'price' => array(
array(
'href' => '',
'name' => '0-239'
),
array(
'href' => '',
'name' => '240-329'
)
),
'color' => array(
array(
'href' => '',
'name' => '黑色',
'rgb' => '#000'
),
array(
'href' => '',
'name' => '红色',
'rgb' => '#f00'
)
),
'size' => array(
array(
'href' => '',
'name' => 'S'
),
array(
'href' => '',
'name' => 'L'
)
),
'seniorChose' => array(
array(
'attr' => 'style',
'name' => '风格',
'showMulti' => true,
'sub' => array(
array(
'id' => '1',
'href' => '',
'name' => '街头'
),
array(
'id' => '2',
'href' => '',
'name' => '简约'
)
'count' => 120
)
),
array(
'attr' => 'weather',
'name' => '适用季节',
'sub' => array(
array(
'id' => '1',
'href' => '',
'name' => '春天'
),
array(
'id' => '2',
'href' => '',
'name' => '夏天'
)
)
)
'curPage' => 1,
'pageCount' => 30,
'nextHref' => 'hello'
)
),
'goods' => array(
... ...