🐛 修复兑换码为空时的渲染异常

This commit is contained in:
目棃
2024-09-27 09:08:25 +08:00
parent 96c58aff85
commit b37a08601d
2 changed files with 28 additions and 16 deletions

View File

@@ -59,25 +59,17 @@ async function tryGetCode(): Promise<void> {
if (!navFind) return;
const actId = new URL(navFind.app_path).searchParams.get("act_id");
if (!actId) {
showSnackbar({
text: "未找到活动ID",
color: "warn",
});
showSnackbar({ text: "未找到活动ID", color: "warn" });
return;
}
const res = await TGRequest.Nav.getCode(actId);
if (!Array.isArray(res)) {
showSnackbar({
text: `[${res.retcode}] ${res.message}`,
color: "warn",
});
showSnackbar({ text: `[${res.retcode}] ${res.message}`, color: "warn" });
return;
}
codeData.value = res;
showSnackbar({
text: "获取兑换码成功",
color: "success",
});
showSnackbar({ text: "获取兑换码成功", color: "success" });
await TGLogger.Info(JSON.stringify(res));
showOverlay.value = true;
}

View File

@@ -4,17 +4,27 @@
<div class="tolc-title">兑换码</div>
<v-list-item v-for="(item, index) in props.data" :key="index">
<template #title>
{{ item.code }}
{{ item.code === "" ? "暂无兑换码" : item.code }}
</template>
<template #subtitle>
<div v-html="item.title"></div>
<span>{{ timestampToDate(Number(item.to_get_time) * 1000) }}</span>
<span title="开放时间">{{ timestampToDate(Number(item.to_get_time) * 1000) }}</span>
</template>
<template #prepend>
<img :src="item.img" alt="icon" />
<img
:src="item.img === '' ? '/source/UI/empty.webp' : item.img"
alt="icon"
class="tolc-icon"
/>
</template>
<template #append>
<v-btn @click="copy(item.code)" icon="mdi-content-copy" variant="outlined"></v-btn>
<v-btn
:disabled="item.code === ''"
@click="copy(item.code)"
icon="mdi-content-copy"
variant="outlined"
class="tolc-btn"
></v-btn>
</template>
</v-list-item>
</div>
@@ -66,4 +76,14 @@ function copy(code: string): void {
font-size: 20px;
text-align: center;
}
.tolc-icon {
width: 40px;
margin-right: 10px;
aspect-ratio: 1;
}
.tolc-btn {
margin-left: 10px;
}
</style>