Merge branch 'feature/me-layout' into develop

+/**
+ * [个人中心]首页/我的订单
+ * @author: xuqi<qi.xu@yoho.cn>
+ * @date: 2016/07/04
+ */
+
+'use strict';
+
+/**
+ * 订单
+ */
+const index = (req, res) => {
+    res.render('index', {
+        module: 'me',
+        page: 'order',
+        isMe: true,
+        content: {
+            nav: [
+                {
+                    link: '//www.yohoblk.com',
+                    name: 'YOHO!BLK首页'
+                },
+                {
+                    link: '//www.yohoblk.com/me',
+                    name: '个人中心'
+                },
+                {
+                    link: '//www.yohoblk.com/me',
+                    name: '我的订单'
+                }
+            ],
+            navigation: [
+                {
+                    focus: true,
+                    link: '/me/order',
+                    name: '我的订单'
+                },
+                {
+                    link: '/me/return',
+                    name: '我的退/换货'
+                },
+                {
+                    link: '/me/collection',
+                    name: '我的收藏'
+                },
+                {
+                    link: '/me/message',
+                    name: '我的消息'
+                },
+                {
+                    link: '/me/currency',
+                    name: '我的YOHO币'
+                },
+                {
+                    link: '/me/setting',
+                    name: '个人设置'
+                },
+                {
+                    link: '/me/address',
+                    name: '收货地址'
+                }
+            ],
+            banner: 'http://placehold.it/150x120',
+            order: true
+        }
+    });
+};
+
+module.exports = {
+    index
+};

+/**
+ * sub app me
+ * @author: xuqi<qi.xu@yoho.cn>
+ * @date: 2016/07/04
+ */
+
+var express = require('express'),
+    path = require('path'),
+    hbs = require('express-handlebars');
+
+var app = express();
+
+// set view engin
+var doraemon = path.join(__dirname, '../../doraemon/views'); // parent view root
+
+app.on('mount', function(parent) {
+    delete parent.locals.settings; // 不继承父 App 的设置
+    Object.assign(app.locals, parent.locals);
+});
+
+app.set('views', path.join(__dirname, 'views/action'));
+app.engine('.hbs', hbs({
+    extname: '.hbs',
+    defaultLayout: 'layout',
+    layoutsDir: doraemon,
+    partialsDir: [path.join(__dirname, 'views/partial'), `${doraemon}/partial`],
+    helpers: 'helpers'
+}));
+
+// router
+app.use(require('./router'));
+
+module.exports = app;

+/**
+ * router of sub app me
+ * @author: xuqi<qi.xu@yoho.cn>
+ * @date: 2016/07/04
+ */
+
+'use strict';
+
+const router = require('express').Router(); // eslint-disable-line
+const cRoot = './controllers';
+
+// 订单
+const order = require(`${cRoot}/order`);
+
+// 个人中心首页/订单
+router.get('/', order.index);
+
+module.exports = router;

