fe / yohobuywap-node · Commits

Go to a project

Authored by 郭成尧
Commit 77e31289a54f474c6b5f28c175bf202f7e3d2322 2 parents 1a0c878f 4ebbcef9

merge-feature/guangV3

Inline Side-by-side
Showing 24 changed files with 1178 additions and 62 deletions
  1 +
  2 +'use strict';
  3 +
  4 +const mRoot = '../models';
  5 +const newGuangModel = require(`${mRoot}/guang-new`);
  6 +const headerModel = require('../../../doraemon/models/header'); // 头部model
  7 +
  8 +const channels = {
  9 + boys: '1,3',
  10 + girls: '2,3',
  11 + kids: '1,2,3',
  12 + lifestyle: '1,2,3'
  13 +};
  14 +
  15 +exports.index = (req, res, next) => {
  16 + let responseData = {
  17 + pageHeader: headerModel.setNav({
  18 + navTitle: '逛'
  19 + }),
  20 + title: '逛',
  21 + module: 'guang',
  22 + page: 'guang-new',
  23 + width750: true,
  24 + localCss: true
  25 + };
  26 +
  27 + let params = {
  28 + gender: channels[req.cookies._Channel] || '1,3'
  29 + };
  30 +
  31 + req.ctx(newGuangModel).index(params).then(result => {
  32 + res.render('guang-new', Object.assign(responseData, result));
  33 + }).catch(next);
  34 +};
  35 +
  36 +exports.more = (req, res, next) => {
  37 + let params = {
  38 + page: req.query.page
  39 + };
  40 +
  41 + req.ctx(newGuangModel).list(params).then(result => {
  42 + res.json(result);
  43 + }).catch(next);
  44 +};
