remind.vue 1.6 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485
  1. <template>
  2. <view>
  3. <view class="list">
  4. <view class="message-bubble-received" v-for="(item, index) in list" :key="index">
  5. <view class="title">
  6. <text class="icon">&#xe813;</text>
  7. <text>{{ item.templateName }}</text>
  8. </view>
  9. <view class="desc">{{ item.op }}</view>
  10. <view class="desc">{{ item.createTime }}</view>
  11. </view>
  12. <view class="loading" v-if="loadMore"><u-loadmore :status="loadMore ? 'loading' : 'nomore'" /></view>
  13. <u-empty v-if="!loadMore && list.length == 0"></u-empty>
  14. </view>
  15. </view>
  16. </template>
  17. <script>
  18. export default {
  19. data() {
  20. return {
  21. list: [],
  22. param: { pageNum: 1, pageSize: 10, type: 0 },
  23. loadMore: true
  24. };
  25. },
  26. onLoad(e) {
  27. this.getData();
  28. },
  29. methods: {
  30. getData() {
  31. this.http.request({
  32. url: '/app/follow/list',
  33. data: this.param,
  34. loading: 'false',
  35. success: (res) => {
  36. this.loadMore = res.data.pages > this.param.pageNum ? true : false;
  37. this.list.push(...res.data.rows);
  38. }
  39. });
  40. },
  41. //刷新数据
  42. refresh() {
  43. this.loadMore = true;
  44. this.param.pageNum = 1;
  45. this.list = [];
  46. this.getData();
  47. }
  48. },
  49. //下拉刷新
  50. onPullDownRefresh() {
  51. setTimeout(() => {
  52. this.refresh();
  53. uni.stopPullDownRefresh();
  54. }, 1000);
  55. },
  56. //上拉加载
  57. onReachBottom() {
  58. if (this.loadMore) {
  59. this.param.pageNum++;
  60. this.getData();
  61. }
  62. }
  63. };
  64. </script>
  65. <style lang="scss">
  66. .list {
  67. padding: 10px 12px;
  68. .message-bubble-received {
  69. .title {
  70. font-size: 16px;
  71. font-weight: bold;
  72. .icon {
  73. padding-right: 3px;
  74. }
  75. }
  76. .desc {
  77. font-size: 13px;
  78. padding-top: 10px;
  79. color: $font-c;
  80. }
  81. }
  82. }
  83. </style>