店铺首页

@@ -23,28 +23,28 @@ const _getShopData = (shopId, uid, isApp) => {
     let channel = req.yoho.channel;
     let channel = req.yoho.channel;
     isApp = isApp || '';
     isApp = isApp || '';
 
 
-    //Promise.all([searchModel.getShopDecorator(shopId),searchModel.getShopInfo(shopId, uid)]).then((result) => {
-    //    data = {
-    //        decorator: result[0], // 店铺装修资源数据
-    //        shopInfo: result[1] // 店铺信息
-    //    };
-    //
-    //    // 店铺使用基础模板，返回品牌页面
-    //    if (data.shopInfo.data.shopTemplateType && data.shopInfo.data.shopTemplateType ===1) {
-    //        return {
-    //            goBrand: data.shopInfo.data
-    //        }
-    //    }
-    //
-    //    // 店铺分类
-    //    return searchModel.getShopCategory(shopId, channel);
-    //}).then(shopCategory => {
-    //    _.assign({
-    //        shopCategory: shopCategory
-    //    }, data);
-    //
-    //    return searchModel.formShopData(data, shopId, isApp); // 组织楼层数据
-    //});
+    Promise.all([searchModel.getShopDecorator(shopId),searchModel.getShopInfo(shopId, uid)]).then((result) => {
+        data = {
+            decorator: result[0], // 店铺装修资源数据
+            shopInfo: result[1] // 店铺信息
+        };
+
+        // 店铺使用基础模板，返回品牌页面
+        if (data.shopInfo.data.shopTemplateType && data.shopInfo.data.shopTemplateType ===1) {
+            return {
+                goBrand: data.shopInfo.data
+            }
+        }
+
+        // 店铺分类
+        return searchModel.getShopCategory(shopId, channel);
+    }).then(shopCategory => {
+        _.assign({
+            shopCategory: shopCategory
+        }, data);
+
+        return searchModel.formShopData(data, shopId, isApp); // 组织楼层数据
+    });
 };
 };
 
 
 /**
 /**

@@ -421,7 +421,7 @@ const getShopCategory = (shopId, channel) => {
  * 组织店铺页面数据
  * 组织店铺页面数据
  * @param {array} data 接口返回的店铺页所需数据
  * @param {array} data 接口返回的店铺页所需数据
  * @param {int} shopId 店铺id
  * @param {int} shopId 店铺id
- * @param {int} isAap app版本
+ * @param {int} isApp app版本
  * @return array
  * @return array
  */
  */
 const formShopData = (data, shopId, isApp) => {
 const formShopData = (data, shopId, isApp) => {

@@ -61,5 +61,6 @@ router.get('/search/search', search.search);
 router.get('/index/index', search.category);
 router.get('/index/index', search.category);
 router.get('/index/brand', search.brand);
 router.get('/index/brand', search.brand);
 router.post('/opt/favoriteBrand', search.favoriteBrand);
 router.post('/opt/favoriteBrand', search.favoriteBrand);
+router.get('/opt/favoriteBrand', search.favoriteBrand);
 
 
 module.exports = router;
 module.exports = router;

+{{# shopIndex}}
+    <div class="shop-index yoho-page" id="wrapper">
+        <div id="scroller">
+            <div id="nav-top">
+                {{!--{{# headerBanner}}
+                    {{> resources/banner-top}}
+                {{/ headerBanner}}--}}
+                <div class="search-area">
+                    <div id="search-input" class="search-input">
+                        <form id="search-form" action={{url}} method="get">
+                            <i class="search-icon iconfont">&#xe60f;</i>
+                            <input type="text" placeholder="搜索店铺内潮品" name="query" class="buriedpoint" data-bp-id="shop_search_input_1">
+                            <input type="hidden" name="from" value="search">
+                            <i class="clear-input iconfont hide">&#xe626;</i>
+                            <span id="search" class="search buriedpoint" type="submit" data-bp-id="shop_search_btn_0">搜索</span>
+                        </form>
+                    </div>
+                </div>
+                <div class="branner-top">
+                    <img src="{{branerImg}}">
+                    <img class="logo" src=""></div>
+                    <p class="name">Vans专营店</p>
+                    <div class="collect"></div>
+                </div>
+            </div>
+
+            <ul id="nav" class="nav">
+                <li class="active color buriedpoint" tab="home-page" data-bp-id="shop_nav_index_1">首页</li>
+                <li tab="new-arrival" class="buriedpoint" data-bp-id="shop_nav_new_1">上新</li>
+                <li tab="popularity" class="buriedpoint" data-bp-id="shop_nav_populary_1">人气</li>
+                <li class="buriedpoint" data-bp-id="shop_nav_all_1">
+                    <a href="#" target="_blank">全部商品</a>
+                </li>
+            </ul>
+
+            <div id="home-page">
+                <div id="nav-main" class="main">
+                    {{#unless  brands}}
+                    <div class="multi-brands">
+                        <h2>品牌一览</h2>
+                        <div class="multi-browse">
+                            <ul class="swiper-wrapper">
+                                {{#each multiList}}
+                                    <li class="swiper-slide brand-img buriedpoint" data-bp-id="shop_brand_{{img}}_0">
+                                        <a href="{{url}}">
+                                            <img src="{{img}}">
+                                        </a>
+                                        <p>{{brandName}}</p>
+                                    </li>
+                                {{/each}}
+                            </ul>
+                        </div>
+                    </div>
+                    {{/unless}}
+
+                    <div class="banner-area">
+                        {{# bannerTop}}
+                            {{> home/banner_top}}
+                        {{/ bannerTop}}
+                    </div>
+
+                    <ul class="spring">
+                        {{#each spring}}
+                        <li class="buriedpoint" data-bp-id="shop_spring_{{img}}_0" >
+                            <a href="{{url}}">
+                                <img src="{{springType}}">
+                            </a>
+                        </li>
+                        {{/each}}
+                    </ul>
+
+                    {{! 热门品类}}
+                    {{# hotCategory}}
+                        {{> resources/hot-category}}
+                    {{/ hotCategory}}
+
+                    <div class="popularity-title">
+                        人气单品
+                        <a class="more" href="{{more_url}}">&#xe618;</a>
+                    </div>
+
+                    <ul class="product-list">
+                        {{#each hotList}}
+                        <li class="buriedpoint" data-bp-id="shop_hotcategory_{{listUrl}}_0">
+                            <a href="{{url}}">
+                                <img src="{{listUrl}}">
+                            </a>
+                            <div class="list-price">
+                                <p>VANS AP M BERZE</p>
+                                <p><span class="red">{{originalPrice}}</span>
+                                <span>{{presentPrice}}</span>
+                                </p>
+                            </div>
+                        </li>
+                        {{/each}}
+                    </ul>
+                </div>
+
+                <div class="discount-area">
+                    {{> shop/goods-nav-top}}
+                </div>
+            </div>
+            <div id="new-arrival" class=""></div>
+            <div id="popularity" class=""></div>
+        </div>
+        {{> shop/shop-footer}}
+        <ul id="pos-nav" class="nav hide">
+            <li class="active color buriedpoint" data-bp-id="shop_nav_index_1">首页</li>
+            <li class="buriedpoint" data-bp-id="shop_nav_new_1">上新</li>
+            <li class="buriedpoint" data-bp-id="shop_nav_populary_1">人气</li>
+            <li class="buriedpoint" data-bp-id="shop_nav_all_1">
+                <a href="#" target="_blank">全部商品</a>
+            </li>
+        </ul>
+
+        <ul id="pos-list " class="list-nav hide">
+            <li class="new active buriedpoint"  data-bp-id="shop_listnav_new_1">
+                <a href="javascript:void(0);">
+                    <span class="spanTest">最新</span>
+                    <span class="iconfont cur">&#xe616;</span>
+                </a>
+            </li>
+            <li class="price buriedpoint"  data-bp-id="shop_listnav_price_1">
+                <a href="javascript:void(0);">
+                    <span class="spanTest">价格</span>
+                    <span class="icon">
+                        <i class="iconfont up cur">&#xe615;</i>
+                        <i class="iconfont down">&#xe616;</i>
+                    </span>
+                </a>
+            </li>
+            <li class="discount buriedpoint"  data-bp-id="shop_listnav_discount_true">
+                <a href="javascript:void(0);">
+                    <span class="spanTest">折扣</span>
+                    <span class="icon">
+                        <i class="iconfont up cur">&#xe615;</i>
+                        <i class="iconfont down">&#xe616;</i>
+                    </span>
+                </a>
+            </li>
+            <li class="filter buriedpoint"  data-bp-id="shop_listnav_filter_1">
+                <a href="javascript:void(0);">
+                    <span class="spanTest">筛选</span>
+                    <span class="iconfont cur">&#xe613;</span>
+                </a>
+            </li>
+        </ul>
+    </div>
+{{/ shopIndex}}

+<ul id="list-nav" class="home-sub-nav list-nav clearfix">
+    <li data-bp-id="shop_listnav_new_1" class="new active buriedpoint">
+        <a href="javascript:void(0);">
+            <span class="spanTest">最新</span>
+            <span class="iconfont cur">&#xe616;</span>
+        </a>
+    </li>
+    <li class="price buriedpoint" data-bp-id="shop_listnav_price_1">
+        <a href="javascript:void(0);">
+            <span class="spanTest">价格</span>
+            <span class="icon">
+                <i class="iconfont up cur">&#xe615;</i>
+                <i class="iconfont down">&#xe616;</i>
+            </span>
+        </a>
+    </li>
+    <li class="discount buriedpoint" data-bp-id="shop_listnav_discount_1">
+        <a href="javascript:void(0);">
+            <span class="spanTest">折扣</span>
+            <span class="icon">
+                <i class="iconfont up cur">&#xe615;</i>
+                <i class="iconfont down">&#xe616;</i>
+            </span>
+        </a>
+    </li>
+    <li class="filter buriedpoint" data-bp-id="shop_listnav_filter_1">
+        <a href="javascript:void(0);">
+            <span class="spanTest">筛选</span>
+            <span class="iconfont cur">&#xe613;</span>
+        </a>
+    </li>
+</ul>
+
+<div id="goods-container" class="goods-container">
+    <div class="new-goods container clearfix">
+        {{# goods}}
+            {{> common/goods}}
+        {{/ goods}}
+    </div>
+    <div class="price-goods container hide clearfix"></div>
+    <div class="discount-goods container hide clearfix"></div>
+
+    {{> common/filter}}
+</div>

+<div class="shop-foot-wrapper">
+    <ul{{#if brandList}} class="foot-list-3"{{/if}}>
+        <li data-bp-id="shop_footnav_one_1" class="buriedpoint">
+            {{#if shopCategory.url}}
+                <a href="{{shopCategory.url}}">商品分类</a>
+            {{^}}
+                商品分类
+                <div class="sub-group hide">
+                    <dl>
+                        {{# shopCategory.list}}
+                        <dd data-bp-id="shop_subgroup_{{name}}_1" class="buriedpoint"><a href="{{url}}">{{name}}</a></dd>
+                        {{/ shopCategory.list}}
+                    </dl>
+                    <div class="sharp"></div>
+                </div>
+            {{/if}}
+            <div class="wall"></div>
+        </li>
+        {{#if brandList}}
+        <li data-bp-id="shop_footnav_two_1" class="buriedpoint">
+            {{#if brandList.url}}
+                <a href="{{brandList.url}}">品牌一览</a>
+            {{^}}
+                品牌一览
+                <div class="sub-group hide">
+                    <dl>
+                        {{# brandList.list}}
+                        <dd><a href="{{url}}" data-bp-id="shop_subgroup_{{brandName}}_1" class="buriedpoint">{{brandName}}</a></dd>
+                        {{/ brandList.list}}
+                    </dl>
+                    <div class="sharp"></div>
+                </div>
+            {{/if}}
+            <div class="wall"></div>
+        </li>
+        {{/if}}
+        <li data-bp-id="shop_footnav_three_1" class="buriedpoint">
+            <a href="{{shopIntroHref}}">店铺简介</a>
+        </li>
+    </ul>
+</div>

+request('../shop/shop');

+/**
+ * 品牌店铺首页
+ */
+
+var $ = require('jquery'),
+    IScroll = require('iscroll/iscroll-probe'),
+    lazyLoad = require('yoho.lazyload'),
+    Swiper = require('yoho.iswiper'),
+    bannerSwiper,
+    multiSwiper,
+    myScroll,
+    imgH,
+    nav1H,
+    main1H,
+    main1oH,
+    nav2H,
+    main2oH,
+    scH,
+    $nav1 = $('#pos-nav'),
+    $nav2 = $('#pos-list'),
+    sTop;
+
+var tip = require('../plugin/tip'),
+    filter = require('../plugin/filter'),
+    loading = require('../plugin/loading');
+
+var $subNav = $('.home-sub-nav'),
+    $goodsContainer = $('#goods-container'),
+    $goodsChildren = $goodsContainer.children(),
+    $ngc = $($goodsChildren.get(0)),
+    $pgc = $($goodsChildren.get(1)),
+    $dgc = $($goodsChildren.get(2)),
+    shopId = $('input[name="shop_id"]').val(),
+    appVersion = $('input[name="app_version"]').val(),
+    brand = $('input[name="brand"]').val(),
+    favId = $('input[name="favId"]').val();
+
+var winH = $(window).height(),
+    noResult = '<p class="no-result">未找到相关搜索结果</p>';
+
+//默认筛选条件
+var defaultOpt = require('./query-param');
+
+var $listNav = $('#list-nav'),
+
+    //导航数据信息
+    navInfo = {
+        new: {
+            order: 1,
+            reload: true,
+            page: 1,
+            end: false
+        },
+        hot: {
+            order: 1,
+            reload: true,
+            page: 1,
+            end: false
+        },
+        newest: {
+            order: 1,
+            reload: true,
+            page: 0,
+            end: false
+        },
+        price: {
+            order: 1,
+            reload: true,
+            page: 0,
+            end: false
+        },
+        discount: {
+            order: 1,
+            reload: true,
+            page: 0,
+            end: false
+        }
+    },
+    $pre = $listNav.find('.active'), //纪录进入筛选前的active项，初始为选中项
+    searching;
+
+var viewType = 1,// 1-首页,2-上新,3-人气
+    listCount = $('.category-list li').length,
+    listModValue = 4 - listCount % 4,
+    listIndex;
+
+lazyLoad($('img.lazy'));
+
+//焦点效果
+if ($('.banner-swiper').find('li').size() > 1) {
+    bannerSwiper = new Swiper('.banner-swiper', {
+        lazyLoading: true,
+        lazyLoadingInPrevNext: true,
+        loop: true,
+        autoplay: 3000,
+        autoplayDisableOnInteraction: false,
+        paginationClickable: true,
+        slideElement: 'li',
+        pagination: '.banner-top .pagination-inner'
+    });
+}
+
+if ($('.multi-browse').find('li').size() > 1) {
+    multiSwiper = new Swiper('.multi-browse', {
+        lazyLoading: true,
+        lazyLoadingInPrevNext: true,
+        lazyLoadingOnTransitionStart: true,
+        grabCursor: true,
+        slidesPerView: 'auto',
+        slideElement: 'li',
+        watchSlidesVisibility: true
+    });
+}
+
+//根据热门品类的个数来改变样式展示
+//
+if ($('.category-list li').length % 4 !== 0) {
+    $('.category-list li:last-child').addClass('category-list-last-li');
+}
+
+if ($('.category-list li').length < 4) {
+    $('.category-list').addClass('category-list-top-board');
+    $('.category-list').find('.buriedpoint').addClass('category-list-only-one-row');
+}
+
+if ($('.category-list li').length >= 5) {
+    for (listIndex = listModValue; listIndex >= 0; listIndex--) {
+        $('.category-list li').eq(listCount - 4 + listIndex - 1).addClass('category-list-last-full-row');
+    }
+}
+
+function getPageGoods(info) {
+    var nav,navType;
+
+    if (searching) {
+        return;
+    }
+
+    navType = info.data.type;
+    nav = navInfo[navType];
+
+    //不需要重新加载并且数据请求结束
+    if (nav.end) {
+
+        return;
+    }
+
+    searching = true;
+    $.ajax({
+        type: 'GET',
+        url: info.url,
+        data: info.data,
+        success: function(data) {
+            if (data === ' ') {
+                nav.end = true;
+            }
+
+            info.callBack(data);
+        },
+        error: function() {
+            alert('网络断开连接了~');
+            searching = false;
+        }
+    });
+}
+
+function getParam(req) {
+    if (brand) {
+        req.data.brand = brand;
+    }
+
+    if (shopId) {
+        req.data.shop_id = shopId;
+    }
+}
+
+function newData(callback) {
+    var req = {};
+
+    req.url = '/index/search/search';
+    req.data = {
+        type: 'newest',
+        order: '1',
+        page: navInfo.new.page,
+        tagNew: '1'
+    };
+
+    getParam(req);
+
+    req.callBack = function(data) {
+        $('#new-arrival').append(data);
+        navInfo.new.page++;
+        myScroll.refresh();
+        lazyLoad($('#new-arrival .lazy'));
+        scH = $('#scroller').outerHeight();
+        searching = false;
+        callback && $.isFunction(callback) && callback();
+    };
+    getPageGoods(req);
+}
+
+function hotData(callback) {
+    var req = {};
+
+    req.url = '/index/search/search';
+    req.data = {
+        type: 'hot',
+        order: '1',
+        page: navInfo.hot.page,
+        showTag: '1'
+    };
+
+    getParam(req);
+
+    req.callBack = function(data) {
+        $('#popularity').append(data);
+        navInfo.hot.page++;
+        myScroll.refresh();
+        lazyLoad($('#popularity .lazy'));
+        scH = $('#scroller').outerHeight();
+        searching = false;
+        callback && $.isFunction(callback) && callback();
+    };
+    getPageGoods(req);
+}
+
+function tabChange(dom, index) {
+    var li = dom.eq(index);
+
+    dom.removeClass('active');
+    li.addClass('active');
+
+    dom.removeClass('color');
+    li.addClass('color');
+}
+
+//首页导航
+$.jqtab = function(nav, posNav, main) {
+
+    $(nav + ' li, ' + posNav + ' li').not('li.all-goods').on('touchstart', function() {
+
+        var index = $(this).index(),
+            activeTab = $(this).attr('tab');
+
+        $nav1.removeClass('fixed-top');
+        tabChange($(nav + ' li'), index);
+        tabChange($(posNav + ' li'), index);
+        $(main).hide();
+        $('#' + activeTab).fadeIn();
+        if (activeTab === 'new-arrival') {
+            newData();
+            viewType = 2;
+        } else if (activeTab === 'popularity') {
+            hotData();
+            viewType = 3;
+        } else if (activeTab === 'home-page') {
+
+            myScroll && myScroll.refresh();
+            scH = $('#scroller').outerHeight();
+            $nav1.removeClass('fixed-top');
+            $nav1.removeClass('absolute');
+            $nav2.removeClass('fixed-top');
+            $nav2.removeClass('absolute');
+        }
+        if (!$nav1.hasClass('hide')) {
+            myScroll.scrollTo(0, 0 - imgH);
+        }
+        $nav1.addClass('hide');
+    });
+};
+$.jqtab('#nav', '#pos-nav', '.main');
+$('#wrapper').addClass('scroll-wrapper');
+
+// lazyLoad($('img.lazy'));
+
+myScroll = new IScroll('#wrapper', {
+    probeType: 3,
+    mouseWheel: true,
+    click: true
+});
+myScroll.on('scroll', function() {
+    var scrollCall,
+        sTop = -this.y;
+
+    if (sTop + winH * 2 > scH) {
+        switch (viewType) {
+            case 2:
+                scrollCall = function() {
+                    $nav1.css({
+                        transform: 'translate(0, ' + (-scH) + 'px)'
+                    });
+                };
+                newData(scrollCall);
+                break;
+            case 3:
+                scrollCall = function() {
+                    $nav1.css({
+                        transform: 'translate(0, ' + (-scH) + 'px)'
+                    });
+                };
+                hotData(scrollCall);
+                break;
+        }
+    }
+
+    if (sTop < imgH) {
+        if (!$nav1.hasClass('hide')) {
+            $nav1.addClass('hide');
+        }
+        if (!$nav2.hasClass('hide')) {
+            $nav2.addClass('hide');
+        }  //滑动距离不到导航1
+    } else if (sTop < imgH + nav1H + main1oH) {
+        if ($nav1.hasClass('hide')) {
+            $nav1.removeClass('hide');
+        }
+        if (!$nav2.hasClass('hide')) {
+            $nav2.addClass('hide');
+        }//滑动距离不到导航2
+
+        if (sTop < imgH + main1H) {
+            if (!$nav1.hasClass('fixed-top')) {
+                $nav1.addClass('fixed-top')
+                    .removeClass('absolute')
+                    .css({
+                        transform: 'translate(0, ' + (-scH) + 'px)'
+                    });
+            }
+        } else if (sTop < imgH + nav1H + main1H) {
+            if ($('#home-page').is(':hidden')) {
+                return false;
+            }
+            if (!$nav1.hasClass('absolute')) {
+                $nav1.addClass('absolute')
+                    .removeClass('fixed-top');
+            }
+            $nav1.css({
+                transform: 'translate(0, ' + (imgH + main1H - sTop - scH) + 'px)'
+            });
+        }
+    } else {
+        if ($('#home-page').is(':hidden')) {
+            return false;
+        }
+
+        if (!$nav1.hasClass('hide')) {
+            $nav1.addClass('hide');
+        }
+        if ($nav2.hasClass('hide')) {
+            $nav2.removeClass('hide');
+        }
+
+        if (sTop < scH) {
+            if (!$nav2.hasClass('absolute')) {
+                $nav2.addClass('absolute')
+                    .removeClass('fixed-top');
+            }
+            $nav2.css({
+                transform: 'translate(0, ' + (-scH) + 'px)'
+            });
+        }
+    }
+    $('#scroller').trigger('scroll');
+});
+
+
+
+document.addEventListener('touchmove', function(e) {
+    e.preventDefault();
+}, false);
+
+/*if (!isIphone) {
+    return;
+}*/
+
+
+//window onload 后重新refresh iscroll
+$(window).load(function() {
+    myScroll && myScroll.refresh();
+    imgH = $('#nav-top').outerHeight();
+    nav1H = $('#nav').outerHeight();
+    main1H = $('#nav-main').height();
+    main1oH = $('#nav-main').outerHeight();
+    nav2H = $('#list-nav').outerHeight();
+    main2oH = $('#goods-container').outerHeight();
+    setTimeout(function() {
+        scH = $('#scroller').outerHeight();
+    }, 1000);
+});
+
+function bindGoodThumbClick() {
+    $(document).trigger('rebindBpEvent');
+}
+
+function search(opt) {
+    var setting = {},
+        ext,
+        att,
+        nav, navType,
+        page;
+
+    if (searching) {
+        return;
+    }
+
+    if (!opt.url) {
+        opt.url = '/index/search/search';
+    }
+
+    if (!opt.nextPage) {
+
+        //筛选项变更则重置reload为true
+        for (att in navInfo) {
+            if (navInfo.hasOwnProperty(att)) {
+                navInfo[att].reload = true;
+            }
+        }
+
+        $listNav.children('.active').removeClass('active');
+        $pre.addClass('active');
+        if (opt.hasOwnProperty('id')) {
+            switch (opt.type) {
+                case 'shop_id':
+                    ext = {
+                        shop_id: opt.id
+                    };
+                    break;
+                case 'gender':
+                    ext = {
+                        gender: opt.id
+                    };
+                    break;
+                case 'brand':
+                    ext = {
+                        brand: opt.id
+                    };
+                    break;
+                case 'sort':
+                    ext = {
+                        sort: opt.id
+                    };
+                    break;
+                case 'color':
+                    ext = {
+                        color: opt.id
+                    };
+                    break;
+                case 'size':
+                    ext = {
+                        size: opt.id
+                    };
+                    break;
+                case 'price':
+                    ext = {
+                        price: opt.id
+                    };
+                    break;
+                case 'discount':
+                    ext = {
+                        discount: opt.id
+                    };
+                    break;
+                case 'ageLevel':
+                    ext = {
+                        age_level: opt.id
+                    };
+                    break;
+            }
+            $.extend(defaultOpt, ext); //扩展筛选项
+        }
+    }
+
+    //导航类别
+    if ($pre.hasClass('new')) {
+        navType = 'newest';
+    } else if ($pre.hasClass('price')) {
+        navType = 'price';
+    } else if ($pre.hasClass('discount')) {
+        navType = 'discount';
+    }
+    nav = navInfo[navType];
+
+    page = nav.page + 1;
+    if (nav.reload) {
+        page = 1;
+    } else if (nav.end) {
+
+        //不需要重新加载并且数据请求结束
+        return;
+    }
+    $.extend(setting, defaultOpt, {
+        type: navType,
+        order: nav.order,
+        page: page
+    });
+
+    if (brand) {
+        setting.brand = brand;
+    }
+    if (shopId) {
+        setting.shop_id = shopId;
+    }
+
+    searching = true;
+    loading.showLoadingMask();
+
+    $.ajax({
+        type: 'GET',
+        url: opt.url ? opt.url : '',
+        data: setting,
+        success: function(data) {
+            var $container,
+                num;
+
+            switch (navType) {
+                case 'newest':
+                    $container = $ngc;
+                    break;
+                case 'price':
+                    $container = $pgc;
+                    break;
+                case 'discount':
+                    $container = $dgc;
+                    break;
+            }
+
+            if (data === ' ') {
+                nav.end = true;
+
+                if (nav.reload) {
+                    $container.html(noResult);
+                }
+            } else {
+                if (nav.reload) {
+                    $container.html(data);
+                    lazyLoad($container.find('.lazy'));
+                } else {
+                    num = $container.find('.good-info').length;
+                    $container.append(data);
+                    lazyLoad($container.find('.good-info:gt(' + (num - 1) + ') .lazy'));
+                }
+            }
+
+            nav.reload = false;
+            nav.page = page;
+
+            searching = false;
+            loading.hideLoadingMask();
+
+            window.rePosFooter();
+
+            setTimeout(function() {
+                myScroll.refresh();
+                scH = $('#scroller').outerHeight();
+            }, 1000);
+            bindGoodThumbClick();
+        },
+        error: function() {
+            tip.show('网络断开连接了~');
+            searching = false;
+            loading.hideLoadingMask();
+        }
+    });
+}
+
+/**
+ * 获取url参数
+ */
+function getQueryString(name) {
+    var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)', 'i');
+    var r = window.location.search.substr(1).match(reg);
+
+    if (r != null) {
+        return window.unescape(r[2]);
+    }
+    return null;
+}
+
+$.ajax({
+    type: 'GET',
+    url: '/search/filter',
+    data: {
+        shop_id: brand ? '' : shopId,
+        brand: brand,
+        gender: getQueryString('gender'),
+        channel: getQueryString('channel')
+    },
+    success: function(data) {
+        $goodsContainer.append(data);
+
+        //初始化filter&注册filter回调
+        filter.initFilter({
+            fCbFn: search,
+            hCbFn: function() {
+
+                //切换active状态到$pre上
+                $pre.addClass('active');
+                $pre.siblings('.filter').removeClass('active');
+            },
+            missStatus: true
+        });
+
+        setTimeout(function() {
+            myScroll.refresh();
+            scH = $('#scroller').outerHeight();
+        }, 1000);
+    }
+});
+
+$listNav.bind('contextmenu', function(e) {
+    return false;
+});
+
+$subNav.on('touchend touchcancel', function(e) {
+    var $this = $(e.target).closest('li'),
+        cname,
+        nav,
+        navType,
+        $active;
+    var bpIdData = $this.attr('data-bp-id') || '';
+
+    e.preventDefault();
+    $(document).trigger('shouldSendBpData', [bpIdData]);
+
+    if (typeof $this === 'undefined' || $this.length === 0) {
+        return;
+    }
+
+    if ($this.hasClass('filter')) {
+
+        //筛选面板切换状态
+        if ($this.hasClass('active')) {
+            filter.hideFilter();
+
+            //点击筛选钱的active项回复active
+            $pre.addClass('active');
+            $this.removeClass('active');
+        } else {
+            $pre = $this.siblings('.active');
+
+            $pre.removeClass('active');
+            $this.addClass('active');
+
+            filter.showFilter();
+        }
+    } else {
+        if ($this.hasClass('new')) {
+            cname = '.new';
+            navType = 'newest';
+        } else if ($this.hasClass('price')) {
+            cname = '.price';
+            navType = 'price';
+        } else if ($this.hasClass('discount')) {
+            cname = '.discount';
+            navType = 'discount';
+        }
+
+        nav = navInfo[navType];
+
+        if ($this.hasClass('active')) {
+
+            //最新无排序切换
+            if ($this.hasClass('new')) {
+                return;
+            }
+
+            if ($this.hasClass('price') || $this.hasClass('discount')) {
+                $this = $subNav.find(cname);
+
+                // 价格/折扣切换排序状态
+                $this.find('.icon > .iconfont').toggleClass('cur');
+                $pre = $this; //更新pre为当前项
+                nav.reload = true; //重置reload,HTML会被替换为逆序的HTML
+                nav.order = nav.order === 0 ? 1 : 0; //切换排序
+
+                $goodsContainer.children('.container:not(.hide)').addClass('hide');
+
+                switch (navType) {
+                    case 'newest':
+                        $ngc.removeClass('hide');
+                        break;
+
+                    case 'price':
+                        $pgc.removeClass('hide');
+                        break;
+
+                    case 'discount':
+                        $dgc.removeClass('hide');
+                        break;
+                }
+
+            }
+        } else {
+            $active = $subNav.find('.active');
+
+            $pre = $this; //$pre为除筛选导航的其他导航项，若当前active的为筛选，则把$pre置为当前点击项
+
+            if ($active.hasClass('filter')) {
+
+                //若之前active项为筛选，则隐藏筛选面板
+                filter.hideFilter();
+            } else {
+
+                //切换container显示
+                $goodsContainer.children('.container:not(.hide)').addClass('hide');
+
+                switch (navType) {
+                    case 'newest':
+                        $ngc.removeClass('hide');
+                        break;
+
+                    case 'price':
+                        $pgc.removeClass('hide');
+                        break;
+
+                    case 'discount':
+                        $dgc.removeClass('hide');
+                        break;
+                }
+            }
+
+            $subNav.children().removeClass('active');
+            $subNav.find(cname).addClass('active');
+        }
+
+        if (nav.reload) {
+            search({
+                type: 'shop_id',
+                id: shopId,
+                brand: brand,
+                url: '/index/search/search',
+                nextPage: false
+            });
+        }
+    }
+    e.stopPropagation();
+});
+
+
+function scrollHandler() {
+
+    sTop = -myScroll.y;
+
+    //当scroll到1/4$goodsContainer高度后继续请求下一页数据
+    myScroll && myScroll.refresh();
+    if (sTop + winH > $('#scroller').height() - 0.25 * $goodsContainer.height() - 50) {
+        if ($pre !== undefined) {
+            search({
+                type: 'shop_id',
+                id: shopId,
+                brand: brand,
+                url: '/index/search/search',
+                nextPage: true
+            });
+        }
+    }
+}
+
+//srcoll to load more
+$(window).scroll(function() {
+    window.requestAnimationFrame(scrollHandler);
+});
+
+
+//初始请求最新第一页数据
+search({
+    type: 'shop_id',
+    id: shopId,
+    brand: brand,
+    url: '/index/search/search',
+    nextPage: false
+});
+
+$listNav.on('touchstart', 'li', function(e) {
+    $(this).addClass('bytouch');
+}).on('touchend touchcancel', function() {
+    $listNav.find('li').removeClass('bytouch');
+    myScroll.refresh();
+});
+
+$nav2.on('touchstart', 'li', function(e) {
+    $(this).addClass('bytouch');
+}).on('touchend touchcancel', function() {
+    $nav2.find('li').removeClass('bytouch');
+    myScroll.refresh();
+});
+
+//底部导航点击
+function fotterClick(group) {
+    $(group + ' li').on('touchstart', function() {
+        $('.sub-group').addClass('hide');
+        if ($(this).find('.sub-group').length > 0) {
+            $(this).find('.sub-group').removeClass('hide');
+        }
+    });
+}
+
+fotterClick('.shop-foot-wrapper');
+
+function stopPropagation(e) {
+    if (e.stopPropagation) {
+        e.stopPropagation();
+    } else {
+        e.cancelBubble = true;
+    }
+}
+
+$(document).bind('touchstart', function() {
+    $('.sub-group').addClass('hide');
+});
+
+$('.shop-foot-wrapper').bind('touchstart', function(e) {
+    stopPropagation(e);
+});
+
+//收藏
+function postCollect(info) {
+    var url = '';
+
+    if (searching) {
+        return;
+    }
+    searching = true;
+
+    $.ajax({
+        method: 'post',
+        url: info.url,
+        data: info.data,
+
+        success: function(data) {
+
+            if (data.code === 200) {
+                if ($('#collect').hasClass('alreadyCollect')) {
+                    $('#collect').attr('class', 'notCollect');
+                } else {
+                    $('#collect').attr('class', 'alreadyCollect');
+                }
+            }
+
+            if (data.code === 401) {
+                url = data.url;
+                $('body').append('<a href=\'' + url + '\'><span class="jump-login"><span></a>');
+
+                $('.jump-login').click();
+            }
+
+            setTimeout(function() {
+                myScroll.refresh();
+                scH = $('#scroller').outerHeight();
+            }, 1000);
+            searching = false;
+        },
+        error: function() {
+            alert('网络断开连接了~');
+            searching = false;
+        }
+    });
+}
+
+function collectShop() {
+    var qew = {};
+
+    qew.url = '/product/index/shopFav';
+    qew.data = {
+        shop_id: favId ? favId : shopId,
+        app_version: appVersion
+    };
+    postCollect(qew);
+}
+
+function cancelShop() {
+    var qew = {};
+
+    qew.url = '/product/index/cancelShopFav';
+    qew.data = {
+        shop_id: favId ? favId : shopId,
+        app_version: appVersion
+    };
+    postCollect(qew);
+}
+
+$('#collect').on('touchstart', function(e) {
+    if ($('#collect').hasClass('alreadyCollect')) {
+        cancelShop();
+    } else {
+        collectShop();
+    }
+});

@@ -2,3 +2,4 @@
 @import "detail/index";
 @import "detail/index";
 @import "outlet/index";
 @import "outlet/index";
 @import "search/index";
 @import "search/index";
+@import "shop/shop-index";

+.shop-index {    
+    position: absolute;
+    top: 0;
+    bottom: 0;
+    left: 0;
+    right: 0;
+    overflow: hidden;
+
+    .branner-top {
+        width: 100%;
+        height: 200px;
+        position: relative;
+        overflow: hidden;
+
+        .shop-back-img {
+            height: 100%;
+            width: 100%;
+        }
+    }
+
+    .logo {
+        position: absolute;
+        overflow: hidden;
+        left: 30px;
+        bottom: 30px;
+        width: 100px;
+        height: 100px;
+    }
+
+    .store-name {
+        color: #fff;
+        font-size: 28px;
+        position: absolute;
+        overflow: hidden;
+        left: 148px;
+        bottom: 20px;
+    }
+
+    .collect {
+        width: 128px;
+        height: 49px;
+        position: absolute;
+        bottom: 30px;
+        right: 30px;
+        border-radius: 10px;
+        text-align: center;
+        background-size: contain;
+    }
+
+    .alreadyCollect{
+        width: 128px;
+        height: 50px;
+        border-radius: 10px;
+        background-image: url('/product/already-collect.png') no-repeat;
+        background-size: contain;
+    }
+
+    .notCollect{
+        width: 128px;
+        height: 50px;
+        border-radius: 10px;
+        background-image: url('/product/not-collect.png') no-repeat;
+        background-size: contain;
+    }
+
+    .nav {
+        width: 100%;
+        height: 88px;
+        margin: 0;
+        padding: 0;
+        border: 0;
+        font: inherit;
+        vertical-align: baseline;
+        list-style: none;
+        font-size: 28px;
+        background: #fff;
+        overflow: hidden;
+        border-sizing: border-box;
+        border-bottom: 1px solid #e1e1e1;
+             
+        li{
+            color: #b1b1b1;
+            display: block;
+            height: 28px;
+            float: left;
+            line-height: 28px;
+            width: 24.7%;
+            text-align: center;
+            border-left: 1px solid #e1e1e1;
+            margin-top: 30px;
+            border-sizing: border-box;
+            color: #b1b1b1;
+
+            &:first-child {
+                border-left: none;
+            }
+
+            a {
+                color: #b1b1b1;
+            }
+        }
+
+        .color {
+            color: #000;
+        }   
+    }
+
+    .main {
+        background: #f0f0f0;
+        padding-bottom: 40px;
+        overflow: hidden;
+    }
+
+    .banner-area {
+        @extend .banner-top;
+        margin-bottom: 30px;
+    }
+
+    .hide {
+        display: hidden;
+    }
+
+    .coupon {
+        width: 100%;
+        padding: 30px 0;
+        overflow: hidden;
+
+        img {
+            width: 245px;
+            height: 120px;
+            vertical-align: top;
+            margin-left: 30px;
+            float: left;
+        }
+    }
+
+    .multi-brands {
+        width: 100%;
+        height: 270px;
+        background: #fff;
+        border: 1px solid #e1e1e1;
+        border-top: none;
+        font-size: 20px;
+        text-align: center;
+        padding-top: 25px;
+        margin-bottom: 30px; 
+        overflow: hidden; 
+
+        p {
+            font-size: 30px;
+        }
+    }
+
+    .multi-browse {
+        margin-top: 50px;
+    }
+ 
+    .brand-img {
+        margin-left: 30px;
+        width: 30%;
+        height: 150px;
+        overflow: hidden;
+        padding-bottom: 20px;
+        float: left;
+
+        p {
+            font-size: 25px;
+            color: #b1b1b1;
+            padding-top: 10px;
+            height: 30px;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+        }
+
+        img {
+            height: 70%;
+        }
+    }
+
+    .spring {
+        margin: 0;
+        overflow: hidden;
+
+        li {
+            width: 50%;
+            float: left;
+            text-align: center;
+            list-style: none;
+            display: list-item;
+
+            img {
+                width: 90%;
+                border-radius: 10px;
+                vertical-align: top;
+            }
+        }
+    }
+
+    .popularity-title {
+        background: #fff;
+        border-bottom: 1px solid #e8e8e8;
+        text-align: center;
+        line-height: 98px;
+        font-size: 32px;
+        margin-top: 40px;
+        position: relative;
+    }
+
+    .more {
+        position: absolute;
+        right: 30px;
+        top: 0;
+        bottom: 0;
+        color: #b0b0b0;
+        font-size: 50px;
+        font-family: "iconfont" !important;
+        font-style: normal;
+        text-decoration: none;
+    }
+
+    .product-list {
+        margin: 0;
+        padding: 0 0 30px 30px;
+        overflow: hidden;
+        background: #fff;
+        border-bottom: 30px solid #f0f0f0;
+
+        li {
+            width: 275px;
+            height: 368px;
+            margin-top: 50px;
+            margin-right: 30px;
+            float: left;
+            text-align: center;
+            list-style: none;
+
+            img {
+                width: 275px;
+                height: 368px;
+                vertical-align: top;
+            }
+        }
+    }
+
+    .list-price {
+        height: 60px;
+        background: #aaaeac;
+        color: #FFFFFF;
+        font-size: 22px;
+        margin-top: -60px;
+        position: relative;
+        opacity: 0.90;
+        padding-left: 15px;
+
+        p {
+            margin: 0;
+            line-height: 32px;
+            text-align: left;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            white-space: nowrap;
+        }
+    }
+
+    .red {
+        color: red;
+    }
+
+    .icon {
+        position: relative;
+        color: #b1b1b1;
+
+        i {
+            position: absolute;
+        }
+
+        .up {
+            top: -5px;
+            left: 8px;
+        }
+
+        .down {
+            top: 8px;
+            left: 8px;
+        }
+    }
+
+    .goods-container {
+        position: relative;
+        min-height: 440px;
+        padding-left: 15px;
+        padding-top: 20px;
+        border-bottom: 1px solid #e0e0e0;
+    }
+
+    .discount-area {
+        @extend .discount-page;
+
+        .list-nav li {
+            display: block;
+            height: 78px;
+            float: left;
+            line-height: 78px;
+            width: 24.8%;
+            text-align: center;
+            border-sizing: border-box;
+            position: relative;
+
+            span {
+                padding-top: 0;
+                font-size: 28px;
+            }
+        }
+
+        .new:after {
+            height: 28px;
+            content: '';
+            border-left: 1px solid #e1e1e1;
+            position: absolute;
+            top: 25px;
+            left: 163px;
+            }
+
+        .price:after {
+                height: 28px;
+            content: '';
+            border-left: 1px solid #e1e1e1;
+            position: absolute;
+            top: 25px;
+            left: 163px;
+        }
+
+        .discount:after {
+            height: 28px;
+            content: '';
+            border-left: 1px solid #e1e1e1;
+            position: absolute;
+            top: 25px;
+            left: 163px;
+        }
+
+        .active {
+            .cur {
+                color: #000;
+            } 
+        }
+        
+       .list-nav .icon .up {
+                top: -28px;
+        }
+
+        .list-nav .icon .down {
+            top: -14px;
+        }
+
+        .goods-container {
+            padding-top: 30px;
+            padding-bottom: 100px;
+        }
+    }
+
+    .search-area {
+        @extend .search-page;
+    }
+
+    .hide {
+        display: none;
+    }
+
+    .shop-foot-wrapper {
+        position: absolute;
+        bottom: 0;
+        display: table;
+        width: 100%;
+        height: 88px;
+        line-height: 88px;
+        font-size: 28px;
+        background: #fff;
+        border-top: 1px solid #eaeaea;
+
+
+        ul {
+            display: table-row;
+        }
+
+        li {
+            display: table-cell;
+            text-align: center;
+
+            .wall {
+                width: 0;
+                height: 28px;
+                margin-top: 30px;
+                float: right;
+                border-right: 1px solid #eaeaea;
+                display: inline-block;
+            }
+        }
+
+        .sub-group {
+            position: absolute;
+            background: #fff;
+            border: 1px solid #eaeaea;
+            border-radius: 12px;
+            bottom: 104px;
+            width: 40%;
+            margin-left: 5%;
+
+            dl {
+                width: 80%;
+                margin: 0 auto;
+            }
+
+            dd {
+                line-height: 80px;
+                text-align: center;
+                border-top: 1px solid #eaeaea;
+                white-space: nowrap;
+                overflow: hidden;
+                text-overflow: ellipsis;
+            }
+
+            dd:first-child {
+                border-top: 0;
+            }
+        }
+
+        .sharp {
+            position: absolute;
+            width: 100%;
+            height: 14px;
+            background: resolve('product/sharp.png') no-repeat center center;
+        }
+
+        .foot-list-3 .sub-group {
+            width: 29%;
+            margin-left: 2%;
+        }
+    }
+
+    .bytouch{
+        background:#eee;
+    }
+
+    .new-arrival {
+        padding-top: 30px;
+        overflow: hidden;
+        padding-left: 15px;
+        background: #fff;
+        padding-bottom: 100px;
+    }
+
+    .popularity {
+        padding-top: 30px;
+        overflow: hidden;
+        padding-left: 15px;
+        background: #fff;
+        padding-bottom: 100px;
+    }
+
+    .pos-list {
+        @extend .discount-page;
+        background: #fff;
+        width: 100%;
+        overflow: hidden;
+
+        li {
+            display: block;
+            height: 78px;
+            float: left;
+            line-height: 78px;
+            width: 24.8%;
+            text-align: center;
+            border-sizing: border-box;
+
+            span {
+                font-size: 28px;
+            }
+
+            a {
+                display: block;
+                box-sizing: border-box;
+                text-align: center;
+                width: 100%;
+                height: 100%;
+                color: #999;
+
+            b {
+                height: 28px;
+                    border-left: 1px solid #e1e1e1;
+                float: right;
+                margin-top: 25px;
+            }
+        }
+        }
+
+        .active .cur {
+            color: #000;
+        }
+
+        .active a {
+            color: #000;
+        }
+
+
+        .new .iconfont {
+            transform: scale(0.8);
+            font-weight: bold;
+        }
+
+        .price .iconfont {
+            transform: scale(0.8);
+            font-weight: bold;
+        }
+
+        .filter .iconfont {
+            font-size: 22px;
+            transition: transform 0.1 ease-in;
+        }
+
+        .filter.active .iconfont {
+            transform: rotate(-180deg);
+        }
+    }
+
+    .pos-list .icon .up {
+        top: -28px;
+    }
+
+    .pos-list .icon .down {
+        top: -14px;
+    }
+
+    .category-list-top-board {
+        border-top: 1px solid #e0e0e0;
+    }
+    
+    .category-list-last-li {
+        border-right: 1px solid #e0e0e0;
+    }
+
+    .category-list-only-one-row {
+        border-top: none!important;
+    }
+
+    .category-list-last-full-row {
+        border-bottom: 1px solid #e0e0e0;
+    }
+}