增加版本检查页面

This commit is contained in:
刘嘉伟 2024-08-11 16:54:01 +08:00
parent 0f5fad1a87
commit ff12514cef
8 changed files with 178 additions and 35 deletions

View File

@ -16,8 +16,9 @@
<h3 align="center">Frpc-Desktop</h3>
<p align="center">
🎉 Frp 跨平台桌面客户端 支持所有frp版本
🎉 FRP跨平台桌面客户端可视化配置轻松实现内网穿透
<br />
支持所有frp版本 / 开机自启 / 可视化配置 / 免费开源
</p>
</div>

15
electron/api/common.ts Normal file
View File

@ -0,0 +1,15 @@
import {ipcMain, shell} from "electron";
import log from "electron-log";
export const initCommonApi = () => {
// 打开链接
ipcMain.on("common.openUrl", async (event, args) => {
if (args) {
log.info(`打开链接:${args}`)
shell.openExternal(args).then(() => {
});
}
})
}

View File

@ -203,13 +203,39 @@ export const initGitHubApi = () => {
})
/**
* GitHub
*
*/
ipcMain.on("github.open", () => {
shell.openExternal("https://github.com/luckjiawei/frpc-desktop/issues");
ipcMain.on("github.getFrpcDesktopLastVersions", async event => {
const request = net.request({
method: "get",
url: "https://api.github.com/repos/luckjiawei/frpc-desktop/releases/latest"
});
request.on("response", response => {
let responseData: Buffer = Buffer.alloc(0);
response.on("data", (data: Buffer) => {
responseData = Buffer.concat([responseData, data]);
});
response.on("end", () => {
versions = JSON.parse(responseData.toString());
// const borderContent: Electron.WebContents =
// BrowserWindow.getFocusedWindow().webContents;
// const downloadPath = path.join(app.getPath("userData"), "download");
// log.info(`开始获取frp版本 当前架构:${currArch} 对应frp架构${frpArch}`)
// const returnVersionsData = versions
// .filter(f => getAdaptiveAsset(f.id))
// .map(m => {
// const asset = getAdaptiveAsset(m.id);
// if (asset) {
// const absPath = `${downloadPath}/${asset.name}`;
// m.absPath = absPath;
// m.download_completed = fs.existsSync(absPath);
// }
// return m;
// });
// log.debug(`获取到frp版本${JSON.stringify(returnVersionsData)}`)
event.reply("github.getFrpcDesktopLastVersionsHook", versions);
});
});
request.end();
})
electron.ipcMain.on("github.openReleases", () => {
electron.shell.openExternal("https://github.com/luckjiawei/frpc-desktop/releases");
});
};

View File

@ -10,6 +10,7 @@ import {initFileApi} from "../api/file";
import {initUpdaterApi} from "../api/update";
import {getConfig} from "../storage/config";
import log from "electron-log";
import {initCommonApi} from "../api/common";
// The built directory structure
//
// ├─┬ dist-electron
@ -170,6 +171,7 @@ app.whenReady().then(() => {
initFrpcApi();
initLoggerApi();
initFileApi();
initCommonApi();
// initUpdaterApi(win);
})
});

View File

@ -2,7 +2,7 @@
"name": "Frpc-Desktop",
"version": "1.0.6",
"main": "dist-electron/main/index.js",
"description": "一个frpc桌面客户端",
"description": "FRP跨平台桌面客户端可视化配置轻松实现内网穿透",
"repository": "github:luckjiawei/frpc-desktop",
"author": "刘嘉伟 <8473136@qq.com>",
"license": "MIT",

View File

