update for detail page count down

@@ -12,7 +12,7 @@ const orderModel = require('../models/order');
 /**
  * 我的订单
  */
-const index = (req, res) => {
+const index = (req, res, next) => {
     const type = req.query.type;
     const page = req.query.page;
     const uid = global.yoho.uid || '7394907';
@@ -27,10 +27,10 @@ const index = (req, res) => {
                 banner: 'http://placehold.it/{width}x{height}'
             }, result)
         });
-    });
+    }).catch(next);
 };
 
-const detail = (req, res) => {
+const detail = (req, res, next) => {
     const code = req.query.code;
     const uid = global.yoho.uid || '7394907';
 
@@ -44,10 +44,10 @@ const detail = (req, res) => {
                 banner: 'http://placehold.it/{width}x{height}'
             }, result)
         });
-    });
+    }).catch(next);
 };
 
-const getOrderList = (req, res) => {
+const getOrderList = (req, res, next) => {
     const type = req.query.type;
     const page = req.query.page;
     const uid = global.yoho.uid || '7394907';
@@ -60,10 +60,10 @@ const getOrderList = (req, res) => {
             orderList: result.order.orderList,
             paginationOpts: result.order.paginationOpts
         });
-    });
+    }).catch(next);
 };
 
-const getOrderTotal = (req, res) => {
+const getOrderTotal = (req, res, next) => {
     const type = req.query.type;
     const uid = global.yoho.uid || '7394907';
 
@@ -74,40 +74,40 @@ const getOrderTotal = (req, res) => {
             total: result.order.total,
             type: result.order.type
         });
-    });
+    }).catch(next);
 };
 
-const cancelOrder = (req, res) => {
+const cancelOrder = (req, res, next) => {
     const uid = global.yoho.uid || '7394907';
     const code = req.query.orderCode;
 
     orderModel.cancelOrder(uid, code).then(result => {
         res.json(result);
-    });
+    }).catch(next);
 };
 
-const deleteOrder = (req, res) => {
+const deleteOrder = (req, res, next) => {
     const uid = global.yoho.uid || '7394907';
     const code = req.query.orderCode;
 
     orderModel.deleteOrder(uid, code).then(result => {
         res.json(result);
-    });
+    }).catch(next);
 };
 
-const getExpressInfo = (req, res) => {
+const getExpressInfo = (req, res, next) => {
     const uid = global.yoho.uid || '7394907';
     const code = req.query.orderCode;
 
     orderModel.getExpressInfo(uid, code).then(result => {
         res.json(result);
-    });
+    }).catch(next);
 };
 
