Merge branch 'feature/my-order' into develop

@@ -9,12 +9,14 @@
 const mcHandler = require('../models/menu-crumb-handler');
 const orderModel = require('../models/order');
 
-// fakeuid = '10931021',
 /**
- * 订单
+ * 我的订单
  */
 const index = (req, res) => {
-    orderModel.getOrderData().then(result => {
+    const type = req.query.type;
+    const page = req.query.page;
+
+    orderModel.getOrderData(type, page).then(result => {
         res.render('index', {
             page: 'order',
             isMe: true,
@@ -27,6 +29,21 @@ const index = (req, res) => {
     });
 };
 
+const getOrderList = (req, res) => {
+    const type = req.query.type;
+    const page = req.query.page;
+
+    orderModel.getOrderData(type, page).then(result => {
+        res.render('order-table', {
+            layout: false,
+            page: 'order',
+            isMe: true,
+            orderList: result.order.orderList
+        });
+    });
+};
+
 module.exports = {
-    index
+    index: index,
+    getOrderList: getOrderList
 };

 const api = global.yoho.API;
 const camelCase = global.yoho.camelCase;
 
-const _getUserOrder = () => {
+const _getUserOrder = (type, page) => {
     return api.get('', {
         method: 'app.SpaceOrders.get',
         uid: '10931021',
-        type: 1,
-        page: 1,
+        type: type || 1,
+        page: page || 1,
         limit: 10
     }).then(result => {
         const orderList = result && result.data && result.data.order_list || [];
@@ -15,10 +15,7 @@ const _getUserOrder = () => {
     });
 };
 
-const getOrderData = () => {
-    return _getUserOrder().then(result => {
-        const fakeData = {
-            title: '我的订单',
+const navBar = {
     tabs: [
         {
             text: '全部订单',
@@ -33,13 +30,21 @@ const getOrderData = () => {
             text: '待发货',
             type: 'delivering'
         }
-            ],
+    ]
+};
+
+const getOrderData = (type, page) => {
+    return _getUserOrder(type, page).then(result => {
+        const fakeData = {
+            title: '我的订单',
             showSearch: true
         };
 
         const order = Object.assign(fakeData, {
-            orderList: result
-        });
+            orderList: result && result.length && result || false
+        }, navBar);
+
+        console.log(order.orderList);
 
         return {
             order: order

@@ -14,5 +14,6 @@ const order = require(`${cRoot}/order`);
 
 // 个人中心首页/订单
 router.get(['/', '/order'], order.index);
+router.get('/getOrderList', order.getOrderList);
 
 module.exports = router;

+{{> order/table-body}}

@@ -3,8 +3,6 @@
     {{> common/subtitle}}
     {{> order/nav}}
     {{> order/table-header}}
-    {{#if orderList}}
     {{> order/table-body}}
-    {{/if}}
 {{/order}}
 </div>

+<div class="table table-body">
+{{#if orderList}}
 {{#orderList}}
-<div class="table">
+    <div class="order">
         <ul class="header">
             <li class="content">下单时间：{{createTime}}</li>
             <li class="content">订单编号：{{orderCode}}</li>
@@ -23,7 +25,7 @@
                     </div>
                 </div>
                 <div class="price bold">
-                <p>{{goodsAmount}}</p>
+                    <p class="{{#if @last}}last{{/if}}">{{goodsAmount}}</p>
                 </div>
                 {{/orderGoods}}
             </div>
@@ -32,7 +34,7 @@
                 <p class="subtext">{{paymentTypeStr}}</p>
             </div>
             <div class="common-column special-border">
-            <p>{{statusStr}}</p>
+                <p class="bold">{{statusStr}}</p>
                 <p class="subtext">查看详情</p>
             </div>
             <div class="common-column special-border">
@@ -50,5 +52,9 @@
                 {{/if}}
             </div>
         </div>
-</div>
+    </div>
 {{/orderList}}
+{{^}}
+数据为空
+{{/if}}
+</div>

-<div class="table">
+<div class="table column-category">
     <ul class="table-header header">
         <li class="big-width">商品信息</li>
         <li class="normal-width">单价</li>

@@ -4,13 +4,65 @@
  * @date: 2016/07/04
  */
 
+var tableOperation = {
+    $header: $('.table.column-category'),
+    $body: $('.table.table-body'),
+    removeBody: function() {
+        this.$body = $('.table.table-body');
+        this.$body.remove();
+    },
+    appendBody: function(htmlStr) {
+        $(htmlStr).appendTo(this.$header);
+    }
+};
+
 require('./me');
 
+function getOrderList(type, page) {
+    tableOperation.removeBody();
+
+    $.ajax({
+        url: 'getOrderList',
+        data: {
+            type: type,
+            page: page
+        }
+    }).done(function(res) {
+        tableOperation.appendBody(res);
+    }).fail(function(err) {
+        console.log(err);
+    });
+}
+
+
+function getQueryString() {
+    var queryArr = location.search.substr(1).split('&');
+    var query = {};
+
+    queryArr.forEach(function(pair) {
+        var arr = pair.split('=');
+
+        query[arr[0]] = arr[1];
+
+    });
+
+    return query;
+}
+
 $('.tabs li').on('click', function() {
     var $this = $(this);
+    var typeMap = {
+        all: 1,
+        paying: 2,
+        delivering: 3
+    };
+    var type = typeMap[$this.data('type')];
+    var page = getQueryString().page;
 
     if (!$this.hasClass('active')) {
         $('.tabs li.active').removeClass('active');
         $this.addClass('active');
     }
+
+    getOrderList(type, page);
 });

@@ -7,6 +7,7 @@
     $bigWidth: 355px;
     $normalWidth: 138px;
     $goodImgWidth: 65px;
+    $goodImgHeight: 90px;
 
     $normalSize: 14px;
 
@@ -65,7 +66,7 @@
 
         img {
             width: $goodImgWidth;
-            height: 90px;
+            height: $goodImgHeight;
             display: inline-block;
             box-sizing: border-box;
             margin: $bigSpace $space;
@@ -119,9 +120,20 @@
         .price {
             width: calc($normalWidth - 4px);
             display: inline-block;
-            margin-top: $bigSpace;
             text-align: center;
             vertical-align: top;
+
+            p {
+                width: $normalWidth;
+                height: calc(2 * $bigSpace + $goodImgHeight + 4px);
+                float: right;
+                padding-top: $bigSpace;
+                border-bottom: 1px solid $borderColor;
+
+                &.last {
+                    border-bottom: none;
+                }
+            }
         }
     }