horzi_rai_wxa/reportPages/morningAll/morningAll.vue

<template>
  <view class="container morning-all-content">
    <view class="content-ul" v-for="item in collectList" :key="item.Id" @click="lookDetails(item)">
      <view class="title">{{ item.Title }}</view>
      <view class="body">
        <text style="flex: 1">{{ item.IndustryName }}</text>
        <view><van-icon name="arrow" /></view>
      </view>
    </view>
    <u-loadmore :status="status" icon-type="flower" :load-text="loadText" margin-top="20" v-if="page_no > 1" />
  </view>
</template>

<script>
import { Reports } from "@/config/api.js";
export default {
  data() {
    return {
      collectList: [],
      page_no: 1,
      pageSize: 10,
      status: "loadmore",
      loadText: {
        loadmore: "上拉加载更多",
        loading: "加载中",
        nomore: "已经到底了",
      },
    };
  },
  methods: {
    // 获取数据
    async getDataList() {
      const res = await Reports.getMorningMeetingList({
        PageSize: this.pageSize,
        CurrentIndex: this.page_no,
      });
      if (res.Ret === 200) {
        this.status = res.Data.Paging.IsEnd ? "nomore" : "loadmore";
        this.collectList = this.page_no == 1 ? res.Data.List || [] : this.collectList.concat(res.Data.List);
      }
    },
    // 查看资源包
    lookDetails(item) {
      uni.navigateTo({
        url: "/reportPages/morningDetails/morningDetails?id=" + item.Id,
      });
    },
  },
  onLoad() {
    this.getDataList();
  },
  // 上滑触底触发分页
  onReachBottom() {
    if (this.status === "nomore") return;
    this.page_no++;
    this.status = "loading";
    this.getDataList();
  },
};
</script>

<style scoped lang="scss">
.morning-all-content {
  background: #f7f7f7;
  padding: 35rpx;
  .content-ul {
    padding: 20rpx 30rpx;
    background-color: #fff;
    margin-bottom: 20rpx;
    border-radius: 4rpx;
    .title {
      font-weight: 500;
      font-size: 30rpx;
      line-height: 42rpx;
      color: #333333;
      padding-bottom: 16rpx;
      border-bottom: 2rpx dashed #ececec;
    }
    .body {
      padding: 20rpx 0;
      display: flex;
      align-items: center;
      font-weight: 400;
      font-size: 28rpx;
      line-height: 39rpx;
      color: #666666;
    }
  }
}
</style>