zhengjinyi 4 lat temu
rodzic
commit
6ae9beb1d4

+ 1 - 0
src/main/resources/static/css/user-center/order/orderlist.css

@@ -36,6 +36,7 @@ li{list-style:none}
     .order-header .header-bt .search-time{float: left;margin-left: 15px;}
     .order-header .header-bt .search-time .label{display: inline-block;float: left;width: 60px;height: 38px;line-height:38px;font-size: 12px;color: #627386;}
     .order-header .header-bt .search-time .search-main{float: left;height: 38px;}
+    .order-header .header-bt .search-time .search-main span{line-height:38px;font-size: 12px;color: #627386;}
     .order-header .header-bt .search-time .search-main .search-input{width:114px;box-sizing: border-box;padding: 0 10px;font-size: 12px;line-height: 36px;border: 1px solid #b8bfca;border-radius: 2px; }
     .order-header .header-bt .header-button{height: 38px;float: right;}
     .order-header .header-bt .header-button .btn-server{width: 90px;height: 36px;display: block;background-color: #e15616;border-radius: 2px;border: solid 1px #e15616;font-size: 14px;color: #FFFFFF;line-height: 36px;text-align: center;}

+ 7 - 0
src/main/resources/static/js/common/serviceapi/order.service.js

@@ -60,6 +60,13 @@ var OrderApi = {
                 callback(res);
             });
         },
+        /* 查询订单列表 */
+        GetQueryOrderListData: function (params, callback) {
+            Http.AjaxService({ url:'/order/list', type:'GET', data:params, json:false})
+            .then(function(res){
+                callback(res);
+            });
+        },
         /* 订单支付,效验付款规则 orderId 订单ID */
         OrderPaymentValidation: function (params, callback) {
             Http.AjaxService({ url:'/order/paymentValidation', type:'GET', data:params, json:false})

+ 61 - 26
src/main/resources/static/js/user-center/order/list.js

@@ -2,10 +2,8 @@ jqMultipleShow("click", ".navList", ".tab", ".con");
 var helpSuggestion = new Vue({
     el: "#dashboard",
     data: {
-        btnLoading: false,
-        isRequset:false,
+        isRequset:true,
         userId: 0,
-        degree:'',
         orderTabBarIndex:0,
         orderTabBar: [
             {state: 0,text: '全部订单',bages:2},
@@ -15,33 +13,66 @@ var helpSuggestion = new Vue({
             {state: 4,text: '已发货',bages:30},
             {state: 5,text: '退货/款',bages:20}
         ],
-        formData:new FormData(),
-        unReadMessageCount:'',//消息数
-        confirmedCount:'',//待確認數量
-        paymentCount:'',//待付款
-        waitShipmentsCount:'',//待发货
-        shipmentsCount:'',//已发货
-        salesReturnCount:'',//退货款
-        productList:[],//推荐商品
-        newsList:[],//新闻动态
+        listQuery:{
+            searchWord:'',
+            orderState:0,
+            userId:0,
+            pageNum:1,
+            pageSize:10
+        },
+        listRecord: 0,
+        pageInput: '1',
+        orderList:[],
+    },
+    filters: {
+        NumFormat:function(text) {
+            return Number(text).toFixed(2);
+        }
+    },
+    computed: {
+        pageTotal: function () {
+            var total = Math.ceil(this.listRecord / this.listQuery.pageSize);
+            return total > 0 ? total : 1;
+        },
+        showPageBtn: function () {
+            var total = Math.ceil(this.listRecord / this.listQuery.pageSize);
+            total = total > 0 ? total : 1;
+            var index = this.listQuery.pageNum, arr = [];
+            if (total <= 6) {
+                for (var i = 1; i <= total; i++) {
+                    arr.push(i);
+                }
+                return arr;
+            }
+            if (index <= 3) return [1, 2, 3, 4, 5, 0, total];
+            if (index >= total - 2) return [1, 0, total - 4, total - 3, total - 2, total - 1, total];
+            return [1, 0, index - 2, index - 1, index, index + 1, index + 2, 0, total];
+        }
     },
     methods: {
-        GetMyPcCenterInfo:function(){
+        toPagination: function (pageNum) {
+            if (pageNum <= this.pageTotal) {
+                var params = {pageNum: pageNum};
+                window.location.href = updateUrlParam(params);
+            }
+        },
+        checkNum: function () {
+            if (this.pageInput > this.pageTotal) {
+                this.pageInput = this.pageTotal;
+            } else if (this.pageInput < 1) {
+                this.pageInput = 1;
+            }
+        },
+        GetQueryOrderListData:function(){
             var _self = this;
-            UserApi.GetMyPcCenterInfo({userId:_self.userId},function (response) {
+            OrderApi.GetQueryOrderListData(_self.listQuery,function (response) {
                 if(response.code == 0){
                     var data = response.data;
-                    _self.userInfo = data.user;
-                    _self.degree = data.degree;
-                    _self.unReadMessageCount = _self.showBadge(data.unReadMessageCount);
-                    _self.confirmedCount = _self.showBadge(data.confirmedCount);
-                    _self.paymentCount = _self.showBadge(data.paymentCount);
-                    _self.waitShipmentsCount = _self.showBadge(data.waitShipmentsCount);
-                    _self.shipmentsCount = _self.showBadge(data.shipmentsCount);
-                    _self.salesReturnCount = _self.showBadge(data.salesReturnCount);
-                    _self.productList = data.homePageAdvertiseList;
-                    _self.newsList = data.homePageInfoList;
-                    _self.isRequset = true;
+                    if(data.results && data.results.length>0) {
+                        _self.orderList = data.results;
+                        _self.listRecord = data.totalRecord;
+                    }
+                    _self.isRequset = false;
                 }else{
                     CAIMEI.Alert(response.msg, '确定', false);
                 }
@@ -77,9 +108,13 @@ var helpSuggestion = new Vue({
     mounted: function () {
         if(globalUserData){
             this.userId = globalUserData.userId;
-            // this.GetMyPcCenterInfo();
+            this.listQuery.orderState = CAIMEI.getUrlParam('state');
+            this.listQuery.userId = this.userId;
+            this.GetQueryOrderListData();
         }
+        console.log(this.listQuery.orderState)
         $('.navLayout').find('.navList').removeClass("on").find('.con').hide().find('a').removeClass("on");
         $('.navLayout').find('.navList').eq(0).addClass("on").find('.con').show().find('a').eq(0).addClass("on");
+
     }
 });

+ 27 - 3
src/main/resources/templates/user-center/order/list.html

@@ -36,7 +36,7 @@
                         <div class="header-search">
                             <div class="search">
                                 <span class="label">订单编号:</span>
-                                <input type="text" placeholder="输入订单编号进行搜索" class="search-input">
+                                <input type="text" v-model="listQuery.searchWord" placeholder="输入订单编号进行搜索" class="search-input">
                             </div>
                             <div class="search-time">
                                 <span class="label">下单时间:</span>
@@ -52,8 +52,13 @@
                         </div>
                     </div>
                 </div>
-                <div class="order-container clear">
-                    <div class="section">
+                <!--loading-->
+                <div v-if="isRequset" class="loading">
+                    <img src="/img/base/loading.gif">
+                </div>
+                <div class="order-container clear" v-else>
+                    <!--数据为空-->
+                    <div class="section" v-if="orderList.length == 0">
                         <div class="user-main order">
                             <div class="order-title">
                                 <span class="bag">自主</span>
@@ -94,6 +99,25 @@
                             </div>
                         </div>
                     </div>
+                    <div v-else class="empty">
+                        <img src="/img/common/empty.png">
+                        <div class="msg"><p>暂无数据</p></div>
+                    </div>
+                </div>
+                <!--分页-->
+                <div v-if="(!isPC) && noMore" class="noMore">---- 没有更多了 ----</div>
+                <div v-if="isPC && pageTotal>1" class="pageWrap clear">
+                    <a v-if="listQuery.pageNum>1" class="prev" @click="toPagination(listQuery.pageNum*1-1)" href="javascript:void(0);"></a>
+                    <template v-for="n in showPageBtn">
+                        <a v-if="n" :class="{'on':(n==listQuery.pageNum)}" @click="toPagination(n)" href="javascript:void(0);" v-text="n"></a>
+                        <span v-else>···</span>
+                    </template>
+                    <a v-if="listQuery.pageNum<pageTotal" class="next" @click="toPagination(listQuery.pageNum*1+1)" href="javascript:void(0);"></a>
+                    <span>共<b v-text="pageTotal>1?pageTotal:1"></b>页</span>
+                    <span>跳至</span>
+                    <input v-model="pageInput" @blur="checkNum()"/>
+                    <span>页</span>&nbsp;
+                    <a class="btn" href="javascript:void(0);" @click="toPagination(pageInput)">点击跳转</a>
                 </div>
             </div>
         </div>