Authored by 郝肖肖

支付失败页

@@ -62,6 +62,7 @@ const online = (req, res, next) => { @@ -62,6 +62,7 @@ const online = (req, res, next) => {
62 } else { 62 } else {
63 res.display('pay-success', { 63 res.display('pay-success', {
64 defaultHeader: false, 64 defaultHeader: false,
  65 + bcNavFocus: 3,
65 content: { 66 content: {
66 cost: order.paymentAmount, 67 cost: order.paymentAmount,
67 orderNum: order.orderCode, 68 orderNum: order.orderCode,
@@ -193,6 +194,7 @@ const callback = (req, res, next) => { @@ -193,6 +194,7 @@ const callback = (req, res, next) => {
193 194
194 res.display('pay-success', { 195 res.display('pay-success', {
195 defaultHeader: false, 196 defaultHeader: false,
  197 + bcNavFocus: 3,
196 content: { 198 content: {
197 cost: order.payment_amount, 199 cost: order.payment_amount,
198 orderNum: order.order_code, 200 orderNum: order.order_code,
@@ -204,7 +206,10 @@ const callback = (req, res, next) => { @@ -204,7 +206,10 @@ const callback = (req, res, next) => {
204 } 206 }
205 }); 207 });
206 } else { 208 } else {
207 - return next(); 209 + res.display('pay-fail', {
  210 + defaultHeader: false,
  211 + bcNavFocus: 3
  212 + });
208 } 213 }
209 }).catch(next); 214 }).catch(next);
210 }; 215 };
  1 +{{> settle-header}}
  2 +<div class="pay-page pay-fail-page blk-page">
  3 + <div class="center-content">
  4 + {{> bc-nav}}
  5 + <div class="pay-fail-group">
  6 + <div class="pay-fail-bg"></div>
  7 + <p class="pay-fail-info big">抱歉!订单支付失败,请立即联系客服</p>
  8 + <p class="pay-fail-info small">I'm sorry! Order failed to pay, please contact customer service</p>
  9 + <p class="pay-fail-info small">感谢您选择{{payName}}支付方式,我们的客服随后会和您确认订单</p>
  10 + <p class="pay-fail-info medium">客服电话:<span class='blue'>400-889-9646</span></p>
  11 + <a href="/" class="go-to-home">
  12 + <span class="btn">返回BLK首页</span>
  13 + </a>
  14 + </div>
  15 + </div>
  16 +</div>
1 {{> settle-header}} 1 {{> settle-header}}
2 -<div class="pay-success-page blk-page"> 2 +<div class="pay-page pay-success-page blk-page">
3 <div class="center-content"> 3 <div class="center-content">
  4 + {{> bc-nav}}
4 {{# content}} 5 {{# content}}
5 <div class="order-info clearfix"> 6 <div class="order-info clearfix">
6 <div class="left"> 7 <div class="left">
  1 +<?xml version="1.0" encoding="utf-8"?>
  2 +<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0) -->
  3 +<svg version="1.1" id="图层_1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" x="0px" y="0px"
  4 + viewBox="0 0 204 204" style="enable-background:new 0 0 204 204;" xml:space="preserve">
  5 +<style type="text/css">
  6 + .st0{fill:#b0b0b0;}
  7 +</style>
  8 +<path id="XMLID_8_" class="st0" d="M102,204C45.8,204,0,158.2,0,102C0,45.8,45.8,0,102,0s102,45.8,102,102
  9 + C204,158.2,158.2,204,102,204z M102,4C48,4,4,48,4,102c0,54,44,98,98,98c54,0,98-44,98-98C200,48,156,4,102,4z"/>
  10 +<g id="XMLID_67_">
  11 + <rect id="XMLID_7_" x="100" y="50.2" class="st0" width="4" height="84.2"/>
  12 + <rect id="XMLID_6_" x="100" y="143.8" class="st0" width="4" height="10"/>
  13 +</g>
  14 +</svg>
1 .blk-cart-page, 1 .blk-cart-page,
  2 +.pay-page,
2 .shopping-order-page { 3 .shopping-order-page {
3 .cart-bc { 4 .cart-bc {
4 width: 100%; 5 width: 100%;
@@ -15,3 +15,4 @@ @@ -15,3 +15,4 @@
15 /* 支付流程-在线支付 */ 15 /* 支付流程-在线支付 */
16 @import "pay"; 16 @import "pay";
17 @import "pay-success"; 17 @import "pay-success";
  18 +@import "pay-fail";
  1 +.pay-fail-page {
  2 + .pay-fail-group {
  3 + margin: 145px auto;
  4 + text-align: center;
  5 +
  6 + .pay-fail-bg {
  7 + background: resolve("layout/pay-fail.svg") no-repeat center center;
  8 + width: 115px;
  9 + height: 130px;
  10 + margin: 0 auto 30px;
  11 + }
  12 +
  13 + .go-to-home .btn {
  14 + margin-top: 40px;
  15 + display: inline-block;
  16 + width: 130px;
  17 + height: 40px;
  18 + line-height: 40px;
  19 + }
  20 +
  21 + .big {
  22 + font-size: 20px;
  23 + line-height: 30px;
  24 + color: #212121;
  25 + }
  26 +
  27 + .medium {
  28 + font-size: 14px;
  29 + line-height: 30px;
  30 + color: #1b1b1b;
  31 + }
  32 +
  33 + .small {
  34 + font-size: 14px;
  35 + line-height: 40px;
  36 + color: #212121;
  37 + }
  38 + }
  39 +}