Merge branch 'feature/newHome' into 'release/6.1'

Feature/new home



See merge request !890

@@ -39,7 +39,7 @@ exports.index = (req, res, next) => {
 
     let params = {
         uid: req.user.uid,
-        udid: require('yoho-md5')(req.ip),
+        udid: req.sessionID || 'yoho',
         contentCode: 'b2b5cde8144aff3073573c3b323344ab',
         channel: (req.query.gender && yhchannels[req.query.gender]) ||
         (req.cookies._Channel && channels[req.cookies._Channel]) || 1

 'use strict';
 
 const _ = require('lodash');
-const camelCase = global.yoho.camelCase;
 const utils = '../../../utils';
 const resourcesProcess = require(`${utils}/resources-process`);
 const helpers = global.yoho.helpers;
@@ -163,9 +162,9 @@ class newHome extends global.yoho.BaseModel {
                 baseInfo: {},
                 infoNum: {},
                 signinUrl: helpers.urlFormat('/signin.html', {
-                    refer: helpers.urlFormat('/home/new-home')
+                    refer: helpers.urlFormat('/home')
                 }),
-                referUrl: helpers.urlFormat('/home/new-home'),
+                referUrl: helpers.urlFormat('/home'),
                 channel: {
                     boys: params.channel === 1,
                     girls: params.channel === 2,
@@ -201,8 +200,6 @@ class newHome extends global.yoho.BaseModel {
                 resu.content = result[5];
             }
 
-            resu = camelCase(resu);
-
             return resu;
         });
     }

@@ -67,7 +67,7 @@ router.post('/orders/changeAddress', orderDetailController.changeAddress); //
 router.post('/orders/sure', auth, orderController.sure); // 确认收货
 
 
-router.get('/', disableBFCache, homeController.index); // 个人中心首页
+// router.get('/', disableBFCache, homeController.index); // 个人中心首页
 router.get('/mydetails', auth, disableBFCache, homeController.myDetails); // 个人基本资料页面
 
 // router.get('/grade', auth, homeController.grade); // 会员等级页
@@ -179,5 +179,5 @@ router.get('/return/exchange/refreshDelivery', auth, exchange.refreshDelivery);
 
 router.get('/tide-command', auth, tideCommand.tideCommand); // 设置潮流口令
 
-router.get('/new-home', newHome.index); // 设置潮流口令
+router.get('/', newHome.index); // 设置潮流口令
 module.exports = router;

@@ -4,8 +4,8 @@
             {{# baseInfo}}
             <a href="/home/mydetails">
                 <div class="left">
-                    <div class="user-avatar" data-avatar="{{image2 headIco mode=2 w=100 h=100 q=90}}"></div>
-                    <div class="level level-{{vipInfo/curLevel}}"></div>
+                    <div class="user-avatar" data-avatar="{{image2 head_ico mode=2 w=100 h=100 q=90}}"></div>
+                    <div class="level level-{{vip_info/cur_level}}"></div>
                 </div>
                 <div class="right">
                     <div class="name eps">{{nickname}}</div>
@@ -70,8 +70,8 @@
             <div class="service-item">
                 <div class="iconfont pic">&#xe634;</div>
                 <p class="name">待付款</p>
-                {{#if waitPayNum}}
-                <div class="val">{{waitPayNum}}</div>
+                {{#if wait_pay_num}}
+                <div class="val">{{wait_pay_num}}</div>
                 {{/if}}
             </div>
         </a>
@@ -79,8 +79,8 @@
             <div class="service-item">
                 <div class="iconfont pic">&#xe63b;</div>
                 <p class="name">待发货</p>
-                {{#if waitCargoNum}}
-                <div class="val">{{waitCargoNum}}</div>
+                {{#if wait_cargo_num}}
+                <div class="val">{{wait_cargo_num}}</div>
                 {{/if}}
             </div>
         </a>
@@ -88,26 +88,26 @@
             <div class="service-item">
                 <div class="iconfont pic">&#xe633;</div>
                 <p class="name">待收货</p>
-                {{#if sendCargoNum}}
-                <div class="val">{{sendCargoNum}}</div>
+                {{#if send_cargo_num}}
+                <div class="val">{{send_cargo_num}}</div>
                 {{/if}}
             </div>
         </a>
         <div class="service-item">
             <a href="/home/favorite">
-                <p class="num">{{#if productFavoriteTotal}}{{productFavoriteTotal}}{{else}}0{{/if}}</p>
+                <p class="num">{{#if product_favorite_total}}{{product_favorite_total}}{{else}}0{{/if}}</p>
                 <p class="name">商品收藏</p>
             </a>
         </div>
         <div class="service-item">
             <a href="/home/favorite?tab=brand">
-                <p class="num">{{#if brandFavoriteTotal}}{{brandFavoriteTotal}}{{else}}0{{/if}}</p>
+                <p class="num">{{#if brand_favorite_total}}{{brand_favorite_total}}{{else}}0{{/if}}</p>
                 <p class="name">品牌收藏</p>
             </a>
         </div>
         <div class="service-item">
             <a href="/home/record">
-                <p class="num">{{#if productBrowse}}{{productBrowse}}{{else}}0{{/if}}</p>
+                <p class="num">{{#if product_browse}}{{product_browse}}{{else}}0{{/if}}</p>
                 <p class="name">浏览记录</p>
             </a>
         </div>
@@ -117,7 +117,7 @@
             <div class="pic iconfont">&#xe63a;</div>
             <div class="body">
                 <div class="main eps">优惠券</div>
-                <div class="value">{{#if couponNum}}{{couponNum}}张{{/if}}</div>
+                <div class="value">{{#if coupon_num}}{{coupon_num}}张{{/if}}</div>
                 <div class="arr iconfont">&#xe604;</div>
             </div>
         </a>
@@ -125,7 +125,7 @@
             <div class="pic iconfont">&#xe732;</div>
             <div class="body">
                 <div class="main eps">有货币</div>
-                <div class="value">{{#if yohoCoinNum}}{{yohoCoinNum}}个{{/if}}</div>
+                <div class="value">{{#if yoho_coin_num}}{{yoho_coin_num}}个{{/if}}</div>
                 <div class="arr iconfont">&#xe604;</div>
             </div>
         </a>
@@ -135,7 +135,7 @@
             <div class="pic iconfont">&#xe63f;</div>
             <div class="body">
                 <div class="main eps">消息</div>
-                <div class="value">{{#if inboxTotal}}{{inboxTotal}}条未读{{/if}}</div>
+                <div class="value">{{#if inbox_total}}{{inbox_total}}条未读{{/if}}</div>
                 <div class="arr iconfont">&#xe604;</div>
             </div>
         </a>

@@ -71,6 +71,7 @@
 {{^}}
 <div class="homebuttom hide">
 {{/ @root.pageChannel}}
+    <div class="ul-arr"></div>
     <ul>
         <li>
             <a href="{{ indexUrl }}">

@@ -304,6 +304,17 @@ $('.nav-home').on('touchstart', function() {
     $('.homebuttom').toggleClass('hide');
 });
 
+// 点击关闭头部菜单
+$('.main-wrap').on('click', '*', (e) => {
+    let $this = $(e.currentTarget);
+
+    if (!$this.hasClass('nav-home')) {
+        $('.homebuttom').addClass('hide');
+    } else {
+        return false;
+    }
+});
+
 // 商品列表找相似按钮
 $('body').on('touchstart', '.similar-btn', function() {
     let $thisP = $(this).parents('.good-info');

@@ -5,37 +5,40 @@ import Page from 'yoho-page';
 import 'common/set-trend-world';
 import Swiper from 'yoho-swiper2';
 import yoho from 'yoho-app';
+import AutoScroll from './new-home/auto-scroll';
 
 class NewHome extends Page {
     constructor() {
         super();
 
         this.selector = {
-            $scrollC: $('.scroll-c'),
-            $scrollWords: $('.scroll-words'),
             $userAvatar: $('.user-avatar'),
             $codeSet: $('.code-set'),
             $resYas: $('.res-c').find('a'),
             $trendCode: $('.trend-code')
         };
 
-        this.time = 6000;
-        this.containerWidth = 0;
-        this.innerWidth = 0;
-        this.moveLength = 0;
-        this.interval = '';
         this.init();
     }
 
     init() {
-        this.autoScroll();
         this.defaultPic();
         this.bindEvents();
         this.swiper();
         this.showTrend();
+        this.autoScroll();
         window.reMarginFooter('.footer-tab');
     }
 
+    autoScroll() {
+        new AutoScroll(
+            {
+                scrollC: $('.scroll-c'), // 内容
+                scrollWords: $('.scroll-words') // 容器
+            }
+        );
+    }
+
     // 首次进入个人中心，且登陆，且没有设置潮流口令，打开弹框子
     showTrend() {
         if (yoho.isLogin() && (!this.selector.$trendCode.html()) && !window.cookie('first-trend')) {
@@ -50,7 +53,6 @@ class NewHome extends Page {
     bindEvents() {
         this.selector.$codeSet.on('click', this.codeSet.bind(this));
         this.selector.$resYas.on('click', this.yas.bind(this));
-        this.selector.$scrollWords.on('DOMNodeInserted', this.chanScroll.bind(this));
     }
 
     // 资源位
@@ -113,39 +115,6 @@ class NewHome extends Page {
         $('.set-trend-world').show();
         return false;
     }
-
-    // 触发修改滚动
-    chanScroll() {
-        this.selector.$scrollWords.stop(true, true);
-        clearInterval(this.interval);
-        setTimeout(() => {
-            this.autoScroll();
-        }, 500);
-    }
-
-    // 判断滚动
-    autoScroll() {
-        this.containerWidth = this.selector.$scrollC.width();
-        this.innerWidth = this.selector.$scrollWords.width();
-        this.moveLength = this.innerWidth - this.containerWidth;
-        if (this.innerWidth > (this.containerWidth + 1)) {
-            this.goScroll();
-            this.interval = setInterval(() => {
-                this.goScroll();
-            }, this.time);
-        } else {
-            clearInterval(this.interval);
-        }
-    }
-
-    // 滚动
-    goScroll() {
-        let $animateObj = this.selector.$scrollWords;
-
-        $animateObj.animate({left: `-${this.moveLength}px`}, this.time / 2, 'linear', () => {
-            $animateObj.animate({left: '0'}, this.time / 2, 'linear');
-        });
-    }
 }
 
 $(() => {

+import Page from 'yoho-page';
+
+class AutoScroll extends Page {
+    constructor(data) {
+        super();
+
+        this.selector = {
+            $scrollC: data.scrollC,
+            $scrollWords: data.scrollWords
+        };
+
+        this.time = 6000;
+        this.containerWidth = 0;
+        this.innerWidth = 0;
+        this.moveLength = 0;
+        this.interval = '';
+        this.init();
+    }
+
+    init() {
+        this.autoScroll();
+        this.bindEvents();
+    }
+
+
+    bindEvents() {
+        this.selector.$scrollWords.on('DOMNodeInserted', this.chanScroll.bind(this));
+    }
+
+    // 触发修改滚动
+    chanScroll() {
+        this.selector.$scrollWords.stop(true, true);
+        clearInterval(this.interval);
+        setTimeout(() => {
+            this.autoScroll();
+        }, 500);
+    }
+
+    // 判断滚动
+    autoScroll() {
+        this.containerWidth = this.selector.$scrollC.width();
+        this.innerWidth = this.selector.$scrollWords.width();
+        this.moveLength = this.innerWidth - this.containerWidth;
+        if (this.innerWidth > (this.containerWidth + 1)) {
+            this.goScroll();
+            this.interval = setInterval(() => {
+                this.goScroll();
+            }, this.time);
+        } else {
+            clearInterval(this.interval);
+        }
+    }
+
+    // 滚动
+    goScroll() {
+        let $animateObj = this.selector.$scrollWords;
+
+        $animateObj.animate({left: `-${this.moveLength}px`}, this.time / 2, 'linear', () => {
+            $animateObj.animate({left: '0'}, this.time / 2, 'linear');
+        });
+    }
+}
+
+module.exports = AutoScroll;

@@ -361,7 +361,7 @@
             height: 35px;
             margin: 0 auto;
             background-size: 100% 100%;
-            background-image: resolve("yohologo02.png");
+            background-image: resolve("yohobuy-grey.png");
         }
     }
 }

@@ -202,25 +202,58 @@
     padding-top: 17px;
 
     &.boys {
-        background-image: resolve("common/homebuttom-bg.png");
+        ul {
+            background-image: linear-gradient(#434343, #171717);
 
-        li {
-            span {
-                border-bottom: solid 1px #444;
+            li {
+                span {
+                    border-bottom: solid 1px #444;
+                }
             }
         }
+
+        .ul-arr {
+            background-color: #434343;
+        }
     }
 
     &.girls {
-        background-image: resolve("common/homebuttom-bg-1.png");
+        ul {
+            background-image: linear-gradient(#fc89ad, #e96e94);
+        }
+
+        .ul-arr {
+            background-color: #fc89ad;
+        }
     }
 
     &.kids {
-        background-image: resolve("common/homebuttom-bg-2.png");
+        ul {
+            background-image: linear-gradient(#7ed3f7, #5fc9f6);
+        }
+
+        .ul-arr {
+            background-color: #7ed3f7;
+        }
     }
 
     &.life-style {
-        background-image: resolve("common/homebuttom-bg-3.png");
+        ul {
+            background-image: linear-gradient(#5e4a3c, #4c3727);
+        }
+
+        .ul-arr {
+            background-color: #5e4a3c;
+        }
+    }
+
+    .ul-arr {
+        width: 26px;
+        height: 26px;
+        position: absolute;
+        top: 4px;
+        right: 32px;
+        transform: rotate(45deg);
     }
 
     ul {
@@ -228,6 +261,7 @@
         width: 100%;
         height: 338px;
         padding: 1px 0;
+        border-radius: 10px;
 
         li {
             float: left;