backList_body.html 9.7 KB

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