-const getCancelOrderReason = (req, res) => {
+const getCancelOrderReason = (req, res, next) => {
     orderModel.getCancelOrderReason().then(result => {
         res.json(result);
-    });
+    }).catch(next);
 };
 
 const editOrder = (req, res) => {

@@ -375,6 +375,11 @@ const getOrderDetail = (uid, code) => {
 
         detail.createTime = _convertUnixTime(detail.createTime);
 
+        if (detail.isCancel === 'N' &&
+            st === 0) {
+            detail.showLeftTime = true;
+        }
+
         // 需要和接口确认如何获取运费，接口文档和线上数据不一致
         // if (detail.shippingCost) {
         //     detail.shippingCost = _removeRmbIcon(detail.shippingCost);

@@ -13,6 +13,15 @@
         </div>
     </div>
 
+    {{#if showLeftTime}}
+    <div class="time">
+        <span>剩余支付时间：</span>
+        <span class="iconfont">&#xe606;</span>
+        <p class="left-time" data-left={{payLefttime}}></p>
+        <span class="tip">（逾期订单将自动取消）</span>
+    </div>
+    {{/if}}
+
     {{#if steps}}
     <div class="time-line">
         <ul>

@@ -6,7 +6,7 @@
             <li class="content">下单时间：{{createTime}}</li>
             <li class="content">订单编号：{{orderCode}}</li>
             {{#if showMobile}}
-            <li class="content">手机订单</li>
+            <li class="content"><span class="iconfont">&#xe62f;</span>手机订单</li>
             {{/if}}
         </ul>
         <div class="table-body">
@@ -25,7 +25,7 @@
                 {{#if showPayButton}}
                 <div class="pay-operation">
                     {{#if isOnlinePaid}}
-                        <p class="left-time" data-left="{{payLefttime}}"></p>
+                        <span class="iconfont">&#xe606;</span><p class="left-time" data-left="{{payLefttime}}"></p>
                         <span class="btn red">立即付款</span>
                     {{/if}}
                     <p class="subtext cancel">取消订单</p>

 var cancelOrder = require('./order/cancel-order');
 var editOrder = require('./order/edit-order');
+var countDown = require('./order/countdown');
 
 
 function reload() {
@@ -35,3 +36,9 @@ $('.order .edit-btn').on('click', function() {
         }
     }, reload);
 });
+
+if ($('.left-time').length) {
+    countDown.intervalValue = 1000;
+    countDown.showSec = true;
+    countDown.start();
+}

@@ -13,6 +13,9 @@ var cancelOrder = require('./order/cancel-order');
 
 var reOrder = require('./order/readd-order');
 
+// 订单剩余时间显示及倒计时
+var countDown = require('./order/countdown');
+
 // 更新表格
 var tableOperation = {
     $header: $('.table.column-category'),
@@ -26,60 +29,6 @@ var tableOperation = {
     }
 };
 
-// 订单剩余时间显示及倒计时
-var countDown = {
-    count: null,
-    intervalTimer: null,
-    intervalValue: 60000,
-    $element: null,
-    selector: '.left-time',
-    setTime: function() {
-        var that = this;
-
-        this.$element.each(function(index, item) {
-            var $item = $(item);
-            var leftTime = $item.data('left');
-
-            $item.text(that.convertLeftTime(leftTime - that.count * 60));
-        });
-        this.count += 1;
-    },
-    convertLeftTime: function(src) {
-        var min = parseInt(src / 60, 10) % 60;
-        var hour = parseInt(src / 3600, 10);
-        var timeStr = min + '分';
-
-        if (src <= 0) {
-            timeStr = '已失效';
-            return timeStr;
-        }
-
-        if (hour > 0) {
-            timeStr = hour + '时' + timeStr;
-        }
-
-        timeStr = '剩余' + timeStr;
-
-        return timeStr;
-    },
-    getLeftTime: function() {
-        var that = this;
-
-        if (this.$element.length) {
-            this.setTime();
-            this.intervalTimer = setInterval(this.setTime.bind(that), that.intervalValue);
-        }
-    },
-    start: function() {
-        this.count = 0;
-        this.$element = $(this.selector);
-        if (this.intervalTimer) {
-            clearInterval(this.intervalTimer);
-        }
-        this.getLeftTime();
-    }
-};
-
 // 订单类型
 var typeMap = {
     all: 1,

+// 订单剩余时间显示及倒计时
+module.exports = {
+    count: null,
+    intervalTimer: null,
+    intervalValue: 60000,
+    $element: null,
+    selector: '.left-time',
+    addtionalMsg: '',
+    showSec: false,
+    setTime: function() {
+        var that = this;
+
+        this.$element.each(function(index, item) {
+            var $item = $(item);
+            var leftTime = $item.data('left');
+            var i = that.intervalValue / 1000;
+
+            $item.text(that.convertLeftTime(leftTime - that.count * i));
+        });
+        this.count += 1;
+    },
+    convertLeftTime: function(src) {
+        var sec = parseInt(src, 10) % 60;
+        var min = parseInt(src / 60, 10) % 60;
+        var hour = parseInt(src / 3600, 10);
+        var timeStr = min + '分';
+
+
+        if (src <= 0) {
+            timeStr = '已失效';
+            return timeStr;
+        }
+
+        if (this.showSec) {
+            timeStr += sec + '秒';
+        }
+
+        if (hour > 0) {
+            timeStr = hour + '时' + timeStr;
+        }
+
+        timeStr = '剩余' + timeStr;
+
+        if (this.addtionalMsg.length > 0) {
+            timeStr += this.addtionalMsg;
+        }
+
+        return timeStr;
+    },
+    getLeftTime: function() {
+        var that = this;
+
+        if (this.$element.length) {
+            this.setTime();
+            this.intervalTimer = setInterval(this.setTime.bind(that), that.intervalValue);
+        }
+    },
+    start: function() {
+        this.count = 0;
+        this.$element = $(this.selector);
+        if (this.intervalTimer) {
+            clearInterval(this.intervalTimer);
+        }
+        this.getLeftTime();
+    }
+};

@@ -2,6 +2,28 @@
     $basicHeight: 90px;
     border-top: 1px solid $borderColor;
     border-bottom: 1px solid $borderColor;
+    position: relative;
+
+    .time {
+        width: 330px;
+        height: 42px;
+        margin-top: -$space;
+        font-size: $smallSize;
+        font-weight: normal;
+
+        .iconfont {
+            font-size: $smallSize;
+            margin-right: 5px;
+        }
+
+        .left-time {
+            display: inline-block;
+        }
+
+        .tip {
+            float: right;
+        }
+    }
 
     .basic {
         height: $basicHeight;

@@ -38,6 +38,10 @@
 
             &.content {
                 margin-right: 25px;
+
+                .iconfont {
+                    font-size: 16px;
+                }
             }
         }
     }
@@ -161,6 +165,18 @@
             margin-bottom: $space;
         }
 
+        .pay-operation {
+            .iconfont {
+                font-size: $normalSize;
+            }
+
+            .left-time {
+                display: inline-block;
+                height: $normalSize;
+                margin-left: 5px;
+            }
+        }
+
         .subtext {
             font-size: 12px;
             cursor: pointer;