Merge branch 'feature/my-order' into develop

@@ -9,12 +9,14 @@
 const mcHandler = require('../models/menu-crumb-handler');
 const mcHandler = require('../models/menu-crumb-handler');
 const orderModel = require('../models/order');
 const orderModel = require('../models/order');
 
 
-// fakeuid = '10931021',
 /**
 /**
- * 订单
+ * 我的订单
  */
  */
 const index = (req, res) => {
 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', {
         res.render('index', {
             page: 'order',
             page: 'order',
             isMe: true,
             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 = {
 module.exports = {
-    index
+    index: index,
+    getOrderList: getOrderList
 };
 };

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

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

+{{> order/table-body}}

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

+<div class="table table-body">
+{{#if orderList}}
 {{#orderList}}
 {{#orderList}}
-<div class="table">
-    <ul class="header">
-        <li class="content">下单时间：{{createTime}}</li>
-        <li class="content">订单编号：{{orderCode}}</li>
-        {{#if showMobile}}
-        <li class="content">手机订单</li>
-        {{/if}}
-    </ul>
-    <div class="table-body">
-        <div class="goods-container special-border">
-            {{#orderGoods}}
-            <div class="good-info {{#if @last}}last{{/if}}">
-                <img src="{{image goodsImage 65 90}}">
-                <div class="detail">
-                    <p class="with-bottom-space">{{productName}}</p>
-                    <span class="with-space">颜色：{{colorName}}</span>
-                    <span>尺码：
-                        <span class="bold">{{sizeName}}</span>
-                    </span>
-                    <p class="bold">{{> icon/error-round}}{{buyNumber}}</p>
+    <div class="order">
+        <ul class="header">
+            <li class="content">下单时间：{{createTime}}</li>
+            <li class="content">订单编号：{{orderCode}}</li>
+            {{#if showMobile}}
+            <li class="content">手机订单</li>
+            {{/if}}
+        </ul>
+        <div class="table-body">
+            <div class="goods-container special-border">
+                {{#orderGoods}}
+                <div class="good-info {{#if @last}}last{{/if}}">
+                    <img src="{{image goodsImage 65 90}}">
+                    <div class="detail">
+                        <p class="with-bottom-space">{{productName}}</p>
+                        <span class="with-space">颜色：{{colorName}}</span>
+                        <span>尺码：
+                            <span class="bold">{{sizeName}}</span>
+                        </span>
+                        <p class="bold">{{> icon/error-round}}{{buyNumber}}</p>
 
 
+                    </div>
+                </div>
+                <div class="price bold">
+                    <p class="{{#if @last}}last{{/if}}">{{goodsAmount}}</p>
                 </div>
                 </div>
+                {{/orderGoods}}
             </div>
             </div>
-            <div class="price bold">
-                <p>{{goodsAmount}}</p>
+            <div class="common-column special-border">
+                <p class="bold">{{amount}}</p>
+                <p class="subtext">{{paymentTypeStr}}</p>
+            </div>
+            <div class="common-column special-border">
+                <p class="bold">{{statusStr}}</p>
+                <p class="subtext">查看详情</p>
+            </div>
+            <div class="common-column special-border">
+                {{#if payLeftTime}}
+                <p class="left-time">剩余{{payLeftTime}}</p>
+                {{/if}}
+                {{#if showPayButton}}
+                <button>立即付款</button>
+                {{/if}}
+                {{#if showEditOption}}
+                <p class="subtext">修改订单</p>
+                <p class="subtext no-space">删除订单</p>
+                {{^}}
+                <p class="subtext">查看详情</p>
+                {{/if}}
             </div>
             </div>
-            {{/orderGoods}}
-        </div>
-        <div class="common-column special-border">
-            <p class="bold">{{amount}}</p>
-            <p class="subtext">{{paymentTypeStr}}</p>
-        </div>
-        <div class="common-column special-border">
-            <p>{{statusStr}}</p>
-            <p class="subtext">查看详情</p>
-        </div>
-        <div class="common-column special-border">
-            {{#if payLeftTime}}
-            <p class="left-time">剩余{{payLeftTime}}</p>
-            {{/if}}
-            {{#if showPayButton}}
-            <button>立即付款</button>
-            {{/if}}
-            {{#if showEditOption}}
-            <p class="subtext">修改订单</p>
-            <p class="subtext no-space">删除订单</p>
-            {{^}}
-            <p class="subtext">查看详情</p>
-            {{/if}}
         </div>
         </div>
     </div>
     </div>
-</div>
 {{/orderList}}
 {{/orderList}}
+{{^}}
+数据为空
+{{/if}}
+</div>

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

@@ -4,13 +4,65 @@
  * @date: 2016/07/04
  * @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');
 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() {
 $('.tabs li').on('click', function() {
     var $this = $(this);
     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')) {
     if (!$this.hasClass('active')) {
         $('.tabs li.active').removeClass('active');
         $('.tabs li.active').removeClass('active');
         $this.addClass('active');
         $this.addClass('active');
     }
     }
+
+    getOrderList(type, page);
 });
 });

@@ -7,6 +7,7 @@
     $bigWidth: 355px;
     $bigWidth: 355px;
     $normalWidth: 138px;
     $normalWidth: 138px;
     $goodImgWidth: 65px;
     $goodImgWidth: 65px;
+    $goodImgHeight: 90px;
 
 
     $normalSize: 14px;
     $normalSize: 14px;
 
 
@@ -65,7 +66,7 @@
 
 
         img {
         img {
             width: $goodImgWidth;
             width: $goodImgWidth;
-            height: 90px;
+            height: $goodImgHeight;
             display: inline-block;
             display: inline-block;
             box-sizing: border-box;
             box-sizing: border-box;
             margin: $bigSpace $space;
             margin: $bigSpace $space;
@@ -119,9 +120,20 @@
         .price {
         .price {
             width: calc($normalWidth - 4px);
             width: calc($normalWidth - 4px);
             display: inline-block;
             display: inline-block;
-            margin-top: $bigSpace;
             text-align: center;
             text-align: center;
             vertical-align: top;
             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;
+                }
+            }
         }
         }
     }
     }