✨ 增加镜像源下载
This commit is contained in:
刘嘉伟
parent
1f246e3966
commit
6e028d377a
@ -5,6 +5,7 @@ import moment from "moment";
|
|||||||
import Breadcrumb from "@/layout/compoenets/Breadcrumb.vue";
|
import Breadcrumb from "@/layout/compoenets/Breadcrumb.vue";
|
||||||
import { ElMessage } from "element-plus";
|
import { ElMessage } from "element-plus";
|
||||||
import { useDebounceFn } from "@vueuse/core";
|
import { useDebounceFn } from "@vueuse/core";
|
||||||
|
import IconifyIconOffline from "@/components/IconifyIcon/src/iconifyIconOffline";
|
||||||
|
|
||||||
defineComponent({
|
defineComponent({
|
||||||
name: "Download"
|
name: "Download"
|
||||||
@ -14,6 +15,17 @@ const versions = ref<Array<FrpVersion>>([]);
|
|||||||
const loading = ref(1);
|
const loading = ref(1);
|
||||||
const downloadPercentage = ref(0);
|
const downloadPercentage = ref(0);
|
||||||
const downloading = ref<Map<number, number>>(new Map<number, number>());
|
const downloading = ref<Map<number, number>>(new Map<number, number>());
|
||||||
|
const currMirror = ref("github");
|
||||||
|
const mirrors = ref<Array<GitHubMirror>>([
|
||||||
|
{
|
||||||
|
id: "github",
|
||||||
|
name: "github"
|
||||||
|
},
|
||||||
|
{
|
||||||
|
id: "ghproxy",
|
||||||
|
name: "ghproxy"
|
||||||
|
}
|
||||||
|
]);
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 获取版本
|
* 获取版本
|
||||||
@ -27,7 +39,11 @@ const handleLoadVersions = () => {
|
|||||||
* @param version
|
* @param version
|
||||||
*/
|
*/
|
||||||
const handleDownload = useDebounceFn((version: FrpVersion) => {
|
const handleDownload = useDebounceFn((version: FrpVersion) => {
|
||||||
ipcRenderer.send("github.download", version.id);
|
// console.log(version, currMirror.value);
|
||||||
|
ipcRenderer.send("github.download", {
|
||||||
|
versionId: version.id,
|
||||||
|
mirror: currMirror.value
|
||||||
|
});
|
||||||
downloading.value.set(version.id, 0);
|
downloading.value.set(version.id, 0);
|
||||||
}, 300);
|
}, 300);
|
||||||
|
|
||||||
@ -98,93 +114,154 @@ onUnmounted(() => {
|
|||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<div class="main">
|
<div class="main">
|
||||||
<breadcrumb />
|
<breadcrumb>
|
||||||
|
<div class="h-full flex items-center justify-center">
|
||||||
|
<span class="text-sm font-bold">下载源： </span>
|
||||||
|
<el-select class="w-24" v-model="currMirror">
|
||||||
|
<el-option
|
||||||
|
v-for="m in mirrors"
|
||||||
|
:label="m.name"
|
||||||
|
:key="m.id"
|
||||||
|
:value="m.id"
|
||||||
|
/>
|
||||||
|
</el-select>
|
||||||
|
</div>
|
||||||
|
<!-- <div-->
|
||||||
|
<!-- class="cursor-pointer h-[36px] w-[36px] bg-[#5f3bb0] rounded text-white flex justify-center items-center"-->
|
||||||
|
<!-- @click="handleOpenInsert"-->
|
||||||
|
<!-- >-->
|
||||||
|
<!-- <IconifyIconOffline icon="add" />-->
|
||||||
|
<!-- </div>-->
|
||||||
|
</breadcrumb>
|
||||||
<!-- <breadcrumb>-->
|
<!-- <breadcrumb>-->
|
||||||
<!-- <div class="flex items-center">-->
|
<!-- <div class="flex items-center">-->
|
||||||
<!-- <el-checkbox>加速下载</el-checkbox>-->
|
<!-- <el-checkbox>加速下载</el-checkbox>-->
|
||||||
<!-- </div>-->
|
<!-- </div>-->
|
||||||
<!-- </breadcrumb>-->
|
<!-- </breadcrumb>-->
|
||||||
<div class="app-container-breadcrumb pr-2" v-loading="loading > 0">
|
<div class="app-container-breadcrumb pr-2" v-loading="loading > 0">
|
||||||
<template v-if="versions && versions.length > 0">
|
<div class="w-full">
|
||||||
<el-row :gutter="20">
|
<template v-if="versions && versions.length > 0">
|
||||||
<el-col
|
<el-row :gutter="20">
|
||||||
v-for="version in versions"
|
<!-- <el-col :span="24">-->
|
||||||
:key="version.id"
|
<!-- <div class="h2 flex justify-between !mb-[10px]">-->
|
||||||
:lg="8"
|
<!-- <div>镜像源</div>-->
|
||||||
:md="8"
|
<!-- </div>-->
|
||||||
:sm="12"
|
<!-- <!– <div class="!mb-[10px]">–>-->
|
||||||
:xl="6"
|
<!-- <!– <el-radio-group v-model="currMirror">–>-->
|
||||||
:xs="24"
|
<!-- <!– <el-radio-button v-for="m in mirrors" :label="m" />–>-->
|
||||||
class="mb-[20px]"
|
<!-- <!– </el-radio-group>–>-->
|
||||||
>
|
<!-- <!– </div>–>-->
|
||||||
<div
|
<!-- </el-col>-->
|
||||||
class="w-full bg-white rounded p-4 drop-shadow-lg flex justify-between items-center"
|
<!-- <el-col :span="24">-->
|
||||||
|
<!-- <div class="h2 flex justify-between">-->
|
||||||
|
<!-- <div>版本选择</div>-->
|
||||||
|
<!-- </div>-->
|
||||||
|
<!-- </el-col>-->
|
||||||
|
<el-col
|
||||||
|
v-for="version in versions"
|
||||||
|
:key="version.id"
|
||||||
|
:lg="6"
|
||||||
|
:md="8"
|
||||||
|
:sm="12"
|
||||||
|
:xl="6"
|
||||||
|
:xs="12"
|
||||||
|
class="mb-[20px]"
|
||||||
>
|
>
|
||||||
<div class="left">
|
<div
|
||||||
<div class="mb-2">
|
class="w-full download-card bg-white rounded p-4 drop-shadow flex justify-between items-center"
|
||||||
<el-tag>{{ version.name }}</el-tag>
|
>
|
||||||
<!-- <el-tag class="ml-2">原文件名：{{ version.assets[0]?.name }}</el-tag>-->
|
<div class="left">
|
||||||
</div>
|
<div class="mb-2 flex items-center justify-center">
|
||||||
<div class="text-sm">
|
<span class="font-bold text-primary mr-2">{{
|
||||||
发布时间：<span class="text-gray-00 text-sm text-primary font-bold">{{
|
version.name
|
||||||
// moment(version.published_at).format("YYYY-MM-DD HH:mm:ss")
|
}}</span>
|
||||||
version.published_at
|
<el-tag size="small"> {{ version.size }}</el-tag>
|
||||||
}}</span>
|
<!-- <el-tag class="ml-2">原文件名：{{ version.assets[0]?.name }}</el-tag>-->
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="right">
|
|
||||||
<div v-if="version.download_completed">
|
|
||||||
<!-- <span class="text-[12px] text-primary font-bold mr-2"-->
|
|
||||||
<!-- >已下载</span-->
|
|
||||||
<!-- >-->
|
|
||||||
<el-button
|
|
||||||
type="text"
|
|
||||||
@click="handleDeleteVersion(version)"
|
|
||||||
>
|
|
||||||
<IconifyIconOffline class="mr-1" icon="check-box" />
|
|
||||||
已下载
|
|
||||||
</el-button>
|
|
||||||
<!-- <el-button type="text"></el-button>-->
|
|
||||||
<el-button
|
|
||||||
type="text"
|
|
||||||
class="danger-text"
|
|
||||||
@click="handleDeleteVersion(version)"
|
|
||||||
>
|
|
||||||
<IconifyIconOffline class="mr-1" icon="delete-rounded" />
|
|
||||||
删除
|
|
||||||
</el-button>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<template v-else>
|
|
||||||
<div class="w-32" v-if="downloading.has(version.id)">
|
|
||||||
<el-progress
|
|
||||||
:percentage="downloading.get(version.id)"
|
|
||||||
:text-inside="false"
|
|
||||||
/>
|
|
||||||
</div>
|
</div>
|
||||||
<el-button
|
<div class="text-[12px]">
|
||||||
v-else
|
<span class="">下载数：</span>
|
||||||
size="small"
|
<span class="text-primary font-bold"
|
||||||
type="primary"
|
>{{
|
||||||
@click="handleDownload(version)"
|
// moment(version.published_at).format("YYYY-MM-DD HH:mm:ss")
|
||||||
>
|
version.download_count
|
||||||
<IconifyIconOffline class="mr-1" icon="download" />
|
}}
|
||||||
下载
|
</span>
|
||||||
</el-button>
|
</div>
|
||||||
</template>
|
<div class="text-[12px]">
|
||||||
|
发布时间：<span class="text-primary font-bold">{{
|
||||||
|
// moment(version.published_at).format("YYYY-MM-DD HH:mm:ss")
|
||||||
|
version.published_at
|
||||||
|
}}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="right">
|
||||||
|
<div v-if="version.download_completed">
|
||||||
|
<!-- <span class="text-[12px] text-primary font-bold mr-2"-->
|
||||||
|
<!-- >已下载</span-->
|
||||||
|
<!-- >-->
|
||||||
|
<div>
|
||||||
|
<el-button
|
||||||
|
type="text"
|
||||||
|
size="small"
|
||||||
|
@click="handleDeleteVersion(version)"
|
||||||
|
>
|
||||||
|
<IconifyIconOffline class="mr-1" icon="check-box" />
|
||||||
|
已下载
|
||||||
|
</el-button>
|
||||||
|
</div>
|
||||||
|
<div>
|
||||||
|
<el-button
|
||||||
|
type="text"
|
||||||
|
size="small"
|
||||||
|
class="danger-text"
|
||||||
|
@click="handleDeleteVersion(version)"
|
||||||
|
>
|
||||||
|
<IconifyIconOffline
|
||||||
|
class="mr-1"
|
||||||
|
icon="delete-rounded"
|
||||||
|
/>
|
||||||
|
删除
|
||||||
|
</el-button>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- <el-button type="text"></el-button>-->
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<template v-else>
|
||||||
|
<div class="w-32" v-if="downloading.has(version.id)">
|
||||||
|
<el-progress
|
||||||
|
:percentage="downloading.get(version.id)"
|
||||||
|
:text-inside="false"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
<el-button
|
||||||
|
v-else
|
||||||
|
size="small"
|
||||||
|
type="text"
|
||||||
|
@click="handleDownload(version)"
|
||||||
|
>
|
||||||
|
<IconifyIconOffline class="mr-1" icon="download" />
|
||||||
|
下载
|
||||||
|
</el-button>
|
||||||
|
</template>
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</el-col>
|
||||||
</el-col>
|
</el-row>
|
||||||
</el-row>
|
</template>
|
||||||
</template>
|
<div
|
||||||
<div
|
v-else
|
||||||
v-else
|
class="w-full h-full bg-white rounded p-2 overflow-hidden drop-shadow-xl flex justify-center items-center"
|
||||||
class="w-full h-full bg-white rounded p-2 overflow-hidden drop-shadow-xl flex justify-center items-center"
|
>
|
||||||
>
|
<el-empty description="暂无可用版本" />
|
||||||
<el-empty description="暂无可用版本" />
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style lang="scss" scoped></style>
|
<style lang="scss" scoped>
|
||||||
|
.download-card {
|
||||||
|
border-left: 5px solid #5a3daa;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|||||||
@ -317,7 +317,7 @@ onUnmounted(() => {
|
|||||||
:md="8"
|
:md="8"
|
||||||
:sm="12"
|
:sm="12"
|
||||||
:xl="6"
|
:xl="6"
|
||||||
:xs="24"
|
:xs="12"
|
||||||
class="mb-[20px]"
|
class="mb-[20px]"
|
||||||
>
|
>
|
||||||
<div class="bg-white w-full rounded drop-shadow-xl p-4">
|
<div class="bg-white w-full rounded drop-shadow-xl p-4">
|
||||||
|
|||||||
Loading…
Reference in New Issue
Block a user