hot.vue 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
  1. <template>
  2. <view>
  3. <view class="searchBar">
  4. <search-bar :disabled="false" @onSearch="onSearch"></search-bar>
  5. </view>
  6. <block v-for="(item, index) in hotList" :key="index">
  7. <u-line color="#e8e8e8"></u-line>
  8. <view class="padding-sm flex justify-between align-center bg-white" @click="navWithParm">
  9. <view class="flex justify-around align-center">
  10. <view class="padding-right text-center text-black text-bold" style="width: 60upx;">{{index + 1}}</view>
  11. <view class="padding-right">
  12. <u-avatar :src="item.avatar" size="130"></u-avatar>
  13. </view>
  14. <view>
  15. <view class="text-bold text-black">{{item.name}}</view>
  16. <view class="margin-tb-xs">{{+item.totalHotValue}} 热力值</view>
  17. </view>
  18. </view>
  19. <view class="padding-right">
  20. <button class="cu-btn round text-white" style="background-color: #583ce6;height: 68upx;">
  21. <text class="cuIcon-hotfill padding-right-xs"></text>
  22. <text>打榜</text>
  23. </button>
  24. </view>
  25. </view>
  26. </block>
  27. </view>
  28. </template>
  29. <script>
  30. import searchBar from "@/components/basic/search-bar.vue";
  31. export default {
  32. components: {
  33. searchBar,
  34. },
  35. data() {
  36. return {
  37. hotList: [],
  38. }
  39. },
  40. onLoad(options) {
  41. this.getRankList(options.activityId);
  42. },
  43. onReachBottom() {
  44. console.log("到底了")
  45. },
  46. methods: {
  47. getRankList(id) {
  48. this.$u.api.activity.rankList({activityId: id}).then(res => {
  49. this.hotList = res.records;
  50. })
  51. },
  52. //跳转需要带惨方法
  53. navWithParm() {
  54. uni.navigateTo({
  55. url: "/pages/activityList/activity/boost"
  56. })
  57. },
  58. onSearch(value) {
  59. console.log(value);
  60. }
  61. }
  62. }
  63. </script>
  64. <style>
  65. </style>