index.vue 1.8 KB

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