index.vue 1.9 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495
  1. <template>
  2. <view class="main pt0">
  3. <view class="item" v-for="(item, index) in list" :key="index" @click="go('/pages/user/resume/deliver/receive/list?id=' + item.id + '&title=' + item.title + '&total=' + item.total)">
  4. <view class="title omit">{{ item.title }}</view>
  5. <view class="desc">
  6. <view class="progress">
  7. <u-line-progress :percentage="(item.isRead / item.total).toFixed(2) * 100" :height="20" text="已读"></u-line-progress>
  8. </view>
  9. <view class="all">{{ item.total }}份</view>
  10. </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. </template>
  16. <script>
  17. export default {
  18. data() {
  19. return {
  20. list: [],
  21. param: { pageNum: 1, pageSize: 10 },
  22. loadMore: true
  23. };
  24. },
  25. onLoad(e) {
  26. this.getData();
  27. },
  28. methods: {
  29. getData() {
  30. this.http.request({
  31. url: '/app/deliver/receive',
  32. data: this.param,
  33. loading: 'false',
  34. success: (res) => {
  35. this.loadMore = res.data.pages > this.param.pageNum ? true : false;
  36. this.list.push(...res.data.rows);
  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. .item {
  69. background-color: white;
  70. border-radius: 7px;
  71. padding: 15px;
  72. overflow: hidden;
  73. margin-bottom: 12px;
  74. .title {
  75. border-radius: 3px;
  76. font-weight: bold;
  77. font-size: 18px;
  78. }
  79. .desc {
  80. margin-top: 10px;
  81. color: $font-c;
  82. font-size: 15px;
  83. margin-left: -5px;
  84. .progress {
  85. float: left;
  86. width: 90%;
  87. }
  88. .all {
  89. float: left;
  90. padding-left: 5px;
  91. }
  92. }
  93. }
  94. </style>