Merge branch 'feature/brandsTree' into 'release/5.4.1'

品牌字母排序、页面切换定位



See merge request !299

@@ -32,67 +32,56 @@ const handleBrandList = origin => {
         indexList: []
     };
 
+    let keyList = [];
+
     // 标记是否有数字，有数字先暂存
     let hasNum = false;
     let numTemp = {};
 
     _.forEach(origin, (value, key) => {
-        let brands = [];
 
         if (_.size(value) <= 0) {
             return;
         }
 
+        _.forEach(value, function(subValue) {
+            subValue.brandUrl = '//m.yohobuy.com/product/index/brand?domain=' + subValue.brand_domain + '&app_type=1';
+            subValue.name = subValue.brand_name_en || subValue.brand_name_cn || subValue.brand_name;
+            subValue.domain = subValue.brand_domain;
+        });
+
         if (key === '0~9') {
             hasNum = true;
             numTemp = origin[key];
         } else {
-            _.forEach(value, (subValue) => {
-                brands.push({
-                    name: subValue.brand_name_en || subValue.brand_name_cn || subValue.brand_name,
-                    logo: subValue.brand_ico,
-                    domain: subValue.brand_domain,
-                    brandUrl: '//m.yohobuy.com/product/index/brand?domain=' + subValue.brand_domain + '&app_type=1'
-                });
-            });
 
-            dest.ListData.push({
-                index: key,
-                brands: brands
-            });
-
-            dest.indexList.push({
-                index: key,
-                name: key === '0~9' ? '0' : key
-            });
+            keyList.push(key);
         }
 
     });
 
-    // 商品列表排序一次
-    _.sortBy(dest.ListData, o => {
-        return o.index.charCodeAt();
-    });
+    keyList.sort();
+
+    _.forEach(keyList, function(key) {
+        let keyName = key;
 
-    // 字母列表排序一次
-    _.sortBy(dest.indexList, o => {
-        return o.index.charCodeAt();
+        dest.ListData.push({
+            index: keyName,
+            brands: origin[key]
+        });
+
+        dest.indexList.push({
+            index: keyName,
+            name: key === '0~9' ? '0' : key
+        });
     });
 
     // 如果有数字，单独处理
     if (hasNum) {
-        let brands = [];
 
-        _.forEach(numTemp, (subValue) => {
-            brands.push({
-                name: subValue.brand_name_en || subValue.brand_name_cn || subValue.brand_name,
-                logo: subValue.brand_ico,
-                domain: subValue.brand_domain
-            });
-        });
         dest.ListData.push({
             index: '0~9',
-            brands: brands
+            brands: numTemp
         });
 
         dest.indexList.push({
@@ -167,6 +156,7 @@ const _getBrandListOriginData = (channel) => {
     });
 };
 
+// 全部分类数据
 const _processCateData = (list, channel, appType) => {
     let nav = ['MEN男士', 'WOMEN女士'];
 
@@ -301,8 +291,6 @@ const brandListData = (code, gender) => {
     });
 };
 
-
-
 module.exports = {
     indexData,
     brandListData

@@ -31,7 +31,7 @@
                     <div class="brand-box">
                         <a href="{{brandUrl}}">
                             <div class="brand-logo">
-                                <img src="{{image logo 136 136}}">
+                                <img src="{{image brand_ico 136 136}}">
                             </div>
                             <span class="brand-name">
                                 {{name}}

@@ -6,7 +6,14 @@ var categoryHeight = $('.tab-box').height(),
 
 var $intercept = $('.no-intercept'),
     $list = $('.brand-list-box'),
-    $listBox = $('.list-box');
+    $listBox = $('.list-box'),
+    $brandContent = $('.brand-content'),
+    $tabBox = $('.tab-box'),
+    $contentIndex = $('.content-index'),
+    $categoryNav = $('.category-nav'),
+    $channelTab = $('.channel-tab'),
+    $categoryContent = $('.category-content'),
+    $brandCha = $('.brand-cha');
 
 require('../common');
 require('./brand-cate/cate-all');
@@ -48,14 +55,21 @@ function loadData(channel) {
             gender: channel
         },
         success: function(data) {
-            $('.brand-content').html(data);
+            $brandContent.html(data);
 
             initialize();
+
+            $('html,body').animate({
+                scrollTop: 0
+            }, 100, function() {
+                $tabBox.removeClass('fastening');
+                $contentIndex.removeClass('distance');
+            });
         }
     });
 }
 
