backList_body.html 8.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="UTF-8">
  5. <meta name="viewport"
  6. content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
  7. <meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
  8. <title>订单内容</title>
  9. <link rel="stylesheet" type="text/css" href="./css/api.css" />
  10. <link rel="stylesheet" type="text/css" href="./css/style1.css" />
  11. <script type="text/javascript" src="./js/auto-size.js"></script>
  12. <style>
  13. ul {
  14. -webkit-margin-before: 1em;
  15. -webkit-margin-after: 1em;
  16. -webkit-margin-start: 0px;
  17. -webkit-margin-end: 0px;
  18. -webkit-padding-start: 0px;
  19. }
  20. p {
  21. display: block;
  22. -webkit-margin-before: 0em;
  23. -webkit-margin-after: 0em;
  24. -webkit-margin-start: 0px;
  25. -webkit-margin-end: 0px;
  26. }
  27. li {
  28. list-style-type: none;
  29. }
  30. .empty {
  31. width: 96%;
  32. height: auto;
  33. /*background: rgba(255, 255, 255, 1);*/
  34. box-shadow: 0px 6px 24px 0px rgba(0, 0, 0, 0.1);
  35. border-radius: 20px;
  36. margin: 0 auto;
  37. margin-top: .2rem;
  38. }
  39. .empty>div:nth-child(1) {
  40. width: 92%;
  41. margin: 0 auto;
  42. padding-top: .5rem;
  43. }
  44. .empty>div:nth-child(1)>div:nth-child(1) {
  45. width: .2rem;
  46. height: .8rem;
  47. background: rgba(246, 207, 25, 1);
  48. float: left;
  49. margin-left: -.41rem;
  50. }
  51. .empty>div:nth-child(1)>div:nth-child(2) {
  52. font-size: .42rem
  53. }
  54. .empty>div:nth-child(1)>div:nth-child(3) {
  55. float: right;
  56. width: 2.6rem;
  57. height: .8rem;
  58. background: rgba(246, 207, 25, 1);
  59. border-radius: 20px 0px 0px 20px;
  60. margin-top: -.7rem;
  61. margin-right: -.41rem;
  62. text-align: center;
  63. line-height: .8rem;
  64. ;
  65. color: #fff;
  66. }
  67. .empty>div:nth-child(2) {
  68. width: 92%;
  69. margin: 0 auto;
  70. padding-top: .2rem;
  71. border-top: .02rem solid #E7E8EA;
  72. margin-top: .6rem;
  73. }
  74. .empty>div:nth-child(2)>p {
  75. font-size: .48rem;
  76. margin-bottom: .2rem;
  77. }
  78. .empty>div:nth-child(2)>ul>li {
  79. font-size: .42rem;
  80. }
  81. .empty>div:nth-child(2)>ul>li:nth-child(1) {
  82. float: left;
  83. }
  84. .empty>div:nth-child(2)>ul>li:nth-child(2) {
  85. float: right;
  86. }
  87. .empty>div:nth-child(2)>ul>li:nth-child(3) {
  88. padding-top: 1rem;
  89. }
  90. .empty>div:nth-child(3) {
  91. width: 92%;
  92. margin: 0 auto;
  93. margin-top: .2rem;
  94. border-top: .02rem solid #E7E8EA;
  95. padding-top: .4rem;
  96. }
  97. .empty>div:nth-child(3) {
  98. display: flex;
  99. justify-content: space-between;
  100. padding-bottom: .2rem;
  101. }
  102. .empty>div:nth-child(3)>div:nth-child(1) {
  103. line-height: .9rem;
  104. color: #616266;
  105. }
  106. .empty>div:nth-child(3)>div:nth-child(2) {
  107. font-size: .56rem;
  108. color: #303133;
  109. }
  110. .auditBtn {
  111. display: flex;
  112. margin-bottom: .1rem;
  113. }
  114. .auditBtn div:nth-child(1) {
  115. background-color: #999;
  116. color: #FFFFFF;
  117. font-size: .4rem;
  118. padding: .2rem .3rem;
  119. border-radius: .2rem;
  120. }
  121. .auditBtn div:nth-child(2) {
  122. background-color: #0096df;
  123. color: #FFFFFF;
  124. font-size: .4rem;
  125. padding: .2rem .3rem;
  126. border-radius: .2rem;
  127. margin-left: .2rem;
  128. }
  129. [v-cloak] {
  130. display: none
  131. }
  132. </style>
  133. </head>
  134. <body>
  135. <div style="overflow-y : scroll" id="mescroll" v-cloak>
  136. <div class="empty pageView youhuijuan" v-for="(order,index) in list">
  137. <div>
  138. <div></div>
  139. <div>
  140. <samp>金额:{{ order.amount }}</samp>
  141. </div>
  142. <div>
  143. <span>{{ order.status | judgeStatus(order.status)}}</span><img src="" alt="">
  144. </div>
  145. </div>
  146. <div>
  147. <p>
  148. 门店名称:{{ order.storeName }}
  149. </p>
  150. <p>
  151. 核销码:{{ order.couponCode }}
  152. </p>
  153. <ul>
  154. <li>
  155. 创建时间:<span>{{ order.createTime }}</span>
  156. </li>
  157. </ul>
  158. </div>
  159. <div>
  160. <div>
  161. <p>
  162. B2B状态:<span v-if="'0'==order.status">未提交</span>
  163. <span v-if="'1'==order.status">未提交</span>
  164. <span v-if="'2'==order.status&&'0'==order.b2bStatus">待审核</span>
  165. <span v-if="'2'==order.status&&'1'==order.b2bStatus">审核不通过</span>
  166. <span v-if="'2'==order.status&&'2'==order.b2bStatus">审核通过</span>
  167. </p>
  168. </div>
  169. <div class="auditBtn" v-show="order.status == 0">
  170. <div v-on:click.stop="handleOrder(order.couponCode,1,index)">拒绝</div>
  171. <div v-on:click.stop="handleOrder(order.couponCode,2,index)">同意</div>
  172. </div>
  173. </div>
  174. </div>
  175. <div v-show="hasOther && list.length > 0"
  176. style="width: 100%;height: 1rem;;text-align : center;margin-top : 1rem">暂无更多数据</div>
  177. <div v-show="list.length == 0" style="text-align:center">
  178. <img src="./image/nodata.png" style="margin:2rem auto;width:100%;height:100%" />
  179. </div>
  180. </div>
  181. </body>
  182. <link rel="stylesheet" href="./mescroll/mescroll.min.css">
  183. <script type="text/javascript" src="../script/aui-scroll.js"></script>
  184. <script type="text/javascript" src="./mescroll/mescroll.min.js"></script>
  185. <script type="text/javascript" src="../script/vue.js"></script>
  186. <script type="text/javascript" src="../script/api.js"></script>
  187. <script type="text/javascript" src="../script/httpRequest.js"></script>
  188. <script type="text/javascript" src="../script/vue_plugins.js"></script>
  189. <script type="text/javascript">
  190. apiready = function () {
  191. new Vue({
  192. el: '#mescroll',
  193. data: {
  194. list: [],
  195. kunnr: '',
  196. current: 1,
  197. size: 10, // 订单状态 0,新创建,1已接单,2,驳回,3完成 经销商审核 0 待审核 1 同意 2 拒绝
  198. frist: 1,
  199. mescroll: '',
  200. hasOther: true,
  201. onClick: true
  202. },
  203. filters: {
  204. judgeStatus: function (auditStatus, status) {
  205. return ["待审核", "审核未通过", "审核通过"][status];
  206. }
  207. },
  208. mounted: function () {
  209. this.init();
  210. },
  211. methods: {
  212. init: function () {
  213. var _this = this;
  214. this.kunnr = $api.getStorage('kunnr');
  215. this.getOrderList();
  216. this.configHeadMotive(function () {
  217. _this.current = _this.current;
  218. _this.hasOther = true;
  219. _this.getOrderList();
  220. })
  221. },
  222. configs: function () {
  223. var _this = this;
  224. this.frist = 2;
  225. // this.configDownAndPull("mescroll", function(mescroll) {
  226. // _this.mescroll = mescroll;
  227. // _this.current = 1;
  228. // _this.getOrderList(mescroll);
  229. // }, function(mescroll) {
  230. // if (_this.current < _this.totalPages) {
  231. // _this.current = _this.current + 1;
  232. // _this.getOrderList(mescroll, 1);
  233. // } else {
  234. // mescroll.endSuccess(_this.size, false);
  235. // }
  236. // },false);
  237. this.configBottomRefush(function () {
  238. if (_this.current < _this.totalPages) {
  239. _this.current = _this.current + 1;
  240. _this.getOrderList(_this.mescroll, 1);
  241. } else {
  242. _this.hasOther = true;
  243. // _this.mescroll.endSuccess(_this.size, false);
  244. }
  245. })
  246. },
  247. getOrderList: function (mescroll) {
  248. var params = {
  249. kunnr: this.kunnr,
  250. size: this.size,
  251. current: this.current,
  252. url: 'json',
  253. type: 'body'
  254. },
  255. _this = this;
  256. this.$post('getCheckListU', params, function (ret) {
  257. if (ret.code == 0 || ret.code == '0') {
  258. _this.list = _this.current == 1 ? ret.data.records : _this.list.concat(ret.data.records);
  259. _this.totalPages = ret.data.pages;
  260. if (mescroll) {
  261. mescroll.endSuccess(_this.size, true);
  262. }
  263. if (_this.frist == 1) {
  264. _this.configs();
  265. }
  266. }
  267. });
  268. },
  269. // 处理订单操作handerOrderUrl
  270. handleOrder: function (code, status, index) {
  271. if (this.onClick) {
  272. this.onClick = false;
  273. var data = {
  274. couponCode: code,
  275. status: status,
  276. kunnr: this.kunnr,
  277. url: 'json',
  278. type: 'body'
  279. },
  280. _this = this,
  281. url = "checkConponU";
  282. this.$post(url, data, function (res) {
  283. if (res.code == 0) {
  284. api.toast({
  285. msg: (status == 1 ? '拒绝' : '同意') + '成功',
  286. });
  287. setTimeout(function () {
  288. _this.$set(_this.list[index], "status", (status == 2 ? '2' : '1'));
  289. if (status == 2) {
  290. _this.$set(_this.list[index], "b2bStatus", 0);
  291. }
  292. }, 200);
  293. }
  294. })
  295. setTimeout(function () {
  296. _this.onClick = true;
  297. }, 1000);
  298. }
  299. },
  300. // 查看订单详情
  301. lookOrderInfo: function (orderId) {
  302. this.goWin('orderInfo_win', 'orderInfo_win.html', {
  303. id: orderId
  304. });
  305. }
  306. }
  307. })
  308. }
  309. </script>
  310. </html>