Authored by 郭成尧

cart-center-page

@@ -28,7 +28,15 @@ const payCenter = (req, res, next) => { @@ -28,7 +28,15 @@ const payCenter = (req, res, next) => {
28 title: '支付中心 | Yoho!Buy有货 | 潮流购物逛不停' 28 title: '支付中心 | Yoho!Buy有货 | 潮流购物逛不停'
29 }; 29 };
30 30
31 - res.render('pay/pay-center', responseData); 31 + payModel.payCenter({
  32 + orderCode: req.query.order_code
  33 + }).then(result => {
  34 + res.render('pay/pay-center', Object.assign(responseData, {
  35 + payAppInfo: result.payList
  36 + }));
  37 + }).catch(next);
  38 +
  39 +
32 }; 40 };
33 41
34 // 货到付款 42 // 货到付款
@@ -10,6 +10,7 @@ const api = global.yoho.API; @@ -10,6 +10,7 @@ const api = global.yoho.API;
10 const serviceAPI = global.yoho.ServiceAPI; 10 const serviceAPI = global.yoho.ServiceAPI;
11 const utils = '../../../utils'; 11 const utils = '../../../utils';
12 const productProcess = require(`${utils}/product-process`); 12 const productProcess = require(`${utils}/product-process`);
  13 +const helpers = global.yoho.helpers;
13 14
14 // 资源位 15 // 资源位
15 const _getBanner = (param) => { 16 const _getBanner = (param) => {
@@ -80,6 +81,33 @@ const _getOthersBuy = (param) => { @@ -80,6 +81,33 @@ const _getOthersBuy = (param) => {
80 }); 81 });
81 }; 82 };
82 83
  84 +/**
  85 + * 支付中心
  86 + * @param params
  87 + */
  88 +const payCenter = (params) => {
  89 + return Promise.resolve({
  90 + payList: [
  91 + {
  92 + appIcon: '',
  93 + payLink: helpers.urlFormat('/shopping/pay/index'),
  94 + appId: 'alipay',
  95 + app: '支付宝支付',
  96 + hint: '支付宝钱包支付',
  97 + subHint: '推荐支付宝用户使用'
  98 + },
  99 + {
  100 + appIcon: '',
  101 + payLink: '',
  102 + appId: 'weixin',
  103 + app: '微信支付',
  104 + hint: '推荐使用',
  105 + subHint: ''
  106 + }
  107 + ]
  108 + });
  109 +};
  110 +
