noticeList.vue 3.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165
  1. <template>
  2. <view class="container">
  3. <cc-pullScroolView class="pullScrollView" ref="pullScroll" :pullDown="pullDown" :isDownLoading="true">
  4. <view class="notice" v-for="(item,index) in list" :key="index">
  5. <view class="justify-content" @click="goDetails(item)">
  6. <view class="font-forty">
  7. {{item.noticeTitle}}
  8. </view>
  9. <view class="font-twenty-eight gray">
  10. {{item.createTime}}
  11. </view>
  12. </view>
  13. </view>
  14. </cc-pullScroolView>
  15. <!--
  16. <view v-if="isLoadMore">
  17. <uni-load-more :status="loadStatus"></uni-load-more>
  18. </view>
  19. </view>
  20. </view> -->
  21. </view>
  22. </template>
  23. <script>
  24. // import {
  25. // onPullDownRefresh
  26. // } from '@dcloudio/uni-app' // 下拉刷新
  27. import CCBProjectList from '../../uni_modules/cc-pullScroolView/components/cc-pullScroolView/cc-pullScroolView.vue';
  28. import {
  29. getNoticeList,
  30. } from '@/api/common'
  31. export default {
  32. components: {
  33. CCBProjectList,
  34. },
  35. data() {
  36. return {
  37. list: [],
  38. pageSize: 10, // 条数
  39. totalNum: '',
  40. pageNum: 1, // 页数
  41. }
  42. },
  43. onLoad() {
  44. this.getList()
  45. },
  46. // 上拉加载
  47. onReachBottom() {
  48. // 数据全部加载完
  49. if (this.pageNum * 10 >= this.totalNum) {
  50. } else {
  51. // 显示加载中
  52. this.$refs.pullScroll.showUpLoading();
  53. this.pageNum++;
  54. this.requestData();
  55. }
  56. },
  57. methods: {
  58. goDetails(item) {
  59. uni.navigateTo({
  60. url: '/pages/notice/noticeDetail?params=' + encodeURIComponent(JSON.stringify(
  61. item))
  62. })
  63. },
  64. // 下拉刷新
  65. pullDown(pullScroll) {
  66. console.log('下拉刷新');
  67. //this.list = [];
  68. this.pageNum = 1;
  69. setTimeout(() => {
  70. this.requestData(pullScroll);
  71. }, 1000);
  72. },
  73. getList() {
  74. let myThis = this;
  75. this.$nextTick(() => {
  76. myThis.$refs.pullScroll.refresh();
  77. });
  78. },
  79. requestData() {
  80. uni.showLoading()
  81. getNoticeList('1', this.pageNum, this.pageSize).then(res => {
  82. // console.log('getNoticeList',res)
  83. this.totalNum = res.total
  84. if (res.code == '200') {
  85. uni.hideLoading()
  86. if (res.rows.length !== 0) {
  87. //首次加载10条数据,后进行拼接
  88. if (this.pageNum == 1) {
  89. this.list = [];
  90. this.list = res.rows
  91. } else {
  92. this.list = this.list.concat(res.rows)
  93. }
  94. // 如果是最后一页
  95. if (this.pageNum * 10 >= this.totalNum) {
  96. this.$refs.pullScroll.finish();
  97. } else {
  98. // 不是最后一页
  99. this.$refs.pullScroll.success();
  100. }
  101. } else {
  102. this.$modal.msg("暂无数据")
  103. }
  104. } else {
  105. this.$modal.msg(res.msg + "")
  106. }
  107. })
  108. }
  109. }
  110. }
  111. </script>
  112. <style lang="scss" scoped>
  113. .container {
  114. display: flex;
  115. margin-left: 10px;
  116. margin-top: 10px;
  117. margin-right: 10px;
  118. align-items: flex-start;
  119. justify-content: space-between;
  120. }
  121. .notice {
  122. margin: 20rpx;
  123. width: 100%;
  124. padding: 20rpx;
  125. background: #FFFFFF;
  126. box-shadow: 0rpx 8rpx 17rpx 0rpx rgba(0, 0, 0, 0.04);
  127. border-radius: 10rpx;
  128. }
  129. .text {
  130. border-left: 15rpx solid #3857F3;
  131. padding-left: 20rpx;
  132. }
  133. </style>