refactor: 代码调整

This commit is contained in:
2026-04-11 15:32:31 +08:00
parent a16d39ef52
commit 4645bf93ff
3 changed files with 66 additions and 46 deletions

View File

@@ -1,5 +1,5 @@
{
"printWidth": 120,
"printWidth": 160,
"tabWidth": 2,
"useTabs": false,
"semi": true,

32
package-lock.json generated
View File

@@ -1,11 +1,11 @@
{
"name": "my-app",
"name": "Zhiju",
"version": "1.0.0",
"lockfileVersion": 3,
"requires": true,
"packages": {
"": {
"name": "my-app",
"name": "Zhiju",
"version": "1.0.0",
"license": "MIT",
"dependencies": {
@@ -933,7 +933,6 @@
"integrity": "sha512-zx0EIq78WlY/lBb1uXlziZmDZI4ubcCXIMJ4uGjXzZW0nS19TjSPeXPAjzzTmKQlJUZm0SbmZhPKP7tuQ1SsEw==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"chalk": "^4.1.1",
"fs-extra": "^9.0.1",
@@ -2089,7 +2088,6 @@
"integrity": "sha512-yl43JD/86CIj3Mz5mvvLJqAOfIup7ncxfJ0Btnl0/v5TouVUyeEdcpknfgc+yMevS/48oH9WAkkw93m7otLb/A==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"@inquirer/checkbox": "^3.0.1",
"@inquirer/confirm": "^4.0.1",
@@ -3174,7 +3172,6 @@
"resolved": "https://registry.npmjs.org/@types/lodash-es/-/lodash-es-4.17.12.tgz",
"integrity": "sha512-0NgftHUcV4v34VhXm8QBSftKVXtbkBG3ViCjs6+eJ5a6y6Mi/jiFGPc1sC7QK+9BFhWrURE3EOggmWaSxL9OzQ==",
"license": "MIT",
"peer": true,
"dependencies": {
"@types/lodash": "*"
}
@@ -3195,7 +3192,6 @@
"integrity": "sha512-tO4ZIRKNC+MDWV4qKVZe3Ql/woTnmHDr5JD8UI5hn2pwBrHEwOEMZK7WlNb5RKB6EoJ02gwmQS9OrjuFnZYdpg==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"undici-types": "~7.18.0"
}
@@ -3625,7 +3621,6 @@
"integrity": "sha512-UVJyE9MttOsBQIDKw1skb9nAwQuR5wuGD3+82K6JgJlm/Y+KI92oNsMNGZCYdDsVtRHSak0pcV5Dno5+4jh9sw==",
"dev": true,
"license": "MIT",
"peer": true,
"bin": {
"acorn": "bin/acorn"
},
@@ -3692,7 +3687,6 @@
"integrity": "sha512-PlXPeEWMXMZ7sPYOHqmDyCJzcfNrUr3fGNKtezX14ykXOEIvyK81d+qydx89KY5O71FKMPaQ2vBfBFI5NHR63A==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"fast-deep-equal": "^3.1.3",
"fast-uri": "^3.0.1",
@@ -3978,7 +3972,6 @@
}
],
"license": "MIT",
"peer": true,
"dependencies": {
"baseline-browser-mapping": "^2.10.12",
"caniuse-lite": "^1.0.30001782",
@@ -5531,6 +5524,17 @@
"dev": true,
"license": "MIT"
},
"node_modules/encoding": {
"version": "0.1.13",
"resolved": "https://registry.npmjs.org/encoding/-/encoding-0.1.13.tgz",
"integrity": "sha512-ETBauow1T35Y/WZMkio9jiM0Z5xjHHmJ4XmjZOq1l/dXz3lr2sRn87nJy20RupqSh1F2m3HHPSp8ShIPQJrJ3A==",
"dev": true,
"license": "MIT",
"optional": true,
"dependencies": {
"iconv-lite": "^0.6.2"
}
},
"node_modules/end-of-stream": {
"version": "1.4.5",
"resolved": "https://registry.npmjs.org/end-of-stream/-/end-of-stream-1.4.5.tgz",
@@ -7740,15 +7744,13 @@
"version": "4.18.1",
"resolved": "https://registry.npmjs.org/lodash/-/lodash-4.18.1.tgz",
"integrity": "sha512-dMInicTPVE8d1e5otfwmmjlxkZoUpiVLwyeTdUsi/Caj/gfzzblBcCE5sRHV/AsjuCmxWrte2TNGSYuCeCq+0Q==",
"license": "MIT",
"peer": true
"license": "MIT"
},
"node_modules/lodash-es": {
"version": "4.18.1",
"resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.18.1.tgz",
"integrity": "sha512-J8xewKD/Gk22OZbhpOVSwcs60zhd95ESDwezOFuA3/099925PdHJ7OFHNTGtajL3AlZkykD32HykiMo+BIBI8A==",
"license": "MIT",
"peer": true
"license": "MIT"
},
"node_modules/lodash-unified": {
"version": "1.0.3",
@@ -10016,7 +10018,6 @@
"integrity": "sha512-vcI4UpRgg81oIRUFwR0WSIHKt11nJ7SAVlYNIu+QpqeyXP+gpQJy/Z4+F0aGxSE4MqwjyXvW/TzgkLAx2AGHwQ==",
"devOptional": true,
"license": "Apache-2.0",
"peer": true,
"bin": {
"tsc": "bin/tsc",
"tsserver": "bin/tsserver"
@@ -10137,7 +10138,6 @@
"integrity": "sha512-o5a9xKjbtuhY6Bi5S3+HvbRERmouabWbyUcpXXUA1u+GNUKoROi9byOJ8M0nHbHYHkYICiMlqxkg1KkYmm25Sw==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"esbuild": "^0.21.3",
"postcss": "^8.4.43",
@@ -10197,7 +10197,6 @@
"resolved": "https://registry.npmjs.org/vue/-/vue-3.5.32.tgz",
"integrity": "sha512-vM4z4Q9tTafVfMAK7IVzmxg34rSzTFMyIe0UUEijUCkn9+23lj0WRfA83dg7eQZIUlgOSGrkViIaCfqSAUXsMw==",
"license": "MIT",
"peer": true,
"dependencies": {
"@vue/compiler-dom": "3.5.32",
"@vue/compiler-sfc": "3.5.32",
@@ -10278,7 +10277,6 @@
"integrity": "sha512-jTywjboN9aHxFlToqb0K0Zs9SbBoW4zRUlGzI2tYNxVYcEi/IPpn+Xi4ye5jTLvX2YeLuic/IvxNot+Q1jMoOw==",
"dev": true,
"license": "MIT",
"peer": true,
"dependencies": {
"@types/eslint-scope": "^3.7.7",
"@types/estree": "^1.0.8",

View File

@@ -2,12 +2,7 @@
<div class="flex flex-col h-screen w-screen overflow-hidden">
<div class="flex flex-1 overflow-hidden">
<!-- 侧边栏 -->
<aside
:class="[
'flex flex-col bg-white border-r border-gray-200 transition-all duration-300 no-drag',
appStore.collapsed ? 'w-16' : 'w-56',
]"
>
<aside :class="['flex flex-col bg-white border-r border-gray-200 transition-all duration-300 no-drag', appStore.collapsed ? 'w-16' : 'w-56']">
<!-- Logo -->
<div class="flex items-center h-14 px-4 border-b border-gray-200 shrink-0">
<el-icon class="text-blue-500 text-xl shrink-0"><Monitor /></el-icon>
@@ -18,27 +13,45 @@
</template>
</div>
<!-- 导航菜单 -->
<el-menu
:default-active="$route.path"
:collapse="appStore.collapsed"
:collapse-transition="false"
router
class="flex-1 border-none"
>
<el-menu-item index="/">
<el-icon><House /></el-icon>
<template #title>首页</template>
</el-menu-item>
<el-menu-item index="/chat">
<el-icon><ChatDotRound /></el-icon>
<template #title>OpenCode 对话</template>
</el-menu-item>
<el-menu-item index="/bonjour">
<el-icon><Search /></el-icon>
<template #title>发现设备</template>
</el-menu-item>
</el-menu>
<!-- 自定义菜单 -->
<nav class="flex-1 px-3 py-4 space-y-1">
<div
v-for="(item, index) in menus"
:key="index"
:class="[
'flex items-center rounded-xl cursor-pointer transition-all duration-200 ease-out group relative overflow-hidden',
appStore.collapsed ? 'justify-center px-0 py-3 mx-auto w-11' : 'px-4 py-3 mx-0',
$route.path === item.index
? 'bg-gradient-to-r from-blue-500 to-blue-600 text-white shadow-md shadow-blue-200'
: 'text-gray-500 hover:bg-gray-50 hover:text-gray-700',
]"
@click="router.push(item.index)"
>
<!-- 图标 -->
<div
:class="[
'flex items-center justify-center shrink-0 transition-transform duration-200',
appStore.collapsed ? 'w-6 h-6' : 'w-5 h-5',
$route.path === item.index ? 'scale-110' : 'group-hover:scale-105',
]"
>
<el-icon :class="['transition-colors duration-200', appStore.collapsed ? 'text-xl' : 'text-lg']">
<component :is="item.icon" />
</el-icon>
</div>
<!-- 文字 -->
<span v-show="!appStore.collapsed" class="ml-3 text-sm font-medium whitespace-nowrap transition-all duration-200">
{{ item.name }}
</span>
<!-- Active 指示条 -->
<div
v-if="$route.path === item.index && !appStore.collapsed"
class="absolute right-0 top-1/2 -translate-y-1/2 w-1 h-6 bg-white/50 rounded-l-full"
/>
</div>
</nav>
<!-- 折叠按钮 -->
<div class="p-3 border-t border-gray-200">
@@ -84,11 +97,20 @@
import { computed, ref } from 'vue';
import { useRoute } from 'vue-router';
import { useAppStore } from '@/stores/app';
import { House, Monitor, Expand, Fold, ChatDotRound, Search } from '@element-plus/icons-vue';
import { House, Monitor, Expand, Fold, ChatDotRound, Search, Collection, Clock } from '@element-plus/icons-vue';
import router from '@/router';
const route = useRoute();
const appStore = useAppStore();
const menus = ref([
{ name: '新对话', index: '/', icon: House },
{ name: '知识空间', index: '/knowledge', icon: Collection },
{ name: 'opencode对话', index: '/chat', icon: ChatDotRound },
{ name: '发现设备', index: '/bonjour', icon: Search },
{ name: '历史对话', index: '/history', icon: Clock },
]);
const showAppInfo = ref(false);
const currentTitle = computed(() => route.meta?.title || appStore.title);