fe / yohobuywap-node · Commits

Go to a project

Authored by zhangxiaoru
Commit d50093547ab119f64eb1c6aa05cd074ff4352f06 2 parents 0b3d918d 9da61d47

冲突ã

Inline Side-by-side
Showing 23 changed files with 638 additions and 25 deletions
@@ -38,7 +38,7 @@ let _processCateData = (list, channel) => { @@ -38,7 +38,7 @@ let _processCateData = (list, channel) => {
38 secondItem.url = helpers.urlFormat('/', { 38 secondItem.url = helpers.urlFormat('/', {
39 sort: _.get(secondItem, 'relationParameter.sort'), 39 sort: _.get(secondItem, 'relationParameter.sort'),
40 sort_name: secondItem.categoryName, 40 sort_name: secondItem.categoryName,
41 - gender: genderMap[channel] || '' 41 + gender: genderMap[key] || ''
42 }, 'list'); 42 }, 'list');
43 }); 43 });
44 44
@@ -47,14 +47,14 @@ let _processCateData = (list, channel) => { @@ -47,14 +47,14 @@ let _processCateData = (list, channel) => {
47 url: helpers.urlFormat('/', { 47 url: helpers.urlFormat('/', {
48 sort: _.get(firstItem, 'relationParameter.sort'), 48 sort: _.get(firstItem, 'relationParameter.sort'),
49 sort_name: firstItem.categoryName, 49 sort_name: firstItem.categoryName,
50 - gender: genderMap[channel] || '' 50 + gender: genderMap[key] || ''
51 }, 'list') 51 }, 'list')
52 }); 52 });
53 } else { 53 } else {
54 firstItem.url = helpers.urlFormat('/', { 54 firstItem.url = helpers.urlFormat('/', {
55 sort: _.get(firstItem, 'relationParameter.sort'), 55 sort: _.get(firstItem, 'relationParameter.sort'),
56 sort_name: firstItem.categoryName, 56 sort_name: firstItem.categoryName,
57 - gender: genderMap[channel] || '' 57 + gender: genderMap[key] || ''
58 }, 'list'); 58 }, 'list');
59 } 59 }
60 }); 60 });
1 <div class="resources"> 1 <div class="resources">
2 <!--banner--> 2 <!--banner-->
3 {{#each result.focus1}} 3 {{#each result.focus1}}
4 - {{> resources/banner-top}} 4 + <div class="banner-top">
  5 + <div class="banner-swiper swiper-container">
  6 + <ul class="swiper-wrapper">
  7 + {{#each data}}
  8 + {{#if @first}}
  9 + <li class="swiper-slide">
  10 + <a href="{{url}}">
  11 + <img src="{{image src 750 364}}">
  12 + </a>
  13 + </li>
  14 + {{^}}
  15 + <li class="swiper-slide">
  16 + <a href="{{url}}">
  17 + <img class="swiper-lazy" data-src="{{image src 750 364}}">
  18 + </a>
  19 + <div class="swiper-lazy-preloader"></div>
  20 + </li>
  21 + {{/if}}
  22 + {{/each}}
  23 + </ul>
  24 + </div>
  25 + <div class="swiper-pagination">
  26 + <div class="pagination-inner">
  27 + </div>
  28 + </div>
  29 + </div>
5 {{/each}} 30 {{/each}}
6 31
7 {{#each result.title_image}} 32 {{#each result.title_image}}
  1 +/**
  2 + * 热销排行页面
  3 + * @author: zxr<xiaoru.zhang@yoho.cn>
  4 + * @date: 2016/09/22
  5 + */
  6 +'use strict';
  7 +
  8 +const newsaleModel = require('../models/newsale');
  9 +const headerModel = require('../../../doraemon/models/header');
  10 +let channels = {
  11 + boys: '1,3',
  12 + girl: '2,3',
  13 + kids: '1,2,3',
  14 + lifestyle: '1,2,3'
  15 +};
  16 +
  17 +const index = (req, res, next) => {
  18 + let channel = req.yoho.channel || 'boys';
  19 + let codeKey = '';
  20 +
  21 + switch (channel) {
  22 + case 'boys': // 男生
  23 + codeKey = '3cf2c1be5217fbab6009ce83959e1e12';
  24 + break;
  25 + case 'girls': // 女生
  26 + codeKey = '1cf7f9f10e2a2670e73d05c568793ad9';
  27 + break;
  28 + case 'kids': // 潮童
  29 + codeKey = '57457adececa6c748b29c90cad0ae940';
  30 + break;
  31 + case 'lifestyle': // 创意生活
  32 + codeKey = '04953a61cbf1db426a681e55d496d2fe';
  33 + break;
  34 + }
  35 +
  36 + newsaleModel.getHotRank(codeKey).then((result) => {
  37 +
  38 + res.render('newsale/hotrank', {
  39 + module: 'product',
  40 + page: 'hot-rank',
  41 + title: '热销排行榜',
  42 + pageHeader: headerModel.setNav({
  43 + navTitle: '热销排行榜'
  44 + }),
  45 + pageFooter: true,
  46 + headerBanner: result
  47 + });
  48 + }).catch(next);
  49 +};
  50 +
  51 +const selectHotrank = (req, res, next) => {
  52 + let sort = req.query.sort;
  53 + let tab_id = req.query.tab_id;
  54 + let limit = 50;
  55 + let page = req.query.page || 1;
  56 + let notab = req.query.notab || 0;
  57 + let yhChannel = req.query.yh_channel || 1;
  58 + let gender = req.query.gender || req.cookies._Channel && channels[req.cookies._Channel] || '1,3';
  59 +
  60 + newsaleModel.selectHotrank(yhChannel, gender, sort, tab_id, limit, page, notab).then((result) => {
  61 +
  62 + res.render('newsale/hotlist', {
  63 + layout: false,
  64 + tabs: result.tabs,
  65 + goods: result.goods
  66 + });
  67 + }).catch(next);
  68 +};
  69 +
  70 +module.exports = {
  71 + index,
  72 + selectHotrank
  73 +};
@@ -921,6 +921,9 @@ const _detailDataPkg = (origin, uid, vipLevel, ua) => { @@ -921,6 +921,9 @@ const _detailDataPkg = (origin, uid, vipLevel, ua) => {
921 }; 921 };
922 922
923 let _getShopsInfo = (brandId) => { 923 let _getShopsInfo = (brandId) => {
  924 + if(!brandId) {
  925 + return Promise.resolve([]);
  926 + }
924 return api.get('', { 927 return api.get('', {
925 method: 'app.shop.queryShopsByBrandId', 928 method: 'app.shop.queryShopsByBrandId',
926 brand_id: _.toString(brandId) 929 brand_id: _.toString(brandId)
@@ -1006,7 +1009,7 @@ let getProductData = (data) => { @@ -1006,7 +1009,7 @@ let getProductData = (data) => {
1006 } 1009 }
1007 result = result.data; 1010 result = result.data;
1008 return Promise.all([ 1011 return Promise.all([
1009 - _getShopsInfo(result.brandInfo.brandId), 1012 + _getShopsInfo(_.get(result, 'brandInfo.brandId', 0)),
1010 _getPromotionInfo(result.productSkn), 1013 _getPromotionInfo(result.productSkn),
1011 comment.getCommentInfo({ 1014 comment.getCommentInfo({
1012 productId: result.productId 1015 productId: result.productId
  1 +'use strict';
  2 +
  3 +const api = global.yoho.API;
  4 +const helpers = global.yoho.helpers;
  5 +const _ = require('lodash');
  6 +const serviceAPI = global.yoho.ServiceAPI;
  7 +const logger = global.yoho.logger;
  8 +
  9 +const getHotRank = (codeKey) => {
  10 + return serviceAPI.get('operations/api/v5/resource/get', {
  11 + content_code: codeKey
  12 + }).then((result) => {
  13 +
  14 + if (result && result.code === 200) {
  15 + let formData = {};
  16 +
  17 + if (result.data[0].data.length === 1) {
  18 + formData.url = result.data[0].data[0].url;
  19 + formData.img = result.data[0].data[0].src;
  20 + } else {
  21 + let list = [];
  22 +
  23 + _.forEach(result.data[0].data, function(val) {
  24 + list.push({
  25 + url: val.url,
  26 + img: val.src
  27 + });
  28 + });
  29 +
  30 + formData.list = list;
  31 + }
  32 + return formData;
  33 + } else {
  34 + logger.error('getHotRank data return code is not 200');
  35 + return {};
  36 + }
  37 + });
  38 +};
  39 +
  40 +const selectHotrank = (yhChannel, gender, sort, tab_id, limit, page, notab) => {
  41 + let param = {
  42 + method: 'app.search.top',
  43 + gender: gender,
  44 + yh_channel: yhChannel,
  45 + page: page,
  46 + limit: limit
  47 + };
  48 +
  49 + if (sort) {
  50 + param.sort = sort;
  51 + }
  52 +
  53 + if (tab_id) {
  54 + param.tab_id = tab_id;
  55 + }
  56 +
  57 + console.log(param);
  58 +
  59 + return api.get('', param).then((result) => {
  60 +
  61 + if (result && result.code === 200 && result.data.product_list) {
  62 +
  63 + let formData = {};
  64 +
  65 + if (notab && parseInt(notab, 10) === 0 && result.data.tabs) {
  66 + let tabs = [];
  67 +
  68 + _.forEach(result.data.tabs, function(val, index) {
  69 + let obj = {};
  70 +
  71 + if (index === 0) {
  72 + obj = _.assign(obj, {
  73 + focus: true
  74 + });
  75 + }
  76 +
  77 + obj = _.assign(obj, {
  78 + title: val,
  79 + dataId: index
  80 + });
  81 +
  82 + tabs.push(obj);
  83 + });
  84 +
  85 + formData.tabs = tabs;
  86 + }
  87 +
  88 + if (result.data.product_list && result.data.product_list.length !== 0) {
  89 +
  90 + let goods = [];
  91 +
  92 + _.forEach(result.data.product_list, function(data, index) {
  93 + let one = {};
  94 +
  95 + if (data === null || !data.product_skn || !data.goods_list[0]) {
  96 + return false;
  97 + }
  98 +
  99 + one = _.assign(one, {
  100 + url: '/product/pro_' + data.product_id + '_' + data.goods_list[0].goods_id
  101 + + '/' + data.cn_alphabet + '.html',
  102 + thumb: data.default_images,
  103 + rank: limit * (page - 1) + index + 1,
  104 + name: data.product_name,
  105 + salePrice: data.sales_price
  106 + });
  107 +
  108 + if (data.sales_phrase) {
  109 + one = _.assign(one, {
  110 + sales_phrase: data.sales_phrase
  111 + });
  112 + }
  113 + goods.push(one);
  114 + });
  115 +
  116 + formData.goods = goods;
  117 + }
  118 +
  119 + return formData;
  120 + }
  121 +
  122 + });
  123 +};
  124 +
  125 +module.exports = {
  126 + getHotRank,
  127 + selectHotrank
  128 +};
@@ -33,6 +33,10 @@ const list = require(`${cRoot}/list`); @@ -33,6 +33,10 @@ const list = require(`${cRoot}/list`);
33 // 新品到着 controller 33 // 新品到着 controller
34 const news = require(`${cRoot}/new`); 34 const news = require(`${cRoot}/new`);
35 35
  36 +//热销排行榜
  37 +const newsale = require(`${cRoot}/newsale`);
  38 +
  39 +
36 // routers 40 // routers
37 41
38 // /pro_136349_455445/HEARTSOFARMianMaShuJiaoXiuXianKuPS1684.html 42 // /pro_136349_455445/HEARTSOFARMianMaShuJiaoXiuXianKuPS1684.html
@@ -98,4 +102,7 @@ router.get('/new', news.newGoods); @@ -98,4 +102,7 @@ router.get('/new', news.newGoods);
98 router.get('/new/selectNewSale', news.selectNewSale); 102 router.get('/new/selectNewSale', news.selectNewSale);
99 router.get('/new/filter', news.filter); 103 router.get('/new/filter', news.filter);
100 104
  105 +router.get('/newsale/hotrank', newsale.index);// 热销排行榜
  106 +router.get('/newsale/selectHotrank', newsale.selectHotrank);// 热销排行榜
  107 +
101 module.exports = router; 108 module.exports = router;
  1 +{{#if tabs}}
  2 + <div class="s-goods-nav goods-nav">
  3 + <ul class="swiper-wrapper clearfix">
  4 + {{# tabs}}
  5 + {{# title}}
  6 + <li class="swiper-slide nav-item {{#if @first}} active{{/if}}">
  7 + <span data-sort="{{ params}}" data-id="{{ id}}" >{{ name}}</span>
  8 + </li>
  9 + {{/ title}}
  10 + {{/ tabs}}
  11 + </ul>
  12 +</div>
  13 +{{/if}}
  14 + <div class="rank-main">
  15 + <ul>
  16 + {{# goods}}
  17 + <li>
  18 + <a class="clearfix" href="{{url}}">
  19 + <div class="item-img">
  20 + <img class="lazy" data-original="{{image thumb 75 114}}">
  21 + </div>
  22 + <div class="item-content">
  23 + <i class="rank-icon top">{{rank}}</i>
  24 + <h2 {{# sales_phrase}}class="hasActive"{{/ sales_phrase}}>{{name}}</h2>
  25 + {{# active}}
  26 + <p>{{.}}</p>
  27 + {{/ active}}
  28 + {{#sales_phrase}}
  29 + <p>{{.}}</p>
  30 + {{/sales_phrase}}
  31 + <p>
  32 + {{#salePrice}}¥{{.}}{{/salePrice}}{{#price}}
  33 + <b>¥{{.}}</b>{{/price}}
  34 + </p>
  35 + </div>
  36 + </a>
  37 + </li>
  38 + {{/ goods}}
  39 + </ul>
  40 + </div>
  1 +<div class="discount-page yoho-page">
  2 + {{# headerBanner}}
  3 + {{> newsale/banner-swipe-and-single}}
  4 + {{/ headerBanner}}
  5 + <div id="hotRank"></div>
  6 + {{> common/suspend-cart}}
  7 +</div>
@@ -22,7 +22,7 @@ @@ -22,7 +22,7 @@
22 {{^}} 22 {{^}}
23 <div class="banner-top-single"> 23 <div class="banner-top-single">
24 <a href={{url}}> 24 <a href={{url}}>
25 - <img class="img" src="{{image img 450 600}}"> 25 + <img class="img" src="{{image src 450 600}}">
26 </a> 26 </a>
27 </div> 27 </div>
28 {{/if}} 28 {{/if}}
  1 +{{#if list}}
  2 +<div class="banner-top">
  3 + <div class="banner-swiper swiper-container">
  4 + <ul class="swiper-wrapper">
  5 + {{# list}}
  6 + <li class="swiper-slide">
  7 + <a href="{{#if url}}{{url}}{{else}}javascript:;{{/if}}">
  8 + <img class="swiper-lazy" data-src="{{image img 640 240}}">
  9 + </a>
  10 + <div class="swiper-lazy-preloader"></div>
  11 + </li>
  12 + {{/ list}}
  13 + </ul>
  14 + </div>
  15 + <div class="swiper-pagination">
  16 + <div class="pagination-inner">
  17 + </div>
  18 + </div>
  19 +</div>
  20 +{{^}}
  21 +<div class="banner-top-single">
  22 + <a href="{{#if url}}{{url}}{{else}}javascript:;{{/if}}">
  23 + <img class="img" src="{{image img 640 240}}">
  24 + </a>
  25 +</div>
  26 +{{/if}}
@@ -14,16 +14,17 @@ var $nav = $('.category-nav'), @@ -14,16 +14,17 @@ var $nav = $('.category-nav'),
14 14
15 require('../common'); 15 require('../common');
16 16
17 -(function() { 17 +function resetHeight() {
18 var $header = $('.yoho-header'), 18 var $header = $('.yoho-header'),
19 $search = $('#search-input'); 19 $search = $('#search-input');
20 20
21 - var h = $(window).height() - $header.outerHeight() - $search.outerHeight() - $nav.outerHeight(); 21 + var h = document.body.scrollHeight - $header.outerHeight() - $search.outerHeight() - $nav.outerHeight();
22 22
23 $categoryContainer.css('min-height', h); 23 $categoryContainer.css('min-height', h);
24 24
25 $contents.height(h); 25 $contents.height(h);
26 -}()); 26 +}
  27 +resetHeight();
27 28
28 $('#search-input').focus(function() { 29 $('#search-input').focus(function() {
29 $(this).blur(); 30 $(this).blur();
@@ -39,6 +40,7 @@ $nav.on('touchend touchcancel', function(e) { @@ -39,6 +40,7 @@ $nav.on('touchend touchcancel', function(e) {
39 var $this = $(e.target).closest('li'), 40 var $this = $(e.target).closest('li'),
40 selector = '.' + $this.data('channel'); 41 selector = '.' + $this.data('channel');
41 42
  43 + resetHeight();
42 if ($this.hasClass('focus')) { 44 if ($this.hasClass('focus')) {
43 return; 45 return;
44 } 46 }
@@ -125,7 +125,7 @@ $(function() { @@ -125,7 +125,7 @@ $(function() {
125 125
126 if (!(window.queryString.app_version || window.queryString.appVersion)) { 126 if (!(window.queryString.app_version || window.queryString.appVersion)) {
127 $('.tab-nav').css({ 127 $('.tab-nav').css({
128 - position: 'absolute' 128 + position: 'relative'
129 }); 129 });
130 130
131 $footer.css({ 131 $footer.css({
@@ -33,6 +33,7 @@ $('.detail-tab span').on('click', function() { @@ -33,6 +33,7 @@ $('.detail-tab span').on('click', function() {
33 33
34 if ($(this).index() === 1) { 34 if ($(this).index() === 1) {
35 setDetailText(); 35 setDetailText();
  36 + lazyLoad($('img.lazy'));
36 } 37 }
37 }); 38 });
38 39
  1 +var $ = require('yoho-jquery'),
  2 +
  3 + // Swiper = require('yoho.iswiper'),
  4 + lazyLoad = require('yoho-jquery-lazyload'),
  5 + loading = require('../plugin/loading');
  6 +
  7 +var page = 1,
  8 + winH,
  9 + listTop,
  10 + navSwiper,
  11 + notab = 0,
  12 + sort = '',
  13 + id = '',
  14 + hotrankNav,
  15 + noResult = '<p class="no-result">未找到相关搜索结果</p>';
  16 +
  17 +require('../common/suspend-cart');
  18 +require('../common');
  19 +
  20 +var share = require('../common/share');
  21 +
  22 +share({
  23 + title: '有货【会员日】开启啦！9月28日潮集狂欢趴等你来HI！限时6大福利，快参与起来喽~',
  24 + link: location.href,
  25 + desc: 'YOHO！BUY',
  26 + imgUrl: 'http://static.yohobuy.com/m/v1/img/touch/apple-touch-icon-144x144-precomposed-new.png'
  27 +
  28 +});
  29 +
  30 +function hotrank(page, sort, tabId, notab) {
  31 + loading.showLoadingMask();
  32 + $.ajax({
  33 + type: 'GET',
  34 + url: '/product/newsale/selectHotrank?' + sort,
  35 + dataType: 'html',
  36 + data: {
  37 + page: page,
  38 + tab_id: tabId,
  39 + notab: notab
  40 + },
  41 + success: function(data) {
  42 + if (data === ' ') {
  43 + if ($('.rank-main').length < 1 && $('.goods-nav').length < 1) {
  44 + $('#hotRank').html(noResult);
  45 + } else {
  46 + if (page === 1) {
  47 + hotrankNav = $('.goods-nav').prop('outerHTML');
  48 +
  49 + $('#hotRank').html(hotrankNav + noResult);
  50 + }
  51 + }
  52 + } else {
  53 + $('.no-result').remove();
  54 + if (page === 1) {
  55 + $('.rank-main').remove();
  56 + }
  57 + $('#hotRank').append(data);
  58 + }
  59 +
  60 + lazyLoad($('img.lazy'));
  61 + $('.rank-main ul li:gt(9)').find('.item-content i').removeClass('top');
  62 + winH = $(window).height();
  63 + if ($('.rank-main').length !== 0) {
  64 + $('#yoho-footer').css('position', 'static');
  65 + listTop = $('.rank-main').find('ul').offset().top;
  66 + } else {
  67 + $('#yoho-footer').css({
  68 + position: 'fixed',
  69 + width: '100%'
  70 + });
  71 + }
  72 + navSwiper = new Swiper('.s-goods-nav', {
  73 + grabCursor: true,
  74 + slidesPerView: 'auto',
  75 + slideElement: 'li'
  76 + });
  77 + loading.hideLoadingMask();
  78 + }
  79 + });
  80 +}
  81 +
  82 +function scrollHandler() {
  83 + if (page === 2) {
  84 + return;
  85 + }
  86 + if ($(window).scrollTop() + winH < listTop + $('#hotRank').height() - 100) {
  87 + return;
  88 + }
  89 + page = 2;
  90 + notab = 1;
  91 + hotrank(page, sort, id, notab);
  92 +}
  93 +
  94 +$(window).scroll(function() {
  95 + window.requestAnimationFrame(scrollHandler);
  96 +});
  97 +
  98 +hotrank(page, sort, id, notab);
  99 +$('#hotRank').on('touchend touchcancel', function(e) {
  100 + var ev = ev || window.event;
  101 + var target = ev.target || ev.srcElement;
  102 +
  103 + if (target.nodeName.toLowerCase() === 'span') {
  104 + $('.s-goods-nav .nav-item').removeClass('active');
  105 + target.parentNode.className = 'active ' + target.parentNode.className;
  106 + id = target.getAttribute('data-id') ? target.getAttribute('data-id') : '';
  107 + sort = target.getAttribute('data-sort') ? target.getAttribute('data-sort') : '';
  108 + page = 1;
  109 + notab = 1;
  110 + hotrank(page, sort, id, notab);
  111 + }
  112 +});
  113 +$('#hotRank').bind('contextmenu', function(e) {
  114 + return false;
  115 +});
  116 +$('#hotRank').on('touchstart', function(e) {
  117 + var ev = ev || window.event;
  118 + var target = ev.target || ev.srcElement;
  119 +
  120 + if (target.nodeName.toLowerCase() === 'span') {
  121 + target.parentNode.className = 'bgActive ' + target.parentNode.className;
  122 + }
  123 +}).on('touchend touchcancel', function() {
  124 + $('.s-goods-nav .nav-item').removeClass('bgActive');
  125 +});
  126 +
@@ -62,19 +62,18 @@ @@ -62,19 +62,18 @@
62 background: #f6f6f6; 62 background: #f6f6f6;
63 63
64 .title-image { 64 .title-image {
65 -  
66 a { 65 a {
67 display: block; 66 display: block;
68 } 67 }
69 68
70 .image { 69 .image {
71 width: 100%; 70 width: 100%;
72 - height: 364px; 71 + height: 310px;
73 } 72 }
74 73
75 img { 74 img {
76 width: 100%; 75 width: 100%;
77 - height: 100%; 76 + height: inherit;
78 } 77 }
79 } 78 }
80 79
@@ -104,20 +103,17 @@ @@ -104,20 +103,17 @@
104 } 103 }
105 104
106 .focus { 105 .focus {
107 -  
108 .swipe { 106 .swipe {
109 height: 100%; 107 height: 100%;
110 } 108 }
111 109
112 .swipe-1 { 110 .swipe-1 {
113 -  
114 .swipe-indicators { 111 .swipe-indicators {
115 display: none; 112 display: none;
116 } 113 }
117 } 114 }
118 115
119 .swipe-item { 116 .swipe-item {
120 -  
121 a { 117 a {
122 display: block; 118 display: block;
123 } 119 }
@@ -126,7 +122,6 @@ @@ -126,7 +122,6 @@
126 width: 100%; 122 width: 100%;
127 height: 100%; 123 height: 100%;
128 } 124 }
129 -  
130 } 125 }
131 126
132 .swipe-indicators { 127 .swipe-indicators {
@@ -168,8 +163,8 @@ @@ -168,8 +163,8 @@
168 a { 163 a {
169 display: inline-block; 164 display: inline-block;
170 margin: 0 15px; 165 margin: 0 15px;
171 - width: 250px;  
172 - height: 250px; 166 + width: 213px;
  167 + height: 213px;
173 } 168 }
174 169
175 img { 170 img {
@@ -4,7 +4,7 @@ @@ -4,7 +4,7 @@
4 } 4 }
5 5
6 li { 6 li {
7 - width: 580px; 7 + width: 100%;
8 height: 200px; 8 height: 200px;
9 margin-bottom: 30px; 9 margin-bottom: 30px;
10 position: relative; 10 position: relative;
@@ -88,7 +88,28 @@ @@ -88,7 +88,28 @@
88 } 88 }
89 89
90 #goods-list { 90 #goods-list {
91 - margin: 15px 0 0 15px; 91 + padding: 0 15px;
  92 + margin: 15px 0 0;
  93 + width: 100%;
  94 + box-sizing: border-box;
  95 + }
  96 +
  97 + .good-info {
  98 + float: left;
  99 + padding: 0 15px;
  100 + margin: 10px 0 40px;
  101 + box-sizing: border-box;
  102 + width: 50%;
  103 + height: auto;
  104 + }
  105 +
  106 + .good-detail-img {
  107 + height: auto;
  108 + background: #c3c3c3;
  109 +
  110 + img {
  111 + height: 100%;
  112 + }
92 } 113 }
93 } 114 }
94 115
@@ -82,7 +82,7 @@ @@ -82,7 +82,7 @@
82 82
83 .title-box { 83 .title-box {
84 margin-left: 22px; 84 margin-left: 22px;
85 - width: 240px; 85 + width: 210px;
86 86
87 .product-name { 87 .product-name {
88 overflow: hidden; 88 overflow: hidden;
@@ -126,7 +126,7 @@ @@ -126,7 +126,7 @@
126 .info-box { 126 .info-box {
127 margin-left: 22px; 127 margin-left: 22px;
128 float: left; 128 float: left;
129 - width: 452px; 129 + width: 402px;
130 } 130 }
131 131
132 h3 { 132 h3 {
@@ -154,7 +154,7 @@ @@ -154,7 +154,7 @@
154 .installment-box { 154 .installment-box {
155 text-align: center; 155 text-align: center;
156 float: left; 156 float: left;
157 - width: 213.333px; 157 + width: 33%;
158 font-size: 22px; 158 font-size: 22px;
159 } 159 }
160 160
@@ -294,7 +294,7 @@ @@ -294,7 +294,7 @@
294 border-top: 1px solid #e0e0e0; 294 border-top: 1px solid #e0e0e0;
295 295
296 label { 296 label {
297 - margin-left: 75px; 297 + margin-left: 60px;
298 width: 320px; 298 width: 320px;
299 height: 120px; 299 height: 120px;
300 float: left; 300 float: left;
@@ -4,3 +4,4 @@ @@ -4,3 +4,4 @@
4 @import "search/index"; 4 @import "search/index";
5 @import "shop/index"; 5 @import "shop/index";
6 @import "new/new-arrival"; 6 @import "new/new-arrival";
  7 +@import "newsale/hot-rank";
  1 +.rank-main {
  2 + padding: 14px 0 0 30px;
  3 + background: #fff;
  4 +
  5 + li {
  6 + height: 230px;
  7 + overflow: hidden;
  8 +
  9 + .item-img {
  10 + float: left;
  11 + width: 150px;
  12 + height: 200px;
  13 + padding: 14px 0;
  14 + line-height: 200px;
  15 + text-align: center;
  16 +
  17 + img {
  18 + max-width: 100%;
  19 + max-height: 100%;
  20 + vertical-align: middle;
  21 + }
  22 + }
  23 +
  24 + .item-content {
  25 + float: left;
  26 + width: 407px;
  27 + height: 213px;
  28 + margin: 0 0 0 13px;
  29 + padding: 14px 0 0 30px;
  30 + border-top: 1px solid #e0e0e0;
  31 + overflow: hidden;
  32 +
  33 + .rank-icon {
  34 + display: block;
  35 + height: 45px;
  36 + width: 50px;
  37 + line-height: 50px;
  38 + text-align: center;
  39 + font-size: 22px;
  40 + color: #fff;
  41 + background: resolve("me/employ/rank.png") no-repeat;
  42 + background-position: center top;
  43 + background-size: auto 100%;
  44 +
  45 + &.top {
  46 + background: resolve("me/employ/rank-t.png") no-repeat;
  47 + background-position: center top;
  48 + background-size: 100%;
  49 + line-height: 54px;
  50 + }
  51 + }
  52 +
  53 + h2 {
  54 + margin: 15px 0 0 !important;
  55 + padding: 0 !important;
  56 + width: 9.5rem;
  57 + max-height: 72px;
  58 + overflow: hidden;
  59 + line-height: 36px;
  60 + color: #444;
  61 + font-size: 28px;
  62 +
  63 + &.hasActive {
  64 + margin: 5px 0 0 !important;
  65 + }
  66 + }
  67 +
  68 + p {
  69 + margin: 0 !important;
  70 + padding: 0 !important;
  71 + width: 9.5rem;
  72 + line-height: 36px;
  73 + font-size: 24px;
  74 + color: #d0021b;
  75 + text-overflow: ellipsis;
  76 + overflow: hidden;
  77 + white-space: nowrap;
  78 +
  79 + b {
  80 + text-decoration: line-through;
  81 + color: #b0b0b0;
  82 + margin-left: 10px;
  83 + }
  84 + }
  85 + }
  86 + }
  87 +
  88 + li:first-child {
  89 + .item-content {
  90 + border: none;
  91 + }
  92 + }
  93 +}
  94 +.goods-nav {
  95 + border-bottom: 2px solid #e6e6e6;
  96 + height: 67px;
  97 + overflow: hidden;
  98 +
  99 + li {
  100 + float: left;
  101 + width: auto;
  102 + height: 67px;
  103 + line-height: 67px;
  104 + width: 145px;
  105 + text-align: center;
  106 + font-size: 28px;
  107 +
  108 + a {
  109 + display: inline-block;
  110 + padding: 0 5px;
  111 + font-size: 28px;
  112 + color: #999;
  113 + height: 65px;
  114 + }
  115 + }
  116 +
  117 + li:first-child {
  118 + margin-left: 30px;
  119 + }
  120 +
  121 + li.focus {
  122 + a {
  123 + border-bottom: 4px solid #000;
  124 + color: #000;
  125 + }
  126 + }
  127 +}
  128 +
  129 +.s-goods-nav {
  130 + box-sizing:border-box;
  131 + overflow: hidden;
  132 +
  133 + li {
  134 + margin: 0 10px;
  135 + padding:0 15px;
  136 + width: auto;
  137 + height: 100%;
  138 + color: #999;
  139 + &.active{
  140 + color: #000;
  141 + }
  142 + &.bgActive{
  143 + color: #000;
  144 + background-color:#e0e0e0;
  145 + }
  146 + a {
  147 + padding: 0;
  148 + }
  149 + }
  150 +
  151 + li:first-child {
  152 + margin: 0 0 0 39px;
  153 + }
  154 +
  155 + .swiper-wrapper {
  156 + background: #fff;
  157 + }
  158 +}