orderList_body.html 4.3 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156
  1. <!DOCTYPE html>
  2. <html class="">
  3. <!--STATUS OK-->
  4. <head>
  5. <meta name="referrer" content="always" />
  6. <meta charset='utf-8' />
  7. <meta name="viewport" content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no" />
  8. <meta http-equiv="x-dns-prefetch-control" content="on">
  9. <meta name="description" content="">
  10. <meta name="format-detection" content="telephone=no" />
  11. <link rel="stylesheet" type="text/css" href="css/vant-ui.css" />
  12. <link rel="stylesheet" type="text/css" href="css/iconfont.css">
  13. <link rel="stylesheet" type="text/css" href="css/main.css" />
  14. <script src="js/vue.js"></script>
  15. <script src="js/vant-ui.js"></script>
  16. <script src="js/main.js"></script>
  17. <link rel="stylesheet" href="./mescroll/mescroll.min.css">
  18. <script type="text/javascript" src="./mescroll/mescroll.min.js"></script>
  19. <title></title>
  20. </head>
  21. <style>
  22. .dingdangenzong .dingdanSearch {
  23. top: 0.5rem
  24. }
  25. .dingdangenzong {
  26. padding-top: 0rem;
  27. }
  28. .dingdangenzong .dingdangenzongContainer .item {
  29. padding-bottom: 0.2rem;
  30. height: auto;
  31. }
  32. .mescroll{
  33. position: relative;
  34. }
  35. </style>
  36. <body>
  37. <div id="app" v-cloak>
  38. <div class="pageView dingdangenzong">
  39. <!-- <div class="dingdanSearch flex a-center j-center">
  40. <div class="search_box flex a-center">
  41. <input type="text" placeholder="请输入详细地址">
  42. <div class="fgx"></div>
  43. <div class="search_btn flex a-center">
  44. 订单状态 <i class="iconfont icon-xia"></i>
  45. </div>
  46. <van-icon name="search" size="0.32rem" />
  47. </div>
  48. </div> -->
  49. <div class="dingdangenzongContainer mescroll-touch-y mescroll" id="mescroll" v-show="list.length > 0">
  50. <div class="item" v-for="(item,index) in list" v-on:click="lookOrderInfo(index)">
  51. <div class="title flex a-center jlr">
  52. <div class="flex a-center">
  53. 订单号:{{ item.orderNum }} <b></b>
  54. </div>
  55. <h2>{{ item.agentAuditStatusName }}</h2>
  56. </div>
  57. <div class="cont">
  58. <p>
  59. 订单类型:{{ item.orderTypeName }}
  60. </p>
  61. <p>
  62. 创建时间:{{ item.createTime }}
  63. </p>
  64. </div>
  65. <!-- <div class="foot flex">
  66. <div class="btn flex a-center j-center" v-on:click="lookOrderInfo(index)">
  67. 订单详情
  68. </div>
  69. <div class="btn flex a-center j-center on" v-on:click="lookOrderLogistics(index)">
  70. 物流信息
  71. </div>
  72. </div> -->
  73. </div>
  74. </div>
  75. <div v-show="list.length == 0" style="text-align:center">
  76. <img src="./image/noData.png" style="margin:2rem auto" />
  77. </div>
  78. </div>
  79. </div>
  80. </body>
  81. <script type="text/javascript" src="../script/api.js"></script>
  82. <script type="text/javascript" src="../script/httpRequest.js"></script>
  83. <script type="text/javascript" src="../script/vue_plugins.js"></script>
  84. <script type="text/javascript">
  85. apiready = function() {
  86. new Vue({
  87. el: '#app',
  88. data: {
  89. list: [],
  90. getOrdersU: 'getOrderListU',
  91. current: 1,
  92. size: 10,
  93. totalPages : 1,
  94. },
  95. methods: {
  96. init: function() {
  97. var _this = this;
  98. this.userId = $api.getStorage('userid');
  99. this.getOrderList();
  100. this.configDownAndPull("mescroll",function(mescroll){
  101. _this.current = 1;
  102. _this.getOrderList(mescroll);
  103. },function(mescroll){
  104. if(_this.current < _this.totalPages){
  105. _this.current = _this.current + 1;
  106. _this.getOrderList(mescroll,1);
  107. }else{
  108. mescroll.endSuccess(_this.size,false);
  109. }
  110. })
  111. },
  112. // 查询门店订单
  113. getOrderList: function(mescroll) {
  114. var data = {
  115. "retailerId": this.userId,
  116. "size": this.size,
  117. "current": this.current,
  118. "url": "json",
  119. "type": "body",
  120. },
  121. _this = this,
  122. url = this.getOrdersU;
  123. this.$post(url, data, function(ret) {
  124. if (ret.code == 0 || ret.code == '0') {
  125. _this.totalPages = ret.data.pages;
  126. _this.list = _this.current == 1 ? ret.data.records : _this.list.concat(ret.data.records);
  127. if(mescroll){
  128. mescroll.endSuccess(_this.size,true);
  129. }
  130. }
  131. })
  132. },
  133. // 查看订单详情
  134. lookOrderInfo: function(index) {
  135. var id = this.list[index].id;
  136. this.goWin('orderInfo_win', 'orderInfo_win.html', {
  137. id: id
  138. });
  139. },
  140. // 查看订单物流信息
  141. lookOrderLogistics: function(index) {
  142. }
  143. },
  144. mounted: function() {
  145. this.init();
  146. }
  147. })
  148. }
  149. </script>
  150. </html>