首次访问导航栏

@@ -56,3 +56,20 @@ exports.getNewArrival = (req, res, next) => {
         res.send(result);
         res.send(result);
     }).catch(next);
     }).catch(next);
 };
 };
+
+exports.getIndexGuide = (req, res,next) => {
+    channelModel.getIndexGuideData().then(data => {
+        console.log(data);
+        if(data.code !== 200){
+            const err = new Error('异常');
+            throw err;
+        }
+        return channelModel.formatIndexGuideData(data.data);
+    }).then(data => {
+        data.layout = false;
+    //console.log('-----');
+    //console.log(data);
+    res.render('guide', {list: data});
+
+}).catch(next);
+}

@@ -646,6 +646,121 @@ const processFloorData = (rawData, type) => {
     };
     };
 };
 };
 
 
+const _formatResourceParams = (code) => {
+    return serviceApi.get('operations/api/v5/resource/get', {content_code: code}).then(data => {
+        let result = data.data[0];
+        result.channel = channel;
+
+        return result;
+    });
+};
+
+/**
+ * 频道页首次登陆导航并行调接口数据
+ * @param  {Object} data
+ * @return {Object} formatData
+ */
+const _formatParams = (channel, data) => {
+    let params = {};
+
+    // 排序数据映射表
+    let orderMaps = {
+        's_t_desc': 'shelve_time:desc',
+        's_t_asc': 'shelve_time:asc',
+        's_p_asc': 'sales_price:asc',
+        's_p_desc': 'sales_price:desc',
+        'p_d_desc': 'discount:desc',
+        'p_d_asc': 'discount:asc',
+        'skn_desc': 'product_skn:desc',
+        'skn_asc': 'product_skn:asc',
+        'activities_desc': 'activities.order_by:desc',
+        'activities_asc': 'activities.order_by:asc',
+        's_n_asc': 'sales_num:asc',
+        's_n_desc': 'sales_num:desc',
+        'activities_id_desc': 'activities.activity_id:desc',
+        'activities_id_asc': 'activities.activity_id:asc',
+        'brand_desc': 'brand_weight:desc'
+    };
+
+    params.status = 1; // 是否上架，1表示在架，2表示不在
+    params.sales = 'Y'; // 只搜索销售的产品
+    params.outlets = 2; // 非奥莱商品
+    params.stocknumber = 1; // 过滤掉已售罄的商品
+    params.attribute_not = 2; //过滤掉赠品
+    if (!data.order) {
+        params.order = orderMaps.s_t_desc;
+    } else {
+        params.order = orderMaps[data.order] ? orderMaps[data.order] : '';
+    }
+    if (!data.page) {
+        params.page = 1;
+    }
+
+    if(data.viewNum) {
+        params.viewNum = data.viewNum;
+    }  else if (!data.limit) {
+        params.viewNum = 60;
+    } else {
+        params.viewNum = data.limit;
+        delete data.limit;
+    }
+    if (data) {
+        params = Object.assign(data);
+    }
+    return searchApi.get('/search.json', params).then(data => {
+        let result = data.data;
+        result.channel = channel;
+
+        return result;
+    });
+}
+
+/**
+ * 格式化频道页首次登陆导航数据
+ * @param  {Object} data
+ * @return {Object} formatData
+ */
+exports.formatIndexGuideData = data => {
+    let channels = {
+        'boys': {'gender': '1,3','limit': 1},
+        'girls': {'gender': '2,3', 'limit': 1},
+        'lifestyle': {'msort': 10 , 'misort': '266,280,101,103,259', 'limit': 1},
+        'kids': {'msort': 365, 'limit': 1}
+    };
+
+    let formatData = [];
+    let promiseArr = [];
+
+    _.forEach(data, item => {
+        let channel = item.sort_name_en.toLowerCase().replace(' ', '');
+
+        formatData.push({
+            'channel': channel,
+            'url': item.sort_url,
+            'sort_name': item.sort_name,
+            'sort_name_en': item.sort_name_en,
+            'content_code': item.content_code,
+            'src': '',
+            'num': 0
+        });
+
+        if (channels[channel]) {
+            promiseArr.push(_formatParams(channel, channels[channel]))
+        }
+    })
+
+    return Promise.all(promiseArr).then(data => {
+        _.forEach(formatData, (item, index) => {
+            _.forEach(data, (item, ind) => {
+                if (formatData[index].channel === data[ind].channel) {
+                    formatData[index].num = data[ind].total;
+                }
+            })
+        })
+
+        return formatData;
+    });
+}
 
 
 /**
 /**
  * 获取频道页数据
  * 获取频道页数据
@@ -732,3 +847,40 @@ exports.getbrandFloorDataAjax = type => {
         return data;
         return data;
     });
     });
 };
 };
+
+exports.getResourceData = (formatData) => {
+    let promiseArr = [];
+
+    _.forEach(data, item => {
+        if (item.content_code) {
+            promiseArr.push(_formatResourceParams(content_code))
+        }
+
+        return Promise.all(promiseArr).then(data => {
+            //console.log(formatData);
+            _.forEach(formatData, (item, index) => {
+                _.forEach(data, (item, ind) => {
+                    if (formatData[index].channel === data[ind].channel) {
+                        formatData[index].src = data[ind].src;
+                    }
+                })
+            })
+            console.log(formatData);
+            return formatData;
+        })
+    })
+}
+
+/**
+ * 获取频道页首次登陆导航数据
+ * @param  {String} type 传入频道页类型，值可以是: boys, girls, kids, lifestyle
+ * @return {Object}
+ */
+exports.getIndexGuideData = () => {
+    let params = {
+        client_type: 'web',
+        private_key: '0ed29744ed318fd28d2c07985d3ba633'
+    };
+
+    return serviceApi.get('operations/api/v6/category/getCategory', params);
+}

