支付失败页

@@ -62,6 +62,7 @@ const online = (req, res, next) => {
         } else {
             res.display('pay-success', {
                 defaultHeader: false,
+                bcNavFocus: 3,
                 content: {
                     cost: order.paymentAmount,
                     orderNum: order.orderCode,
@@ -193,6 +194,7 @@ const callback = (req, res, next) => {
 
             res.display('pay-success', {
                 defaultHeader: false,
+                bcNavFocus: 3,
                 content: {
                     cost: order.payment_amount,
                     orderNum: order.order_code,
@@ -204,7 +206,10 @@ const callback = (req, res, next) => {
                 }
             });
         } else {
-            return next();
+            res.display('pay-fail', {
+                defaultHeader: false,
+                bcNavFocus: 3
+            });
         }
     }).catch(next);
 };

+{{> settle-header}}
+<div class="pay-page pay-fail-page blk-page">
+    <div class="center-content">
+        {{> bc-nav}}
+        <div class="pay-fail-group">
+            <div class="pay-fail-bg"></div>
+            <p class="pay-fail-info big">抱歉！订单支付失败，请立即联系客服</p>
+            <p class="pay-fail-info small">I'm sorry！ Order failed to pay, please contact customer service</p>
+            <p class="pay-fail-info small">感谢您选择{{payName}}支付方式，我们的客服随后会和您确认订单</p>
+            <p class="pay-fail-info medium">客服电话：<span class='blue'>400-889-9646</span></p>
+            <a href="/" class="go-to-home">
+                <span class="btn">返回BLK首页</span>
+            </a>
+        </div>
+    </div>
+</div>

 {{> settle-header}}
-<div class="pay-success-page blk-page">
+<div class="pay-page pay-success-page blk-page">
     <div class="center-content">
+        {{> bc-nav}}
         {{# content}}
             <div class="order-info clearfix">
                 <div class="left">

+<?xml version="1.0" encoding="utf-8"?>
+<!-- Generator: Adobe Illustrator 19.0.0, SVG Export Plug-In . SVG Version: 6.00 Build 0)  -->
+<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"
+	 viewBox="0 0 204 204" style="enable-background:new 0 0 204 204;" xml:space="preserve">
+<style type="text/css">
+	.st0{fill:#b0b0b0;}
+</style>
+<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
+	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"/>
+<g id="XMLID_67_">
+	<rect id="XMLID_7_" x="100" y="50.2" class="st0" width="4" height="84.2"/>
+	<rect id="XMLID_6_" x="100" y="143.8" class="st0" width="4" height="10"/>
+</g>
+</svg>

 .blk-cart-page,
+.pay-page,
 .shopping-order-page {
     .cart-bc {
         width: 100%;

@@ -15,3 +15,4 @@
 /* 支付流程-在线支付 */
 @import "pay";
 @import "pay-success";
+@import "pay-fail";

+.pay-fail-page {
+    .pay-fail-group {
+        margin: 145px auto;
+        text-align: center;
+
+        .pay-fail-bg {
+            background: resolve("layout/pay-fail.svg") no-repeat center center;
+            width: 115px;
+            height: 130px;
+            margin: 0 auto 30px;
+        }
+
+        .go-to-home .btn {
+            margin-top: 40px;
+            display: inline-block;
+            width: 130px;
+            height: 40px;
+            line-height: 40px;
+        }
+
+        .big {
+            font-size: 20px;
+            line-height: 30px;
+            color: #212121;
+        }
+
+        .medium {
+            font-size: 14px;
+            line-height: 30px;
+            color: #1b1b1b;
+        }
+
+        .small {
+            font-size: 14px;
+            line-height: 40px;
+            color: #212121;
+        }
+    }
+}