@@ -437,6 +439,7 @@ provide('getVideoType', () => props.type!)
(), {
maxCount: 3, // 最多显示的头像数量
})
@@ -65,6 +66,14 @@ const displayedAvatars = computed(() => {
>
+
diff --git a/src/contentScripts/views/Home/components/Following.vue b/src/contentScripts/views/Home/components/Following.vue
index ec093fcf..7274a8da 100644
--- a/src/contentScripts/views/Home/components/Following.vue
+++ b/src/contentScripts/views/Home/components/Following.vue
@@ -4,6 +4,7 @@ import type { Ref } from 'vue'
import type { Author } from '~/components/VideoCard/types'
import { useBewlyApp } from '~/composables/useAppProvider'
import type { GridLayoutType } from '~/logic'
+import type { FollowingLiveResult, List as FollowingLiveItem } from '~/models/live/getFollowingLiveList'
import type { DataItem as MomentItem, MomentResult } from '~/models/moment/moment'
import api from '~/utils/api'
@@ -15,6 +16,11 @@ interface VideoElement {
authorList?: Author[]
}
+interface LiveVideoElement {
+ uniqueId: string
+ item?: FollowingLiveItem
+}
+
const props = defineProps<{
gridLayout: GridLayoutType
}>()
@@ -33,6 +39,7 @@ const gridValue = computed((): string => {
})
const videoList = ref
([])
+const liveVideoList = ref([])
const isLoading = ref(false)
const needToLoginFirst = ref(false)
const containerRef = ref() as Ref
@@ -42,6 +49,7 @@ const noMoreContent = ref(false)
const { handleReachBottom, handlePageRefresh, haveScrollbar } = useBewlyApp()
onMounted(() => {
+ getLiveVideoList()
initData()
initPageAction()
})
@@ -90,6 +98,60 @@ async function getData() {
}
}
+/**
+ * Get all livestreaming videos of followed users
+ */
+const livePage = ref(1)
+async function getLiveVideoList() {
+ let lastLiveVideoListLength = liveVideoList.value.length
+ try {
+ const response: FollowingLiveResult = await api.live.getFollowingLiveList({
+ page: livePage.value,
+ page_size: 9,
+ })
+
+ if (response.code === -101) {
+ noMoreContent.value = true
+ needToLoginFirst.value = true
+ return
+ }
+
+ if (response.code === 0) {
+ if (response.data.list.length < 9)
+ noMoreContent.value = true
+
+ livePage.value++
+
+ const resData = [] as FollowingLiveItem[]
+
+ response.data.list.forEach((item: FollowingLiveItem) => {
+ // 只保留正在直播的
+ if (item.live_status === 1)
+ resData.push(item)
+ })
+
+ // when videoList has length property, it means it is the first time to load
+ if (!liveVideoList.value.length) {
+ liveVideoList.value = resData.map(item => ({ uniqueId: `${item.roomid}`, item }))
+ }
+ else {
+ resData.forEach((item) => {
+ liveVideoList.value[lastLiveVideoListLength++] = {
+ uniqueId: `${item.roomid}`,
+ item,
+ }
+ })
+ }
+ }
+ }
+ finally {
+ // 當直播列表結果大於9時(9是返回的列表數量)且如果最后一支影片還是正在直播,則繼續獲取
+ if (liveVideoList.value.length > 9 && liveVideoList.value[liveVideoList.value.length - 1]?.item?.live_status === 1) {
+ getFollowedUsersVideos()
+ }
+ }
+}
+
async function getFollowedUsersVideos() {
if (noMoreContent.value)
return
@@ -217,6 +279,29 @@ defineExpose({ initData })
m="b-0 t-0" relative w-full h-full
:grid="gridValue"
>
+
+