chore(AI):前端逻辑优化

front/src/App.vue

@@ -4,47 +4,46 @@ import { MenuProps, message } from 'ant-design-vue';
 import { SettingOutlined, UserOutlined, WindowsOutlined } from '@ant-design/icons-vue';
 import { useRouter } from 'vue-router';
 import * as shell from '@tauri-apps/plugin-shell';
-
 import { invoke } from "@tauri-apps/api/core";
-async function contant() {
-    await invoke("open_url", { url: "https://space.bilibili.com/1728953419" })
+
+// 打开作者B站空间
+async function openAuthorBilibili() {
+    await invoke("open_url", { url: "https://space.bilibili.com/1728953419" });
 }
 
-//屏蔽右键菜单
-document.oncontextmenu = function (event: any) {
+// 屏蔽右键菜单（输入框和文本域除外）
+document.oncontextmenu = (event: any) => {
     try {
-        var the = event.srcElement
-        if (
-            !(
-                (the.tagName == 'INPUT' && the.type.toLowerCase() == 'text') ||
-                the.tagName == 'TEXTAREA'
-            )
-        ) {
-            return false
-        }
-        return true
-    } catch (e) {
-        return false
+        const target = event.srcElement;
+        const isInput = target.tagName === 'INPUT' && target.type.toLowerCase() === 'text';
+        const isTextarea = target.tagName === 'TEXTAREA';
+        return isInput || isTextarea;
+    } catch {
+        return false;
     }
-}
+};
 
-/* 启动后端 */
-message.loading("DeEarthX.Core启动中，此过程中请勿执行任何操作......").then(() => {
-    shell.Command.create("core").spawn().then(() => {
-        fetch("http://localhost:37019/", { method: "GET" }).catch((e) => {
-            router.push('/error')
-        }).then(() => {
-            message.success("DeEarthX.Core 启动成功")
-        })
-        console.log(`DeEarthX V3 Core`)
-    }).catch((e) => {
-        console.log(e)
-        message.error("DeEarthX.Core 启动失败，请检查37019是否被占用！")
-    })
-})
 const router = useRouter();
-const selectedKeys = ref(['main']);
-const items: MenuProps['items'] = [
+
+// 启动后端核心服务
+message.loading("DeEarthX.Core启动中，请勿操作...").then(() => {
+    shell.Command.create("core").spawn()
+        .then(() => {
+            // 检查后端服务是否成功启动
+            fetch("http://localhost:37019/", { method: "GET" })
+                .catch(() => router.push('/error'))
+                .then(() => message.success("DeEarthX.Core 启动成功"));
+            console.log("DeEarthX V3 Core");
+        })
+        .catch((error) => {
+            console.error(error);
+            message.error("DeEarthX.Core 启动失败，请检查37019端口是否被占用！");
+        });
+});
+
+// 导航菜单配置
+const selectedKeys = ref<(string | number)[]>(['main']);
+const menuItems: MenuProps['items'] = [
     {
         key: 'main',
         icon: h(WindowsOutlined),
@@ -63,31 +62,26 @@ const items: MenuProps['items'] = [
         label: '关于',
         title: '关于',
     }
-]
-const handleClick: MenuProps['onClick'] = (e) => {
-    switch (e.key) {
-        case 'main':
-            selectedKeys.value[0] = 'main';
-            router.push('/');
-            break;
-        case 'setting':
-            selectedKeys.value[0] = 'setting';
-            router.push('/setting');
-            break;
-        case 'about':
-            selectedKeys.value[0] = 'about';
-            router.push('/about');
-            break;
-        default:
-            break;
-    }
-}
+];
 
+// 菜单点击事件处理
+const handleMenuClick: MenuProps['onClick'] = (e) => {
+    selectedKeys.value[0] = e.key;
+    const routeMap: Record<string, string> = {
+        main: '/',
+        setting: '/setting',
+        about: '/about'
+    };
+    const route = routeMap[e.key] || '/';
+    router.push(route);
+};
+
+// 主题配置
 const theme = ref({
-    "token": {
-        "colorPrimary": "#67eac3",
+    token: {
+        colorPrimary: '#67eac3',
     }
-})
+});
 </script>
 
 <template>
@@ -96,12 +90,12 @@ const theme = ref({
             <a-page-header class="tw:fixed tw:h-16" style="border: 1px solid rgb(235, 237, 240)" title="DeEarthX"
                 sub-title="V3" :avatar="{ src: './public/dex.png' }">
                 <template #extra>
-                    <a-button @click="contant">作者B站</a-button>
+                    <a-button @click="openAuthorBilibili">作者B站</a-button>
                 </template>
             </a-page-header>
             <div class="tw:flex tw:full tw:h-89/100">
-                <a-menu id="menu" style="width: 144px;" :selectedKeys="selectedKeys" mode="inline" :items="items"
-                    @click="handleClick" />
+                <a-menu id="menu" style="width: 144px;" :selectedKeys="selectedKeys" mode="inline" :items="menuItems"
+                    @click="handleMenuClick" />
                 <RouterView />
             </div>
         </div>