<template>
  <div class="app-page">
    <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
      <van-list
        v-model:loading="loading"
        v-model:error="loadError"
        :finished="finished"
        finished-text=""
        error-text="加载错误，请点击重新加载"
        @load="onLoad"
      >
        <div class="list" v-if="list.length">
          <!-- <VideoItem v-for="(item, index) in list" :key="index" :item="item" /> -->
          <Item v-for="(item, index) in list" :key="index" :item="item" />
        </div>
        <Empty v-else-if="!loading" text="暂无更多数据..." />
      </van-list>
    </van-pull-refresh>
  </div>
</template>

<script setup>
import { ref } from "vue";
import { useRoute } from "vue-router";
import { queryLivePlanNew } from "@/api/index";
// import VideoItem from "@/components/VideoItem2.vue";
import Item from "./components/Item";
const route = useRoute();
const list = ref([]);
const loading = ref(false);
const loadError = ref(false);
const finished = ref(false);
const refreshing = ref(false);
const current = ref(1);

const onRefresh = () => {
  current.value = 1;
  // 清空列表数据
  finished.value = false;

  // 重新加载数据
  // 将 loading 设置为 true，表示处于加载状态
  loading.value = true;
  onLoad();
};
const onLoad = async () => {
  // 异步更新数据
  let ret = await queryLivePlanNew(
    Object.assign(
      {
        size: 10,
        lastId:
          refreshing.value || !list.value.length
            ? ""
            : list.value[list.value.length - 1].id,
        lastStartTime:
          refreshing.value || !list.value.length
            ? ""
            : list.value[list.value.length - 1].startTime,
        lastSort:
          refreshing.value || !list.value.length
            ? ""
            : list.value[list.value.length - 1].sort,
        lastIsRecommend:
          refreshing.value || !list.value.length
            ? ""
            : list.value[list.value.length - 1].isRecommend,
        limitTypeStr: route.query.limitTypeStr,
      },
      route.query.advisorId
        ? { advisorId: route.query.advisorId, type: 1 }
        : { deptId: route.query.deptId, type: 2 }
    )
  );
  if (ret.code === 0) {
    if (refreshing.value) {
      list.value = [];
      refreshing.value = false;
    }
    current.value++;
    list.value = list.value.concat(ret.data.list);
    finished.value = !ret.data.hasNext;
  } else {
    loadError.value = true;
  }
  loading.value = false;
};
</script>

<style scoped lang="scss">
.app-page {
  padding: 0 32px;
  background: #fff;
}
</style>
