logs.vue 1.6 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768
  1. <template>
  2. <view>
  3. <!-- 顶部导航 -->
  4. <fa-navbar title="签到日志"></fa-navbar>
  5. <view class="u-p-30 ">
  6. <view class="u-flex u-col-center u-row-around u-p-30 u-m-b-20 u-bg-white" v-for="(item,index) in list" :key="index">
  7. <view class="">{{item.type}}</view>
  8. <view class="">连续签到{{item.successions}}天</view>
  9. <view class="">{{item.createtime}}</view>
  10. </view>
  11. </view>
  12. <!-- 加载更多 -->
  13. <view class="u-p-b-30" v-if="list.length"><u-loadmore bg-color="#f4f6f8" :status="has_more ? status : 'nomore'" /></view>
  14. <!-- 空数据 -->
  15. <view class="fa-empty" v-if="!list.length"><u-empty></u-empty></view>
  16. <!-- 回到顶部 -->
  17. <u-back-top :scroll-top="scrollTop" :icon-style="{color:theme.bgColor}" :custom-style="{backgroundColor:lightColor}"></u-back-top>
  18. <!-- 底部导航 -->
  19. <fa-tabbar></fa-tabbar>
  20. </view>
  21. </template>
  22. <script>
  23. export default {
  24. onLoad() {
  25. this.signLog();
  26. },
  27. data() {
  28. return {
  29. scrollTop: 0,
  30. list: [],
  31. status: 'loadmore',
  32. has_more: false,
  33. page: 1
  34. };
  35. },
  36. methods: {
  37. signLog(){
  38. this.$api.signLog({page:this.page}).then(res=>{
  39. this.status = 'loadmore';
  40. if (!res.code) {
  41. this.$u.toast(res.msg);
  42. return;
  43. }
  44. this.list = this.list.concat(res.data.data);
  45. this.has_more = res.data.last_page > res.data.current_page;
  46. })
  47. }
  48. },
  49. onPageScroll(e) {
  50. this.scrollTop = e.scrollTop;
  51. },
  52. onReachBottom() {
  53. if (this.has_more) {
  54. this.status = 'loading';
  55. this.page++;
  56. this.signLog();
  57. }
  58. }
  59. };
  60. </script>
  61. <style lang="scss">
  62. page {
  63. background-color: #f4f6f8;
  64. }
  65. </style>