@ -3,7 +3,7 @@ import {computed, defineComponent, onMounted, ref} from "vue";
import {Icon} from "@iconify/vue";
import router from "@/router";
import {RouteRecordRaw} from "vue-router";
import {ipcRenderer} from "electron";
import pkg from '../../../package.json';
defineComponent({
name: "AppMain"
@ -28,6 +28,13 @@ const handleMenuChange = (route: any) => {
});
};
const handleOpenGitHubReleases = () => {
// ipcRenderer.send("github.openReleases")
router.push({
name: "About"
})
}
onMounted(() => {
routes.value = router.options.routes[0].children?.filter(
@ -39,7 +46,7 @@ onMounted(() => {
<template>
<div class="left-menu-container drop-shadow-xl">
<div class="logo-container">
<img src="/logo/only/128x128.png" class="logo" alt="Logo"/>
<img src="/logo/only/128x128.png" class="logo animate__animated animate__lightSpeedInLeft" alt="Logo"/>
</div>
<ul class="menu-container">
<!-- enter-active-class="animate__animated animate__bounceIn"-->
@ -55,7 +62,7 @@ onMounted(() => {
</li>
</ul>
<div class="version mb-2 animate__animated" @click="handleOpenGitHubReleases">
v1.0.6
{{ pkg.version }}
</div>
</div>

View File

@ -67,7 +67,7 @@ const routes: RouteRecordRaw[] = [
title: "关于",
icon: "material-symbols:info-sharp",
keepAlive: true,
hidden: false
hidden: true
},
component: () => import("@/views/about/index.vue")
},

View File

@ -1,27 +1,91 @@
<script lang="ts" setup>
import {defineComponent} from "vue";
import {ipcRenderer, clipboard} from "electron";
import {computed, defineComponent, onMounted, onUnmounted, ref} from "vue";
import {ipcRenderer} from "electron";
import {Icon} from "@iconify/vue";
import Breadcrumb from "@/layout/compoenets/Breadcrumb.vue";
import {ElMessage} from "element-plus";
import pkg from '../../../package.json';
import {ElMessage, ElMessageBox} from "element-plus";
/**
* 最后一个版本号
*/
const latestVersionInfo = ref(null);
const isLastVersion = computed(() => {
if (!latestVersionInfo.value) {
return true;
}
// tagName
const tagName = latestVersionInfo.value['tag_name']
console.log(tagName, latestVersionInfo.value, 'tagName')
if (!tagName) {
return true;
}
//
const lastVersion = tagName.replace('v', '').toString();
const currVersion = pkg.version;
console.log(lastVersion, currVersion, currVersion >= lastVersion, "isLast")
// console.log()
return currVersion >= lastVersion;
// return false;
})
/**
* 打开github issues
*/
const handleOpenGitHubIssues = () => {
ipcRenderer.send("common.openUrl", "https://github.com/luckjiawei/frpc-desktop/issues")
}
/**
* 打开github主页
*/
const handleOpenGitHub = () => {
ipcRenderer.send("github.open")
ipcRenderer.send("common.openUrl", "https://github.com/luckjiawei/frpc-desktop")
}
const handleCopyInfo = () => {
ElMessage({
message: '复制成功',
type: 'success',
})
clipboard.writeText(`
Frpc Desktop
v${pkg.version}
更简单的内网穿透工具免费开源 / 桌面客户端 / 开机启动
`)
/**
* 获取最后一个版本
*/
const handleGetLastVersion = () => {
ipcRenderer.send("github.getFrpcDesktopLastVersions")
}
const handleOpenNewVersion = () => {
ipcRenderer.send("common.openUrl", latestVersionInfo.value['html_url'])
}
onMounted(() => {
ipcRenderer.on("github.getFrpcDesktopLastVersionsHook", (event, args) => {
latestVersionInfo.value = args;
console.log(latestVersionInfo.value, '1')
if (!isLastVersion.value) {
let content = latestVersionInfo.value.body
content = content.replaceAll('\n', '<br/>')
ElMessageBox.alert(content, `🎉 发现新版本 ${args.name}`, {
showCancelButton: true,
cancelButtonText: "关闭",
dangerouslyUseHTMLString: true,
confirmButtonText: "去下载"
}).then(() => {
handleOpenNewVersion()
})
}else {
ElMessage({
message: "当前已是最新版本",
type: "success"
})
}
});
handleGetLastVersion();
})
onUnmounted(() => {
ipcRenderer.removeAllListeners("github.getFrpcDesktopLastVersionsHook");
})
defineComponent({
name: "About"
});
@ -33,20 +97,48 @@ defineComponent({
<breadcrumb/>
<div class="app-container-breadcrumb">
<div
class="w-full h-full bg-white p-4 rounded drop-shadow-lg overflow-y-auto flex justify-center items-center flex-col"
class="w-full h-full bg-white p-4 rounded drop-shadow-lg overflow-y-auto flex justify-center items-center flex-col"
>
<img src="/logo/only/1024x1024.png" class="w-[95px] h-[95px] mt-[-50px]" alt="Logo"/>
<img src="/logo/pack/1024x1024.png"
class="w-[95px] h-[95px] mt-[-50px] animate__animated animate__lightSpeedInLeft" alt="Logo"/>
<div class="mt-[8px] text-2xl">Frpc Desktop</div>
<div class="mt-[8px] text-neutral-400 flex items-center">
v{{pkg.version}}
<Icon class="ml-1.5 cursor-pointer" icon="material-symbols:refresh-rounded"></Icon>
<!-- <span class="font-bold"> v{{ pkg.version }}</span>-->
<el-link
:class="!isLastVersion? 'line-through': ''"
class="ml-2 font-bold">v{{ pkg.version }}
</el-link>
<el-link v-if="!isLastVersion && latestVersionInfo"
@click="handleOpenNewVersion"
class="ml-2 text-[#67C23A] font-bold"
type="success">v{{ latestVersionInfo.name }}
</el-link>
<!-- <span class="ml-2 text-[#67C23A] font-bold"-->
<!-- @click="handleOpenNewVersion"-->
<!-- v-if="!isLastVersion && latestVersionInfo">v{{ latestVersionInfo.name }}</span>-->
<Icon class="ml-1.5 cursor-pointer" icon="material-symbols:refresh-rounded"
@click="handleGetLastVersion"></Icon>
</div>
<div class="mt-[8px] text-sm text-center">
<p>
🎉 {{ pkg.description }}
</p>
<p>
开机自启 / 可视化配置 / 免费开源
</p>
</div>
<div class="mt-[8px] text-sm">更简单的内网穿透工具免费开源 / 桌面客户端 / 开机启动</div>
<div class="mt-[12px]">
<el-button type="primary" @click="handleCopyInfo">复制信息</el-button>
<el-button type="danger" plain @click="handleOpenGitHub">反馈问题</el-button>
<el-button plain type="primary" @click="handleOpenGitHub">
<Icon class="cursor-pointer mr-2" icon="logos:github-icon"/>
仓库地址
</el-button>
<el-button type="danger" plain @click="handleOpenGitHubIssues">
<Icon class="cursor-pointer mr-2" icon="material-symbols:question-mark"/>
反馈问题
</el-button>
</div>
</div>
</div>
</div>
</template>
</template>