index.js 4.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177
  1. // pages/exhibition/index.js
  2. const { museumApi } = require('../../utils/api.js');
  3. const { navigateToWebview, urlImg } = 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. urlImg: urlImg
  17. },
  18. /**
  19. * 生命周期函数--监听页面加载
  20. */
  21. onLoad(options) {
  22. this.initData();
  23. },
  24. /**
  25. * 页面相关事件处理函数--监听用户下拉动作
  26. */
  27. onPullDownRefresh() {
  28. this.initData();
  29. },
  30. /**
  31. * 页面上拉触底事件的处理函数
  32. */
  33. onReachBottom() {
  34. this.loadMore();
  35. },
  36. // 初始化数据
  37. async initData() {
  38. await this.getCarouselData();
  39. await this.getExhibitionList(false);
  40. wx.stopPullDownRefresh();
  41. },
  42. // 获取轮播图数据(type为0的前5条)
  43. async getCarouselData() {
  44. try {
  45. const response = await museumApi.getExhibitionList({
  46. pageNum: 1,
  47. pageSize: 5,
  48. type: 0
  49. });
  50. if (response && response.records) {
  51. this.setData({
  52. carouselList: response.records
  53. });
  54. }
  55. } catch (error) {
  56. console.error('获取轮播图数据失败:', error);
  57. }
  58. },
  59. // 获取展览列表数据
  60. async getExhibitionList(isLoadMore = false) {
  61. if (this.data.loading) return;
  62. this.setData({ loading: true });
  63. try {
  64. const response = await museumApi.getExhibitionList({
  65. pageNum: isLoadMore ? this.data.currentPage : 1,
  66. pageSize: this.data.pageSize,
  67. type: this.data.selectedType
  68. });
  69. if (response && response.records) {
  70. let exhibitionList;
  71. if (isLoadMore) {
  72. // 加载更多,追加数据
  73. exhibitionList = [...this.data.exhibitionList, ...response.records];
  74. } else {
  75. // 重新加载,替换数据
  76. exhibitionList = response.records;
  77. this.setData({ currentPage: 1 });
  78. }
  79. this.setData({
  80. exhibitionList: exhibitionList,
  81. hasMore: response.records.length === this.data.pageSize
  82. });
  83. if (isLoadMore) {
  84. this.setData({
  85. currentPage: this.data.currentPage + 1
  86. });
  87. }
  88. }
  89. } catch (error) {
  90. console.error('获取展览列表失败:', error);
  91. wx.showToast({
  92. title: '加载失败',
  93. icon: 'none'
  94. });
  95. } finally {
  96. this.setData({ loading: false });
  97. }
  98. },
  99. // 选择分类
  100. async selectCategory(e) {
  101. const type = e.currentTarget.dataset.type;
  102. if (this.data.selectedType === type) return;
  103. this.setData({
  104. selectedType: type,
  105. currentPage: 1,
  106. hasMore: true
  107. });
  108. // 重新获取列表数据
  109. await this.getExhibitionList(false);
  110. },
  111. // 加载更多
  112. async loadMore() {
  113. if (!this.data.hasMore || this.data.loading) return;
  114. await this.getExhibitionList(true);
  115. },
  116. // 展览项点击事件
  117. onExhibitionTap(e) {
  118. const item = e.currentTarget.dataset.item;
  119. this.goToDetail(item.exhibitId);
  120. },
  121. // 线上观展点击事件
  122. onOnlineExhibitionTap(e) {
  123. // e.stopPropagation(); // 阻止事件冒泡
  124. const webSite = 'https://www.4dmodel.com/SuperTwoCustom/KLMYscene/?m=SG-alDn3FU4jQ8';
  125. if (webSite) {
  126. console.log('跳转到webSite:', webSite);
  127. navigateToWebview(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. });