托盘图标增加主题切换功能，调整成员列表延迟至前方，增加nat类型查看，修复自定义网卡无法保存信息的问题

app.vue

@@ -4,6 +4,9 @@
 	</NuxtLayout>
 </template>
 <script setup lang="ts">
-	import { initTheme } from "~/composables/theme";
-	initTheme();
+	import useMainStore from "@/stores/index";
+	import { initTheme } from "@/composables/theme";
+	const mainStore = useMainStore();
+	// console.log(mainStore.theme)
+	initTheme(mainStore.theme);
 </script>

composables/theme.ts

@@ -1,6 +1,6 @@
 import { useDark, useToggle, usePreferredDark } from "@vueuse/core";
 import { isFunction } from "lodash-es";
-const isDark = usePreferredDark();
+// const isDark = usePreferredDark();
 const darkConfig = useDark({
 	selector: "html",
 	attribute: "class",
@@ -8,9 +8,9 @@ const darkConfig = useDark({
 	valueLight: "",
 });
 const toggleDark = useToggle(darkConfig);
-export const initTheme = () => {
+export const initTheme = (isDark: boolean) => {
 	if (isDark && isFunction(toggleDark)) {
-		toggleDark(isDark.value);
+		toggleDark(isDark);
 	}
 };
 

composables/tray.ts

@@ -2,6 +2,8 @@ import { Menu, MenuItem, PredefinedMenuItem } from "@tauri-apps/api/menu";
 import { TrayIcon } from "@tauri-apps/api/tray";
 import { getCurrentWindow } from "@tauri-apps/api/window";
 import pkg from "@/package.json";
+import { setTheme } from "~/composables/theme";
+import useMainStore from "@/stores/index";
 
 const DEFAULT_TRAY_NAME = "main";
 
@@ -20,8 +22,8 @@ export async function useTray(init: boolean = false, beforExit: Function) {
 		tray = await TrayIcon.getById(DEFAULT_TRAY_NAME);
 		if (!tray) {
 			tray = await TrayIcon.new({
-				tooltip: `EasyTier\n${pkg.version}`,
-				title: `EasyTier\n${pkg.version}`,
+				tooltip: `EasyTierGame\n${pkg.version}`,
+				title: `EasyTierGame\n${pkg.version}`,
 				id: DEFAULT_TRAY_NAME,
 				menu: await Menu.new({
 					id: "main",
@@ -38,7 +40,7 @@ export async function useTray(init: boolean = false, beforExit: Function) {
 	}
 
 	if (init) {
-		tray.setTooltip(`EasyTier\n${pkg.version}`);
+		tray.setTooltip(`EasyTierGame\n${pkg.version}`);
 		tray.setMenuOnLeftClick(false);
 		tray.setMenu(
 			await Menu.new({
@@ -52,7 +54,12 @@ export async function useTray(init: boolean = false, beforExit: Function) {
 }
 
 export async function generateMenuItem(beforExit: Function) {
-	return [await MenuItemShow("显示 / 隐藏"), await PredefinedMenuItem.new({ item: "Separator" }), await MenuItemExit("退出", beforExit)];
+	return [
+		await MenuItemShow("显示 / 隐藏"),
+		await MenuItemTheme(),
+		await PredefinedMenuItem.new({ item: "Separator" }),
+		await MenuItemExit("退出", beforExit),
+	];
 }
 
 export async function MenuItemExit(text: string, beforExit: Function) {
@@ -78,6 +85,20 @@ export async function MenuItemShow(text: string) {
 	});
 }
 
+export async function MenuItemTheme() {
+	return await MenuItem.new({
+		id: "theme",
+		text: "主题切换",
+		action: async () => {
+			const mainStore = useMainStore();
+			mainStore.theme = !mainStore.theme;
+			// const appWindow = getCurrentWindow();
+			// appWindow.emitTo("main", "config", { theme: mainStore.theme });
+			await setTheme(mainStore.theme);
+		},
+	});
+}
+
 // export async function setTrayMenu(items: (MenuItem | PredefinedMenuItem)[] | undefined = undefined) {
 //   // const tray = await useTray()
 //   const tray = await TrayIcon.getById(DEFAULT_TRAY_NAME)
@@ -98,8 +119,8 @@ export async function setTrayRunState(tray: TrayIcon | null, isRunning: boolean
 export async function setTrayTooltip(tray: TrayIcon | null, tooltip?: string | null) {
 	if (!tray) return;
 	if (tooltip) {
-		await tray.setTooltip(`EasyTier\n${pkg.version}\n${tooltip}`);
+		await tray.setTooltip(`EasyTierGame\n${pkg.version}\n${tooltip}`);
 	} else {
-		await tray.setTooltip(`EasyTier\n${pkg.version}`);
+		await tray.setTooltip(`EasyTierGame\n${pkg.version}`);
 	}
 }

package.json

@@ -3,7 +3,7 @@
 	"private": true,
 	"author": "leizi97",
 	"description": "A simple network initiator based on Easytier",
-	"version": "1.1.2",
+	"version": "1.1.3",
 	"scripts": {
 		"dev": "nuxt dev --dotenv env/.env.dev --host 0.0.0.0",
 		"build": "nuxt generate --dotenv env/.env.prod"

pages/member.vue

@@ -5,13 +5,11 @@
 			<ElTable
 				stripe
 				:data="data.member"
-				v-else
-			>
+				v-else>
 				<ElTableColumn
 					v-for="prop in showTableHeader"
 					:label="prop[1]"
-					:key="prop[0]"
-				>
+					:key="prop[0]">
 					<template #default="{ row }">
 						<span v-if="prop[0] == 'loss_rate'">
 							{{ row[prop[0]] && row[prop[0]] != "-" ? Number(row[prop[0]] * 100).toFixed(2) + "%" : row[prop[0]] }}
@@ -20,8 +18,7 @@
 						<ElTag
 							v-else
 							effect="dark"
-							:type="row[prop[0]] == 'p2p' ? 'success' : 'info'"
-						>
+							:type="row[prop[0]] == 'p2p' ? 'success' : 'info'">
 							{{ row[prop[0]] }}
 						</ElTag>
 					</template>
@@ -35,22 +32,23 @@
 	import { reactive, onMounted, onBeforeUnmount } from "vue";
 	import { parsePeerInfo } from "@/utils";
 	const data = reactive<{ member: any[] }>({
-		member: []
+		member: [],
 	});
 
 	const showTableHeader = [
-		["ipv4", "虚拟网IP"],
 		["hostname", "主机名"],
-		["cost", "路由"],
 		["lat_ms", "延迟/ms"],
+		["ipv4", "虚拟网IP"],
+		["cost", "路由"],
 		["loss_rate", "丢包率"],
-		["version", "版本"]
+		["nat_type", "NAT类型"],
+		["version", "版本"],
 	];
 
 	const listenOutput = async () => {
 		const member = await invoke("get_members_by_cli");
 		const peerInfo = parsePeerInfo(member as string);
-		peerInfo.forEach(value => {
+		peerInfo.forEach((value) => {
 			if (value.cost === "Local") {
 				value.cost = "本机";
 			}
@@ -58,6 +56,7 @@
 				value.ipv4 = value.ipv4.split("/")[0];
 			}
 		});
+		console.log(peerInfo);
 		data.member = peerInfo;
 	};
 

src-tauri/Cargo.lock

@@ -1109,7 +1109,7 @@ checksum = "0d6ef0072f8a535281e4876be788938b528e9a1d43900b82c2569af7da799125"
 
 [[package]]
 name = "easytier-game"
-version = "1.1.2"
+version = "1.1.3"
 dependencies = [
  "log",
  "planif",

src-tauri/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "easytier-game"
-version = "1.1.2"
+version = "1.1.3"
 homepage = "https://github.com/EasyTier/EasyTier"
 repository = "https://github.com/EasyTier/EasytierGame"
 description = "A simple network initiator based on Easytier"

src-tauri/tauri.conf.json

@@ -1,7 +1,7 @@
 {
 	"$schema": "../node_modules/@tauri-apps/cli/config.schema.json",
 	"productName": "easytier-game",
-	"version": "1.1.2",
+	"version": "1.1.3",
 	"identifier": "com.tauri.easytier-game",
 
 	"build": {
@@ -13,7 +13,7 @@
 	"app": {
 		"windows": [
 			{
-				"title": "easytier-game 1.1.2",
+				"title": "easytier-game 1.1.3",
 				"width": 335,
 				"height": 305,
 				"resizable": false,

stores/index.ts

@@ -29,6 +29,7 @@ export default defineStore("main", {
 				devName: false, //自定义网卡名
 				devNameValue: "", //自定义网卡名
 			},
+			theme: false, //主题  false light true dark
 			configStartEnable: false, //使用配置文件启动
 			configPath: "", //配置文件路径
 			cidrEnable: false,
@@ -39,6 +40,7 @@ export default defineStore("main", {
 		paths: [
 			"basePeers",
 			"cidrEnable",
+			"theme",
 			"config.proxyNetworks",
 			"config.serverUrl",
 			"config.networkName",
@@ -60,7 +62,9 @@ export default defineStore("main", {
 			"config.hostname",
 			"config.dhcp",
 			"config.saveErrorLog",
-			"config.logLevel"
+			"config.logLevel",
+			"config.devName",
+			"config.devNameValue",
 		],
 	},
 });