baoxiuList.js 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212
  1. Page({
  2. /**
  3. * 页面的初始数据
  4. */
  5. data: {
  6. noticeList: [
  7. {
  8. id: 1,
  9. address: '安平镇安坪村安平小区12栋304室',
  10. content: '水表漏水 11111',
  11. contact: '张三',
  12. phone: '13800138000',
  13. date: '2024-03-15',
  14. type: '水表漏水',
  15. hasAttachment: true,
  16. attachments: [
  17. '/static_file/background.png',
  18. '/static_file/card.png'
  19. ],
  20. isReplied: true,
  21. replyTime: '2025-3-12 12:10',
  22. replyContent: '建议增加线上开票功能,线下开票太麻烦了'
  23. },
  24. {
  25. id: 2,
  26. address: '安平镇安坪村安平小区12栋305室',
  27. content: '水管漏水 2222',
  28. contact: '李四',
  29. phone: '13900139000',
  30. date: '2024-03-14',
  31. type: '水表漏水',
  32. hasAttachment: false,
  33. attachments: [],
  34. isReplied: false,
  35. replyTime: '',
  36. replyContent: ''
  37. },
  38. {
  39. id: 3,
  40. address: '安平镇安坪村安平小区12栋306室',
  41. content: '3333',
  42. contact: '王五',
  43. phone: '13700137000',
  44. date: '2024-03-13',
  45. type: '水表漏水',
  46. hasAttachment: true,
  47. attachments: [
  48. '/static_file/add.png'
  49. ],
  50. isReplied: true,
  51. replyTime: '2025-3-10 09:30',
  52. replyContent: '已经对相关人员进行培训,感谢您的反馈'
  53. }
  54. ],
  55. imageList: [], // 存储图片路径的数组
  56. showCustomPreview: false, // 是否显示自定义预览
  57. currentPreviewImages: [], // 当前预览的图片数组
  58. currentPreviewIndex: 0 // 当前预览的图片索引
  59. },
  60. /**
  61. * 生命周期函数--监听页面加载
  62. */
  63. onLoad(options) {
  64. this.getNoticeList()
  65. },
  66. /**
  67. * 生命周期函数--监听页面初次渲染完成
  68. */
  69. onReady() {
  70. },
  71. /**
  72. * 生命周期函数--监听页面显示
  73. */
  74. onShow() {
  75. },
  76. /**
  77. * 生命周期函数--监听页面隐藏
  78. */
  79. onHide() {
  80. },
  81. /**
  82. * 生命周期函数--监听页面卸载
  83. */
  84. onUnload() {
  85. },
  86. /**
  87. * 页面相关事件处理函数--监听用户下拉动作
  88. */
  89. onPullDownRefresh() {
  90. },
  91. /**
  92. * 页面上拉触底事件的处理函数
  93. */
  94. onReachBottom() {
  95. },
  96. /**
  97. * 用户点击右上角分享
  98. */
  99. onShareAppMessage() {
  100. },
  101. // 获取列表数据
  102. getNoticeList() {
  103. // wx.request({
  104. // url: 'YOUR_API_URL',
  105. // success: (res) => {
  106. // this.setData({
  107. // noticeList: res.data
  108. // })
  109. // }
  110. // })
  111. },
  112. previewImage: function(e) {
  113. // 获取当前点击项的id
  114. const id = e.currentTarget.dataset.id;
  115. // 根据id找到对应的投诉建议项
  116. const item = this.data.noticeList.find(item => item.id === id);
  117. // 确保有附件
  118. if (item && item.hasAttachment && item.attachments.length > 0) {
  119. this.setData({
  120. showCustomPreview: true,
  121. currentPreviewImages: item.attachments,
  122. currentPreviewIndex: 0
  123. });
  124. } else {
  125. console.log('没有找到附件或附件为空');
  126. }
  127. },
  128. // 关闭预览
  129. closePreview: function() {
  130. this.setData({
  131. showCustomPreview: false
  132. });
  133. },
  134. // 切换预览图片
  135. changePreviewImage: function(e) {
  136. const direction = e.currentTarget.dataset.direction;
  137. let newIndex = this.data.currentPreviewIndex;
  138. if (direction === 'prev') {
  139. newIndex = newIndex > 0 ? newIndex - 1 : this.data.currentPreviewImages.length - 1;
  140. } else {
  141. newIndex = newIndex < this.data.currentPreviewImages.length - 1 ? newIndex + 1 : 0;
  142. }
  143. this.setData({
  144. currentPreviewIndex: newIndex
  145. });
  146. },
  147. // 防止点击图片内容时关闭预览
  148. preventBubble: function() {
  149. return;
  150. },
  151. // 跳转到详情页
  152. goToDetail(e) {
  153. const id = e.currentTarget.dataset.id;
  154. const item = this.data.noticeList.find(item => item.id === id);
  155. // 统一使用预览模式,传递isReplied参数
  156. wx.navigateTo({
  157. url: `/pages/baoxiudj/baoxiudj?id=${id}&mode=preview&isReplied=${item.isReplied ? 'true' : 'false'}`
  158. });
  159. },
  160. // 跳转到表单页
  161. goToForm() {
  162. wx.navigateTo({
  163. url: '/pages/baoxiudj/baoxiudj'
  164. })
  165. },
  166. // 返回上一页
  167. goBack() {
  168. wx.navigateBack()
  169. },
  170. // 假设您从服务器获取数据的函数
  171. getDataFromServer: function() {
  172. // 示例:从服务器获取数据
  173. wx.request({
  174. url: 'your_api_url',
  175. success: (res) => {
  176. // 假设返回的数据中包含图片数组
  177. const images = res.data.images || [];
  178. this.setData({
  179. imageList: images
  180. });
  181. }
  182. });
  183. }
  184. })