APP下载页面

+'use strict';
+
+module.exports = {
+    index: (req, res) => {
+        res.render('app-downloads', {
+            localCss: true
+        });
+    }
+};

@@ -29,7 +29,7 @@ const share = require(`${cRoot}/share`);
 const aliCloud = require(`${cRoot}/ali-cloud`);
 const aliCloud = require(`${cRoot}/ali-cloud`);
 const studentMarket = require(`${cRoot}/student-market`);
 const studentMarket = require(`${cRoot}/student-market`);
 const individuation = require(`${cRoot}/individuation`);
 const individuation = require(`${cRoot}/individuation`);
-
+const appDownloads = require(`${cRoot}/app-downloads`);
 const redbag = require(`${cRoot}/redbag`);
 const redbag = require(`${cRoot}/redbag`);
 
 
 // routers
 // routers
@@ -136,4 +136,6 @@ router.get('/redbag/2017', redbag.index);
 // 获取活动页面个性化推荐商品数据
 // 获取活动页面个性化推荐商品数据
 router.get('/individuation', individuation.productLst);
 router.get('/individuation', individuation.productLst);
 
 
+router.get('/app-downloads', appDownloads.index);
+
 module.exports = router;
 module.exports = router;

+<div class="container">
+    <div class="banner"></div>
+    <div class="main">
+        <div class="slide-box">
+            <div class="swiper-wrapper clearfix">
+                <div class="yohobuy" tag="0">
+                    <div class="swiper-yohobuy bg"></div>
+                    <div class="ewm-area">
+                        <img src="http://cdn.yoho.cn/yohocn/160315/images/ewm-yohobuy.png" />
+                        <div class="ewm-info"></div>
+                    </div>
+                    <span id="download" class="download-btn">点击下载 · Yoho!Buy有货</span>
+                </div>
+            </div>
+        </div>
+        <div class="slide-pagination clearfix">
+        </div>
+    </div>
+    <div class="footer">
+        CopyRight © 2007-2017 YOHO!新力传媒
+    </div>
+    <div class="mask">
+        <div class="wx-img1"></div>
+        <div class="wx-img2"></div>
+        <div class="wx-img3"></div>
+    </div>
+</div>
+
+{{#if devEnv}}
+    {{#if localCss}}
+        <link rel="stylesheet" media="all" href="//{{devHost}}:5001/bundle/common.css">
+    {{/if}}
+    {{#ifor localCss vue}}
+        <link rel="stylesheet" media="all" href="//{{devHost}}:5001/bundle/{{module}}.{{page}}.css">
+    {{^}}
+
+        <link rel="stylesheet" media="all" href="//{{devHost}}:5001/bundle/index.css">
+    {{/ifor}}
+{{^}}
+
+    {{#if localCss }}
+        <link rel="stylesheet" media="all" href="//cdn.yoho.cn/m-yohobuy-node/{{version}}/common.css">
+    {{/if}}
+    {{#ifor localCss vue}}
+        <link rel="stylesheet" media="all" href="//cdn.yoho.cn/m-yohobuy-node/{{version}}/{{module}}.{{page}}.css">
+    {{^}}
+        <link rel="stylesheet" media="all" href="//cdn.yoho.cn/m-yohobuy-node/{{version}}/index.css">
+    {{/ifor}}
+{{/if}}

+require('../../scss/activity/_app-downloads.css');
+
+const url = 'yohobuy://yohobuy.com/goapp?openby:yohobuy={"action":"go.home","params":{"gender":"1","channel":"2"}}';
+const u = navigator.userAgent.toLowerCase();
+const isiOS = u.indexOf('os') > -1 || u.indexOf('iphone') > -1 || u.indexOf('mac') > -1 || u.indexOf('ipad') > -1;
+
+let appPath = url;
+let ifr;
+
+if (isiOS) {
+    window.location.href = appPath;
+} else {
+    ifr = document.createElement('iframe');
+    ifr.src = appPath;
+    ifr.style.display = 'none';
+    document.body.appendChild(ifr);
+}
+
+$('#download').click(function() {
+    var mktc = '';
+
+    location.href = `http://union.yoho.cn/union/downapp.html${(mktc ? '?union_type=' + mktc : '')}`;
+});

+body {
+    line-height: 1.5;
+    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
+}
+
+table {
+    border-collapse: collapse;
+    border-spacing: 0
+}
+
+caption, th, td, b, strong {
+    text-align: left;
+    font-weight: normal
+}
+
+table, td, th {
+    vertical-align: middle
+}
+
+blockquote:before, blockquote:after, q:before, q:after {
+    content: ""
+}
+
+blockquote, q {
+    quotes: "" ""
+}
+
+a img {
+    border: none
+}
+
+em, cite {
+    font-style: normal
+}
+
+body {
+    background: #fff;
+    font: 12px/1.5 Tahoma, '宋体';
+    color: #000
+}
+
+h1, h2, h3, h4, h5, h6 {
+    font-weight: normal;
+    color: #111
+}
+
+a {
+    text-decoration: none;
+    cursor: pointer
+}
+
+dl, dt, dd, ol, ul, li {
+    list-style: none
+}
+
+.left {
+    float: left
+}
+
+.right {
+    float: right
+}
+
+.clearfix:before, .clearfix:after {
+    content: "";
+    display: table
+}
+
+.clearfix:after {
+    clear: both
+}
+
+.clearfix {
+    *zoom: 1
+}
+
+body.disable-default-action {
+    -webkit-touch-callout: none;
+    -webkit-user-select: none;
+}
+
+.loadding-area {
+    position: fixed;
+    top: 50%;
+    left: 50%;
+    width: 4rem;
+    height: 4rem;
+    margin-top: -2rem;
+    margin-left: -2rem;
+    border-radius: 10%;
+    background-color: rgba(0, 0, 0, 0.3);
+    z-index: 9999;
+}
+
+.loadding {
+    z-index: 999;
+    width: 1.1rem;
+    position: absolute;
+    top: 50%;
+    left: 50%;
+    margin: -0.55rem 0 0 -0.55rem;
+}
+
+.container {
+    max-width: 790px;
+    height: auto;
+    margin: 0 auto;
+    /*overflow: hidden;*/
+}
+
+.banner {
+    height: 6rem;
+    background: url(http://cdn.yoho.cn/yohocn/160315/images/banner.png) no-repeat right;
+    background-size: contain;
+    position: fixed;
+    top: 0;
+    left: 0;
+    right: 0;
+    z-index: 99;
+}
+
+.main {
+    position: relative;
+    top: 3.5rem;
+    height: 20rem;
+}
+
+.slide-box {
+    overflow: hidden;
+    position: relative;
+    height: 20.78rem;
+    width: 100%;
+}
+
+.slide-box .swipe-wrap {
+    overflow: hidden;
+    position: relative;
+    height: 19.775rem;
+}
+
+/*.slide-box .swiper-wrapper {
+    padding: 0px 4.578rem;
+}*/
+
+.slide-box .swiper-slide {
+    float: left;
+    width: 16rem;
+    position: relative;
+    height: 20.78rem;
+    margin: 0;
+    padding: 0;
+}
+
+.slide-box .download-btn {
+    background-color: #d0021b;
+    color: #fff;
+    border-radius: 0.2rem;
+    width: 12.8rem;
+    height: 2rem;
+    line-height: 2rem;
+    font-family: arial, helvetica, '黑体';
+    font-size: 0.8rem;
+    text-align: center;
+    position: absolute;
+    bottom: 0px;
+    left: 50%;
+    margin-left: -6.4rem;
+}
+
+.slide-box .ewm-area {
+    width: 12.8rem;
+    height: 5.7rem;
+    position: absolute;
+    bottom: 2.45rem;
+    left: 50%;
+    margin-left: -6.4rem;
+}
+
+.slide-box .ewm-area img {
+    width: 4.6rem;
+    margin: 0 auto;
+    display: block;
+}
+
+.slide-box .ewm-area .yoho-txt01 {
+    background: url(http://cdn.yoho.cn/yohocn/160315/images/txt01.png) no-repeat;
+}
+
+.slide-box .ewm-area .yoho-txt02 {
+    background: url(http://cdn.yoho.cn/yohocn/160315/images/txt02.png) no-repeat;
+}
+
+.slide-box .ewm-area .yoho-txt01,
+.slide-box .ewm-area .yoho-txt02 {
+    width: 3.3rem;
+    height: 0.7rem;
+    display: block;
+    margin: 0 auto;
+    background-size: contain;
+}
+
+.slide-box .ewm-area .ewm-info {
+    background: url(http://cdn.yoho.cn/yohocn/160315/images/ewm-info.png) no-repeat;
+    width: 7rem;
+    height: 0.7rem;
+    margin: 0.4rem auto 0 auto;
+    background-size: contain;
+    clear: both;
+}
+
+.slide-box .ewm-area .ewm-yoho {
+    height: 5.4rem;
+    width: 4.6rem;
+}
+
+.swiper-yohobuy {
+    background: url(http://cdn.yoho.cn/yohocn/160315/images/yohobuy.png) no-repeat;
+}
+
+.swiper-yoho {
+    background: url(http://cdn.yoho.cn/yohocn/160315/images/yoho.png) no-repeat;
+}
+
+.swiper-show {
+    background: url(http://cdn.yoho.cn/yohocn/160315/images/show.png) no-repeat;
+}
+
+.swiper-mars {
+    background: url(http://cdn.yoho.cn/yohocn/160315/images/mars.png) no-repeat;
+}
+
+.slide-box .bg {
+    display: block;
+    margin: 0 auto;
+    width: 12.5rem;
+    height: 19.2rem;
+    background-size: contain;
+}
+
+.slide-pagination {
+    margin: 0.125rem 0 0 0;
+    text-align: center;
+}
+
+.slide-pagination .swiper-pagination-bullet {
+    margin: 0 0.1rem;
+}
+
+.swiper-pagination-bullet-active {
+    background: #696969;
+}
+
+.footer {
+    text-align: center;
+    color: #555;
+    line-height: 16px;
+    font-size: 0.35rem;
+    box-shadow: none;
+    position: relative;
+    top: 5.3rem;
+}
+
+.mask {
+    background: rgba(0, 0, 0, 0.8);
+    position: absolute;
+    left: 0;
+    right: 0;
+    top: 0;
+    bottom: 0;
+    height: 41rem;
+    z-index: 999;
+    display: none;
+}
+
+.mask .wx-img1 {
+    width: 7rem;
+    height: 2rem;
+    background: url(http://cdn.yoho.cn/yohocn/160315/images/wx-img1.png) no-repeat;
+    background-size: contain;
+    position: fixed;
+    top: 0.4rem;
+    right: 1rem;
+}
+
+.mask .wx-img2 {
+    width: 16rem;
+    height: 9rem;
+    background: url(http://cdn.yoho.cn/yohocn/160315/images/wx-img2.png) no-repeat;
+    background-size: cover;
+    position: absolute;
+    bottom: 4rem;
+    right: 50%;
+    margin-right: -8rem;
+}
+
+.mask .wx-img3 {
+    width: 16rem;
+    height: 16rem;
+    background: url(http://cdn.yoho.cn/yohocn/160315/images/wx-img3.png) no-repeat;
+    background-size: cover;
+    position: absolute;
+    top: 2rem;
+    right: 50%;
+    margin-right: -7.7rem;
+    display: none;
+}