发送订单列表

 'use strict';
 
-exports.page = (req, res, next) => {
+const orderModel = require('../../home/models/order');
 
+exports.page = (req, res, next) => {
     res.locals.module = 'service';
     res.locals.page = 'chat';
     res.locals.pageStyle = 'service-chat';
@@ -9,3 +10,18 @@ exports.page = (req, res, next) => {
 
     res.render('chat/index');
 };
+
+exports.getOrders = (req, res, next) => {
+    orderModel.getOrders({
+        type: req.query.type || 1,
+        page: req.query.page || 1,
+        gender: req.query.gender || '1,3',
+        yh_channel: req.query.channel || 1,
+        uid: req.user.uid
+    }).then(result => {
+        res.render('chat/chat-order', {
+            layout: false,
+            orders: result
+        });
+    }).catch(next);
+};

@@ -15,6 +15,7 @@ const chatQa = require(`${cRoot}/chatQa`); // 问题搜索列表页
 
 // Your controller here
 router.get('/im/', chat.page);
+router.get('/getOrders', chat.getOrders);
 
 router.get('/chatQaList', chatQa.qaList); // 问题搜索列表页
 router.get('/qaSearch', chatQa.qaSearch); // 问题搜索页

+{{#each orders}}
+<div class="order-page">
+    <div class="order" data-id="{{orderNum}}" data-href="{{detailUrl}}">
+        <header class="header">
+            订单编号：{{orderNum}}
+            <span class="order-status">{{orderStatus}}</span>
+        </header>
+        <section class="order-goods">
+            {{# goods}}
+                {{> order/good}}
+            {{/ goods}}
+        </section>
+        <footer class="footer">
+            共{{count}}件商品  实付<span class="sum-cost">¥{{sumCost}}</span>
+            {{#shippingCost}}(含运费¥{{.}}){{/shippingCost}}
+        </footer>
+        <div class="send-order clearfix">
+            <button class="send-order-btn">发送订单</button>
+        </div>
+    </div>
+</div>
+{{/each}}
\ No newline at end of file

@@ -33,20 +33,22 @@
 
     <div class="menu">
         <div class="icon-wrap camera">
+            <input type="file" style="position: absolute;right: -3px;top: -3px;z-index: 999;" accept="image/*">
             <div class="icon"></div>
-            <p class="name">拍照</p>
+            <p class="menu-name">拍照</p>
         </div>
         <div class="icon-wrap photo">
+            <input type="file" style="position: absolute;right: -3px;top: -3px;z-index: 999;" accept="image/*">
             <div class="icon"></div>
-            <p class="name">相册</p>
+            <p class="menu-name">相册</p>
         </div>
         <div class="icon-wrap order">
             <div class="icon"></div>
-            <p class="name">订单</p>
+            <p class="menu-name">订单</p>
         </div>
         <div class="icon-wrap broad-order">
             <div class="icon"></div>
-            <p class="name">境外订单</p>
+            <p class="menu-name">境外订单</p>
         </div>
     </div>
 </footer>

 <div id="order-list-wrap">
-<!--im 头部-->
-<header id="chat-header" class="yoho-header">
-    <a href="{{#if backUrl}}{{backUrl}}{{^}}javascript:history.go(-1);{{/if}}" class="iconfont nav-back">&#xe610;</a>
-    <div class="header-status">
-        <span class="service-name">订单列表</span>
+    <!--im 头部-->
+    <header id="chat-header" class="yoho-header">
+        <a href="#" class="iconfont nav-back order-back">&#xe610;</a>
+        <div class="header-status">
+            <span class="service-name">订单列表</span>
+        </div>
+    </header>
+
+    <div id="order-container" class="order-container">
+        <div class="orders"></div>
     </div>
-</header>
 
 </div>
\ No newline at end of file

@@ -8,7 +8,7 @@
 import {time} from './time';
 import {tip} from './tip';
 import {ChatRole, Customer, Employee, Robot} from './role';
-import {RatingView, LeaveMSGView} from './view';
+import {RatingView, LeaveMSGView, OrderListView} from './view';
 
 const chatBox = $('#chat-window');
 
@@ -73,6 +73,8 @@ let leaveMsg = new LeaveMSGView();
 
 leaveMsg.init();
 
+// 订单
+let orderList = new OrderListView();
 
 // 图片放大
 $('#chat-window').on('click', '.chat-image', function() {
@@ -88,13 +90,6 @@ $('#chat-window').on('click', '.chat-image', function() {
 });
 
 
-// 订单
-$('body').on('touchstart', '.menu .order', function() {
-    $('#chat-main-wrap').hide();
-    $('#order-list-wrap').show();
-});
-
-
 
 
 

+const loading = require('../../plugin/loading'),
+    lazyLoad = require('yoho-jquery-lazyload');
+
+require('../../common');
+
 /*
     留言view
 */
@@ -79,7 +84,85 @@ class RatingView {
 /*
     订单列表view
 */
-class OrderListView {}
+class OrderListView {
+    constructor() {
+        this.bindEvent();
+        this.order = {
+            page: 0,
+            end: false
+        };
+        this.$curContainer = $('#order-container').children('.orders:not(.hide)');
+        this.getOrder(this);
+    }
+
+    bindEvent() {
+        // 订单
+        $('body').on('touchstart', '.menu .order', function() {
+            $('#chat-main-wrap').hide();
+            $('#order-list-wrap').show();
+
+            $('.order-back').on('click', function() {
+                $('#order-list-wrap').hide();
+                $('#chat-main-wrap').show();
+            });
+        });
+    }
+
+    getOrder(self, cb, option) {
+        var opt = {
+            type: 1,
+            page: self.order.page + 1
+        };
+
+        var show = option && !option.noLoadingMask;
+
+        if (this.inAjax) {
+            return;
+        }
+
+        this.inAjax = true;
+        show && loading.showLoadingMask();
+
+        $.ajax({
+            type: 'GET',
+            url: '/service/getOrders',
+            data: opt,
+            success: function(data) {
+                var num;
+
+                if (data) {
+                    self.order.page = opt.page;
+
+                    if (opt.page === 1) {
+                        self.$curContainer.html(data);
+                        lazyLoad(self.$curContainer.find('.lazy'), {
+                            try_again_css: 'order-failure'
+                        });
+                    } else {
+                        num = self.$curContainer.children('.order').length;
+                        self.$curContainer.append(data);
+
+                        // lazyload
+                        lazyLoad(self.$curContainer.children('.order:gt(' + (num - 1) + ')').find('.lazy'), {
+                            try_again_css: 'order-failure'
+                        });
+                    }
+
+                    window.rePosFooter(); // 重新计算底部位置
+                } else {
+                    if (opt.page > 1) {
+                        return;
+                    }
+                    self.$curContainer.html('<div class="no-order"><div class="icon"></div><span>你还没有订单!</span><a class="walk-way" href="//m.yohobuy.com/product/new">随便逛逛</a></div>');
+                    self.order.end = true;
+                }
+
+                this.inAjax = false;
+                show && loading.hideLoadingMask();
+            }
+        });
+    }
+}
 
 
 
@@ -87,4 +170,4 @@ class ChatView {
 
 }
 
-export {RatingView, LeaveMSGView};
+export {RatingView, LeaveMSGView, OrderListView};

@@ -5,6 +5,7 @@
     }
 
     .icon-wrap {
+        position: relative;
         display: inline-block;
         margin-left: 50px;
 
@@ -25,7 +26,7 @@
         background-repeat: no-repeat;
     }
 
-    .name {
+    .menu-name {
         width: 120px;
         text-align: center;
         color: #b0b0b0;
@@ -48,4 +49,12 @@
     .broad-order .icon {
         background-image: resolve("service/chat/broad-order.png");
     }
+
+    .camera input,
+    .photo input {
+        display: block;
+        height: 120px;
+        width: 120px;
+        opacity: 0;
+    }
 }

 #order-list-wrap {
     display: none;
+    background: #f0f0f0;
+}
+
+.order-page {
+    .send-order {
+        border-top: 1px solid #e0e0e0;
+        padding: 30px;
+    }
+
+    .send-order-btn {
+        display: inline-block;
+        float: right;
+        height: 60px;
+        width: 145px;
+        line-height: 60px;
+        text-align: center;
+        font-size: 28px;
+        color: #fff;
+        background: #d0021b;
+        border-radius: 5PX;
+    }
 }