@@ -79,6 +79,7 @@ const editor = (req, res, next) => { @@ -79,6 +79,7 @@ const editor = (req, res, next) => {
79 articleListData = datas[1]; 79 articleListData = datas[1];
80 let build = []; 80 let build = [];
81 let name = authorData.data ? authorData.data.name : ''; 81 let name = authorData.data ? authorData.data.name : '';
  82 + let total = articleListData.data ? articleListData.data.total : 0;
82 83
83 if (articleListData.data && articleListData.data.list && articleListData.data.list.artList) { 84 if (articleListData.data && articleListData.data.list && articleListData.data.list.artList) {
84 articleListData.data.list.artList.forEach(articleData => { 85 articleListData.data.list.artList.forEach(articleData => {
@@ -104,7 +105,8 @@ const editor = (req, res, next) => { @@ -104,7 +105,8 @@ const editor = (req, res, next) => {
104 guang: { 105 guang: {
105 infos: build, 106 infos: build,
106 isApp: isApp, 107 isApp: isApp,
107 - authorInfo: authorData.data 108 + authorInfo: authorData.data,
  109 + total: total
108 }, 110 },
109 localCss: true 111 localCss: true
110 }, parameter)); 112 }, parameter));
  1 +'use strict';
  2 +
  3 +const _ = require('lodash');
  4 +
  5 +class newGuang extends global.yoho.BaseModel {
  6 + constructor(ctx) {
  7 + super(ctx);
  8 + }
  9 +
  10 + _indexRes(params) {
  11 + let options = {
  12 + url: '/operations/api/v5/resource/get',
  13 + data: {
  14 + content_code: '44153d54effebaf803a2deee06b3ea5a',
  15 + gender: params.gender
  16 + },
  17 + api: global.yoho.ServiceAPI
  18 + };
  19 +
  20 + return this.get(options).then(result => {
  21 + return result;
  22 + });
  23 + }
  24 +
  25 + list(params) {
  26 + let options = {
  27 + url: '/guang/api/v1/article/getHomePageList',
  28 + data: {
  29 + page: params.page || 1,
  30 + limit: params.limit || 10
  31 + },
  32 + api: global.yoho.ServiceAPI
  33 + };
  34 +
  35 + return this.get(options).then(result => {
  36 + let resu = {
  37 + list: []
  38 + };
  39 +
  40 + if (_.get(result, 'data.guangList')) {
  41 + resu.list = result.data.guangList;
  42 +
  43 + _.forEach(resu.list, (val) => {
  44 + val.play = val.hasVideoFlag === 1;
  45 + });
  46 + }
  47 + return resu;
  48 + });
  49 + }
  50 +
  51 + index(params) {
  52 + return Promise.all([
  53 + this._indexRes(params)
  54 + ]).then((result) => {
  55 + let resu = {
  56 + floorRes: {},
  57 + gender: encodeURIComponent(params.gender)
  58 + };
  59 +
  60 + if (_.get(result, '[0].data')) {
  61 + _.forEach(result[0].data, (val) => {
  62 + if (val.template_name === 'focus') {
  63 + resu.floorRes.focus = _.get(val, 'data');
  64 + }
  65 + if (val.template_name === '3:4ImageListFloor') {
  66 + resu.floorRes.type = _.get(val, 'data.list');
  67 + }
  68 + if (val.template_name === 'GuangRqFloor') {
  69 + resu.floorRes.renQi = _.get(val, 'data.list');
  70 + }
  71 + if (val.template_name === 'GuangDpFloor') {
  72 + resu.floorRes.daPei = _.get(val, 'data.list');
  73 + }
  74 + if (val.template_name === 'GuangHhFloor') {
  75 + resu.floorRes.haoHuo = _.get(val, 'data.list');
  76 + }
  77 + });
  78 + }
  79 +
  80 + return resu;
  81 + });
  82 + }
  83 +}
  84 +
  85 +module.exports = newGuang;
@@ -21,6 +21,7 @@ const plustar = require(cRoot + '/plustar'); @@ -21,6 +21,7 @@ const plustar = require(cRoot + '/plustar');
21 const rss = require(cRoot + '/rss'); 21 const rss = require(cRoot + '/rss');
22 const brand = require(cRoot + '/brand-list'); 22 const brand = require(cRoot + '/brand-list');
23 const sitemap = require('../3party/controllers/sitemap'); 23 const sitemap = require('../3party/controllers/sitemap');
  24 +const guangNew = require(cRoot + '/guang-new');
24 const router = express.Router(); // eslint-disable-line 25 const router = express.Router(); // eslint-disable-line
25 26
26 router.get('/star', star.index); // 星潮教室首页 27 router.get('/star', star.index); // 星潮教室首页
@@ -76,4 +77,7 @@ router.get('/plusstar/cate', brand.index); @@ -76,4 +77,7 @@ router.get('/plusstar/cate', brand.index);
76 router.get('/plusstar/brandList', brand.brandList); 77 router.get('/plusstar/brandList', brand.brandList);
77 router.get('/sitemap.xml', sitemap.siteMap); 78 router.get('/sitemap.xml', sitemap.siteMap);
78 79
  80 +router.get('/guang-new', guangNew.index);
  81 +router.get('/guang-new/more', guangNew.more);
  82 +
79 module.exports = router; 83 module.exports = router;
  1 +<div class="guang-new-page yoho-page">
  2 + {{#if floorRes.focus}}
  3 + <div class="swiper-top">
  4 + <div class="swiper-container">
  5 + <div class="swiper-wrapper">
  6 + {{# floorRes.focus}}
  7 + <div class="swiper-slide">
  8 + <a href="{{url}}">
  9 + <img src="{{image2 src w=750 h=322 q=30}}" alt="{{title}}" />
  10 + </a>
  11 + </div>
  12 + {{/ floorRes.focus}}
  13 + </div>
  14 + <div class="swiper-pagination">
  15 + <div class="wiper-pagination-bullets"></div>
  16 + </div>
  17 + </div>
  18 + </div>
  19 + {{/if}}
  20 + {{#if floorRes.type}}
  21 + <div class="swiper-tab">
  22 + <div class="swiper-container">
  23 + <div class="swiper-wrapper">
  24 + {{#floorRes.type}}
  25 + <div class="swiper-slide">
  26 + <a href="{{url}}">
  27 + <div class="tab-item" style="background-image: url({{image2 src w=100 h=320 q=30}})">
  28 + <div class="cover"></div>
  29 + <div class="title">{{alt}}</div>
  30 + </div>
  31 + </a>
  32 + </div>
  33 + {{/floorRes.type}}
  34 + </div>
  35 + </div>
  36 + </div>
  37 + {{/if}}
  38 + {{#if floorRes.renQi}}
  39 + <div class="big-title">
  40 + 人气
  41 + <a class="iconfont" href="//guang.m.yohobuy.com/?gender={{gender}}&type=1001">MORE&nbsp;&#xe604;</a>
  42 + </div>
  43 + <div class="swiper-page">
  44 + <div class="swiper-container">
  45 + <div class="swiper-wrapper">
  46 + {{# floorRes.renQi}}
  47 + <div class="swiper-slide">
  48 + <a href="//guang.m.yohobuy.com/info/index?id={{id}}">
  49 + <div class="page-c">
  50 + <img src="{{image2 src w=690 h=430 q=30}}" />
  51 + <div class="info">
  52 + <p class="name eps">{{title}}</p>
  53 + <p class="type eps">{{intro}}</p>
  54 + </div>
  55 + </div>
  56 + </a>
  57 + </div>
  58 + {{/ floorRes.renQi}}
  59 + </div>
  60 + </div>
  61 + </div>
  62 + {{/if}}
  63 + {{#if floorRes.daPei}}
  64 + <div class="big-title">
  65 + 搭配
  66 + <a class="iconfont" href="//guang.m.yohobuy.com/?gender={{gender}}&type=2">MORE&nbsp;&#xe604;</a>
  67 + </div>
  68 + <div class="swiper-collocation">
  69 + <div class="swiper-container">
  70 + <div class="swiper-wrapper">
  71 + {{# floorRes.daPei}}
  72 + <div class="swiper-slide">
  73 + <a href="//guang.m.yohobuy.com/info/index?id={{id}}">
  74 + <img src="{{image2 src w=590 h=370 q=30}}" />
  75 + <p class="eps-2">{{title}}</p>
  76 + </a>
  77 + </div>
  78 + {{/ floorRes.daPei}}
  79 + </div>
  80 + </div>
  81 + </div>
  82 + {{/if}}
  83 + <div class="big-title hide">
  84 + 限定
  85 + <span class="iconfont">MORE&nbsp;&#xe604;</span>
  86 + </div>
  87 + <div class="swiper-limit hide">
  88 + <div class="swiper-container">
  89 + <div class="swiper-wrapper">
  90 + <div class="swiper-slide">
  91 + <img src="http://img10.static.yhbimg.com/article/2017/10/23/16/01b08f8dee3abc9025cd677e46d875a6b9.jpg" />
  92 + <div class="info">
  93 + <div class="name eps-2">Nike’s Air Force 1 Is Headed</div>
  94 + <div class="title">发布日期</div>
  95 + <div class="name">2017/6/15</div>
  96 + <div class="title">发售价格</div>
  97 + <div class="name">¥7999.00</div>
  98 + </div>
  99 + </div>
  100 + </div>
  101 + <div class="swiper-pagination"></div>
  102 + </div>
  103 + </div>
  104 + {{#if floorRes.haoHuo}}
  105 + <div class="big-title">
  106 + 好货
  107 + <a class="iconfont" href="//guang.m.yohobuy.com/?gender={{gender}}&type=4">MORE&nbsp;&#xe604;</a>
  108 + </div>
  109 + <div class="goods-list clearfix">
  110 + {{# floorRes.haoHuo}}
  111 + <div class="goods-item">
  112 + <a href="//guang.m.yohobuy.com/info/index?id={{id}}">
  113 + <img src="{{image2 src w=360 h=224 q=30}}" />
  114 + <div class="info">
  115 + <p class="name eps-2 eps-3">{{title}}</p>
  116 + <p class="tips">#{{min_sort_name}}#</p>
  117 + </div>
  118 + </a>
  119 + </div>
  120 + {{/ floorRes.haoHuo}}
  121 + </div>
  122 + {{/if}}
  123 + <div class="big-title hide">
  124 + 人物
  125 + <span class="iconfont">MORE&nbsp;&#xe604;</span>
  126 + </div>
  127 + <div class="person-list clearfix hide">
  128 + <div class="person-item">
  129 + <img src="http://img10.static.yhbimg.com/yhb-img01/2017/10/27/12/01fee21a2b9808e42f02ad2217b59a1491.jpg" />
  130 + <p class="eps">马思唯：有趣的人会买东西</p>
  131 + </div>
  132 + </div>
  133 + <div class="big-title hide">
  134 + SHOW
  135 + <span class="iconfont">MORE&nbsp;&#xe604;</span>
  136 + </div>
  137 + <div class="swiper-show hide">
  138 + <div class="swiper-container">
  139 + <div class="swiper-wrapper">
  140 + <div class="swiper-slide">
  141 + <img src="" />
  142 + <p class="words eps-2"></p>
  143 + <div class="auther">
  144 + <span class="name"></span>
  145 + <span class="iconfont">&#xe601;</span>
  146 + </div>
  147 + </div>
  148 + </div>
  149 + </div>
  150 + </div>
  151 + <div class="big-title">
  152 + 逛
  153 + <a class="iconfont" href="//guang.m.yohobuy.com/?gender={{gender}}">MORE&nbsp;&#xe604;</a>
  154 + </div>
  155 + <div class="guang-list"></div>
  156 + <div class="trend-list hide">
  157 + <div class="trend-item">
  158 + <img src="http://img11.static.yhbimg.com/yhb-img01/2017/10/27/11/01ea9512175a0c5795bfd01048271b654e.jpg" />
  159 + <p class="intro eps-2">虽然每一年说流行这个那个颜色，但是相信很多潮人穿上身的还是逃不开黑白灰，真是无趣的要...</p>
  160 + <div class="auther">
  161 + <div class="pic" style="background-image:url(http://img11.static.yhbimg.com/yhb-img01/2017/10/27/11/01ea9512175a0c5795bfd01048271b654e.jpg)"></div>
  162 + <div class="name">川本小一</div>
  163 + </div>
  164 + </div>
  165 + </div>
  166 + <a href="//guang.m.yohobuy.com/?gender={{gender}}" class="guang-fixed fixed"></a>
  167 + <div class="float-top fixed"></div>
  168 +</div>
1 <div class="guang-list-page guang-page yoho-page" id="guangList"> 1 <div class="guang-list-page guang-page yoho-page" id="guangList">
2 -  
3 {{# guang}} 2 {{# guang}}
4 - <ul id="guang-nav" class="guang-nav">  
5 - {{# navs}}  
6 - <li class="guang-nav-item {{#focus}}focus{{/focus}}" data-type={{typeId}}>  
7 - {{type}} 3 + <div class="nav-scroll">
  4 + <ul id="guang-nav" class="guang-nav">
  5 + {{# navs}}
  6 + <li class="guang-nav-item {{#focus}}focus{{/focus}}" data-type={{typeId}}>
  7 + <span>{{type}}</span>
  8 + </li>
  9 + {{/ navs}}
  10 + <li class="guang-nav-item news-jump" data-type=-1>
  11 + <a href='//m.yohobuy.com/guang/news' title='资讯'>资讯</a>
8 </li> 12 </li>
9 - {{/ navs}}  
10 - <li class="guang-nav-item news-jump" data-type=-1>  
11 - <a href='//m.yohobuy.com/guang/news' title='资讯'>资讯</a>  
12 - </li>  
13 - </ul>  
14 - 13 + </ul>
  14 + </div>
15 <div id="info-list" class="info-list-container"> 15 <div id="info-list" class="info-list-container">
16 {{# infos}} 16 {{# infos}}
17 <div class="info-list{{^show}} hide{{/show}}"> 17 <div class="info-list{{^show}} hide{{/show}}">
@@ -7,9 +7,12 @@ @@ -7,9 +7,12 @@
7 </div> 7 </div>
8 <div class="text"> 8 <div class="text">
9 <p class="name">{{name}}</p> 9 <p class="name">{{name}}</p>
10 - <p class="info">{{author_desc}}</p> 10 + {{#if ../total}}
  11 + <p class="info">{{../total}}篇内容</p>
  12 + {{/if}}
11 </div> 13 </div>
12 </div> 14 </div>
  15 + <p class="intro">{{author_desc}}</p>
13 {{/ authorInfo}} 16 {{/ authorInfo}}
14 17
15 <div id="info-list" class="info-list"> 18 <div id="info-list" class="info-list">
1 <div class="guang-info" data-id="{{id}}"> 1 <div class="guang-info" data-id="{{id}}">
2 {{# author}} 2 {{# author}}
3 - <a class="info-author clearfix"{{#if url}} href="{{url}}"{{/if}}> 3 + <a class="info-author clearfix"{{#if url}} href="{{url}}"{{/if}} style="display: none;">
4 <img class="lazy avatar" data-original="{{image2 avatar mode=2 q=60}}"> 4 <img class="lazy avatar" data-original="{{image2 avatar mode=2 q=60}}">
5 <span class="name">{{name}}</span> 5 <span class="name">{{name}}</span>
6 {{#if minCategory}} 6 {{#if minCategory}}
@@ -60,7 +60,7 @@ @@ -60,7 +60,7 @@
60 60
61 <div class="info-deps"> 61 <div class="info-deps">
62 <a class="info-title-container"{{#unless isShow}} href="{{url}}"{{/unless}}> 62 <a class="info-title-container"{{#unless isShow}} href="{{url}}"{{/unless}}>
63 - <div class="info-title">{{#if top}}<span class="top-tag">置顶</span>{{/if}}{{title}}</div> 63 + <div class="info-title text-overflow">{{#if top}}<span class="top-tag">置顶</span>{{/if}}{{title}}</div>
64 </a> 64 </a>
65 <p class="info-text">{{text}}</p> 65 <p class="info-text">{{text}}</p>
66 {{> index/tvls}} 66 {{> index/tvls}}
1 -<li class="goods-box"> 1 +<li class="goods-box{{#if only}} only{{/if}}">
2 <div class="goods-img"> 2 <div class="goods-img">
3 <a href="{{href}}"> 3 <a href="{{href}}">
4 <img class="lazy" data-original="{{image2 pic_url w=106 h=138}}" /> 4 <img class="lazy" data-original="{{image2 pic_url w=106 h=138}}" />
1 <div class="time-view-like-share clearfix"> 1 <div class="time-view-like-share clearfix">
2 - <i class="iconfont">&#xe603;</i>  
3 - {{publishTime}}&nbsp;&nbsp;&nbsp;&nbsp;  
4 - <i class="iconfont">&#xe602;</i>  
5 - <span class="page-view">{{pageView}}</span> 2 + {{#if author.minCategory}}
  3 + <span>{{author.minCategory}}</span>&nbsp;&nbsp;|&nbsp;
  4 + {{/if}}
  5 + <span class="page-view">{{pageView}}</span>人阅读
6 <div class="like-share-container"> 6 <div class="like-share-container">
7 - {{#like}}  
8 - <i class="iconfont like-btn{{#isLiked}} like{{/isLiked}}">&#xe601;</i> 7 + {{# like}}
9 <span class="like-count">{{count}}</span> 8 <span class="like-count">{{count}}</span>
  9 + <i class="iconfont like-btn{{#isLiked}} like{{/isLiked}}">&#xe601;</i>
10 {{/ like}} 10 {{/ like}}
11 {{# collect}} 11 {{# collect}}
12 <i class="iconfont collect-btn{{#isCollected}} collected{{/isCollected}}">&#xe605;</i> 12 <i class="iconfont collect-btn{{#isCollected}} collected{{/isCollected}}">&#xe605;</i>
@@ -17,8 +17,9 @@ const domains = { @@ -17,8 +17,9 @@ const domains = {
17 singleApi: 'http://api-test3.yohops.com:9999/', 17 singleApi: 'http://api-test3.yohops.com:9999/',
18 imSocket: 'ws://socket.yohobuy.com:10240', 18 imSocket: 'ws://socket.yohobuy.com:10240',
19 imCs: 'http://im.yohobuy.com/api', 19 imCs: 'http://im.yohobuy.com/api',
  20 + global: 'http://api-global.yohobuy.com',
  21 + store: 'http://192.168.102.47:8080/portal-gateway/',
20 platformApi: 'http://192.168.102.48:8088/', 22 platformApi: 'http://192.168.102.48:8088/',
21 - store: 'http://192.168.102.47:8080/portal-gateway/wechat/',  
22 extstore: 'http://extstore-test1.yohops.com', 23 extstore: 'http://extstore-test1.yohops.com',
23 family: 'http://192.168.102.31:8096/uic/', 24 family: 'http://192.168.102.31:8096/uic/',
24 yohoNowApi: 'http://yohonow-test.yohops.com:9999/' 25 yohoNowApi: 'http://yohonow-test.yohops.com:9999/'
  1 +{{# list}}
  2 +<div class="guang-item">
  3 + <a href="//guang.m.yohobuy.com/info/index?id={{id}}">
  4 + <div class="page-c">
  5 + <img class="lazy" data-original="{{image2 src w=690 h=430 q=30}}" />
  6 + <div class="info">
  7 + <p class="name eps-2">{{title}}</p>
  8 + <p class="type">{{category_name}}</p>
  9 + </div>
  10 + {{#if play}}
  11 + <div class="play"></div>
  12 + {{/if}}
  13 + </div>
  14 + </a>
  15 +</div>
  16 +{{/ list}}
  1 +import 'guang/guang-new.page.css';
  2 +import $ from 'yoho-jquery';
  3 +import Page from 'yoho-page';
  4 +import Swiper from 'yoho-swiper';
  5 +import lazyLoad from 'yoho-jquery-lazyload';
  6 +
  7 +import moreRender from 'guang/list.hbs';
  8 +
  9 +class GuangNew extends Page {
  10 + constructor() {
  11 + super();
  12 +
  13 + this.selector = {
  14 + $parentObj: $('.swiper-tab'),
  15 + $fixed: $('.fixed'),
  16 + $guangList: $('.guang-list')
  17 + };
  18 +
  19 + this.view = {
  20 + moreRender
  21 + };
  22 +
  23 + this.fixedTop = 0;
  24 + this.page = 0;
  25 + this.end = false;
  26 + this.loading = false;
  27 + this.init();
  28 + }
  29 +
  30 + init() {
  31 + this.swiperTop();
  32 + this.swiperTab();
  33 + this.swiperPage();
  34 + this.swiperCollocation();
  35 + this.swiperLimit();
  36 + this.swiperShow();
  37 + this.fixed();
  38 + this.fixedRetop();
  39 + this.list();
  40 + }
  41 +
  42 + list() {
  43 + $(window).scroll(() => {
  44 + window.requestAnimationFrame(this.scrollHandler.bind(this));
  45 + });
  46 + }
  47 +
  48 + scrollHandler() {
  49 + if (($(window).scrollTop() + $(window).height() >= $(document).height() * 0.8)) {
  50 + this.doMore();
  51 + }
  52 + }
  53 +
  54 + doMore() {
  55 + if (!this.end && !this.loading) {
  56 + this.page++;
  57 + this.moreList(this.page);
  58 + }
  59 + }
  60 +
  61 + moreList() {
  62 + this.loading = true;
  63 + this.ajax({
  64 + url: '/guang/guang-new/more',
  65 + data: {
  66 + page: this.page
  67 + },
  68 + }).then(result => {
  69 + if (result && result.list.length > 0) {
  70 + let $lazy = $(this.view.moreRender(result));
  71 +
  72 + this.selector.$guangList.append($lazy);
  73 + this.loading = false;
  74 + lazyLoad($lazy.find('.lazy'));
  75 + } else {
  76 + this.end = true;
  77 + }
  78 + }).catch(error => {
  79 + console.error(error);
  80 + });
  81 + }
  82 +
  83 + // 返回顶部，最新资讯
  84 + fixed() {
  85 + $(window).scroll(() => {
  86 + this.fixedRetop();
  87 + });
  88 + }
  89 +
  90 + fixedRetop() {
  91 + this.fixedTop = this.selector.$parentObj.offset().top - $(document).scrollTop();
  92 + if (this.fixedTop <= 0) {
  93 + this.selector.$fixed.show();
  94 + } else {
  95 + this.selector.$fixed.hide();
  96 + }
  97 + }
  98 +
  99 + // 顶部swiper
  100 + swiperTop() {
  101 + if ($('.swiper-top').length > 0) {
  102 + new Swiper('.swiper-top .swiper-container', {
  103 + pagination: '.swiper-pagination .wiper-pagination-bullets',
  104 + paginationClickable: true
  105 + });
  106 + }
  107 + }
  108 +
  109 + // 频道swiper
  110 + swiperTab() {
  111 + if ($('.swiper-tab').length > 0) {
  112 + let preWidth = $(window).width() / 750 * -115; // 向左位移一个swiper-slide宽度，相对于750宽度下
  113 +
  114 + new Swiper('.swiper-tab .swiper-container', {
  115 + effect: 'coverflow',
  116 + loop: true,
  117 + grabCursor: true,
  118 + slidesPerView: 'auto',
  119 + followFinger: false,
  120 + slidesOffsetBefore: preWidth,
  121 + centeredSlides: true,
  122 + speed: 800,
  123 + coverflow: {
  124 + rotate: 0,
  125 + stretch: 0,
  126 + depth: 0,
  127 + modifier: 1,
  128 + slideShadows: false
  129 + },
  130 + touchRatio: 0.01,
  131 + });
  132 + }
  133 + }
  134 +
  135 + // 人气swiper
  136 + swiperPage() {
  137 + if ($('.swiper-page').length > 0) {
  138 + new Swiper('.swiper-page .swiper-container', {
  139 + direction: 'vertical',
  140 + effect: 'coverflow',
  141 + grabCursor: true,
  142 + centeredSlides: true,
  143 + slidesPerView: 'auto',
  144 + followFinger: false,
  145 + loop: true,
  146 + coverflow: {
  147 + rotate: 0,
  148 + stretch: 0,
  149 + depth: 0,
  150 + modifier: 1,
  151 + slideShadows: false
  152 + }
  153 + });
  154 + }
  155 + }
  156 +
  157 + // 搭配swiper
  158 + swiperCollocation() {
  159 + if ($('.swiper-collocation').length > 0) {
  160 + new Swiper('.swiper-collocation .swiper-container', {
  161 + centeredSlides: true,
  162 + slidesPerView: 'auto',
  163 + loop: true
  164 + });
  165 + }
  166 + }
  167 +
  168 + // 限定swiper
  169 + swiperLimit() {
  170 + if ($('.swiper-limit').length > 0) {
  171 + new Swiper('.swiper-limit .swiper-container', {
  172 + pagination: '.swiper-pagination',
  173 + paginationClickable: true
  174 + });
  175 + }
  176 + }
  177 +
  178 + // showswiper
  179 + swiperShow() {
  180 + if ($('.swiper-show').length > 0) {
  181 + new Swiper('.swiper-show .swiper-container', {
  182 + slidesPerView: 'auto'
  183 + });
  184 + }
  185 + }
  186 +}
  187 +
  188 +$(() => {
  189 + new GuangNew();
  190 +});
@@ -23,7 +23,8 @@ let $infoList = $('#info-list'), @@ -23,7 +23,8 @@ let $infoList = $('#info-list'),
23 curType = $curNav.data('type'); 23 curType = $curNav.data('type');
24 24
25 let getDynamicData = require('./list-dynamic'); 25 let getDynamicData = require('./list-dynamic');
26 -let productlistWith = require('./index/product-list'); 26 +
  27 +// let productlistWith = require('./index/product-list');
27 28
28 let state = {}; 29 let state = {};
29 30
@@ -61,7 +62,7 @@ info.initInfosEvt($infoList); @@ -61,7 +62,7 @@ info.initInfosEvt($infoList);
61 $nav.bind('contextmenu', function() { 62 $nav.bind('contextmenu', function() {
62 return false; 63 return false;
63 }); 64 });
64 -$nav.on('touchend touchcancel', function(e) { 65 +$nav.on('click', function(e) {
65 66
66 if ($(e.target).closest('.news-jump').length > 0) { 67 if ($(e.target).closest('.news-jump').length > 0) {
67 return true; 68 return true;
@@ -71,7 +72,7 @@ $nav.on('touchend touchcancel', function(e) { @@ -71,7 +72,7 @@ $nav.on('touchend touchcancel', function(e) {
71 $content, 72 $content,
72 index; 73 index;
73 74
74 - if ($this.hasClass('focus')) { 75 + if ($this.hasClass('focus') || !$this.hasClass('guang-nav-item')) {
75 return; 76 return;
76 } 77 }
77 78
@@ -128,12 +129,12 @@ $(document).scroll(function() { @@ -128,12 +129,12 @@ $(document).scroll(function() {
128 window.requestAnimationFrame(scrollHandler); 129 window.requestAnimationFrame(scrollHandler);
129 }); 130 });
130 131
131 -$nav.on('touchstart', function(e) {  
132 - let target = e.target || e.srcElement; 132 +// $nav.on('touchstart', function(e) {
  133 +// let target = e.target || e.srcElement;
133 134
134 - target.className = 'bytouch ' + target.className;  
135 -}).on('touchend touchcancel', function() {  
136 - $nav.find('li').removeClass('bytouch');  
137 -}); 135 +// target.className = 'bytouch ' + target.className;
  136 +// }).on('touchend touchcancel', function() {
  137 +// $nav.find('li').removeClass('bytouch');
  138 +// });
138 139
139 -productlistWith(); 140 +// productlistWith();
@@ -21,7 +21,8 @@ let searching = false; @@ -21,7 +21,8 @@ let searching = false;
21 let mySwiper = {}; 21 let mySwiper = {};
22 22
23 let getDynamicData = require('./list-dynamic'); 23 let getDynamicData = require('./list-dynamic');
24 -let productlistWith = require('./index/product-list'); 24 +
  25 +// let productlistWith = require('./index/product-list');
25 26
26 require('common'); 27 require('common');
27 28
@@ -227,7 +228,7 @@ function loadMore($container, opt, url) { @@ -227,7 +228,7 @@ function loadMore($container, opt, url) {
227 $noMore.removeClass('hide'); 228 $noMore.removeClass('hide');
228 } 229 }
229 230
230 - productlistWith($data); 231 + // productlistWith($data);
231 $container.append($data); 232 $container.append($data);
232 233
233 $swiper = $container.find('.swiper-container'); 234 $swiper = $container.find('.swiper-container');
  1 +html,
  2 +body {
  3 + background-color: #f0f0f0;
  4 +}
  5 +
1 .guang-list-page { 6 .guang-list-page {
2 .editor-header { 7 .editor-header {
3 - margin-bottom: 15PX;  
4 - padding-top: 18PX;  
5 - padding-bottom: 20PX; 8 + padding: 30px 0;
  9 + background: #fff;
  10 + }
  11 +
  12 + .intro {
  13 + width: 100%;
  14 + padding: 0 30px;
  15 + font-size: 24px;
  16 + color: #444;
6 background: #fff; 17 background: #fff;
7 - border-bottom: 1px solid #e0e0e0;  
8 } 18 }
9 19
10 .avatar { 20 .avatar {
@@ -12,8 +22,8 @@ @@ -12,8 +22,8 @@
12 margin-left: 30px; 22 margin-left: 30px;
13 23
14 img { 24 img {
15 - width: 50PX;  
16 - height: 50PX; 25 + width: 100px;
  26 + height: 100px;
17 border-radius: 50%; 27 border-radius: 50%;
18 } 28 }
19 } 29 }
@@ -22,17 +32,17 @@ @@ -22,17 +32,17 @@
22 float: left; 32 float: left;
23 margin-left: 32px; 33 margin-left: 32px;
24 width: 475px; 34 width: 475px;
  35 + padding: 10px 0;
25 36
26 .name { 37 .name {
27 - font-size: 16PX;  
28 - line-height: 20PX; 38 + font-size: 26px;
  39 + line-height: 40px;
29 } 40 }
30 41
31 .info { 42 .info {
32 - margin-top: 6px;  
33 color: #bdbdbf; 43 color: #bdbdbf;
34 - font-size: 12PX;  
35 - line-height: 16PX; 44 + font-size: 20px;
  45 + line-height: 40px;
36 } 46 }
37 } 47 }
38 48
@@ -56,24 +66,43 @@ @@ -56,24 +66,43 @@
56 } 66 }
57 } 67 }
58 68
59 - .guang-nav {  
60 - background-color: #fff; 69 + .nav-scroll {
61 overflow: hidden; 70 overflow: hidden;
62 width: 640px; 71 width: 640px;
63 height: 80px; 72 height: 80px;
64 - display: flex;  
65 - justify-content: space-around; 73 + }
  74 +
  75 + .guang-nav {
  76 + background-color: #fff;
  77 + overflow-x: scroll;
  78 + overflow-y: hidden;
  79 + height: 80px;
  80 + font-size: 0;
  81 + line-height: 0;
  82 + white-space: nowrap;
  83 + padding: 0 23px;
66 } 84 }
67 85
68 .guang-nav-item { 86 .guang-nav-item {
69 - width: 20%; 87 + display: inline-block;
70 color: #ccc; 88 color: #ccc;
71 font-size: 14PX; 89 font-size: 14PX;
72 text-align: center; 90 text-align: center;
73 - line-height: 80px; 91 + padding: 0 23px;
  92 +
  93 + span {
  94 + line-height: 76px;
  95 + display: block;
  96 + border-bottom: solid 4px #fff;
  97 + padding: 0 14px;
  98 + }
74 99
75 &.focus { 100 &.focus {
76 - color: #000; 101 + color: #444;
  102 +
  103 + span {
  104 + border-bottom: solid 4px #444;
  105 + }
77 } 106 }
78 107
79 &.news-jump a { 108 &.news-jump a {
1 .guang-info { 1 .guang-info {
2 margin-bottom: 30px; 2 margin-bottom: 30px;
3 padding: 0 0 24px; 3 padding: 0 0 24px;
4 - border-top: 1px solid #e0e0e0;  
5 - border-bottom: 1px solid #e0e0e0;  
6 background: #fff; 4 background: #fff;
7 5
8 .info-author { 6 .info-author {
@@ -49,10 +47,14 @@ @@ -49,10 +47,14 @@
49 position: relative; 47 position: relative;
50 width: 100%; 48 width: 100%;
51 49
  50 + .img-box {
  51 + padding: 30px 30px 0;
  52 + display: block;
  53 + }
  54 +
52 img { 55 img {
53 display: block; 56 display: block;
54 width: 100%; 57 width: 100%;
55 - min-height: 400px;  
56 } 58 }
57 59
58 .play { 60 .play {
@@ -128,6 +130,7 @@ @@ -128,6 +130,7 @@
128 } 130 }
129 131
130 .info-title { 132 .info-title {
  133 + max-height: 44px;
131 line-height: 44px; 134 line-height: 44px;
132 color: #000; 135 color: #000;
133 font-size: 20PX; 136 font-size: 20PX;
@@ -135,10 +138,9 @@ @@ -135,10 +138,9 @@
135 138
136 .top-tag { 139 .top-tag {
137 font-size: 18px; 140 font-size: 18px;
138 - color: #d0021b; 141 + color: #fff;
139 padding: 4px 16px; 142 padding: 4px 16px;
140 - border: 1px solid #d0021b;  
141 - border-radius: 4px; 143 + background-color: #444;
142 margin-right: 20px; 144 margin-right: 20px;
143 } 145 }
144 } 146 }
@@ -12,17 +12,19 @@ @@ -12,17 +12,19 @@
12 overflow-x: scroll; 12 overflow-x: scroll;
13 overflow-y: hidden; 13 overflow-y: hidden;
14 -webkit-overflow-scrolling: touch; 14 -webkit-overflow-scrolling: touch;
  15 + padding-right: 0;
15 } 16 }
16 17
17 .product-list { 18 .product-list {
18 height: 138px; 19 height: 138px;
19 overflow-y: hidden; 20 overflow-y: hidden;
  21 + white-space: nowrap;
20 22
21 .goods-box { 23 .goods-box {
22 width: 320px; 24 width: 320px;
23 height: 138px; 25 height: 138px;
24 border-radius: 8px; 26 border-radius: 8px;
25 - float: left; 27 + display: inline-block;
26 margin-right: 20px; 28 margin-right: 20px;
27 background-color: #f0f0f0; 29 background-color: #f0f0f0;
28 } 30 }
@@ -47,6 +49,7 @@ @@ -47,6 +49,7 @@
47 float: left; 49 float: left;
48 50
49 .title { 51 .title {
  52 + white-space: normal;
50 font-size: 22px; 53 font-size: 22px;
51 color: #444; 54 color: #444;
52 overflow: hidden; 55 overflow: hidden;
@@ -62,5 +65,14 @@ @@ -62,5 +65,14 @@
62 margin-top: 20px; 65 margin-top: 20px;
63 } 66 }
64 } 67 }
  68 +
  69 + .goods-box.only {
  70 + width: 600px;
  71 + margin-right: 0;
  72 +
  73 + .goods-info {
  74 + width: 494px;
  75 + }
  76 + }
65 } 77 }
66 } 78 }
@@ -2,7 +2,7 @@ @@ -2,7 +2,7 @@
2 color: #b0b0b0; 2 color: #b0b0b0;
3 line-height: 38px; 3 line-height: 38px;
4 height: 38px; 4 height: 38px;
5 - font-size: 12PX; 5 + font-size: 20px;
6 6
7 .iconfont { 7 .iconfont {
8 vertical-align: 9%; 8 vertical-align: 9%;
  1 +@import "layout/swiper";
  2 +
  3 +body,
  4 +html {
  5 + background-color: #f0f0f0;
  6 +}
  7 +
  8 +.guang-new-page {
  9 + .clearfix:after {
  10 + content: "";
  11 + display: table;
  12 + clear: both;
  13 + }
  14 +
  15 + .page-c {
  16 + width: 690px;
  17 + position: relative;
  18 +
  19 + .play {
  20 + background-image: resolve("guang/play-btn.png");
  21 + width: 140px;
  22 + height: 140px;
  23 + background-size: 100% 100%;
  24 + position: absolute;
  25 + top: 145px;
  26 + left: 50%;
  27 + margin-left: -70px;
  28 + }
  29 +
  30 + img {
  31 + width: 690px;
  32 + height: 430px;
  33 + }
  34 +
  35 + .info {
  36 + height: 150px;
  37 + padding: 20px;
  38 + text-align: center;
  39 + }
  40 +
  41 + .name {
  42 + font-size: 30px;
  43 + font-weight: 500;
  44 + text-align: center;
  45 + color: #444;
  46 + height: 60px;
  47 + line-height: 60px;
  48 + }
  49 +
  50 + .type {
  51 + font-size: 20px;
  52 + color: #b0b0b0;
  53 + height: 50px;
  54 + line-height: 50px;
  55 + }
  56 + }
  57 +
  58 + .eps {
  59 + white-space: nowrap;
  60 + overflow: hidden;
  61 + text-overflow: ellipsis;
  62 + }
  63 +
  64 + .eps-2 {
  65 + overflow: hidden;
  66 + text-overflow: ellipsis;
  67 + display: -webkit-box;
  68 + -webkit-line-clamp: 2;
  69 + -webkit-box-orient: vertical;
  70 + }
  71 +
  72 + .eps-3 {
  73 + -webkit-line-clamp: 3;
  74 + }
  75 +
  76 + .swiper-container {
  77 + width: 100%;
  78 + height: 100%;
  79 + }
  80 +
  81 + .swiper-top {
  82 + width: 750px;
  83 + height: 322px;
  84 + margin-bottom: 20px;
  85 +
  86 + img {
  87 + width: 100%;
  88 + height: 100%;
  89 + }
  90 +
  91 + .swiper-slide {
  92 + width: 750px;
  93 + height: 100%;
  94 + }
  95 +
  96 + .swiper-pagination {
  97 + height: 20px;
  98 + line-height: 20px;
  99 + }
  100 +
  101 + .swiper-pagination-bullets {
  102 + line-height: 20px;
  103 + display: inline-block;
  104 + padding: 0 5px;
  105 + height: 20px;
  106 + border-radius: 10px;
  107 + background-image: resolve("guang/swiper-btn.png");
  108 + background-repeat: repeat;
  109 + }
  110 +
  111 + .swiper-pagination-bullet {
  112 + width: 10px;
  113 + height: 10px;
  114 + border-radius: 50%;
  115 + background-color: #fff;
  116 + margin-bottom: 5px;
  117 + opacity: 0.5;
  118 + }
  119 +
  120 + .swiper-pagination-bullet-active {
  121 + background-color: #fff;
  122 + opacity: 1;
  123 + }
  124 + }
  125 +
  126 + .swiper-tab {
  127 + width: 750px;
  128 + height: 320px;
  129 + background-color: #fff;
  130 + margin-bottom: 20px;
  131 +
  132 + .swiper-slide {
  133 + width: 104px;
  134 + height: 320px;
  135 + padding: 0 2px;
  136 +
  137 + .tab-item {
  138 + width: 100%;
  139 + height: 320px;
  140 + background-size: cover;
  141 + background-repeat: no-repeat;
  142 + background-position: center center;
  143 + position: relative;
  144 +
  145 + .title {
  146 + text-align: center;
  147 + line-height: 320px;
  148 + font-size: 28px;
  149 + color: #fff;
  150 + width: 100%;
  151 + height: 100%;
  152 + position: absolute;
  153 + top: 0;
  154 + left: 0;
  155 + right: 0;
  156 + bottom: 0;
  157 + }
  158 +
  159 + .cover {
  160 + width: 100%;
  161 + height: 100%;
  162 + position: absolute;
  163 + top: 0;
  164 + left: 0;
  165 + right: 0;
  166 + bottom: 0;
  167 + background-color: #000;
  168 + opacity: 0.6;
  169 + }
  170 + }
  171 + }
  172 +
  173 + .swiper-slide-active {
  174 + width: 334px !important;
  175 +
  176 + .tab-item {
  177 + width: 100%;
  178 + }
  179 +
  180 + .cover {
  181 + display: none;
  182 + }
  183 + }
  184 + }
  185 +
  186 + .big-title {
  187 + height: 110px;
  188 + line-height: 110px;
  189 + background-color: #fff;
  190 + position: relative;
  191 + text-align: center;
  192 + font-size: 32px;
  193 + font-weight: 500;
  194 + color: #444;
  195 +
  196 + .iconfont {
  197 + font-size: 22px;
  198 + line-height: 110px;
  199 + position: absolute;
  200 + top: 0;
  201 + right: 30px;
  202 + color: #b0b0b0;
  203 + }
  204 + }
  205 +
  206 + .swiper-page {
  207 + width: 750px;
  208 + height: 640px;
  209 + overflow: hidden;
  210 + padding: 0 25px;
  211 + background-color: #fff;
  212 +
  213 + .swiper-slide {
  214 + border-radius: 10px;
  215 + overflow: hidden;
  216 + width: 690px;
  217 + height: 580px;
  218 + background: #fff;
  219 + margin: 0 auto;
  220 + margin-bottom: 56px;
  221 + box-shadow: 0 0 20px #bbb;
  222 + transform: translateX(0) !important;
  223 +
  224 + .page-c {
  225 + height: 580px;
  226 + opacity: 0;
  227 + }
  228 + }
  229 +
  230 + .swiper-slide-active {
  231 + .page-c {
  232 + height: auto !important;
  233 + opacity: 1 !important;
  234 + }
  235 + }
  236 +
  237 + .swiper-slide-prev {
  238 + .page-c {
  239 + height: auto !important;
  240 + opacity: 0 !important;
  241 + transition: all 1s;
  242 + }
  243 + }
  244 +
  245 + .swiper-slide-next {
  246 + transform: translateY(-610px) !important;
  247 + width: 630px;
  248 +
  249 + .page-c {
  250 + height: auto !important;
  251 + opacity: 0 !important;
  252 + transition: all 1s;
  253 + }
  254 + }
  255 +
  256 + .swiper-slide-next + div {
  257 + transform: translateY(-1220px) !important;
  258 + width: 570px;
  259 + }
  260 + }
  261 +
  262 + .swiper-collocation {
  263 + margin-bottom: 20px;
  264 + width: 750px;
  265 + height: 567px;
  266 + background-color: #fff;
  267 +
  268 + .swiper-slide {
  269 + width: 590px;
  270 + height: 100%;
  271 + margin: 0 15px;
  272 +
  273 + img {
  274 + width: 590px;
  275 + height: 370px;
  276 + box-shadow: 0 5px 20px #bbb;
  277 + margin-top: 10px;
  278 + }
  279 +
  280 + p {
  281 + width: 490px;
  282 + height: 107px;
  283 + margin: 30px 50px 50px;
  284 + line-height: 53px;
  285 + font-size: 30px;
  286 + font-weight: 500;
  287 + text-align: center;
  288 + color: #444;
  289 + }
  290 + }
  291 + }
  292 +
  293 + .swiper-limit {
  294 + width: 750px;
  295 + height: 360px;
  296 + background-color: #fff;
  297 + margin-bottom: 20px;
  298 +
  299 + .swiper-pagination-bullet {
  300 + width: 20px;
  301 + height: 4px;
  302 + background-color: #b0b0b0;
  303 + }
  304 +
  305 + .swiper-pagination-bullet-active {
  306 + background-color: #444;
  307 + }
  308 +
  309 + .swiper-slide {
  310 + padding: 0 30px;
  311 +
  312 + img {
  313 + float: left;
  314 + width: 410px;
  315 + height: 256px;
  316 + }
  317 +
  318 + .info {
  319 + float: left;
  320 + width: 250px;
  321 + height: 256px;
  322 + padding-left: 30px;
  323 + }
  324 +
  325 + .name {
  326 + font-size: 30px;
  327 + color: #444;
  328 + }
  329 +
  330 + .title {
  331 + font-size: 22px;
  332 + color: #b0b0b0;
  333 + margin-top: 15px;
  334 + }
  335 + }
  336 + }
  337 +
  338 + .goods-list {
  339 + background-color: #fff;
  340 + width: 750px;
  341 + padding: 0 30px;
  342 + margin-bottom: 20px;
  343 +
  344 + .goods-item {
  345 + width: 690px;
  346 + height: 224px;
  347 + margin-bottom: 30px;
  348 +
  349 + img {
  350 + width: 360px;
  351 + height: 224px;
  352 + float: left;
  353 + }
  354 +
  355 + .info {
  356 + width: 300px;
  357 + height: 224px;
  358 + padding-left: 30px;
  359 + float: left;
  360 + }
  361 +
  362 + .name {
  363 + font-size: 24px;
  364 + color: #444;
  365 + line-height: 50px;
  366 + height: 150px;
  367 + }
  368 +
  369 + .tips {
  370 + margin-top: 34px;
  371 + height: 40px;
  372 + line-height: 40px;
  373 + font-size: 24px;
  374 + color: #b0b0b0;
  375 + }
  376 + }
  377 + }
  378 +
  379 + .person-list {
  380 + background-color: #fff;
  381 + padding: 0 30px;
  382 + margin-bottom: 20px;
  383 +
  384 + .person-item {
  385 + width: 690px;
  386 + height: 340px;
  387 + border-radius: 10px;
  388 + overflow: hidden;
  389 + margin-bottom: 30px;
  390 + position: relative;
  391 +
  392 + img {
  393 + width: 100%;
  394 + height: 100%;
  395 + }
  396 +
  397 + p {
  398 + position: absolute;
  399 + width: 690px;
  400 + height: 80px;
  401 + line-height: 80px;
  402 + bottom: 0;
  403 + left: 0;
  404 + color: #fff;
  405 + font-size: 30px;
  406 + text-align: center;
  407 + padding: 0 30px;
  408 + }
  409 + }
  410 + }
  411 +
  412 + .swiper-show {
  413 + background-color: #fff;
  414 + padding: 0 30px 30px;
  415 + margin-bottom: 20px;
  416 +
  417 + .swiper-slide {
  418 + width: 360px;
  419 + height: 360px;
  420 + border: solid 1px #e0e0e0;
  421 + position: relative;
  422 + color: #fff;
  423 + margin-right: 30px;
  424 +
  425 + img {
  426 + width: 100%;
  427 + height: 100%;
  428 + }
  429 +
  430 + .auther {
  431 + width: 298px;
  432 + height: 60px;
  433 + line-height: 60px;
  434 + position: absolute;
  435 + bottom: 0;
  436 + left: 0;
  437 + margin: 0 30px;
  438 +
  439 + .name {
  440 + font-size: 18px;
  441 + }
  442 +
  443 + .iconfont {
  444 + font-size: 30px;
  445 + float: right;
  446 + }
  447 + }
  448 +
  449 + .words {
  450 + width: 298px;
  451 + max-height: 80px;
  452 + position: absolute;
  453 + bottom: 60px;
  454 + left: 0;
  455 + font-size: 24px;
  456 + line-height: 40px;
  457 + margin: 10px 30px;
  458 + }
  459 + }
  460 + }
  461 +
  462 + .guang-list {
  463 + .guang-item {
  464 + padding-top: 30px;
  465 + background-color: #fff;
  466 + margin-bottom: 20px;
  467 +
  468 + .page-c {
  469 + margin: 0 auto;
  470 +
  471 + .name {
  472 + height: 120px;
  473 + }
  474 +
  475 + .info {
  476 + height: 210px;
  477 + }
  478 + }
  479 +
  480 + &:first-child {
  481 + padding-top: 0;
  482 + }
  483 + }
  484 + }
  485 +
  486 + .trend-list {
  487 + .trend-item {
  488 + background-color: #fff;
  489 + padding: 30px;
  490 + margin-bottom: 20px;
  491 +
  492 + img {
  493 + width: 690px;
  494 + height: 340px;
  495 + }
  496 +
  497 + .intro {
  498 + line-height: 45px;
  499 + height: 90px;
  500 + font-size: 26px;
  501 + text-align: center;
  502 + color: #444;
  503 + margin: 25px 0;
  504 + }
  505 +
  506 + .auther {
  507 + text-align: center;
  508 +
  509 + .pic {
  510 + display: inline-block;
  511 + width: 60px;
  512 + height: 60px;
  513 + border-radius: 50%;
  514 + background-size: cover;
  515 + background-repeat: no-repeat;
  516 + background-position: center center;
  517 + vertical-align: middle;
  518 + }
  519 +
  520 + .name {
  521 + display: inline-block;
  522 + font-size: 26px;
  523 + color: #444;
  524 + height: 30px;
  525 + line-height: 30px;
  526 + margin-left: 20px;
  527 + }
  528 + }
  529 + }
  530 + }
  531 +
  532 + .guang-fixed {
  533 + display: none;
  534 + position: fixed;
  535 + right: 20px;
  536 + bottom: 180px;
  537 + width: 80px;
  538 + height: 80px;
  539 + z-index: 9;
  540 + border-radius: 50%;
  541 + background: resolve("guang/new.png") no-repeat;
  542 + background-size: cover;
  543 + }
  544 +}
  545 +
  546 +.float-top {
  547 + position: fixed;
  548 + bottom: 78px;
  549 + right: 20px;
  550 + border-radius: 50%;
  551 + width: 80px;
  552 + height: 80px;
  553 + background: resolve("guang/up.png") no-repeat;
  554 + background-size: cover;
  555 + display: none;
  556 + z-index: 9999;
  557 +}
@@ -202,7 +202,8 @@ const formatArticle = (articleData, showTag, isApp, showAuthor, uid, top) => { @@ -202,7 +202,8 @@ const formatArticle = (articleData, showTag, isApp, showAuthor, uid, top) => {
202 _.forEach(articleData.product_list, value => { 202 _.forEach(articleData.product_list, value => {
203 result.productList.push(_.assign(value, { 203 result.productList.push(_.assign(value, {
204 price: parseFloat(value.sales_price).toFixed(2), 204 price: parseFloat(value.sales_price).toFixed(2),
205 - href: `//m.yohobuy.com/product/${value.product_skn}.html` 205 + href: `//m.yohobuy.com/product/${value.product_skn}.html`,
  206 + only: articleData.product_list.length === 1
206 })); 207 }));
207 }); 208 });
208 } 209 }