-$('.brand-cha').find('li').click(function() {
+$brandCha.find('li').click(function() {
     gender = $(this).find('span').text().replace(/[^A-Za-z]+/g, '').toLowerCase();
 
     $(this).addClass('focus').siblings().removeClass('focus');
@@ -79,15 +93,30 @@ $('.brand-tab').find('li').click(function() {
     $(this).addClass('active').siblings().removeClass('active');
 
     if ($(this).hasClass('brand')) {
-        $('.brand-content').removeClass('hide').siblings().addClass('hide');
-        $('.channel-tab').removeClass('hide');
-        $('.brand-cha').removeClass('hide').siblings().addClass('hide');
+        $brandContent.removeClass('hide').siblings().addClass('hide');
+        $channelTab.removeClass('hide');
+        $brandCha.removeClass('hide').siblings().addClass('hide');
     } else {
-        $('.category-content').removeClass('hide').siblings().addClass('hide');
+        $categoryContent.removeClass('hide').siblings().addClass('hide');
         $('.channel-tab').addClass('hide');
     }
 
     initialize();
+
+    // 页面切换回到头部
+    $('html,body').animate({
+        scrollTop: 0
+    }, 100, function() {
+        if (!$brandContent.hasClass('hide')) {
+            $tabBox.removeClass('fastening');
+            $contentIndex.removeClass('distance');
+        } else {
+            $tabBox.removeClass('fastening');
+            $categoryNav.removeClass('loca');
+            $('.blk-cate-all .content').removeClass('living');
+            $contentIndex.removeClass('distance');
+        }
+    });
 });
 
 if ($listBox.find('li').length <= 0) {
@@ -97,24 +126,24 @@ if ($listBox.find('li').length <= 0) {
 $(window).scroll(function() {
     var totalHeight = $('#yoho-header').height() + $('.tab-box').height();
 
-    if (!$('.brand-content').hasClass('hide')) {
+    if (!$brandContent.hasClass('hide')) {
         if ($(this).scrollTop() >= $('#yoho-header').height()) {
-            $('.tab-box').addClass('fastening');
-            $('.content-index').addClass('distance');
+            $tabBox.addClass('fastening');
+            $contentIndex.addClass('distance');
             $('.list-box').css('top', $('.tab-box').height());
         } else {
-            $('.tab-box').removeClass('fastening');
-            $('.content-index').removeClass('distance');
+            $tabBox.removeClass('fastening');
+            $contentIndex.removeClass('distance');
             $('.list-box').css('top', totalHeight - $(this).scrollTop());
         }
     } else {
         if ($(this).scrollTop() >= $('#yoho-header').height()) {
-            $('.tab-box').addClass('fastening');
-            $('.category-nav').addClass('loca');
+            $tabBox.addClass('fastening');
+            $categoryNav.addClass('loca');
             $('.blk-cate-all .content').addClass('living');
         } else {
-            $('.tab-box').removeClass('fastening');
-            $('.category-nav').removeClass('loca');
+            $tabBox.removeClass('fastening');
+            $categoryNav.removeClass('loca');
             $('.blk-cate-all .content').removeClass('living');
         }
     }

@@ -190,7 +190,7 @@
 
     .list-box {
         position: fixed;
-        width: 30px;
+        width: 35px;
         margin: 0;
         padding: 6px 0;
         right: 0;