myorderdetail.html 5.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
  6. <meta name="apple-mobile-web-app-capable" content="yes">
  7. <meta name="apple-mobile-web-app-status-bar-style" content="black">
  8. <title>我的订单明细</title>
  9. <link href="../../../css/mui.min.css" rel="stylesheet" />
  10. <link href="../../../css/OA-style.css" rel="stylesheet" />
  11. </head>
  12. <body>
  13. <header class="mui-bar mui-bar-nav" id="login">
  14. <a href="" class="mui-action-back back mui-pull-left"><img src="../../../images/back.png"></a>
  15. <h1 class="mui-title" id="title">我的订单明细</h1>
  16. </header>
  17. <div class="mui-content" >
  18. <div id="pullrefresh" class="mui-content mui-scroll-wrapper" style="margin-top: 50px;">
  19. <div v-for="item in items">
  20. <div class="mui-card">
  21. <ul class="mui-table-view" v-if="item.orderfood==1">
  22. <div style="border-bottom: solid gainsboro;">
  23. <li class="mui-table-view-cell mui-collapse mui-active">
  24. <a class="mui-navigate-right" href="#"><b>类型:早餐</b><span style="float: right;margin-right: 20px;">{{item.foodnum}}份</span></a>
  25. <div class="mui-collapse-content">
  26. <p>具体菜品:{{item.foodname}}</p>
  27. <p>每份价格:{{item.foodmoney}}元</p>
  28. <p>下单日期:{{item.date}}</p>
  29. </div>
  30. </li>
  31. </div>
  32. </ul>
  33. <ul class="mui-table-view" v-else-if="item.orderfood==2">
  34. <div style="border-bottom: solid gainsboro;">
  35. <li class="mui-table-view-cell mui-collapse mui-active">
  36. <a class="mui-navigate-right" href="#"><b>类型:午餐</b><span style="float: right;margin-right: 20px;">{{item.foodnum}}份</span></a>
  37. <div class="mui-collapse-content">
  38. <p>具体菜品:{{item.foodname}}</p>
  39. <p>每份价格:{{item.foodmoney}}元</p>
  40. <p>下单日期:{{item.date}}</p>
  41. </div>
  42. </li>
  43. </div>
  44. </ul>
  45. <ul class="mui-table-view" v-else-if="item.orderfood==3">
  46. <div style="border-bottom: solid gainsboro;">
  47. <li class="mui-table-view-cell mui-collapse mui-active">
  48. <a class="mui-navigate-right" href="#"><b>类型:晚餐</b><span style="float: right;margin-right: 20px;">{{item.foodnum}}份</span></a>
  49. <div class="mui-collapse-content">
  50. <p>具体菜品:{{item.foodname}}</p>
  51. <p>每份价格:{{item.foodmoney}}元</p>
  52. <p>下单日期:{{item.date}}</p>
  53. </div>
  54. </li>
  55. </div>
  56. </ul>
  57. <ul class="mui-table-view" v-else>
  58. <div style="border-bottom: solid gainsboro;">
  59. <li class="mui-table-view-cell mui-collapse mui-active">
  60. <a class="mui-navigate-right" href="#"><b>类型:{{item.foodname}}</b><span style="float: right;margin-right: 20px;">{{item.foodnum}}份</span></a>
  61. <div class="mui-collapse-content">
  62. <p>具体菜品:{{item.foodname}}</p>
  63. <p>每份价格:{{item.foodmoney}}元</p>
  64. <p>下单日期:{{item.date}}</p>
  65. </div>
  66. </li>
  67. </div>
  68. </ul>
  69. </div>
  70. </div>
  71. </div>
  72. <script type="text/javascript" src="../../../js/jquery-1.11.2.min.js"></script>
  73. <script src="../../../js/mui.min.js"></script>
  74. <script src="../../../js/config.js"></script>
  75. <script src="../../../js/app.js"></script>
  76. <script src="../../../js/dj/article/list.js"></script>
  77. <script src="../../../js/vue.min.js"></script>
  78. <script>
  79. mui.init();
  80. var orderid="";
  81. var vmA = new Vue({
  82. el: '#pullrefresh',
  83. data: {
  84. items: [] //列表信息流数据
  85. }
  86. });
  87. mui.plusReady(function() {
  88. var self = plus.webview.currentWebview();
  89. orderid = self.orderid;
  90. addData(orderid)
  91. });
  92. function addData(orderid) {
  93. var url = API.API_URL();
  94. var serviceId = "oa_2018V001PHONE_orderDetailxq";
  95. var state = app.getState(); //获取登陆信息
  96. var universalid=state.user.useId;
  97. /*var staffId = state.user.useId;
  98. var unitId = state.user.unitId;
  99. var notice_title = "";*/
  100. var obj = {
  101. /*unitId: unitId,
  102. userId: staffId,
  103. notice_title: notice_title,*/
  104. universalid:universalid,
  105. orderid: orderid
  106. };
  107. app.ajax(serviceId,obj, function(data) {
  108. //服务器返回响应
  109. console.log(JSON.stringify(data))
  110. var result = data.returnParams;
  111. var list = data.list;
  112. console.log(list.length);
  113. if(list.length > 0) {
  114. vmA.items = vmA.items.concat(list);
  115. }
  116. });
  117. }
  118. /**
  119. * 1、将服务端返回数据,转换成前端需要的格式
  120. * 2、若服务端返回格式和前端所需格式相同,则不需要改功能
  121. *
  122. * @param {Array} items
  123. */
  124. // function convert(items) {
  125. // var newItems = [];
  126. // items.forEach(function(item) {
  127. // if(item.type==1){
  128. // type="获得补贴";
  129. // }
  130. // if(item.type==2){
  131. // type="消费";
  132. // }
  133. // if(item.type==3){
  134. // type="扣除补贴";
  135. // }
  136. // newItems.push({
  137. // universalid: item.universalid,
  138. // name: item.name,
  139. // //修改类型
  140. // type:type,
  141. // either: item.either == 1? "收入":"支出",//收入或支出
  142. // money: item.money,//金额
  143. // date: item.date,
  144. // allowance: item.allowance,
  145. // moneys: item.moneys,//普通余额
  146. // /*content: item.noticecontent == null ? "" : item.noticecontent.substr(0, 70),
  147. // name : item.name,
  148. // isread: item.if_read,*/
  149. //
  150. // });
  151. //
  152. // });
  153. // return newItems;
  154. // }
  155. </script>
  156. </body>
  157. </html>