@@ -6,7 +6,7 @@
 
 
 'use strict';
 'use strict';
 
 
-const router = require('express').Router(); // eslint-disable-line
+const router = require('express').Router(); // eslint-disable-line
 const cRoot = './controllers';
 const cRoot = './controllers';
 
 
 // Your controller here
 // Your controller here
@@ -21,5 +21,6 @@ router.get('/lifestyle', channelController.index);
 // ajax
 // ajax
 router.get('/getbrandFloorDataAjax', channelController.getbrandFloorDataAjax);
 router.get('/getbrandFloorDataAjax', channelController.getbrandFloorDataAjax);
 router.post('/common/getNewArrival', channelController.getNewArrival);
 router.post('/common/getNewArrival', channelController.getNewArrival);
+router.get('/guide', channelController.getIndexGuide);
 
 
 module.exports = router;
 module.exports = router;

+<div class="con"></div>
+<div class="guide-box" spm-name="homepage_guide" style="top: 255.5px;">
+	<a class="close" href="javascript:void(0)">x</a>
+	<ul class="clear">
+	{{#list}}
+		    <li class="{{channel}}" >
+			<dl>
+				<dt class="tag_img_warpper">
+					<a href="{{url}}" target="_self">
+					<img spm-name="homepage_guide_manimg" alt="YOHO!BOYS" src="{{src}}"></a>
+				</dt>
+				<dd class="block_cn">{{sort_name}}</dd>
+				<dd class="block_en"> <b>{{sort_name_en}}</b>
+				</dd>
+				<dd class="block_line">
+				</dd>
+				<dd class="goods-num"> <b>{{num}}+ Items.</b>
+				</dd>
+				<dd>
+					<a class="go" href="{{url}}">
+						Enter
+						<span class="ifont">&gt;</span>
+					</a>
+				</dd>
+			</dl>
+		</li>
+	{{/list}}
+  </ul>
+</div>

@@ -434,3 +434,100 @@ $subNav.on({
         $thirdNav.hide();
         $thirdNav.hide();
     }
     }
 });
 });
+
+/**
+ * 首次进入有弹窗
+ * @return {[type]} [description]
+ */
+function actionCover() {
+    var gender = window.cookie('_Gender');
+    var newMask = '';
+    var windowheight = '';
+    var selfheight = '';
+    var containertop;
+    var length = '';
+
+    if (true) {
+        $.get('/guide', function(data) {
+            newMask = document.createElement('div');
+            newMask.id = 'cover';
+            newMask.innerHTML = data;
+            document.body.appendChild(newMask);
+            windowheight = $(window).height();
+            selfheight = $('.guide-box').height();
+            containertop = windowheight / 2 - selfheight / 2;
+            length = $('.guide-box .clear').find('li').length;
+            $('.guide-box').css({
+                width: (200 * length) + 'px',
+                top: containertop + 'px'
+            });
+            $('#cover').bind('click', function(event) {
+                window.setCookie('_Gender', '1,3', {
+                    path: '/',
+                    domain: '.yohobuy.com',
+                    expires: 90
+                });
+                window.setCookie('_Channel', 'boys', {
+                    path: '/',
+                    domain: '.yohobuy.com',
+                    expires: 7
+                });
+                closeCover();
+            })
+            $('#cover .guide-box .close').bind('click', function(event) {
+                getSource('弹窗', 'CLOSE', 'homepage_man');
+                window.setCookie('_Gender', '1,3', {
+                    path: '/',
+                    domain: '.yohobuy.com',
+                    expires: 90
+                });
+                window.setCookie('_Channel', 'boys', {
+                    path: '/',
+                    domain: '.yohobuy.com',
+                    expires: 7
+                });
+                closeCover();
+            });
+            $('.boys img , .boys .go').bind('click', function(event) {
+                getSource('弹窗', 'BOYS', 'homepage_man');
+                window.setCookie('_Gender', '1,3', {
+                    path: '/',
+                    domain: '.yohobuy.com',
+                    expires: 90
+                });
+                window.setCookie('_Channel', 'boys', {
+                    path: '/',
+                    domain: '.yohobuy.com',
+                    expires: 7
+                });
+                closeCover();
+            });
+            $('.girls img, .girls .go').bind('click', function(event) {
+                getSource('弹窗', 'GIRLS', 'homepage_woman');
+                window.setCookie('_Gender', '2,3', {
+                    path: '/',
+                    domain: '.yohobuy.com',
+                    expires: 90
+                });
+                window.setCookie('_Channel', 'girls', {
+                    path: '/',
+                    domain: '.yohobuy.com',
+                    expires: 7
+                });
+            });
+            $('.lifestyle img, .lifestyle .go').bind('click', function(event) {
+                window.setCookie('_Channel', 'lifestyle', {
+                    path: '/',
+                    domain: '.yohobuy.com',
+                    expires: 7
+                });
+                getSource('弹窗', 'LIEFSTYLE', 'homepage_lifestyle');
+            });
+            $('#cover .guide-box').bind('click', function(event) {
+                event.stopPropagation();
+            });
+        }).error(function(err){alert(JSON.parse(err.responseText).message)});
+    }
+};
+
+actionCover();

