like.vue
1.88 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
<!--
* @Author: hookehuyr hookehuyr@gmail.com
* @Date: 2022-05-26 23:52:36
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2022-06-09 16:13:33
* @FilePath: /tswj/src/views/me/like.vue
* @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
-->
<template>
<div class="book-video-list">
<template v-for="item in prodList" :key="item" style="height: 3rem;">
<video-card :item="item"></video-card>
</template>
<div style="height: 2rem;"></div>
</div>
<van-empty v-if="emptyStatus"
class="custom-image"
:image="no_image"
description="暂无点赞"
/>
</template>
<script setup>
import VideoCard from '@/components/VideoCard/index.vue'
import no_image from '@images/que-shuju@2x.png'
import { onBeforeRouteLeave } from 'vue-router'
import { ref, onMounted } from 'vue'
import _ from 'lodash'
import { useScrollTop } from '@/composables';
import { myLikeAPI } from '@/api/C/me.js'
/******************** 返回点击位置 ********************/
const { resetScrollTop, store } = useScrollTop(); // 页面滚动恢复
resetScrollTop('scrollTopLike');
onBeforeRouteLeave(() => {
// 监听记录滚动位置
store.changeScrollTopLike(window.scrollY)
})
/*****************************************************/
// 处理书籍下作品列表
const prodList = ref([]);
// 因为不能让空图标提前出来的写法
const emptyStatus = ref(false);
onMounted(async () => {
// 获取点赞列表
const { data } = await myLikeAPI();
if (!data.prod.length) {
emptyStatus.value = true;
} else {
prodList.value = data.prod;
_.each(prodList.value, (item) => {
item.type = 'read-only'; // 特殊标识，判断入口 为keepAlive使用
})
emptyStatus.value = false;
}
});
</script>
<style lang="less" scoped>
</style>