index.vue 3.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116
  1. <template>
  2. <view>
  3. <view class='sign-record'>
  4. <view class='list' v-for="(item,index) in signList" :key="index">
  5. <view class='item'>
  6. <view class='data'>{{item.month}}</view>
  7. <view class='listn'>
  8. <view class='itemn acea-row row-between-wrapper' v-for="(itemn,indexn) in item.list" :key="indexn">
  9. <view>
  10. <view class='name line1'>{{$t(itemn.title)}}</view>
  11. <view>{{itemn.add_time}}</view>
  12. </view>
  13. <view class='num font-color'>+{{itemn.number}}</view>
  14. </view>
  15. </view>
  16. </view>
  17. </view>
  18. <view class='loadingicon acea-row row-center-wrapper' v-if="signList.length > 0">
  19. <text class='loading iconfont icon-jiazai' :hidden='loading==false'></text>{{loadtitle}}
  20. </view>
  21. <view v-if="signList.length == 0"><emptyPage :title="$t(`暂无签到记录~`)"></emptyPage></view>
  22. </view>
  23. <!-- #ifdef MP -->
  24. <!-- <authorize @onLoadFun="onLoadFun" :isAuto="isAuto" :isShowAuth="isShowAuth" @authColse="authColse"></authorize> -->
  25. <!-- #endif -->
  26. </view>
  27. </template>
  28. <script>
  29. import { getSignMonthList } from '@/api/user.js';
  30. import { toLogin } from '@/libs/login.js';
  31. import { mapGetters } from "vuex";
  32. import emptyPage from '@/components/emptyPage';
  33. // #ifdef MP
  34. import authorize from '@/components/Authorize';
  35. // #endif
  36. export default {
  37. components: {
  38. emptyPage,
  39. // #ifdef MP
  40. authorize
  41. // #endif
  42. },
  43. data() {
  44. return {
  45. loading:false,
  46. loadend:false,
  47. loadtitle:this.$t(`加载更多`),
  48. page:1,
  49. limit:8,
  50. signList:[],
  51. isAuto: false, //没有授权的不会自动授权
  52. isShowAuth: false //是否隐藏授权
  53. };
  54. },
  55. computed: mapGetters(['isLogin']),
  56. watch:{
  57. isLogin:{
  58. handler:function(newV,oldV){
  59. if(newV){
  60. this.getSignMoneList();
  61. }
  62. },
  63. deep:true
  64. }
  65. },
  66. onLoad(){
  67. if(this.isLogin){
  68. this.getSignMoneList();
  69. }else{
  70. toLogin();
  71. }
  72. },
  73. onReachBottom: function () {
  74. this.getSignMoneList();
  75. },
  76. methods: {
  77. /**
  78. *
  79. * 授权回调
  80. */
  81. onLoadFun:function(){
  82. this.getSignMoneList();
  83. },
  84. // 授权关闭
  85. authColse:function(e){
  86. this.isShowAuth = e
  87. },
  88. /**
  89. * 获取签到记录列表
  90. */
  91. getSignMoneList:function(){
  92. let that=this;
  93. if(that.loading) return;
  94. if(that.loadend) return;
  95. that.loading = true;
  96. that.loadtitle = "";
  97. getSignMonthList({ page: that.page, limit: that.limit }).then(res=>{
  98. let list = res.data;
  99. let loadend = list.length < that.limit;
  100. that.signList = that.$util.SplitArray(list, that.signList);
  101. that.$set(that,'signList',that.signList);
  102. that.loadend = loadend;
  103. that.loading = false;
  104. that.loadtitle = loadend ? that.$t(`我也是有底线的`) : that.$t(`加载更多`);
  105. }).catch(err=>{
  106. that.loading = false;
  107. that.loadtitle = that.$t(`加载更多`);
  108. });
  109. },
  110. }
  111. }
  112. </script>
  113. <style>
  114. </style>