+.yoho-notice {
+    width: 100%;
+    height: 100px;
+    font-size: 12px;
+    background-color: #555;
+    font-family: '微软雅黑';
+
+    .notice-title{
+        height: 100px;
+        line-height: 100px;
+        font-size: 27px;
+        font-weight: bold;
+        color: #fff;
+        width: 245px;
+        position: absolute;
+    }
+
+    .notice-content {
+        padding: 16px 0 0 300px;
+        color: #e8e8e8;
+
+
+        .tips {
+            margin-bottom: 10px;
+        }
+
+        .detail {
+            line-height: 16px;
+        }
+    }
+}
+
+
+.yoho-header {
+    .header-topwrapper {
+        width: 100%;
+        background-color: #f4f4f4;
+        min-width: 1150px;
+    }
+
+    .header-top {
+        width: 1150px;
+        height: 32px;
+        line-height: 32px;
+        margin: 0 auto;
+        position: relative;
+    }
+
+    #loginBox {
+        display: none;
+    }
+
+    .leftpart {
+        position: relative;
+        padding-left: 5px;
+        padding-right: 5px;
+    }
+
+    .leftpart:hover {
+        background-color: #dcdcdc;
+
+        .yohoproducts-list {
+            display: block !important;
+        }
+    }
+
+    .leftpart .acttags {
+        background-color: #dcdcdc;
+    }
+
+    .yohoproducts-list {
+        position: absolute;
+        display: none;
+        width: 170px;
+        left: 0;
+        top: 32px;
+        background-color: #f4f4f4;
+        padding-top: 30px;
+        padding-bottom: 10px;
+        padding-left: 20px;
+        z-index: 10000000;
+    }
+
+    .yohoproducts-item {
+        height: 14px;
+        line-height: 14px;
+        margin-bottom: 20px;
+
+        a {
+            color: #9196a0;
+            font-size: 14px;
+        }
+
+        &:hover a {
+            color: black;
+        }
+    }
+
+    .rightpart {
+        position: absolute;
+        right: 0;
+        top: 0;
+
+        .acttags {
+            background-color: #dcdcdc;
+        }
+
+        .tag-seprate {
+            border-color: #dcdcdc;
+        }
+    }
+
+    .hi,
+    .loginbar,
+    .registbar {
+        display: inline-block;
+        float: left;
+    }
+
+    .hi {
+        color: #8e8e8e;
+        font-size: 12px;
+    }
+
+    #loginBox a,
+    #loginBox span {
+        color: black;
+        font-size: 12px;
+    }
+
+    .header-yoho,
+    .loginbar,
+    .login-out,
+    .registbar {
+        color: black;
+        font-size: 12px;
+    }
+
+    .registbar {
+        margin-left: 7px;
+    }
+
+    .tag-list-wrapper {
+        margin-left: 13px;
+        float: left;
+    }
+
+    .tag-list {
+        margin-left: 13px;
+        height: 34px;
+    }
+
+    .tag-seprate {
+        margin-top: 11px;
+        width: 0;
+        height: 14px;
+        display: inline-block;
+        float: left;
+        border-left: 1px solid #dcdcdc;
+    }
+
+    .tag-item {
+        display: inline-block;
+        float: left;
+        line-height: 32px;
+        box-sizing: border-box;
+        margin-left: -1px;
+
+        a {
+            color: #8e8e8e;
+            font-size: 12px;
+            display: inline-block;
+        }
+
+        span {
+            display: inline-block;
+        }
+    }
+
+    .myyoho {
+        padding-right: 10px;
+        position: relative;
+
+        .tag-seprate {
+            margin-right: 12px;
+        }
+    }
+
+    .myyoho-info {
+        position: absolute;
+        display: none;
+        top: 32px;
+        left: -110px;
+        width: 300px;
+        background-color: #f8f8f8;
+        z-index: 1000000;
+    }
+
+    .myyoho-photo {
+        overflow: hidden;
+
+        img{
+            display: block;
+            margin:0 auto;
+            width: 63px;
+            height: 63px;
+            border-radius: 50%;
+        }
+    }
+
+    .myyoho-info-header {
+        margin: 17px auto 0;
+        width: 257px;
+        border-bottom: 1px solid #dcdcdc;
+        text-align: center;
+        padding-bottom: 15px;
+    }
+
+    .user-email {
+        margin-top: 14px;
+        color: black;
+        height: 25px;
+        line-height: 20px;
+        font-size: 18px;
+    }
+
+    .user-level {
+        color: black;
+        height: 20px;
+        line-height: 20px;
+        font-size: 18px;
+
+        .leveldetail {
+            color: #8cc4f9;
+        }
+    }
+
+    .levelinfo {
+        width: 100%;
+        padding-top: 10px;
+        clear: both;
+        height: 15px;
+    }
+
+    .levelwrapper {
+        width: 150px;
+        height: 14px;
+        background-color: #e2e2e2;
+        margin-left: 40px;
+        position: relative;
+    }
+
+    .levelspan {
+        position: absolute;
+        left: 2px;
+        height: 14px;
+        top: 0;
+        line-height: 16px;
+    }
+
+    .levelwrapper .integrate {
+        height: 14px;
+        line-height: 15px;
+        background-color: #ceae64;
+        text-align: left;
+        padding-left: 5px;
+    }
+
+    .cardcate {
+        font-size: 14px;
+        line-height: 14px;
+        margin-left: 5px;
+    }
+
+    .myyoho-info-content {
+        margin: 20px auto 0;
+        padding-left: 35px;
+        padding-right: 29px;
+        border-bottom: 1px solid #dcdcdc;
+
+        .item {
+            height: 12px;
+            line-height: 12px;
+            margin-bottom: 16px;
+
+            a {
+                font-size: 14px;
+                color: black;
+            }
+        }
+    }
+
+    .myyoho-info-footer {
+        height: 51px;
+        line-height: 51px;
+        text-align: center;
+
+        a {
+            color: black;
+            font-size: 14px;
+        }
+    }
+
+    .myorder {
+        padding-right: 10px;
+
+        .tag-seprate {
+            margin-right: 11px;
+        }
+    }
+
+    .mycollect {
+        padding-right: 11px;
+
+        .tag-seprate {
+            margin-right: 11px;
+        }
+    }
+
+    .message {
+        padding-right: 10px;
+
+        .tag-seprate {
+            margin-right: 11px;
+        }
+    }
+
+    .phone {
+        padding-right: 8px;
+        position: relative;
+
+        .tag-seprate {
+            margin-right: 10px;
+        }
+    }
+
+    .qr {
+        position: absolute;
+        display: none;
+        top: 32px;
+        left: -100px;
+        width: 231px;
+        height: 290px;
+        background-color: #f8f8f8;
+        z-index: 10000000;
+    }
+
+    .qr-img {
+        position: relative;
+        background-image: resolve(header/qr.png);
+        background-repeat: no-repeat;
+        background-size: 100% 100%;
+        margin: 32px auto 15px;
+        width: 143px;
+        height: 147px;
+    }
+
+    .qr-words {
+        height: 25px;
+        line-height: 25px;
+        font-size: 16px;
+        text-align: center;
+    }
+
+    .qr-more {
+        margin-top: 6px;
+        line-height: 25px;
+        font-size: 14px;
+        text-align: center;
+    }
+
+    .onlineserver .tag-seprate {
+        margin-right: 10px;
+    }
+
+    .header-navwrapper {
+        width: 100%;
+        height: 130px;
+        position: relative;
+        min-width: 1150px;
+    }
+
+    .header-navcontent {
+        width: 1150px;
+        height: 130px;
+        margin: 0 auto;
+    }
+
+    .first-nav-list {
+        margin-top: 45px;
+    }
+
+    .first-nav-item {
+        float: left;
+        padding: 8px 23px 0;
+
+        .menu-ico {
+            width: 84px;
+            height: 32px;
+            display: block;
+        }
+    }
+
+    .all a,
+    .girls a,
+    .boys a,
+    .kids a,
+    .lifestyle a {
+        color: white !important;
+    }
+
+    .all span,
+    .girls span,
+    .boys span,
+    .kids span,
+    .lifestyle span {
+        color: white !important;
+    }
+
+    .all {
+        background-color: #5e4b3c;
+
+        .sub-nav-wrapper {
+            background-color: black;
+            display: block !important;
+        }
+
+        .third-nav-wrapper {
+            border-top: 2px solid black;
+        }
+    }
+
+    .searchcateboys {
+        .searchinput {
+            border: 1px solid #3a3a3a
+        }
+        .icon-search {
+            background-color: #3a3a3a!important
+        }
+    }
+    .searchcategirls {
+        .searchinput {
+            border: 1px solid #ff88ae
+        }
+        .icon-search {
+            background-color: #ff88ae!important
+        }
+    }
+    .searchcatewoman {
+        .searchinput {
+            border: 1px solid #ff88ae
+        }
+        .icon-search {
+            background-color: #ff88ae!important
+        }
+    }
+    .searchcatekids {
+        .searchinput {
+            border: 1px solid #7bd3f9 !important
+        }
+        .icon-search {
+            background-color: #7bd3f9!important
+        }
+    }
+    .gobuyboys {
+        background: url(header/cart/boys.png) no-repeat;
+    }
+    .gobuygirls {
+        background: url(header/cart/girls.png) no-repeat;
+    }
+    .gobuykids {
+        background: url(header/cart/kids.png) no-repeat;
+    }
+    .gobuylifestyle {
+        background: url(header/cart/lifestyle.png) no-repeat;
+    }
+    .gobuyoutlets {
+        background: url(header/cart/outlets.png) no-repeat;
+    }
+    .searchcatelifestyle {
+        .searchinput {
+            border: 1px solid #5e4b3c !important
+        }
+        .icon-search {
+            background-color: #5e4b3c !important
+        }
+    }
+    .boys {
+        background-color: #3a3a3a;
+
+        .sub-nav-wrapper {
+            background-color: #3a3a3a;
+            display: block !important;
+        }
+
+        .third-nav-wrapper {
+            border-top: 2px solid #3a3a3a;
+        }
+    }
+
+    .girls {
+        background-color: #ff88ae;
+
+        .sub-nav-wrapper {
+            background-color: #ff88ae;
+            display: block !important;
+        }
+
+        .third-nav-wrapper {
+            border-top: 2px solid #ff88ae;
+        }
+    }
+
+    .kids {
+        background-color: #7bd3f9;
+
+        .sub-nav-wrapper {
+            background-color: #7bd3f9;
+            display: block !important;
+        }
+
+        .third-nav-wrapper {
+            border-top: 2px solid #7bd3f9;
+        }
+    }
+
+    .lifestyle {
+        background-color: #5e4b3c;
+
+        .sub-nav-wrapper {
+            background-color: #5e4b3c;
+            display: block !important;
+        }
+
+        .third-nav-wrapper {
+            border-top: 2px solid #5e4b3c;
+        }
+    }
+
+    .outlets > .sub-nav-wrapper {
+        display: block !important;
+    }
+
+    .name-cn {
+        text-align: center;
+        line-height: 16px !important;
+
+        a {
+            color: black;
+            font-size: 16px !important;
+        }
+    }
+
+    .name-en {
+        text-align: center;
+        line-height: 14px !important;
+        margin-bottom: 6px;
+
+        a {
+            color: #8e8e8e;
+            font-size: 12px;
+            line-height: 14px !important;
+            font-family: 'arial' !important;
+        }
+    }
+
+    .sub-nav-wrapper {
+        display: none;
+        height: 40px;
+        left: 0;
+        width: 100%;
+        position: absolute;
+        z-index: 1000;
+    }
+
+    .sub-nav-list {
+        width: 1150px;
+        height: 40px;
+        margin: 0 auto;
+        overflow: hidden;
+    }
+
+    .sub-nav-item {
+        float: left;
+        padding: 12px 46px 12px 0;
+        box-sizing: border-box;
+        margin-right: 38px;
+
+        &:last-child {
+            margin-right: 0 !important;
+        }
+
+        a {
+            position: relative;
+            color: white;
+            font-size: 14px;
+            line-height: 14px;
+            display: inline-block;
+        }
+    }
+
+    .newlogo {
+        display: block;
+        width: 26px;
+        height: 12px;
+        background-image: resolve(header/new.png);
+        background-repeat: no-repeat;
+        position: absolute;
+        right: -29px;
+        top: -6px;
+    }
+
+    .sub-nav-item:hover > a {
+        padding-bottom: 3px;
+        border-bottom: 2px solid white;
+    }
+
+    .actsecondnav {
+        padding-bottom: 3px;
+        border-bottom: 2px solid white;
+    }
+
+    .sub-nav-item:hover .third-nav-wrapper {
+        display: block;
+    }
+
+    .third-nav-wrapper {
+        box-sizing: border-box;
+        height: 410px;
+        position: absolute;
+        left: 0;
+        top: 38px;
+        width: 100%;
+        min-width: 1150px;
+        display: none;
+        z-index: 10000;
+        padding-top: 30px;
+        padding-bottom: 30px;
+        background-color: #f8f8f8;
+    }
+
+    .third-nav {
+        width: 1150px;
+        height: 100%;
+        margin: 0 auto;
+    }
+
+    .category {
+        width: 880px;
+        float: left;
+        overflow: hidden;
+
+        .thirdnavlist {
+            box-sizing: border-box;
+            width: 220px;
+            height: 240px;
+            float: left;
+            padding-left: 20px;
+            border-right: 1px solid #dcdcdc;
+            padding-right: 20px;
+        }
+    }
+
+    .category-title {
+        color: black;
+        font-size: 16px;
+        width: 178px;
+        padding-bottom: 12px;
+        border-bottom: 1px solid #000;
+        line-height: 16px;
+        margin-bottom: 20px;
+        a {
+            color: black !important;
+        }
+    }
+
+    .category-list {
+        margin-top: 16px;
+        margin-bottom: 30px;
+    }
+
+    .category-item {
+        line-height: 28px;
+    }
+
+    .category-list a {
+        color: #a1a1a1 !important;
+        font-size: 14px;
+    }
+
+    .category-list .category-item .hot {
+        color: #ee0011 !important;
+        font-size: 14px;
+    }
+
+    .category-item-act a {
+        color: black !important;
+    }
+
+    .showdetail {
+        box-sizing: border-box;
+        padding-left: 19px;
+        padding-right: 19px;
+        width: 337px;
+        height: 250px;
+        float: right;
+    }
+
+    [class^="icon-"], [class*=" icon-"] {
+        display: inline-block;
+        vertical-align: middle;
+        background-repeat: none;
+    }
+
+    .icon-hamburger {
+        background: url(header/hamburger.png) no-repeat;
+        width: 13px;
+        height: 11px;
+    }
+
+    .icon-headphones {
+        background: url(header/iphone.png) no-repeat;
+        width: 15px;
+        height: 10px;
+        margin-top: 2px;
+    }
+
+    .icon-heart {
+        background: url(header/heart.png) no-repeat;
+        width: 12px;
+        height: 11px;
+        margin-top: -2px;
+    }
+
+    .icon-mail {
+        background: url(header/mail.png) no-repeat;
+        width: 16px;
+        height: 10px;
+        margin-top: -2px;
+    }
+
+    .icon-iphone {
+        background: url(header/iphone.png) no-repeat;
+        width: 8px;
+        height: 14px;
+        margin-top: -2px;
+    }
+
+    .icon-papers {
+        background: url(header/paper.png) no-repeat;
+        width: 10px;
+        height: 14px;
+        margin-top: -2px;
+    }
+
+    .icon-bottomarrow {
+        background: url(header/bottom-arrow.png) no-repeat;
+        width: 10px;
+        height: 5px;
+        margin-top: -2px;
+    }
+
+    .outlets-logo {
+        background: resolve(header/outlets.png) no-repeat center center;
+        width: 200px;
+        height: 34px;
+        left: 42%;
+        margin-top: 28px;
+        position: absolute;
+        display: none;
+    }
+
+    .icon-logo {
+        background: resolve(header/logo.png) no-repeat center center;
+        width: 182px;
+        height: 53px;
+        top: 22px;
+        left: 44.2%;
+        position: absolute;
+        .main-link {
+            display: block;
+            width: 100%;
+            height: 100%;
+        }
+    }
+
+    .search {
+        position: relative;
+    }
+
+    .searchspan {
+        margin-top: 45px;
+        float: left;
+        display: inline-block;
+        overflow: hidden;
+    }
+
+    .searchinput {
+        float: left;
+        width: 240px;
+        height: 28px;
+        border: 1px solid #000;
+        box-sizing: border-box;
+        padding: 6px 0 5px 10px;
+        border-right: none;
+    }
+
+    .icon-search {
+        background: resolve(header/search.png) no-repeat center center;
+        width: 80px;
+        height: 28px;
+        float: left;
+        border: none;
+        margin-top: 45px;
+        background-color: #3a3a3a;
+    }
+
+    .search-list {
+        position: absolute;
+        top: 73px;
+        left: 0;
+        z-index: 1000;
+        box-sizing: border-box;
+        display: none;
+        background-color: white;
+        padding-top: 20px;
+        width: 100%;
+        max-height: 500px;
+        border-left: 1px solid #000;
+        border-right: 1px solid #000;
+        border-bottom: 1px solid #000;
+    }
+
+    .search-item {
+        position: relative;
+        padding: 5px;
+        height: 25px;
+        line-height: 25px;
+        font: 12px;
+
+        &:hover {
+            background-color: #f4f4f4;
+        }
+    }
+
+    .searchvalue {
+        position: absolute;
+        left: 10px;
+        max-width: 192px;
+        font-size: 12px;
+        @mixin ellipsis;
+    }
+
+    .valuenum {
+        position: absolute;
+        right: 10px;
+        font-size: 12px;
+    }
+
+    .header-tool {
+        padding-right: 23px;
+    }
+
+    .gobuy {
+        margin-top: 47px;
+        margin-left: 23px;
+        width: 26px;
+        height: 26px;
+        position: relative;
+        cursor: pointer;
+    }
+
+    .gobuy-wrapper {
+        position: absolute;
+        display: none;
+        top: 24px;
+        right: -14px;
+        width: 378px;
+        padding-top: 6px;
+        z-index: 10000000;
+    }
+
+    .gobuy-empty {
+        position: absolute;
+        width: 100%;
+        height: 507px;
+        z-index: 1;
+        background: #f8f8f8 resolve(header/empty_car.png) no-repeat 106px 132px;
+
+        .information {
+            margin-top: 300px;
+            width: 100%;
+            height: 18px;
+            line-height: 18px;
+            font-size: 18px;
+            text-align: center;
+        }
+    }
+
+    .gobuy-loading {
+        position: absolute;
+        width: 100%;
+        height: 407px;
+        z-index: 1;
+        background: #f8f8f8 resolve(header/loading.gif) no-repeat center 150px;
+
+        .information {
+            margin-top: 180px;
+            width: 100%;
+            height: 12px;
+            line-height: 12px;
+            font-size: 12px;
+            text-align: center;
+        }
+    }
+
+    .gobuy-notempty {
+        position: absolute;
+        width: 100%;
+        z-index: 1;
+        background-color: #f8f8f8;
+        overflow: hidden;
+    }
+
+    .goods-list-wrapper {
+        width: 100%;
+        max-height: 444px;
+        margin-bottom: 19px;
+        overflow-y: auto;
+        overflow-x: hidden;
+    }
+
+    .goods-list {
+        margin-top: 40px;
+    }
+
+    .goods-item {
+        height: 64px;
+        margin-bottom: 18px;
+        padding-left: 18px;
+    }
+
+    .goods-img {
+        display: inline-block;
+        float: left;
+        width: 46px;
+        height: 62px;
+        margin-right: 13px;
+    }
+
+    .goods-detail {
+        margin-right: 16px;
+
+        .content {
+            width: 170px;
+            height: 14px;
+            line-height: 14px;
+            font-size: 14px;
+            margin-bottom: 13px;
+            @mixin ellipsis;
+
+            a {
+                color: #666;
+                outline: none;
+                text-decoration: none;
+            }
+        }
+
+        .style {
+            height: 14px;
+            line-height: 14px;
+            font-size: 14px;
+            color: #b0b0b0;
+        }
+    }
+
+    .goods-price .priceandnum {
+        height: 14px;
+        line-height: 14px;
+        font-size: 14px;
+        margin-bottom: 13px;
+        min-width: 75px;
+        text-align: right;
+    }
+
+    .goods-price .delete {
+        display: inline-block;
+        float: right;
+        font-size: 14px;
+        color: #000;
+    }
+
+    .activity-item {
+        margin-bottom: 8px;
+        padding-left: 18px;
+    }
+
+    .activity-name {
+        display: inline-block;
+        box-sizing:border-box;
+        border: none;
+        width: 60px;
+        height: 18px;
+        line-height: 18px;
+        background-color: #3a3a3a;
+        color: white;
+        font-size: 14px;
+        text-align: center;
+        margin-right: 13px;
+        vertical-align: top;
+    }
+
+    .activity-content {
+        display: inline-block;
+        line-height: 14px;
+        width: 250px;
+        color: #3a3a3a;
+        font-size: 12px;
+        word-break: break-all;
+    }
+
+    .gobuy-notempty-footer {
+        width: 100%;
+        height: 61px;
+        text-align: center;
+
+        h3 {
+            box-sizing: border-box;
+            width: 349px;
+            margin: 0 auto;
+            height: 61px;
+            line-height: 61px;
+            border-top: 1px solid #dcdcdc;
+        }
+
+        a {
+            font-size: 18px;
+            color: #444;
+        }
+    }
+
+    .ic-infomation {
+        position: absolute;
+        background: url(header/ic-information.png) no-repeat;
+        width: 27px;
+        height: 20px;
+        top: -10px;
+        right: -15px;
+        color: white;
+        text-align: center;
+        line-height: 20px;
+        font-size: 12px;
+    }
+
+    .float-left {
+        float: left;
+    }
+
+    .float-right {
+        float: right;
+    }
+
+    .showdetail img {
+        display: block;
+        box-sizing: border-box;
+        width: 337px;
+        height: 250px;
+    }
+
+   .showdetail .title {
+        display: block;
+        margin-top: 40px;
+        width: 100%;
+        height: 15px;
+        text-align: center;
+        line-height: 15px;
+        font-size: 14px;
+        color: black !important;
+        @mixin ellipsis;
+    }
+
+    .cate_row {
+        float:left;
+        height:352px;
+        box-sizing:border-box;
+
+        li {
+            box-sizing:border-box;
+        }
+    }
+
+    .cate_row1 {
+        width:253px;
+    }
+
+    .cate_row2 {
+        width:278px;
+        border-left:1px solid #ccc;
+        padding-left: 50px;
+    }
+
+    .cate_row3 {
+        width: 270px;
+        border-left:1px solid #ccc;
+        padding-left: 50px;
+    }
+
+    .third-nav .cattitle {
+        width: 180px;
+        padding-bottom: 10px;
+        border-bottom: 1px solid #000;
+        line-height: 18px;
+        margin-bottom: 20px;
+    }
+
+    .third-nav .cattitle h3 a {
+        color: black !important;
+        font-size: 14px;
+    }
+
+    .third-nav .catdetail {
+        line-height: 14px;
+        height: 14px;
+        margin-bottom: 24px;
+        min-width: 200px;
+
+        a {
+            color: #a1a1a1 !important;
+            font-size: 14px;
+        }
+
+        .hot {
+            color: #ee0011 !important ;
+        }
+    }
+
+    .thirdcatelink:hover {
+        text-decoration: underline !important ;
+    }
+
+    .hovercontent {
+        display: none;
+    }
+}
+
+.yoho-header.outlets {
+    .header-navwrapper {
+        background-color: #3a3a3a;
+
+        .sub-nav-wrapper {
+            background-color: #e6e6e6;
+            margin-top: 37px;
+        }
+
+        .third-nav-wrapper {
+            border-top: 0;
+        }
+    }
+
+    .outlets-logo {
+        display: block;
+    }
+
+    .icon-logo {
+        display: none;
+    }
+
+    .first-nav-item.cure {
+        background: none;
+    }
+
+    .first-nav-item > h3 {
+        display: none;
+    }
+
+    .header-tool > .search {
+        display: none;
+    }
+
+    .sub-nav-list {
+        padding-left: 15%;
+
+        .sub-nav-item {
+            width: 14%;
+            text-align: center;
+
+            & > a {
+                color: #222!important;
+            }
+        }
+
+        .sub-nav-item:hover a {
+            border-color: #555;
+        }
+
+        .third-nav {
+            text-align: left;
+        }
+    }
+}
+
+.simple-header {
+    height: 66px;
+    margin: 0 0 20px 0;
+    border-bottom: 2px solid #222;
+
+    .header-inner {
+        width: 990px;
+        height: 100%;
+        margin: 0 auto;
+    }
+
+    .logo {
+        float: left;
+        line-height: 66px;
+        font-size: 0;
+        img {
+            vertical-align: middle;
+        }
+    }
+}
+
+.simple-header .header-tool {
+    float: right;
+    line-height: 66px;
+    font-size: 0;
+
+    li {
+        display: inline-block;
+        padding: 0 10px;
+        line-height: 28px;
+        font-size: 12px;
+        vertical-align: middle;
+
+        span, a {
+            font-size: 12px;
+            vertical-align: middle;
+        }
+
+        .tell-icon {
+            font-size: 12px;
+        }
+
+        .tell-icon ~ span {
+            font-weight: bold;
+        }
+    }
+
+    .login-box a {
+        color: #666;
+    }
+
+    .tool-options {
+        position: relative;
+        font-size: 0;
+        cursor: pointer;
+
+        &:hover {
+            background-color: #eaeceb;
+            .iconfont {
+                &.up {
+                    display: inline-block;
+                }
+
+                &.down {
+                    display: none;
+                }
+            }
+        }
+
+        .iconfont, span{
+            display: inline-block;
+            font-size: 12px;
+            height: 28px;
+            line-height: 28px;
+            vertical-align: top;
+            &.up {
+                display: none;
+            }
+        }
+
+        .tool-select {
+            display: none;
+            position: absolute;
+            width: 74px;
+            left: 0;
+            background: #eaeceb;
+            z-index: 9;
+            a {
+                display: block;
+                padding: 0 0 0 10px;
+                border-top: 1px solid #ddd;
+            }
+        }
+    }
+}
+
+.min-screen .yoho-header {
+    .header-topwrapper {
+        min-width: 990px;
+    }
+    .header-top {
+        width: 990px;
+    }
+    .header-navwrapper {
+        min-width: 990px;
+    }
+    .header-wrapper {
+        width: 990px;
+    }
+    .header-navcontent {
+        width: 990px;
+    }
+    .icon-logo {
+        left: 39.2%;
+        .main-link {
+            display: block;
+            width: 100%;
+            height: 100%;
+        }
+    }
+    .sub-nav-list {
+        width: 990px;
+        min-width: 990px;
+    }
+    .sub-nav-item {
+        margin-right:15px;
+    }
+    .first-nav-item {
+        float: left;
+        padding: 10px 14px 0;
+        margin-right: 3px;
+    }
+    .third-nav {
+        width: 990px;
+    }
+    .third-nav-wrapper {
+        min-width: 990px;
+    }
+    .category {
+        width: 800px;
+    }
+    .cate_row1 {
+        width: 204px;
+    }
+    .cate_row2 {
+        width: 244px;
+        border-left: 1px solid #ccc;
+        padding-left: 39px;
+    }
+    .cate_row3 {
+        width: 163px;
+        border-left: 1px solid #ccc;
+        padding-left: 28px;
+    }
+    .category .thirdnavlist {
+        width: 200px;
+    }
+    .category-title {
+        width: 152px;
+    }
+    .showdetail {
+        width: 190px;
+        padding-right: 0;
+        img {
+            width: 174px;
+            height: 155px;
+        }
+    }
+}
+
+#cover {
+    left: 0px;
+    top: 0px;
+    width: 100%;
+    height: 100%;
+    position: fixed;
+    z-index: 1001;
+
+    .con {
+        background: rgba(0, 0, 0, 0.6) !important;
+        left: 0px;
+        top: 0px;
+        width: 100%;
+        height: 100%;
+        position: absolute;
+        z-index: 1002;
+        opacity: 0.5;
+    }
+
+    .tag_img_warpper {
+        margin: 0px auto;
+        width: 180px;
+        height: 168px;
+
+        img {
+            width: 100%;
+            height: 100%;
+        }
+    }
+
+    .guide-box {
+        background: rgb(255, 255, 255);
+        margin: 0px auto;
+        height: 400px;
+        position: relative;
+        z-index: 1003;
+
+        .close {
+            top: -15px;
+            text-align: center;
+            right: -15px;
+            color: rgb(255, 255, 255);
+            line-height: 22px;
+            font-size: 24px;
+            position: absolute;
+            background: rgb(0, 0, 0);
+            border-radius: 50px;
+            border: currentColor;
+            border-image: none;
+            width: 28px;
+            height: 28px;
+            line-height: 25px;
+            display: block;
+        }
+
+        li {
+            padding: 10px;
+            width: 200px;
+            height: 400px;
+            float: left;
+            box-sizing: border-box;
+
+            &.girls {
+                border-left-color: rgb(238, 238, 238);
+                border-left-width: 1px;
+                border-left-style: solid;
+
+                .goods-num {
+                    text-align: center;
+                    color: rgb(187, 187, 187);
+                    line-height: 12px;
+                    font-size: 12px;
+                    margin-top: 16px;
+                }
+            }
+
+            &.lifestyle {
+                border-left-color: rgb(238, 238, 238);
+                border-left-width: 1px;
+                border-left-style: solid;
+
+                .goods-num {
+                    text-align: center;
+                    color: rgb(187, 187, 187);
+                    line-height: 12px;
+                    font-size: 12px;
+                    margin-top: 16px;
+                }
+            }
+
+            &.kids {
+                border-left-color: rgb(238, 238, 238);
+                border-left-width: 1px;
+                border-left-style: solid;
+
+                .goods-num {
+                    text-align: center;
+                    color: rgb(187, 187, 187);
+                    line-height: 12px;
+                    font-size: 12px;
+                    margin-top: 16px;
+                }
+            }
+
+            &.boys .goods-num {
+                text-align: center;
+                color: rgb(187, 187, 187);
+                line-height: 12px;
+                font-size: 12px;
+                margin-top: 16px;
+            }
+
+            .go {
+                margin: 26px auto 0px;
+                width: 100%;
+                height: 18px;
+                text-align: center;
+                color: rgb(176, 176, 176);
+                line-height: 18px;
+                font-size: 18px;
+                font-style: italic;
+                font-weight: lighter;
+                display: block;
+            }
+        }
+    }
+
+    .boys .block_cn {
+        text-align: center;
+        line-height: 26px;
+        font-size: 26px;
+        font-weight: bold;
+        margin-top: 30px;
+    }
+
+    .girls .block_cn {
+        text-align: center;
+        line-height: 26px;
+        font-size: 26px;
+        font-weight: bold;
+        margin-top: 30px;
+    }
+
+    .kids .block_cn {
+        text-align: center;
+        line-height: 26px;
+        font-size: 26px;
+        font-weight: bold;
+        margin-top: 30px;
+    }
+
+    .lifestyle .block_cn {
+        text-align: center;
+        line-height: 26px;
+        font-size: 26px;
+        font-weight: bold;
+        margin-top: 30px;
+    }
+
+    .boys .block_en {
+        text-align: center;
+        line-height: 26px;
+        font-size: 26px;
+        font-weight: bold;
+        margin-top: 19px;
+    }
+
+    .girls .block_en {
+        text-align: center;
+        line-height: 26px;
+        font-size: 26px;
+        font-weight: bold;
+        margin-top: 19px;
+    }
+
+    .kids .block_en {
+        text-align: center;
+        line-height: 26px;
+        font-size: 26px;
+        font-weight: bold;
+        margin-top: 19px;
+    }
+
+    .lifestyle .block_en {
+        text-align: center;
+        line-height: 26px;
+        font-size: 26px;
+        font-weight: bold;
+        margin-top: 19px;
+    }
+
+    .boys .block_cn,
+    .boys .block_en {
+        color: #000;
+    }
+
+    .girls .block_cn,
+    .girls .block_en {
+        color: rgb(255, 136, 174);
+    }
+
+    .kids .block_cn,
+    .kids .block_en {
+        color: rgb(122, 217, 248);
+    }
+
+    .lifestyle .block_cn,
+    .lifestyle .block_en {
+        color: rgb(79, 64, 55) !important;
+    }
+
+    .boys .block_line {
+        margin: 20px auto 0px;
+        width: 50px;
+        height: 0px;
+        border-bottom-color: rgb(204, 204, 204);
+        border-bottom-width: 1px;
+        border-bottom-style: solid;
+    }
+
+    .girls .block_line {
+        margin: 20px auto 0px;
+        width: 50px;
+        height: 0px;
+        border-bottom-color: rgb(204, 204, 204);
+        border-bottom-width: 1px;
+        border-bottom-style: solid;
+    }
+
+    .kids .block_line {
+        margin: 20px auto 0px;
+        width: 50px;
+        height: 0px;
+        border-bottom-color: rgb(204, 204, 204);
+        border-bottom-width: 1px;
+        border-bottom-style: solid;
+    }
+
+    .lifestyle .block_line {
+        margin: 20px auto 0px;
+        width: 50px;
+        height: 0px;
+        border-bottom-color: rgb(204, 204, 204);
+        border-bottom-width: 1px;
+        border-bottom-style: solid;
+    }
+}

@@ -3,6 +3,7 @@
 /* 公共 */
 /* 公共 */
 @import "common/index";
 @import "common/index";
 @import "plugin/index";
 @import "plugin/index";
+@import "header";
 
 
 /* 模块 */
 /* 模块 */
 @import "channel/index";
 @import "channel/index";