feat: 添加最新版本信息和下载链接逻辑

This commit is contained in:
2025-06-06 00:28:27 +08:00
parent cfb95eca4e
commit 134e993274
3 changed files with 116 additions and 11 deletions

17
app.vue
View File

@@ -162,6 +162,23 @@ onMounted(() => {
{ immediate: true } { immediate: true }
); );
}); });
// 数据获取
export interface Release {
assets: {
name: string;
browser_download_url: string;
}[];
tag_name: string;
created_at: string;
body: string;
}
const { data: latestRelease }: { data: Ref<Release> } = await useFetch(
"https://gitee.com/api/v5/repos/spark-store-project/spark-store/releases/latest"
);
provide("latestRelease", latestRelease);
</script> </script>
<template> <template>

View File

@@ -1,6 +1,10 @@
<script setup lang="ts"> <script setup lang="ts">
import { MdPreview } from "md-editor-v3"; import { MdPreview } from "md-editor-v3";
import "md-editor-v3/lib/preview.css"; import "md-editor-v3/lib/preview.css";
import type { Release } from "~/app.vue";
import { useToast } from "primevue/usetoast";
const toast = useToast();
const selectedArch = ref("amd64"); const selectedArch = ref("amd64");
const archList = [ const archList = [
@@ -37,12 +41,45 @@ const faqContent = ref(
const startDownload = () => { const startDownload = () => {
downloadStarted.value = true; downloadStarted.value = true;
// 模拟下载过程 if (selectedArch.value === "loong64") {
// setTimeout(() => { toast.add({
// dialog.value = false; severity: "error",
// // 在这里可以添加实际的下载逻辑 summary: "请前往 Gitee 手动下载",
// // 比如调用 API 创建下载任务等 detail:
// }, 2000); "loong64 架构的安装包不同发行版有所不同,请前往 Gitee 手动下载。\n5s 后自动跳转。",
life: 5000,
});
setTimeout(() => {
window.open(
"https://gitee.com/spark-store-project/spark-store/releases/latest",
"_blank"
);
}, 5000);
} else {
// 创建下载任务
const downloadLink = downloadUrl.value;
if (downloadLink) {
const a = document.createElement("a");
a.href = downloadLink;
a.download = `spark-store-${selectedArch.value}.deb`;
document.body.appendChild(a);
a.click();
document.body.removeChild(a);
toast.add({
severity: "success",
summary: "下载任务已创建",
detail: `正在下载适用于 ${selectedArch.value} 架构的星火应用商店安装包,请在浏览器下载管理器中查看进度。`,
life: 5000,
});
} else {
toast.add({
severity: "error",
summary: "下载链接错误",
detail: "无法找到适合您架构的下载链接,请稍后再试。",
life: 5000,
});
}
}
}; };
watchEffect(() => { watchEffect(() => {
@@ -51,6 +88,29 @@ watchEffect(() => {
downloadStarted.value = false; downloadStarted.value = false;
} }
}); });
const latestRelease = inject<Ref<Release>>("latestRelease");
const downloadUrl = computed(() => {
if (selectedArch.value === "loong64") {
return "https://gitee.com/spark-store-project/spark-store/releases/latest";
}
for (const asset of latestRelease?.value.assets || []) {
if (asset.name.includes(selectedArch.value)) {
return asset.browser_download_url;
}
}
return "";
});
const consoleDownloadUrl = computed(() => {
for (const asset of latestRelease?.value.assets || []) {
if (asset.name.includes("all")) {
return asset.browser_download_url;
}
}
return "";
});
</script> </script>
<template> <template>
@@ -105,7 +165,14 @@ watchEffect(() => {
@click="dialog = true" @click="dialog = true"
> >
<p class="translate-y-0.5">下载最新版本</p> <p class="translate-y-0.5">下载最新版本</p>
<p class="text-lg opacity-75">V4.5.2 | 2025-03-15</p> <p class="text-lg opacity-75">
V{{ latestRelease?.tag_name }} |
{{
new Date(latestRelease!.created_at)
.toLocaleDateString()
.replace(/\//g, "-")
}}
</p>
<Icon <Icon
name="sp:spark" name="sp:spark"
class="absolute top-0 right-0 s-color-primary-200 w-20 translate-x-1/6 -translate-y-2/9 opacity-60" class="absolute top-0 right-0 s-color-primary-200 w-20 translate-x-1/6 -translate-y-2/9 opacity-60"
@@ -115,7 +182,8 @@ watchEffect(() => {
}" }"
/> />
</button> </button>
<button <a
:href="consoleDownloadUrl"
class="relative items-center gap-2 flex py-2 px-4 font-bold rounded-2xl overflow-hidden from-primary-400 to-primary-500 bg-linear-to-r dark:from-primary-500 dark:to-primary-600 before:content-[''] before:absolute before:top-0 before:left-0 before:w-full before:h-full before:border-5 before:border-[transparent] before:rounded-2xl before:bg-white before:bg-clip-content before:opacity-50 dark:before:bg-secondary-950 dark:before:opacity-80" class="relative items-center gap-2 flex py-2 px-4 font-bold rounded-2xl overflow-hidden from-primary-400 to-primary-500 bg-linear-to-r dark:from-primary-500 dark:to-primary-600 before:content-[''] before:absolute before:top-0 before:left-0 before:w-full before:h-full before:border-5 before:border-[transparent] before:rounded-2xl before:bg-white before:bg-clip-content before:opacity-50 dark:before:bg-secondary-950 dark:before:opacity-80"
> >
<Icon name="proicons:terminal" class="text-primary-500 text-6xl" /> <Icon name="proicons:terminal" class="text-primary-500 text-6xl" />
@@ -125,7 +193,7 @@ watchEffect(() => {
全平台支持 仅包含基本功能 全平台支持 仅包含基本功能
</p> </p>
</div> </div>
</button> </a>
</div> </div>
<div class="flex flex-col items-center justify-center gap-2"> <div class="flex flex-col items-center justify-center gap-2">
<div class="flex gap-8 font-bold text-lg"> <div class="flex gap-8 font-bold text-lg">
@@ -229,6 +297,9 @@ watchEffect(() => {
阅读以下安装须知了解星火应用商店在不同发行版的安装方式 阅读以下安装须知了解星火应用商店在不同发行版的安装方式
</p> </p>
</div> </div>
<Message v-if="selectedArch === 'loong64'" severity="error">
loong64 架构的安装包不同发行版有所不同请前往 Gitee 手动下载
</Message>
<div class="flex-grow bg-surface-100 rounded-xl h-[0] dark:bg-black"> <div class="flex-grow bg-surface-100 rounded-xl h-[0] dark:bg-black">
<ScrollPanel <ScrollPanel
ref="scrollPanel" ref="scrollPanel"
@@ -249,6 +320,18 @@ watchEffect(() => {
:theme="sDark ? 'dark' : 'light'" :theme="sDark ? 'dark' : 'light'"
preview-theme="github" preview-theme="github"
/> />
<a
href="https://gitee.com/spark-store-project/spark-store/releases/latest"
class="font-bold text-xl text-primary-color hover:underline pl-4"
target="_blank"
>
V{{ latestRelease?.tag_name }}
</a>
<MdPreview
:model-value="latestRelease?.body || ''"
:theme="sDark ? 'dark' : 'light'"
preview-theme="github"
/>
</ScrollPanel> </ScrollPanel>
</div> </div>
<div class="flex justify-between gap-4"> <div class="flex justify-between gap-4">
@@ -287,7 +370,7 @@ watchEffect(() => {
</div> </div>
<p class="text-lg leading-[2]"> <p class="text-lg leading-[2]">
应用商店安装包下载已开始<br />如果创建下载任务失败<a 应用商店安装包下载已开始<br />如果创建下载任务失败<a
href="#" :href="downloadUrl"
class="text-primary-color underline" class="text-primary-color underline"
>点击此处重试</a >点击此处重试</a
> >
@@ -303,6 +386,7 @@ watchEffect(() => {
</div> </div>
</div> </div>
</Dialog> </Dialog>
<Toast />
</div> </div>
</template> </template>

View File

@@ -1,4 +1,6 @@
<script setup lang="ts"> <script setup lang="ts">
import type { Release } from "~/app.vue";
const scrollPanel = inject<Ref<ComponentPublicInstance>>("scrollPanel"); const scrollPanel = inject<Ref<ComponentPublicInstance>>("scrollPanel");
const sProgress = ref(0); const sProgress = ref(0);
@@ -62,6 +64,8 @@ onMounted(() => {
sProgress.value = scrollTop / clientHeight; sProgress.value = scrollTop / clientHeight;
}); });
}); });
const latestRelease = inject<Ref<Release>>("latestRelease");
</script> </script>
<template> <template>
@@ -123,7 +127,7 @@ onMounted(() => {
<div class="flex flex-col items-start justify-between"> <div class="flex flex-col items-start justify-between">
<span <span
class="font-(family-name:--s-title-font) px-4 py-0.5 text-white from-primary-400 to-primary-500 bg-linear-to-r rounded-full dark:from-primary-500 dark:to-primary-600" class="font-(family-name:--s-title-font) px-4 py-0.5 text-white from-primary-400 to-primary-500 bg-linear-to-r rounded-full dark:from-primary-500 dark:to-primary-600"
>V4.5.2</span >V{{ latestRelease?.tag_name }}</span
> >
<h2 <h2
class="text-lg font-(family-name:--s-title-font) text-primary-500" class="text-lg font-(family-name:--s-title-font) text-primary-500"