+<div class="me-page blk-page clearfix">
+    <div class="center-content">
+        {{# content}}
+            {{!-- 头部面包屑 --}}
+            {{> path-nav}}
+
+            {{!-- 左侧菜单导航 --}}
+            <div class="me-navigation left">
+                <p class="title bold">MY YOHO!BLK</p>
+                <ul class="nav">
+                    {{#each navigation}}
+                        <li class="nav-row{{#if focus}} focus{{/if}}">
+                            <a href="{{link}}">{{name}}</a>
+                        </li>
+                    {{/each}}
+                </ul>
+                {{#if banner}}
+                    <img class="banner-img" data-original="{{banner}}">
+                {{/if}}
+            </div>
+
+            {{!-- 右侧页面内容 --}}
+            <div class="me-main left">
+                {{!-- 我的订单 --}}
+                {{#if order}}
+                    {{> order}}
+                {{/if}}
+
+                {{!-- 我的退换货 --}}
+                {{#if return}}
+                    {{> return}}
+                {{/if}}
+
+                {{!-- 我的收藏 --}}
+                {{#if collection}}
+                    {{> collection}}
+                {{/if}}
+
+                {{!-- 我的消息 --}}
+                {{#if message}}
+                    {{> message}}
+                {{/if}}
+
+                {{!-- 我的YOHO币 --}}
+                {{#if currency}}
+                    {{> curency}}
+                {{/if}}
+
+                {{!-- 个人设置 --}}
+                {{#if setting}}
+                    {{> setting}}
+                {{/if}}
+
+                {{!-- 收货地址 --}}
+                {{#if address}}
+                    {{> address}}
+                {{/if}}
+            </div>
+        {{/ content}}
+    </div>
+    
+    {{!-- 在线客服和返回顶部 --}}
+    <div class="service-top">
+        <a class="service" href="" target="_blank">
+            <span class="iconfont">&#xe61c;</span>
+            <span class="hover-text hide">在线<br>客服</span>
+        </a>
+        <div class="return-top">
+            <span class="iconfont bold">&#xe617;</span>
+            <span class="hover-text hide">返回<br>顶部</span>
+        </div>
+    </div>
+</div>
\ No newline at end of file

+I am order
\ No newline at end of file

@@ -10,5 +10,7 @@ module.exports = app => {
     app.use('/partial', require('./apps/partial')); // 组件demo
 
     // 业务模块
-    //app.use('/passport', require('./apps/passport'));
+    // app.use('/passport', require('./apps/passport'));
+
+    app.use('/me', require('./apps/me')); // 个人中心
 };

@@ -20,7 +20,7 @@
             <link rel="stylesheet" href="//cdn.yoho.cn/yohoblk-node/{{version}}/index.css">
         {{/if}}
     </head>
-    <body>
+    <body{{#if isMe}} class="for-me"{{/if}}>
         {{> header}}
 
         {{{body}}}

 {{#if nav}}
     <p class="path-nav">
-        {{#each pathNav}}
-            {{#if href}}
-                <a {{#if @last}}class="last"{{/if}} href="{{href}}" title="{{pathTitle}}">{{{name}}}</a>
+        {{#each nav}}
+            {{#if link}}
+                <a {{#if @last}}class="last"{{/if}} href="{{link}}" title="{{pathTitle}}">{{{name}}}</a>
             {{^}}
                 <span {{#if @last}}class="last"{{/if}} title="{{pathTitle}}">{{{name}}}</span>
             {{/if}}

@@ -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 Mon Jul  4 16:04:45 2016
+Created by FontForge 20120731 at Mon Jul  4 15:42:03 2016
  By admin
 </metadata>
 <defs>

+/**
+ * 个人中心布局
+ * @author: xuqi<qi.xu@yoho.cn>
+ * @date: 2016/07/04
+ */
+
+var $ = require('yoho-jquery'),
+    lazyLoad = require('yoho-jquery-lazyload');
+
+// 左侧banner图片lazyload
+lazyLoad($('.banner-img'));
+
+// 浮动在线客服和返回顶部的鼠标移入移出切换效果
+$('.service, .return-top').hover(function() {
+    $(this).find('.iconfont').addClass('hide').end().find('.hover-text').removeClass('hide');
+}, function() {
+    $(this).find('.iconfont').removeClass('hide').end().find('.hover-text').addClass('hide');
+});

+/**
+ * [个人中心]首页/我的订单
+ * @author: xuqi<qi.xu@yoho.cn>
+ * @date: 2016/07/04
+ */
+
+require('./me');

 .path-nav {
     font-size: 14px;
-    height: 48px;
-    line-height: 48px;
+    height: 50px;
+    line-height: 50px;
 
     a {
         color: #666;

 @charset "utf-8";
 
 /* 公共 */
+@import "base";
+@import "components/index";
 @import "plugin/index";
 
 /* 模块 */
-@import "base";
-@import "components/index";
+@import "me/index";
 @import "channel/index";
+

+.me-page {
+    padding-bottom: 30px;
+    background: #f5f5f5;
+
+    /* 个人中心布局下重置默认的底部样式 */
+    + .yoho-footer .center-content {
+        border-top: none;
+    }
+
+    /* 左侧导航 */
+    .me-navigation {
+        width: 150px;
+        margin-right: 10px;
+
+        .title {
+            height: 60px;
+            line-height: 60px;
+            text-align: center;
+            background: #fff;
+        }
+
+        .nav-row {
+            height: 40px;
+            line-height: 40px;
+            color: #cecece;
+            background: #fff;
+
+            a {
+                display: block;
+                height: 100%;
+                width: 100%;
+                padding-left: 20px;
+                border-left: 2px solid #fff;
+            }
+
+            &.focus {
+                background: #eee;
+                color: #000;
+
+                a {
+                    border-color: #000;
+                }
+            }
+        }
+
+        .banner-img {
+            width: 150px;
+            height: 120px;
+            margin-top: 10px;
+        }
+    }
+
+    .me-main {
+        width: 990px;
+    }
+
+    .service-top {
+        position: fixed;
+        left: 50%;
+        bottom: 20px;
+        border: 1px solid #eee;
+        background: #fff;
+        cursor: pointer;
+        z-index: 2;
+        margin-left: 625px;
+
+        .service,
+        .return-top {
+            display: block;
+            width: 50px;
+            height: 50px;
+            padding-top: 13px;
+            text-align: center;
+
+            &:hover {
+                padding-top: 8px;
+            }
+        }
+
+        .return-top {
+            border-top: 1px solid #eee;
+        }
+
+        .hover-text {
+            font-size: 12px;
+        }
+    }
+}