83 // 货到付款 111 // 货到付款
84 const getPayCod = (param) => { 112 const getPayCod = (param) => {
85 return api.all([ 113 return api.all([
@@ -153,6 +181,7 @@ const getPayAli = (param) => { @@ -153,6 +181,7 @@ const getPayAli = (param) => {
153 }; 181 };
154 182
155 module.exports = { 183 module.exports = {
  184 + payCenter,
156 getPayCod, 185 getPayCod,
157 getPayAli 186 getPayAli
158 }; 187 };
@@ -3,6 +3,7 @@ @@ -3,6 +3,7 @@
3 <input id='ordercode' type="hidden" value="{{orderCode}}"> 3 <input id='ordercode' type="hidden" value="{{orderCode}}">
4 {{/if}} 4 {{/if}}
5 <div class="payapp-list"> 5 <div class="payapp-list">
  6 + {{log payAppInfo}}
6 {{# payAppInfo}} 7 {{# payAppInfo}}
7 {{#if payLink}} 8 {{#if payLink}}
8 <a href="{{payLink}}"> 9 <a href="{{payLink}}">
1 var $ = require('yoho-jquery'), 1 var $ = require('yoho-jquery'),
2 lazyLoad = require('yoho-jquery-lazyload'); 2 lazyLoad = require('yoho-jquery-lazyload');
3 3
  4 +var loading = require('../plugin/loading'),
  5 + tip = require('../plugin/tip'),
  6 + Hammer = require('yoho-hammer');
  7 +
  8 +
  9 +// 点击微信显示加载
  10 +var $loadingToast = $(".loading-toast");
  11 +
  12 +/* TODO 影响加载此段 JS */
  13 +// var theOrderCode = document.getElementById('ordercode').value;
  14 +
  15 +var wxPayEl = document.getElementById('weixin'),
  16 + wxHammer = wxPayEl && new Hammer(wxPayEl);
  17 +
  18 +var appIconPosition = {
  19 + baidu: '-2.7rem',
  20 + weixin: '-1.2rem',
  21 + QQ: '-5.4rem',
  22 + bank: '-4rem'
  23 +};
  24 +
4 require('../common'); 25 require('../common');
5 26
6 lazyLoad($('img.lazy')); 27 lazyLoad($('img.lazy'));
@@ -14,3 +35,169 @@ require('../channel/maybe-like')(getGender()); @@ -14,3 +35,169 @@ require('../channel/maybe-like')(getGender());
14 if ($('#goods-list').length === 0) { 35 if ($('#goods-list').length === 0) {
15 $('.maybe-like').hide(); 36 $('.maybe-like').hide();
16 } 37 }
  38 +
  39 +//隐藏微信分享选项
  40 +if (window.wx) {
  41 + wx.hideOptionMenu();
  42 +}
  43 +
  44 +function onBridgeReady() {
  45 + document.addEventListener('WeixinJSBridgeReady', function() {
  46 + window.WeixinJSBridge && window.WeixinJSBridge.call('hideOptionMenu');
  47 + });
  48 +}
  49 +
  50 +if (typeof WeixinJSBridge === undefined) {
  51 + if (document.addEventListener) {
  52 + document.addEventListener('WeixinJSBridgeReady', onBridgeReady, false);
  53 + } else if (document.attachEvent) {
  54 + document.attachEvent('WeixinJSBridgeReady', onBridgeReady);
  55 + document.attachEvent('onWeixinJSBridgeReady', onBridgeReady);
  56 + }
  57 + onBridgeReady();
  58 +} else {
  59 + onBridgeReady();
  60 +}
  61 +
  62 +// 调用微信JS api 支付
  63 +function jsApiCall(orderCode, jsApiParameters) {
  64 + $loadingToast.addClass("hide");
  65 +
  66 + // 防止重复操作弹框
  67 + window.WeixinJSBridge && window.WeixinJSBridge.invoke(
  68 + 'getBrandWCPayRequest',
  69 + jsApiParameters,
  70 + function(res) {
  71 +
  72 + window.location.href = '/home/orders/detail?order_code=' + orderCode + '&openId=true';
  73 + }
  74 + );
  75 +}
  76 +
  77 +// 微信支付
  78 +function callpay(orderCode) {
  79 + var jsApiParameters;
  80 +
  81 + $loadingToast.removeClass("hide");
  82 + if (typeof WeixinJSBridge === undefined) {
  83 + if (document.addEventListener) {
  84 + document.addEventListener('WeixinJSBridgeReady', jsApiCall, false);
  85 + } else if (document.attachEvent) {
  86 + document.attachEvent('WeixinJSBridgeReady', jsApiCall);
  87 + document.attachEvent('onWeixinJSBridgeReady', jsApiCall);
  88 + }
  89 + } else {
  90 + $.ajax({
  91 + type: 'GET',
  92 + url: '/shopping/pay/wechatwapapi',
  93 + data: {
  94 + 'order_code': orderCode
  95 + },
  96 + dataType: 'json',
  97 + success: function(res) {
  98 + if (res.code === 200) {
  99 + jsApiParameters = res.data.jsApiParameters;
  100 + jsApiCall(orderCode, jsApiParameters);
  101 + } else {
  102 + tip.show('微信支付调取失败');
  103 + }
  104 + },
  105 + error: function() {
  106 + tip.show('请刷新本页面,完成微信支付');
  107 + },
  108 + complete: function() {
  109 + $loadingToast.addClass("hide");
  110 + }
  111 + });
  112 + }
  113 +}
  114 +
  115 +
  116 +function isWXOpen() {
  117 + var ua = window.navigator.userAgent.toLowerCase();
  118 +
  119 + return ua.indexOf('micromessenger') > 0;
  120 +}
  121 +
  122 +function hideWeChatPay() {
  123 + var $payApps = $('.app');
  124 +
  125 + $payApps.each(function(idx, app) {
  126 + if ($(app).parent().attr('id') === 'weixin') {
  127 + $(app).parent().css('display', 'none');
  128 + return false;
  129 + }
  130 + });
  131 +}
  132 +
  133 +function hideAliPay() {
  134 + var $payApps = $('.app');
  135 +
  136 + $payApps.each(function(idx, app) {
  137 + if ($(app).parent().attr('id') === 'alipay') {
  138 + $(app).closest('a').css('display', 'none');
  139 + return false;
  140 + }
  141 + });
  142 +}
  143 +
  144 +function handleForWX() {
  145 + if (!isWXOpen()) {
  146 + hideWeChatPay();
  147 + } else {
  148 + hideAliPay();
  149 + }
  150 +}
  151 +
  152 +
  153 +function setAppIcon(el, position) {
  154 + $(el).css('background-position-y', position);
  155 +}
  156 +
  157 +function loadIcon() {
  158 + var $boxs = $('.box');
  159 + var $div = null;
  160 + var appid = null;
  161 +
  162 + $boxs.each(function(idx, box) {
  163 + $div = $(box).find('.icon').find('div');
  164 + if ($div.length > 0) {
  165 + appid = $(box).attr('id');
  166 + if (appid !== 'alipay') {
  167 + setAppIcon($div, appIconPosition[appid]);
  168 + }
  169 + }
  170 + });
  171 +}
  172 +
  173 +function showPage() {
  174 + $('.payapp-list').css('visibility', 'visible');
  175 +}
  176 +
  177 +function bindTouchedEvent() {
  178 + var $boxs = $('.box');
  179 +
  180 + $boxs.on('touchstart', function(e) {
  181 + $(this).addClass('bytouch');
  182 + }).on('touchend touchcancel', function() {
  183 + $boxs.removeClass('bytouch');
  184 + });
  185 +}
  186 +
  187 +if (wxHammer) {
  188 + wxHammer.on('tap', function() {
  189 + callpay(theOrderCode);
  190 + });
  191 +}
  192 +
  193 +function main() {
  194 + handleForWX();
  195 + loading.hideLoadingMask();
  196 + showPage();
  197 + loadIcon();
  198 + bindTouchedEvent();
  199 +}
  200 +
  201 +loading.showLoadingMask();
  202 +
  203 +$(document).ready(main);