product-profit-boot.html 7.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8">
  5. <title>开机奖励-产品中心-创业帮</title>
  6. <meta name="keywords" content="开机奖励-产品中心-创业帮">
  7. <meta name="description" content="开机奖励-产品中心-创业帮">
  8. <meta content="width=device-width,minimum-scale=1.0,maximum-scale=1.0,shrink-to-fit=no,user-scalable=no" name="viewport" viewport="cover">
  9. <meta name="apple-mobile-web-app-capable" content="yes">
  10. <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
  11. <meta content="telephone=no" name="format-detection">
  12. <meta content="email=no" name="format-detection">
  13. <meta name="apple-mobile-web-app-title" content="开机奖励-产品中心-创业帮">
  14. <meta http-equiv="Cache-Control" content="no-siteapp">
  15. <link rel="stylesheet" href="./static/css/main.css">
  16. </head>
  17. <body class="bgc-back h100p ovh pt0" style="padding-top:0;">
  18. <div id="app">
  19. <van-nav-bar class="user_rank_explan_title user_title_normal" left-arrow :title="'开机奖励-'+title" v-if="toptitleisshow" @click-left="goback">
  20. <template #left> <img src="./static/images/left.png" alt=""></template>
  21. </van-nav-bar>
  22. <van-tabs v-model="active" animated swipeable line-width="20" title-active-color="#ff502a" @change="changetab" line-height="2" :ellipsis="false" sticky v-cloak>
  23. <van-tab class="top_line" title="按日查询">
  24. <div class="bgcfff">
  25. <div class="ovh-x" ref="wrapper1">
  26. <van-pull-refresh v-model="refreshing" @refresh="onRefresh" style="height:100%;" :class="transactions.length === 0 ? 'isnodata':''">
  27. <van-empty class="custom-image" image="./static/images/empty-img.png" description="暂无数据" v-if="isnodata"></van-empty>
  28. <van-list v-model="loading" :finished="finished" finished-text="没有更多数据了" @load="onLoad" :immediate-check="false">
  29. <van-cell-group :border="false">
  30. <van-cell v-for="item,index in transactions" @click="bootdetail(item.DateValue)" :title="item.Date" :value="item.RewardAmount +'元'" title-class="f12 c333" value-class="f12" center is-link></van-cell>
  31. </van-cell-group>
  32. </van-list>
  33. </van-pull-refresh>
  34. </div>
  35. </div>
  36. </van-tab>
  37. <van-tab class="top_line" title="按月查询">
  38. <div class="bgcfff">
  39. <div class="ovh-x" ref="wrapper2">
  40. <van-pull-refresh v-model="refreshing" @refresh="onRefresh" style="height:100%;" :class="transactions.length === 0 ? 'isnodata':''">
  41. <van-empty class="custom-image" image="./static/images/empty-img.png" description="暂无数据" v-if="isnodata"></van-empty>
  42. <van-list v-model="loading" :finished="finished" finished-text="没有更多数据了" @load="onLoad" :immediate-check="false">
  43. <van-cell-group :border="false">
  44. <van-cell v-for="item,index in transactions" :title="item.Date" :value="item.RewardAmount+'元'" title-class="f12 c333" value-class="f12" center></van-cell>
  45. </van-cell-group>
  46. </van-list>
  47. </van-pull-refresh>
  48. </div>
  49. </div>
  50. </van-tab>
  51. </van-tabs>
  52. </div>
  53. <script src="./static/js/klm-vv.min.js"></script>
  54. <script src="./static/js/appfunc.min.js"></script>
  55. <script src="./static/js/klm-axios-config.js"></script>
  56. <script src="./static/js/publicfn.js"></script>
  57. <script>
  58. // 通过 CDN 引入时不会自动注册 Lazyload 组件
  59. // 可以通过下面的方式手动注册
  60. Vue.use(vant.Lazyload);
  61. PublicLib.SetStatusBarBgColor({bgcolor:'ffffff'});
  62. // 在 #app 标签下渲染一个按钮组件
  63. let app = new Vue({
  64. el: '#app',
  65. data() {
  66. return {
  67. isnodata:false,
  68. toptitleisshow:false,
  69. active: 0,
  70. title:'',
  71. transactions: [
  72. ],
  73. loading: false,
  74. finished: false,
  75. refreshing: false,
  76. pageinfo:{
  77. PageSize:20,
  78. PageNum:1
  79. }
  80. };
  81. },
  82. created(){
  83. this.toptitleisshow = toptitleisshow;
  84. this.title = PublicLib.getCookieInfo('productMachineType');
  85. this.getbootlist();
  86. PublicLib.SetTitle({Title:'开机奖励-'+ PublicLib.getCookieInfo('productMachineType')});
  87. },
  88. beforeUpdate() {
  89. this.$nextTick(() => {
  90. this.$refs.wrapper1.style.height = `${document.documentElement.clientHeight - 44}px`;
  91. });
  92. },
  93. watch:{
  94. active(value){
  95. if(value === 1){
  96. this.$nextTick(() => {
  97. this.$refs.wrapper2.style.height = `${document.documentElement.clientHeight - 44}px`;
  98. });
  99. };
  100. }
  101. },
  102. methods: {
  103. goback(){
  104. PublicLib.GoBack({Level:1});
  105. },
  106. onLoad() {
  107. if (this.refreshing) {
  108. //- this.transactions = [];
  109. this.refreshing = false;
  110. this.pageinfo.PageNum = 0;
  111. };
  112. this.pageinfo.PageNum++;
  113. this.getbootlist();
  114. console.log(this.$refs.wrapper1.scrollTop);
  115. },
  116. bootdetail(time){
  117. PublicLib.putCookieInfo('bootDetailTime', time);
  118. PublicLib.Goto({Url:'product-profit-boot-detail'});
  119. },
  120. onRefresh() {
  121. // 清空列表数据
  122. this.finished = false;
  123. // 重新加载数据
  124. // 将 loading 设置为 true,表示处于加载状态
  125. this.loading = true;
  126. this.pageinfo.PageNum = 1;
  127. this.getbootlist('refresh');
  128. },
  129. changetab(){
  130. this.pageinfo.PageNum = 1;
  131. this.getbootlist('refresh');
  132. },
  133. async getbootlist(type = 'onload'){
  134. const ProductType = PublicLib.getCookieInfo('productMachineId');
  135. const UserId = PublicLib.getCookieInfo('userId');
  136. const Kind = this.active === 0 ? 1 : 2;
  137. const res = await getRequest('api/v1/pos/openreward/statlist?t='+Math.random(6),JSON.stringify({...this.pageinfo,ProductType,UserId,Kind}));
  138. if(res.status !== '1')return tips('开机奖励列表获取失败!');
  139. //- PublicLib.HideLoading();
  140. if(res.data.length < this.pageinfo.PageSize) {
  141. this.finished = true;
  142. };
  143. if(type === 'refresh'){
  144. this.transactions = res.data
  145. this.refreshing = false;
  146. }else{
  147. this.transactions.push(...res.data);
  148. }
  149. this.loading = false;
  150. if(this.transactions.length === 0) {this.isnodata = true}else{this.isnodata = false};
  151. },
  152. }
  153. });
  154. </script>
  155. </body>
  156. </html>