index.js 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177
  1. // pages/exhibition/index.js
  2. const { museumApi } = require('../../utils/api.js');
  3. const { navigateToWebview } = require('../../utils/util.js');
  4. Page({
  5. /**
  6. * 页面的初始数据
  7. */
  8. data: {
  9. selectedType: 0, // 当前选中的类型:0-全部,1-室内,2-室外
  10. carouselList: [], // 轮播图数据
  11. exhibitionList: [], // 展览列表数据
  12. loading: false, // 加载状态
  13. hasMore: true, // 是否还有更多数据
  14. currentPage: 1, // 当前页码
  15. pageSize: 10 // 每页数量
  16. },
  17. /**
  18. * 生命周期函数--监听页面加载
  19. */
  20. onLoad(options) {
  21. this.initData();
  22. },
  23. /**
  24. * 页面相关事件处理函数--监听用户下拉动作
  25. */
  26. onPullDownRefresh() {
  27. this.initData();
  28. },
  29. /**
  30. * 页面上拉触底事件的处理函数
  31. */
  32. onReachBottom() {
  33. this.loadMore();
  34. },
  35. // 初始化数据
  36. async initData() {
  37. await this.getCarouselData();
  38. await this.getExhibitionList(false);
  39. wx.stopPullDownRefresh();
  40. },
  41. // 获取轮播图数据(type为0的前5条)
  42. async getCarouselData() {
  43. try {
  44. const response = await museumApi.getExhibitionList({
  45. pageNum: 1,
  46. pageSize: 5,
  47. type: 0
  48. });
  49. if (response && response.records) {
  50. this.setData({
  51. carouselList: response.records
  52. });
  53. }
  54. } catch (error) {
  55. console.error('获取轮播图数据失败:', error);
  56. }
  57. },
  58. // 获取展览列表数据
  59. async getExhibitionList(isLoadMore = false) {
  60. if (this.data.loading) return;
  61. this.setData({ loading: true });
  62. try {
  63. const response = await museumApi.getExhibitionList({
  64. pageNum: isLoadMore ? this.data.currentPage : 1,
  65. pageSize: this.data.pageSize,
  66. type: this.data.selectedType
  67. });
  68. if (response && response.records) {
  69. let exhibitionList;
  70. if (isLoadMore) {
  71. // 加载更多,追加数据
  72. exhibitionList = [...this.data.exhibitionList, ...response.records];
  73. } else {
  74. // 重新加载,替换数据
  75. exhibitionList = response.records;
  76. this.setData({ currentPage: 1 });
  77. }
  78. this.setData({
  79. exhibitionList: exhibitionList,
  80. hasMore: response.records.length === this.data.pageSize
  81. });
  82. if (isLoadMore) {
  83. this.setData({
  84. currentPage: this.data.currentPage + 1
  85. });
  86. }
  87. }
  88. } catch (error) {
  89. console.error('获取展览列表失败:', error);
  90. wx.showToast({
  91. title: '加载失败',
  92. icon: 'none'
  93. });
  94. } finally {
  95. this.setData({ loading: false });
  96. }
  97. },
  98. // 选择分类
  99. async selectCategory(e) {
  100. const type = e.currentTarget.dataset.type;
  101. if (this.data.selectedType === type) return;
  102. this.setData({
  103. selectedType: type,
  104. currentPage: 1,
  105. hasMore: true
  106. });
  107. // 重新获取列表数据
  108. await this.getExhibitionList(false);
  109. },
  110. // 加载更多
  111. async loadMore() {
  112. if (!this.data.hasMore || this.data.loading) return;
  113. await this.getExhibitionList(true);
  114. },
  115. // 展览项点击事件
  116. onExhibitionTap(e) {
  117. const item = e.currentTarget.dataset.item;
  118. this.goToDetail(item.exhibitId);
  119. },
  120. // 线上观展点击事件
  121. onOnlineExhibitionTap(e) {
  122. console.log('线上观展点击事件触发', e.currentTarget.dataset.item);
  123. // e.stopPropagation(); // 阻止事件冒泡
  124. const item = e.currentTarget.dataset.item;
  125. if (item.webSite) {
  126. console.log('跳转到webSite:', item.webSite);
  127. navigateToWebview(item.webSite,'open');
  128. } else {
  129. this.goToDetail(item.exhibitId);
  130. console.log('webSite为空');
  131. }
  132. },
  133. // 跳转到详情页面
  134. goToDetail(id) {
  135. navigateToWebview(`/allDetailsShow?isFrom=weixin&id=${id}&type=exhibition`);
  136. },
  137. /**
  138. * 用户点击右上角分享
  139. */
  140. onShareAppMessage() {
  141. return {
  142. title: '克拉玛依博物馆 - 展览',
  143. path: '/pages/exhibition/index'
  144. };
  145. },
  146. /**
  147. * 用户点击右上角分享到朋友圈
  148. */
  149. onShareTimeline() {
  150. return {
  151. title: '克拉玛依博物馆 - 精彩展览等你来看',
  152. query: '',
  153. imageUrl: '' // 可以设置自定义分享图片
  154. };
  155. }
  156. });