fix live detail loading

This commit is contained in:
2023-12-22 15:37:26 +08:00
parent 0c62ad8685
commit ee93182b54
9 changed files with 56 additions and 44 deletions

View File

@@ -264,8 +264,8 @@ async function ChangeBili() {
</NSpace>
<NDivider />
<NSpace justify="center">
<NButton type="info" @click="resetNameModalVisiable = true"> 修改用户名 </NButton>
<NButton type="warning" @click="resetPasswordModalVisiable = true"> 修改密码 </NButton>
<NButton type="warning" @click="resetNameModalVisiable = true"> 修改用户名 </NButton>
<NPopconfirm @positive-click="logout">
<template #trigger>
<NButton type="error"> 登出 </NButton>

View File

@@ -4,8 +4,8 @@ import { DanmakuModel, ResponseLiveInfoModel } from '@/api/api-models'
import { QueryGetAPI } from '@/api/query'
import DanmakuContainer from '@/components/DanmakuContainer.vue'
import { LIVE_API_URL } from '@/data/constants'
import { NButton, useMessage } from 'naive-ui'
import { ref } from 'vue'
import { NButton, NEmpty, NSpin, useMessage } from 'naive-ui'
import { onActivated, ref } from 'vue'
import { useRoute, useRouter } from 'vue-router'
interface ResponseLiveDetail {
@@ -18,9 +18,12 @@ const message = useMessage()
const route = useRoute()
const router = useRouter()
const isLoading = ref(true)
const liveInfo = ref<ResponseLiveDetail | undefined>(await get())
async function get() {
isLoading.value = true
try {
const data = await QueryGetAPI<ResponseLiveDetail>(LIVE_API_URL + 'get', {
id: route.params.id,
@@ -34,28 +37,40 @@ async function get() {
}
} catch (err) {
message.error('无法获取数据')
} finally {
isLoading.value = false
}
return undefined
}
onActivated(async () => {
if (liveInfo.value?.live.liveId != route.params.id) {
liveInfo.value = await get()
}
})
</script>
<template>
<NButton @click="router.go(-1)" text>
{{ '< 返回' }}
</NButton>
<DanmakuContainer
v-if="liveInfo"
ref="danmakuContainerRef"
:current-live="liveInfo.live"
:current-danmakus="liveInfo.danmakus"
:height="750"
show-rank
show-liver
show-live-info
show-tools
show-name
to="userDanmakus"
:item-range="100"
:item-height="25"
/>
<NSpin v-if="isLoading" show />
<template v-else>
<NButton @click="router.go(-1)" text>
{{ '< 返回' }}
</NButton>
<DanmakuContainer
v-if="liveInfo"
ref="danmakuContainerRef"
:current-live="liveInfo.live"
:current-danmakus="liveInfo.danmakus"
:height="750"
show-rank
show-liver
show-live-info
show-tools
show-name
to="userDanmakus"
:item-range="100"
:item-height="25"
/>
<NEmpty v-else description="无数据" />
</template>
</template>

View File

@@ -39,6 +39,7 @@ function OnClickCover(live: ResponseLiveInfoModel) {
params: { id: live.liveId },
})
}
</script>
<template>
@@ -54,7 +55,7 @@ function OnClickCover(live: ResponseLiveInfoModel) {
<NDivider />
<NList bordered hoverable clickable>
<NListItem @click="OnClickCover(live)" v-for="live in lives" v-bind:key="live.liveId">
<LiveInfoContainer :live="live" />
<LiveInfoContainer :live="live" :key="live.liveId"/>
</NListItem>
</NList>
</template>

View File

@@ -546,7 +546,15 @@ onUnmounted(() => {
<NSlider style="min-width: 200px" v-model:value="settings.speechInfo.rate" :min="0" :max="2" :step="0.01" />
</span>
</NSpace>
<NDivider> 自定义内容 </NDivider>
<NDivider>
自定义内容
<NTooltip>
<template #trigger>
<NIcon :component="Info24Filled" />
</template>
留空则不念
</NTooltip>
</NDivider>
<NSpace vertical>
<NSpace>
支持的变量: