<template>
  <div class="unwatch-list-page">
    <div class="book-video-list">
      <van-list v-model:loading="loading" :finished="finished" :finished-text="finishedTextStatus ? '没有更多了' : ''" @load="onLoad">
        <template v-if="prod_list.length" v-for="item in prod_list" :key="item" style="height: 3rem;">
          <video-card :item="item"></video-card>
        </template>
      </van-list>
    </div>
    <div style="height: 2rem;"></div>
    <van-empty v-if="emptyStatus"
      class="custom-image"
      :image="no_image"
      description="暂无未看"
    />
  </div>
</template>

<script setup>
import { mainStore } from '@/store'
import { storeToRefs } from 'pinia'

import no_image from '@images/que-shuju@2x.png'

import { useUnwatchList } from '@/composables/useUnwatchList.js'

import VideoCard from '@/components/VideoCard/index.vue'

import { ref, onActivated, computed } from 'vue'
import { useRoute, useRouter, onBeforeRouteLeave } from 'vue-router'
import $ from 'jquery'
import _ from 'lodash';
import { wxInfo } from '@/utils/tools';

const $route = useRoute();
const $router = useRouter();

const { onLoad, prod_list, finished, loading, finishedTextStatus, emptyStatus } = useUnwatchList();

/****************** keepAlive 模块 *******************/

// TAG: keepAlive 缓存页面
const store = mainStore();
store.keepThisPage($route.meta.name);

onActivated(() => { // keepAlive 重置后执行回调
  // TAG: pinia应用，动态刷新数据
  // 处理数据未刷新数据显示问题
  // Pinia 解构方法：storeToRefs
  const { video_detail } = storeToRefs(store);
  // 如果作品信息有变化及时修正
  const arr = ref([]);
  _.each(prod_list.value, (item) => {
    if (item.id === video_detail.value.id) {
      item = video_detail.value
    }
    arr.value.push(item);
  })
  // 触发更新
  prod_list.value = arr.value;

  const { scrollTop } = storeToRefs(store);
  // 嵌套滚动，执行两个，先滚外面再滚里面
  _.times(2, () => {
    $("html,body").animate({ "scrollTop": String(scrollTop.value) + 'px' });
  });

  // 监听记录滚动位置
  window.addEventListener('scroll',()=>{
    if (window.scrollY) {
      store.changeScrollTop(window.scrollY)
    }
  });
});

// 监听记录滚动位置
window.addEventListener('scroll',()=>{
  if (window.scrollY) {
    store.changeScrollTop(window.scrollY)
  }
});

/*********************************************************/

</script>

<script>
import mixin from 'common/mixin';

export default {
  name: 'unwatchList',
  mixins: [mixin.init],
  data() {
    return {

    }
  },
  mounted() {

  },
  methods: {

  }
}
</script>

<style lang="less" scoped>
</style>