优化文字提示,启动联机下拉按钮新增本地游戏列表功能

This commit is contained in:
黑先森
2025-02-07 20:13:33 +08:00
parent 01d475860b
commit 436c265e95
18 changed files with 588 additions and 123 deletions
+4 -3
View File
@@ -121,9 +121,10 @@ export async function MenuItemTheme() {
text: "主题切换",
action: async () => {
const mainStore = useMainStore();
mainStore.theme = !mainStore.theme;
// const appWindow = getCurrentWindow();
// appWindow.emitTo("main", "config", { theme: mainStore.theme });
mainStore.$patch({
theme: !mainStore.theme
});
// mainStore.$persist();
await setTheme(mainStore.theme);
},
});
+1
View File
@@ -3,5 +3,6 @@ VITE_CONFIG_ADMIN_PATH=easytier/config/.admin/
VITE_CONFIG_FILE_NAME=easytier/config.json
VITE_LOG_PATH=easytier/logs/
VITE_CACHE_PATH=easytier/cache/
VITE_GAME_LIST_PATH=easytier/gameList/
VITE_PUBLIC_PEERS_URL=https://easytier.gd.nkbpal.cn/status/easytier
VITE_AUTO_START_SERVICE_NAME=easytierGameAutoStart
+1
View File
@@ -3,5 +3,6 @@ VITE_CONFIG_ADMIN_PATH=easytier/config/.admin/
VITE_CONFIG_FILE_NAME=easytier/config.json
VITE_LOG_PATH=easytier/logs/
VITE_CACHE_PATH=easytier/cache/
VITE_GAME_LIST_PATH=easytier/gameList/
VITE_PUBLIC_PEERS_URL=https://easytier.gd.nkbpal.cn/status/easytier
VITE_AUTO_START_SERVICE_NAME=easytierGameAutoStart
+1 -1
View File
@@ -3,7 +3,7 @@
"private": true,
"author": "leizi97",
"description": "A simple network initiator based on Easytier",
"version": "1.3.9",
"version": "1.4.0",
"scripts": {
"dev": "nuxt dev --dotenv env/.env.dev --host 0.0.0.0",
"build": "nuxt generate --dotenv env/.env.prod",
+397
View File
@@ -0,0 +1,397 @@
<template>
<div class="relative flex h-full flex-col flex-wrap gap-[0] overflow-hidden">
<div class="flex h-[40px] w-full flex-nowrap items-center gap-[0_5px]">
<div class="ml-[5px] mr-auto flex flex-1">
<ElInput
size="small"
v-model="searchValue"
placeholder="请输入游戏名进行查询"
></ElInput>
</div>
<div>
<ElButton
:icon="Plus"
size="small"
type="primary"
class="mr-[5px]"
@click="handleCreate"
>
新增本地游戏
</ElButton>
<ElButton
size="small"
class="mr-[5px]"
@click="openCoverDir"
>
打开封面目录
</ElButton>
</div>
</div>
<div class="flex flex-1 flex-wrap gap-[0] overflow-auto">
<div
v-for="(item, idx) in computedGameList"
:key="item.id"
class="w-[25%] p-[4px]"
>
<div class="group/card relative">
<ElCard>
<template #header>
<div class="flex flex-nowrap gap-[0_8px]">
<ElTooltip :content="item.name">
<p class="ml-auto flex-1 truncate">
<ElText
size="default"
type="info"
>
{{ item.name }}
</ElText>
</p>
</ElTooltip>
</div>
</template>
<img
:src="showImgConvertFileSrc(item.showImg)"
@error="handleImgError(item, idx)"
class="aspect-[1] w-full object-cover"
/>
</ElCard>
<div
class="absolute left-0 top-0 z-[1] hidden h-full w-full flex-col items-center justify-center rounded-[5px] bg-[var(--el-mask-color)] group-hover/card:flex"
>
<ElButton
size="large"
type="success"
:icon="VideoPlay"
@click.stop="handleStartGame(item)"
>
启动游戏
</ElButton>
<div class="pt-[5px]">
<ElButton
size="small"
type="info"
:icon="EditPen"
title="修改"
@click.stop="handleEditItem(item)"
/>
<ElButton
size="small"
type="danger"
:icon="DeleteFilled"
title="删除"
@click.stop="handleDeleteItem(item)"
/>
</div>
</div>
</div>
</div>
<div class="w-[25%] p-[4px]">
<ElTooltip content="新增本地游戏">
<ElCard
@click.stop="handleCreate"
shadow="hover"
>
<div class="group/plus flex cursor-pointer items-center justify-center py-[25px]">
<ElIcon class="!text-[80px] transition-all group-hover/plus:text-[color:var(--el-color-primary)]">
<Plus></Plus>
</ElIcon>
</div>
</ElCard>
</ElTooltip>
</div>
</div>
<ElDialog
width="95%"
top="30px"
append-to-body
:z-index="10"
class="!mb-0"
v-model="createGameData.visible"
:close-on-press-escape="false"
:title="`${createGameData.isEdit ? '编辑' : '新建'}本地游戏`"
>
<ElForm
hide-required-asterisk
label-position="left"
:model="createGameData.form"
:rules="createGameData.rules"
ref="formRef"
>
<ElFormItem
label="游戏名字"
prop="name"
>
<ElInput
v-model="createGameData.form.name"
placeholder="请输入游戏名字"
></ElInput>
</ElFormItem>
<ElFormItem
label="执行文件"
prop="exePath"
>
<ElInput
v-model="createGameData.form.exePath"
placeholder="请选择游戏执行文件"
>
<template #append>
<ElButton
size="small"
type="primary"
@click.stop="handleBrowser('exePath')"
>
浏览
</ElButton>
</template>
</ElInput>
</ElFormItem>
<ElFormItem
label="游戏封面"
prop="coverImg"
>
<ElBadge :hidden="createGameData.form.showImg == defaultPng">
<template #content="{ value }">
<div
class="cursor-pointer"
@click.stop="handleBadgeDeleteCover"
>
<ElIcon>
<DeleteFilled />
</ElIcon>
</div>
</template>
<img
@click.stop="handleBrowser('coverImg')"
:src="showImgConvertFileSrc(createGameData.form.showImg)"
class="aspect-[1] w-[120px] cursor-pointer object-cover"
/>
</ElBadge>
</ElFormItem>
</ElForm>
<template #footer>
<div><ElText type="warning">除了默认封面以外自定义封面会集中保存在封面目录里</ElText></div>
<ElButton
size="default"
type="primary"
@click="handleSave"
>
保存
</ElButton>
<ElButton
size="default"
@click="createGameData.visible = false"
>
关闭
</ElButton>
</template>
</ElDialog>
</div>
</template>
<script lang="ts" setup>
import { VideoPlay, DeleteFilled, EditPen, Plus, Delete } from "@element-plus/icons-vue";
import { dataSubscribe } from "~/composables/windows";
import { BaseDirectory, resourceDir as getResourceDir, join } from "@tauri-apps/api/path";
import { convertFileSrc } from "@tauri-apps/api/core";
import { computed, nextTick, reactive, ref, useTemplateRef } from "vue";
import useMainStore from "@/stores/index";
import { uniqueId } from "lodash-es";
import { open as dialogOpen } from "@tauri-apps/plugin-dialog";
import { ElMessage, type FormInstance } from "element-plus";
import { ATJ, bounce } from "~/utils";
import { ElConfirmDanger } from "~/utils/element";
import { copyFile, exists, mkdir, readDir, remove } from "@tauri-apps/plugin-fs";
import { Command, open } from "@tauri-apps/plugin-shell";
const resourceDir = await getResourceDir();
const gameListResourceDir = await join(resourceDir, import.meta.env.VITE_GAME_LIST_PATH);
// const defaultLocalIconPath = await join(configPath, "icon.png");
// const tauriPath = convertFileSrc(defaultLocalIconPath);
const mainStore = useMainStore();
const formEl = useTemplateRef<FormInstance>("formRef");
const searchValue = ref("");
const defaultPng = "/default.png";
// const b = bounce(600);
type gameItemType = { name: string; exePath: string; coverImg: string; id: string; showImg: string };
const createGameData = reactive({
visible: false,
isEdit: false,
form: {
id: "",
name: "",
exePath: "",
coverImg: "",
showImg: defaultPng
},
rules: {
name: [{ required: true, message: "请输入游戏名", trigger: "blur" }],
exePath: [{ required: true, message: "请选择游戏执行文件", trigger: "blur" }]
}
});
const computedGameList = computed(() => {
if (!searchValue.value.trim()) return mainStore.gameList;
return mainStore.gameList.filter(item => {
return item.name.includes(searchValue.value); // 过滤
});
});
const handleCreate = async () => {
createGameData.isEdit = false;
createGameData.form = {
id: "",
name: "",
exePath: "",
coverImg: "",
showImg: defaultPng
};
await nextTick();
createGameData.visible = true;
};
const handleBrowser = async (type: "coverImg" | "exePath") => {
const filters = type === "coverImg" ? [{ name: "", extensions: ["png", "jpg", "jpeg"] }] : [{ name: "", extensions: ["exe"] }];
const file = await dialogOpen({
multiple: false,
directory: false,
filters
});
if (file) {
if (type === "coverImg") {
createGameData.form.coverImg = file;
if (createGameData.form.coverImg) {
if (!createGameData.form.id) {
const time = new Date().getTime();
createGameData.form.id = uniqueId(`${time}`);
}
let coverImg = createGameData.form.coverImg;
const game_list_path = import.meta.env.VITE_GAME_LIST_PATH;
const isExists = await exists(game_list_path, { baseDir: BaseDirectory.Resource });
if (!isExists) {
try {
await mkdir(game_list_path, { baseDir: BaseDirectory.Resource });
} catch (err) {}
}
const toPath = await join(gameListResourceDir, createGameData.form.id);
const suffix = coverImg.split(".").pop();
const toPathFileName = `${toPath}.${suffix}`;
if (coverImg != toPathFileName) {
await copyFile(coverImg, toPathFileName);
}
const isExistsToPath = await exists(toPathFileName);
if (isExistsToPath) {
createGameData.form = { ...createGameData.form, showImg: `${toPathFileName}` }; // 如果复制正确,那就存储文件名即可
}
}
}
if (type === "exePath") {
createGameData.form.exePath = file;
}
} else {
ElMessage.error("获取文件路径失败");
}
};
const openCoverDir = async () => {
const game_list_path = import.meta.env.VITE_GAME_LIST_PATH;
const isExists = await exists(game_list_path, { baseDir: BaseDirectory.Resource });
if (!isExists) {
try {
await mkdir(game_list_path, { baseDir: BaseDirectory.Resource });
} catch (err) {}
}
await Command.create("explorer", [gameListResourceDir]).execute();
};
const handleSave = async () => {
const [error, _] = await ATJ(formEl.value?.validate() as Promise<boolean>);
if (!error) {
if (createGameData.form.showImg == defaultPng) {
//删除本地封面图
// const toPath = await join(gameListResourceDir, createGameData.form.id);
// const suffix = coverImg.split(".").pop();
// const imgPath = `${toPath}.${suffix}`;
// await remove(imgPath);
}
const idx = mainStore.gameList.findIndex(i => i.id == createGameData.form.id);
if (idx >= 0) {
mainStore.gameList[idx] = { ...createGameData.form };
mainStore.$patch({
gameList: [...mainStore.gameList]
});
} else {
mainStore.$patch({
gameList: [...mainStore.gameList, createGameData.form]
});
}
ElMessage.success("保存成功");
createGameData.visible = false;
// await Command.create("explorer", [gameListResourceDir]).execute();
}
};
const handleBadgeDeleteCover = async () => {
await removeFileById(createGameData.form.id);
createGameData.form = { ...createGameData.form, coverImg: "", showImg: defaultPng };
};
const removeFileById = async (id: string) => {
if (!id) return;
const entries = await readDir(gameListResourceDir);
if (entries.length > 0) {
for (const entry of entries) {
if (entry.name.includes(id + ".")) {
const imgPath = await join(gameListResourceDir, entry.name);
await remove(imgPath);
}
}
}
};
const handleDeleteItem = async ({ coverImg, id }: gameItemType) => {
if (id) {
const [error, _] = await ElConfirmDanger("确定要删除吗?");
if (!error) {
await removeFileById(id);
mainStore.$patch({
gameList: mainStore.gameList.filter(i => i.id !== id)
});
}
}
};
const handleEditItem = async (item: gameItemType) => {
createGameData.isEdit = true;
createGameData.form = { ...item };
createGameData.visible = true;
};
const handleStartGame = async (item: gameItemType) => {
try {
const isExists = await exists(item.exePath);
if (!isExists) {
return ElMessage.error("执行文件不存在");
}
} catch (err) {
return ElMessage.error("执行文件不存在");
}
ElMessage.info("正在启动游戏,请稍后...");
const _child = await open(item.exePath);
};
const handleImgError = (item: gameItemType, idx: number) => {
item.showImg = defaultPng;
item.coverImg = "";
mainStore.gameList[idx] = { ...item };
mainStore.$patch({
gameList: [...mainStore.gameList]
});
};
const showImgConvertFileSrc = (showImg: string) => {
return showImg != defaultPng ? `${convertFileSrc(showImg)}?${new Date().getTime()}` : defaultPng;
};
dataSubscribe();
</script>
+57 -8
View File
@@ -44,16 +44,24 @@
</ElTooltip>
</div>
<ElTooltip content="请先停止自建服务和联机后再使用,否则内核被占用的情况下,无法进行内核更换">
<ElBadge
badge-class="!text-[9px] cursor-pointer"
:hidden="!haveNewCoreVersion"
:offset="[-5, 6]"
@click.stop="handleCoreManagement"
value="N"
>
<ElButton
class="ml-auto"
class="ml-auto mr-[3px]"
:disabled="data.isStart || listenObj.server_thread_id.value"
@click="handleCoreManagement"
@click.stop="handleCoreManagement"
:loading="data.update"
type="primary"
size="small"
>
内核管理
</ElButton>
</ElBadge>
</ElTooltip>
</div>
</template>
@@ -310,6 +318,12 @@
>
保存当前房间配置
</ElDropdownItem>
<ElDropdownItem
command="game_start_config"
:icon="SwitchFilled"
>
本地游戏列表
</ElDropdownItem>
</ElDropdownMenu>
</template>
</ElDropdown>
@@ -684,9 +698,10 @@
SetUp,
Folder,
CopyDocument,
Platform
Platform,
SwitchFilled
} from "@element-plus/icons-vue";
import { reactive, onBeforeUnmount, onMounted, ref, toRaw } from "vue";
import { reactive, onBeforeUnmount, onMounted, ref, toRaw, computed } from "vue";
import { useTray, setTrayRunState, setTrayTooltip, checkNewVersion } from "~/composables/tray";
import { getMatches } from "@tauri-apps/plugin-cli";
import { initStartWinIpBroadcast } from "~/composables/netcard";
@@ -694,7 +709,7 @@
import { ElMessage, ElMessageBox, ElTooltip } from "element-plus";
import { getCurrentWindow, type Window } from "@tauri-apps/api/window";
import { getAllWebviewWindows, WebviewWindow } from "@tauri-apps/api/webviewWindow";
import etWindows from "@/composables/windows";
import etWindows, { dataSubscribe } from "@/composables/windows";
import { resourceDir as getResourceDir, join } from "@tauri-apps/api/path";
import { readDir, exists, mkdir, BaseDirectory, readTextFile, readFile, writeFile, remove as removeFile } from "@tauri-apps/plugin-fs";
import { updateConfigJson } from "~/composables/configJson";
@@ -731,6 +746,7 @@
cidrVisible: false,
advanceVisible: false,
toolVisible: false,
gameListVisible: false,
serverVisible: false,
winipBcPid: 0, //WinIPBroadcast进程id
winipBcStart: false,
@@ -962,6 +978,18 @@
data.coreVersion = (coreVersion as string).replace("easytier-core ", "");
};
const haveNewCoreVersion = computed<boolean>(() => {
if (!data.coreVersion) return false;
const releaseLatestVersion = data?.releaseList?.[0]?.[0];
if (!releaseLatestVersion) return false;
const version = `v${/(\d+\.\d+\.\d+)/g.exec(data.coreVersion || "")?.[1]}`;
// console.log(version, releaseLatestVersion)
if (releaseLatestVersion != version) {
return true;
}
return false;
});
const checkUpdate = async () => {
// const latestVersionFileName = data.releaseList?.[0]?.[0]?.[1] as string;
let [downloadUrl, versionFileName] = (coreManagementData.data as string).split("<>");
@@ -993,7 +1021,7 @@
const handleCoreManagement = async () => {
coreManagementData.visible = true;
await getReleaseList();
// await getReleaseList();
};
const handleInstallCore = async () => {
@@ -1160,14 +1188,14 @@
mountedShow(); // 不需要await
closePrevent();
data.hasNewVersion = await checkNewVersion();
window.addEventListener("storage", () => {
mainStore.$hydrate();
dataSubscribe(async () => {
if (mainStore.createConfigInEasytier) {
b(async () => {
await updateConfigJson(data.configJsonSeverUrl);
});
}
});
getReleaseList();
});
onBeforeUnmount(() => {
@@ -1550,6 +1578,27 @@
}
}
}
if (command === "game_start_config") {
await etWindows(
"gameList",
{
title: "本地游戏列表",
width: 800,
height: 400,
minWidth: 800,
minHeight: 400,
resizable: true,
url: "#/gameList"
},
(_, appWindow) => {
data.gameListVisible = true;
},
() => {
data.gameListVisible = false;
}
);
}
};
const handleDeleteAdminConfig = async () => {
+1 -1
View File
@@ -42,7 +42,7 @@
</div>
<div>
<ElTooltip
content="使用ForceBindIP启动应用 (强制绑定IP或者网卡),如果还没启动联机,请先启动联机,联机成功后,点击刷新获取easytier生成的网卡"
content="使用ForceBindIP启动应用 (强制绑定IP或者网卡),如果还没启动联机,请先启动联机,联机成功后,点击刷新获取easytier生成的网卡"
>
<ElText>
方案2
Binary file not shown.

After

Width:  |  Height:  |  Size: 130 KiB

BIN
View File
Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.0 KiB

+8 -1
View File
@@ -1290,7 +1290,7 @@ checksum = "0d6ef0072f8a535281e4876be788938b528e9a1d43900b82c2569af7da799125"
[[package]]
name = "easytier-game"
version = "1.3.9"
version = "1.4.0"
dependencies = [
"hashbrown 0.15.2",
"log",
@@ -2075,6 +2075,12 @@ dependencies = [
"pin-project-lite",
]
[[package]]
name = "http-range"
version = "0.1.5"
source = "registry+https://github.com/rust-lang/crates.io-index"
checksum = "21dec9db110f5f872ed9699c3ecf50cf16f423502706ba5c72462e28d3157573"
[[package]]
name = "httparse"
version = "1.9.5"
@@ -4745,6 +4751,7 @@ dependencies = [
"gtk",
"heck 0.5.0",
"http",
"http-range",
"image",
"jni",
"libc",
+2 -2
View File
@@ -1,6 +1,6 @@
[package]
name = "easytier-game"
version = "1.3.9"
version = "1.4.0"
homepage = "https://github.com/EasyTier/EasyTier"
repository = "https://github.com/EasyTier/EasytierGame"
description = "A simple network initiator based on Easytier"
@@ -25,7 +25,7 @@ tauri-build = { version = "2.0.5", features = [] }
serde_json = "1.0.137"
serde = { version = "1.0.217", features = ["derive"] }
log = "0.4.25"
tauri = { version = "2.2.5", features = [
tauri = { version = "2.2.5", features = [ "protocol-asset",
"tray-icon",
"image-png",
"image-ico",
+1 -1
View File
@@ -2,7 +2,7 @@
"$schema": "../gen/schemas/desktop-schema.json",
"identifier": "default",
"description": "enables the default permissions",
"windows": ["main", "log", "member", "cidr", "advance", "tool", "server"],
"windows": ["main", "log", "member", "cidr", "advance", "tool", "server", "gameList"],
"permissions": [
"core:default",
"core:window:allow-minimize",
Binary file not shown.
Binary file not shown.
+7 -3
View File
@@ -1,7 +1,7 @@
{
"$schema": "../node_modules/@tauri-apps/cli/config.schema.json",
"productName": "easytier-game",
"version": "1.3.9",
"version": "1.4.0",
"identifier": "com.tauri.easytier-game",
"build": {
@@ -12,7 +12,7 @@
"app": {
"windows": [
{
"title": "easytier-game 1.3.9",
"title": "easytier-game 1.4.0",
"label": "main",
"minWidth": 340,
"width": 340,
@@ -30,7 +30,11 @@
}
],
"security": {
"csp": null
"csp": null,
"assetProtocol": {
"enable": true,
"scope": ["**"]
}
}
},
"plugins": {
+7 -3
View File
@@ -57,7 +57,7 @@ const store = defineStore("main", {
configPath: "", //配置文件路径
winIpBcAutoStart: true,
createConfigInEasytier: false, //在easytier目录生成config.json文件吗
githubFastUrl: "https://ghproxy.cc/",
githubFastUrl: "https://ghfast.top/",
// forceBindIp配置
forceBindIpBit: "64",
@@ -66,7 +66,9 @@ const store = defineStore("main", {
forceBindFile: "",
winipBcPid: 0,
winipBcStart: false
winipBcStart: false,
gameList: [] as Array<{name: string, exePath: string, id: string, coverImg: string; showImg: string}>, // 游戏列表
};
},
persist: {
@@ -133,7 +135,9 @@ const store = defineStore("main", {
"forceBindIpBit",
"delayInjectDll",
"forceBindInput",
"forceBindFile"
"forceBindFile",
"gameList"
]
// // 除了这些,其他都要存下来
// omit: ["winipBcPid", "winipBcStart"]
+1
View File
@@ -4,6 +4,7 @@ interface ImportMetaEnv {
readonly VITE_LOG_PATH: string;
readonly VITE_CACHE_PATH: string;
readonly VITE_AUTO_START_SERVICE_NAME: string;
readonly VITE_GAME_LIST_PATH: string;
}
interface ImportMeta {