index.js 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197
  1. // pages/match/index.js
  2. const app = getApp();
  3. Page({
  4. /**
  5. * 页面的初始数据
  6. */
  7. data: {
  8. appAssetsUrl2: app.appAssetsUrl2,
  9. matchList: [],
  10. statusBarHeightTop: 0,
  11. statusBarHeight: 0,
  12. // 分页相关数据
  13. pageNum: 1,
  14. pageSize: 10,
  15. total: 0,
  16. hasMore: true,
  17. isLoading: false
  18. },
  19. /**
  20. * 赛事项目点击事件
  21. */
  22. onMatchItemTap(e) {
  23. const index = e.currentTarget.dataset.index;
  24. const matchItem = this.data.matchList[index];
  25. console.log('点击赛事项目:', matchItem);
  26. // 跳转到详情页面
  27. wx.navigateTo({
  28. url: `/pages/match/details/index?id=${matchItem.id}`
  29. });
  30. },
  31. /**
  32. * 生命周期函数--监听页面加载
  33. */
  34. onLoad(options) {
  35. this.height();
  36. // 加载赛事数据
  37. this.loadMatchData();
  38. },
  39. /**
  40. * 加载赛事数据
  41. */
  42. loadMatchData() {
  43. // 如果正在加载或没有更多数据,则不执行
  44. if (this.data.isLoading || !this.data.hasMore) {
  45. return;
  46. }
  47. this.setData({
  48. isLoading: true
  49. });
  50. wx.showLoading({
  51. title: this.data.pageNum === 1 ? '加载中...' : '加载更多...'
  52. });
  53. // 调用API获取赛事数据
  54. const params = {
  55. pageNum: this.data.pageNum,
  56. pageSize: this.data.pageSize
  57. };
  58. // 使用项目中已有的请求方法
  59. app._get('news/page', params, (res) => {
  60. wx.hideLoading();
  61. this.setData({
  62. isLoading: false
  63. });
  64. if (res.code === 0) {
  65. // 处理返回的数据
  66. const newList = res.page.list || [];
  67. const total = res.page.totalPage || 0;
  68. // 如果是第一页,直接设置数据;否则追加数据
  69. const matchList = this.data.pageNum === 1 ? newList : [...this.data.matchList, ...newList];
  70. this.setData({
  71. matchList: matchList,
  72. total: total,
  73. hasMore: matchList.length < total
  74. });
  75. } else {
  76. wx.showToast({
  77. title: '数据加载失败',
  78. icon: 'none'
  79. });
  80. }
  81. }, (fail) => {
  82. wx.hideLoading();
  83. this.setData({
  84. isLoading: false
  85. });
  86. wx.showToast({
  87. title: '请求失败',
  88. icon: 'none'
  89. });
  90. });
  91. },
  92. /**
  93. * 重置并重新加载数据
  94. */
  95. reloadMatchData() {
  96. this.setData({
  97. pageNum: 1,
  98. matchList: [],
  99. hasMore: true
  100. });
  101. this.loadMatchData();
  102. },
  103. height() {
  104. const {
  105. platform,
  106. statusBarHeight
  107. } = wx.getSystemInfoSync();
  108. let statusBarHeightTop = statusBarHeight;
  109. let height = statusBarHeight + 4; //ios 24px
  110. let mH = statusBarHeight + 4;
  111. if (platform.toLowerCase() == "android") {
  112. height += 4; //android 28px
  113. mH += 4;
  114. }
  115. height = height + 100;
  116. // height = height + 38 + 118;
  117. // 胶囊高度 32px 下边框6px height 状态栏高度
  118. this.setData({
  119. statusBarHeightTop: statusBarHeightTop + "px",
  120. statusBarHeight: height + "px",
  121. statusBarMH: mH + "px",
  122. });
  123. },
  124. /**
  125. * 生命周期函数--监听页面初次渲染完成
  126. */
  127. onReady() {
  128. // 页面渲染完成
  129. },
  130. /**
  131. * 生命周期函数--监听页面显示
  132. */
  133. onShow() {
  134. // 页面显示时刷新数据
  135. },
  136. /**
  137. * 生命周期函数--监听页面隐藏
  138. */
  139. onHide() {
  140. // 页面隐藏
  141. },
  142. /**
  143. * 生命周期函数--监听页面卸载
  144. */
  145. onUnload() {
  146. // 页面卸载
  147. },
  148. /**
  149. * 页面相关事件处理函数--监听用户下拉动作
  150. */
  151. onPullDownRefresh() {
  152. // 下拉刷新
  153. this.reloadMatchData();
  154. wx.stopPullDownRefresh();
  155. },
  156. /**
  157. * 页面上拉触底事件的处理函数
  158. */
  159. onReachBottom() {
  160. // 上拉加载更多
  161. console.log('加载更多赛事数据');
  162. if (this.data.hasMore && !this.data.isLoading) {
  163. this.setData({
  164. pageNum: this.data.pageNum + 1
  165. });
  166. this.loadMatchData();
  167. }
  168. },
  169. /**
  170. * 用户点击右上角分享
  171. */
  172. onShareAppMessage() {
  173. }
  174. });