index.vue 1.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788
  1. <template>
  2. <view class="main">
  3. <navbar :config="config" backColor="#999999"></navbar>
  4. <welfareGoods :listData="listData" @tabChange="tabChange"></welfareGoods>
  5. <u-loadmore :status="loadStatus" />
  6. </view>
  7. </template>
  8. <script>
  9. export default{
  10. data(){
  11. return {
  12. config: {
  13. back: true,
  14. title: '公益福利购',
  15. color: '#1A1A1A',
  16. backgroundColor: [1, "#fff"],
  17. statusBarFontColor: '#1A1A1A'
  18. },
  19. // 包含【新人专区】【公益申领】
  20. pageParams:{
  21. page: 1,
  22. limit: 10,
  23. order_type: 1, // 1是综合(设置的顺序),2是新品,3价格,4销量
  24. order_mode: ''
  25. },
  26. listData: [],
  27. loadStatus: 'loadmore',//loading / nomore
  28. }
  29. },
  30. onLoad() {
  31. this.getList(true);
  32. },
  33. onPullDownRefresh() {
  34. this.getList(true);
  35. uni.stopPullDownRefresh();
  36. },
  37. methods:{
  38. // 获取列表
  39. getList(isRefresh,needLoading = false) {
  40. let that = this;
  41. if (!isRefresh && this.loadStatus == 'nomore') {
  42. return false;
  43. }
  44. this.pageParams.page = isRefresh ? 1 : this.pageParams.page + 1;
  45. this.listData = isRefresh ? [] : this.listData;
  46. if(needLoading){
  47. uni.showLoading({
  48. title: '努力加载中...',
  49. mask: true
  50. });
  51. }
  52. this.loadStatus = 'loading';
  53. this.$http.get('/goodsareafeature/welfarePage',this.pageParams)
  54. .then(res=>{
  55. if (res.code == 200) {
  56. let listData = that.listData;
  57. listData.push(...res.page.list);
  58. that.listData = listData;
  59. that.loadStatus = that.listData.length >= res.page.totalCount?'nomore':'loadmore';
  60. }
  61. })
  62. .finally(()=>{
  63. if(needLoading){
  64. uni.hideLoading();
  65. }
  66. })
  67. },
  68. tabChange(tab){
  69. this.pageParams = {
  70. ...this.pageParams,
  71. order_type: tab.index+1,
  72. order_mode: tab.sort
  73. }
  74. this.getList(true);
  75. }
  76. },
  77. onReachBottom(){
  78. this.getList();
  79. }
  80. }
  81. </script>
  82. <style lang="scss" scoped>
  83. .main{
  84. padding: 0 0 30rpx 0;
  85. }
  86. </style>