help.vue 2.7 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110
  1. <template>
  2. <!-- 直播带货列表 -->
  3. <view class="container">
  4. <view class="rnwdList">
  5. <view class="list" @tap="goDetails(item.id)" v-for="(item, index1) in dataSource" :key="index1">
  6. <span class="listTitle">{{ item.titleName }}</span>
  7. <view class="onePic" v-if="item.pictureList != null && item.pictureList.length == 1">
  8. <image :src="loadImgSrcLocalhost(item2)" v-for="(item2, index2) in item.pictureList" :key="index2">
  9. </image>
  10. </view>
  11. <view class="twoPic" v-if="item.pictureList != null && item.pictureList.length == 2">
  12. <image :src="loadImgSrcLocalhost(item2)" v-for="(item2, index2) in item.pictureList" :key="index2">
  13. </image>
  14. </view>
  15. <view class="threePic" v-if="item.pictureList != null && item.pictureList.length == 3">
  16. <image :src="loadImgSrcLocalhost(item2)" v-for="(item2, index2) in item.pictureList" :key="index2">
  17. </image>
  18. </view>
  19. <view class="threePic" v-if="item.pictureList != null && item.pictureList.length > 3">
  20. <image :src="loadImgSrcLocalhost(item2)" v-for="(item2, index2) in item.pictureList"
  21. v-if="index2 < 3" :key="index2"></image>
  22. </view>
  23. <view class="jlSj">
  24. <view class="ck">
  25. <span>
  26. <em class="iconfont icon-chakan"></em>
  27. {{ item.likeNum }}
  28. </span>
  29. <span>
  30. <em class="iconfont icon-shoucang"></em>
  31. {{ item.watchNum }}
  32. </span>
  33. </view>
  34. </view>
  35. </view>
  36. </view>
  37. </view>
  38. </template>
  39. <script>
  40. import {
  41. list
  42. } from '@/api/help/help.js';
  43. export default {
  44. data() {
  45. return {
  46. dataSource: [],
  47. // 数据总量
  48. total: 0,
  49. queryParams: {
  50. // 当前页
  51. pageNum: 1,
  52. // 每页数据量
  53. pageSize: 10,
  54. },
  55. loading: false,
  56. }
  57. },
  58. /**
  59. * 生命周期函数--监听页面加载
  60. */
  61. onLoad(options) {
  62. this.getList(1)
  63. },
  64. onReachBottom(){
  65. let pageNum = this.queryParams.pageNum
  66. let pageSize = this.queryParams.pageSize
  67. let total = this.total
  68. if(pageNum * pageSize >= total){
  69. uni.showToast({
  70. title:'暂无更多数据'
  71. })
  72. return
  73. } else {
  74. this.queryParams.pageNum += 1;
  75. this.getList()
  76. }
  77. },
  78. methods: {
  79. goDetails(id) {
  80. uni.navigateTo({
  81. url: '/pages/highServer/helpDetail/helpDetails?id=' + id,
  82. });
  83. },
  84. // 分页触发
  85. change(e) {
  86. this.getList(e.current);
  87. },
  88. // 获取数据
  89. getList(pageNum) {
  90. let params = {
  91. pageSize: this.queryParams.pageSize,
  92. pageNum: pageNum,
  93. }
  94. list(params).then(res => {
  95. if (res.code == 200) {
  96. this.dataSource = [...this.dataSource,...res.rows]
  97. this.total = res.total
  98. }
  99. })
  100. },
  101. }
  102. }
  103. </script>
  104. <style>
  105. @import './help.css';
  106. </style>