mirror of
https://github.com/BTMuli/TeyvatGuide.git
synced 2025-12-12 09:18:14 +08:00
🐛 修复banner为空时的渲染异常
This commit is contained in:
@@ -2,7 +2,12 @@
|
|||||||
<div :id="`anno_card_${props.modelValue.id}`" class="anno-card">
|
<div :id="`anno_card_${props.modelValue.id}`" class="anno-card">
|
||||||
<div class="anno-cover" :title="props.modelValue.title">
|
<div class="anno-cover" :title="props.modelValue.title">
|
||||||
<img :src="localBanner" alt="cover" @click="createAnno" v-if="localBanner" />
|
<img :src="localBanner" alt="cover" @click="createAnno" v-if="localBanner" />
|
||||||
<v-progress-circular color="primary" :indeterminate="true" />
|
<v-progress-circular
|
||||||
|
color="primary"
|
||||||
|
:indeterminate="true"
|
||||||
|
v-else-if="props.modelValue.banner !== ''"
|
||||||
|
/>
|
||||||
|
<img src="/source/UI/defaultCover.webp" alt="cover" v-else />
|
||||||
<div class="anno-info">
|
<div class="anno-info">
|
||||||
<div class="anno-time">
|
<div class="anno-time">
|
||||||
<v-icon>mdi-clock-time-four-outline</v-icon>
|
<v-icon>mdi-clock-time-four-outline</v-icon>
|
||||||
@@ -39,7 +44,9 @@ const localBanner = ref<string>();
|
|||||||
const localTag = ref<string>();
|
const localTag = ref<string>();
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
|
if (props.modelValue.banner !== "") {
|
||||||
localBanner.value = await saveImgLocal(props.modelValue.banner);
|
localBanner.value = await saveImgLocal(props.modelValue.banner);
|
||||||
|
}
|
||||||
localTag.value = await saveImgLocal(props.modelValue.tagIcon);
|
localTag.value = await saveImgLocal(props.modelValue.tagIcon);
|
||||||
});
|
});
|
||||||
|
|
||||||
@@ -48,10 +55,14 @@ watch(
|
|||||||
async () => {
|
async () => {
|
||||||
if (localBanner.value && localBanner.value.startsWith("blob:")) {
|
if (localBanner.value && localBanner.value.startsWith("blob:")) {
|
||||||
URL.revokeObjectURL(localBanner.value);
|
URL.revokeObjectURL(localBanner.value);
|
||||||
|
localBanner.value = undefined;
|
||||||
}
|
}
|
||||||
|
if (props.modelValue.banner !== "") {
|
||||||
localBanner.value = await saveImgLocal(props.modelValue.banner);
|
localBanner.value = await saveImgLocal(props.modelValue.banner);
|
||||||
|
}
|
||||||
if (localTag.value && localTag.value.startsWith("blob:")) {
|
if (localTag.value && localTag.value.startsWith("blob:")) {
|
||||||
URL.revokeObjectURL(localTag.value);
|
URL.revokeObjectURL(localTag.value);
|
||||||
|
localTag.value = undefined;
|
||||||
}
|
}
|
||||||
localTag.value = await saveImgLocal(props.modelValue.tagIcon);
|
localTag.value = await saveImgLocal(props.modelValue.tagIcon);
|
||||||
},
|
},
|
||||||
|
|||||||
@@ -1,12 +1,9 @@
|
|||||||
/**
|
/**
|
||||||
* @file web utils transAnno.ts
|
* @file web utils transAnno.ts
|
||||||
* @description 公告数据转换工具
|
* @description 公告数据转换工具
|
||||||
* @since Beta v0.4.4
|
* @since Beta v0.6.1
|
||||||
*/
|
*/
|
||||||
|
|
||||||
// 默认封面图
|
|
||||||
const defaultCover = "/source/UI/defaultCover.webp";
|
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* @description 获取公告标签
|
* @description 获取公告标签
|
||||||
* @since Beta v0.4.4
|
* @since Beta v0.4.4
|
||||||
@@ -31,7 +28,7 @@ function getAnnoTag(tag: string): string {
|
|||||||
|
|
||||||
/**
|
/**
|
||||||
* @description 将获取到的数据转为渲染用的卡片
|
* @description 将获取到的数据转为渲染用的卡片
|
||||||
* @since Beta v0.4.3
|
* @since Beta v0.6.1
|
||||||
* @param {TGApp.BBS.Announcement.ListData[]} data 公告数据
|
* @param {TGApp.BBS.Announcement.ListData[]} data 公告数据
|
||||||
* @returns {TGApp.App.Announcement.ListCard[]} 渲染用的卡片
|
* @returns {TGApp.App.Announcement.ListCard[]} 渲染用的卡片
|
||||||
*/
|
*/
|
||||||
@@ -48,7 +45,7 @@ export function getAnnoCard(
|
|||||||
id: anno.ann_id,
|
id: anno.ann_id,
|
||||||
title: anno.title,
|
title: anno.title,
|
||||||
subtitle: anno.subtitle.replace(/<br \/>/g, " "),
|
subtitle: anno.subtitle.replace(/<br \/>/g, " "),
|
||||||
banner: anno.banner || defaultCover,
|
banner: anno.banner,
|
||||||
typeLabel: anno.type === 2 ? "游戏公告" : "活动公告",
|
typeLabel: anno.type === 2 ? "游戏公告" : "活动公告",
|
||||||
tagIcon: anno.tag_icon,
|
tagIcon: anno.tag_icon,
|
||||||
tagLabel: getAnnoTag(anno.tag_label),
|
tagLabel: getAnnoTag(anno.tag_label),
|
||||||
|
|||||||
Reference in New Issue
Block a user