duanshuwen/zn-ai
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat: 调整布局

Browse Source
This commit is contained in:
duanshuwen
2025-12-07 16:29:57 +08:00
parent 14d916187c
commit 84300791a0
19 changed files with 564 additions and 146 deletions
Download Patch File Download Diff File Expand all files Collapse all files

405
package-lock.json generated
View File

@@ -44,6 +44,7 @@
"eslint-plugin-import": "^2.32.0",
"eslint-plugin-vue": "^10.6.0",
"postcss": "^8.5.6",
"sass-embedded": "^1.89.1",
"tailwindcss": "^3.4.18",
"typescript": "~4.5.4",
"vite": "^7.1.9",
@@ -109,6 +110,13 @@
"node": ">=6.9.0"
}
},
"node_modules/@bufbuild/protobuf": {
"version": "2.10.1",
"resolved": "https://registry.npmjs.org/@bufbuild/protobuf/-/protobuf-2.10.1.tgz",
"integrity": "sha512-ckS3+vyJb5qGpEYv/s1OebUHDi/xSNtfgw1wqKZo7MR9F2z+qXr0q5XagafAG/9O0QPVIUfST0smluYSTpYFkg==",
"dev": true,
"license": "(Apache-2.0 AND BSD-3-Clause)"
},
"node_modules/@ctrl/tinycolor": {
"version": "3.6.1",
"resolved": "https://registry.npmjs.org/@ctrl/tinycolor/-/tinycolor-3.6.1.tgz",
@@ -3923,6 +3931,13 @@
"ieee754": "^1.1.13"
}
},
"node_modules/buffer-builder": {
"version": "0.2.0",
"resolved": "https://registry.npmjs.org/buffer-builder/-/buffer-builder-0.2.0.tgz",
"integrity": "sha512-7VPMEPuYznPSoR21NE1zvd2Xna6c/CloiZCfcMXR1Jny6PjX0N4Nsa38zcBFo/FMK+BlA+FLKbJCQ0i2yxp+Xg==",
"dev": true,
"license": "MIT/X11"
},
"node_modules/buffer-crc32": {
"version": "0.2.13",
"resolved": "https://registry.npmjs.org/buffer-crc32/-/buffer-crc32-0.2.13.tgz",
@@ -4405,6 +4420,13 @@
"dev": true,
"license": "MIT"
},
"node_modules/colorjs.io": {
"version": "0.5.2",
"resolved": "https://registry.npmjs.org/colorjs.io/-/colorjs.io-0.5.2.tgz",
"integrity": "sha512-twmVoizEW7ylZSN32OgKdXRmo1qg+wT5/6C3xu5b9QsWzSFAhHLn2xd8ro0diCsKfCj1RdaTP/nrcW+vAoQPIw==",
"dev": true,
"license": "MIT"
},
"node_modules/combined-stream": {
"version": "1.0.8",
"resolved": "https://registry.npmjs.org/combined-stream/-/combined-stream-1.0.8.tgz",
@@ -7212,6 +7234,13 @@
"node": ">= 4"
}
},
"node_modules/immutable": {
"version": "5.1.4",
"resolved": "https://registry.npmjs.org/immutable/-/immutable-5.1.4.tgz",
"integrity": "sha512-p6u1bG3YSnINT5RQmx/yRZBpenIl30kVxkTLDyHLIMk0gict704Q9n+thfDI7lTRm9vXdDYutVzXhzcThxTnXA==",
"dev": true,
"license": "MIT"
},
"node_modules/import-fresh": {
"version": "3.3.1",
"resolved": "https://registry.npmjs.org/import-fresh/-/import-fresh-3.3.1.tgz",
@@ -10459,6 +10488,23 @@
"queue-microtask": "^1.2.2"
}
},
"node_modules/rxjs": {
"version": "7.8.2",
"resolved": "https://registry.npmjs.org/rxjs/-/rxjs-7.8.2.tgz",
"integrity": "sha512-dhKf903U/PQZY6boNNtAGdWbG85WAbjT/1xYoZIC7FAY0yWapOBQVsVrDl58W86//e1VpMNBtRV4MaXfdMySFA==",
"dev": true,
"license": "Apache-2.0",
"dependencies": {
"tslib": "^2.1.0"
}
},
"node_modules/rxjs/node_modules/tslib": {
"version": "2.8.1",
"resolved": "https://registry.npmjs.org/tslib/-/tslib-2.8.1.tgz",
"integrity": "sha512-oJFu94HQb+KVduSUQL7wnpmqnfmLsOA/nAh6b6EH0wCEoK0/mPeXU6c3wKDV83MkOuHPRHtSXKKU99IBazS/2w==",
"dev": true,
"license": "0BSD"
},
"node_modules/safe-array-concat": {
"version": "1.1.3",
"resolved": "https://registry.npmjs.org/safe-array-concat/-/safe-array-concat-1.1.3.tgz",
@@ -10542,6 +10588,335 @@
"dev": true,
"license": "MIT"
},
"node_modules/sass-embedded": {
"version": "1.89.1",
"resolved": "https://registry.npmjs.org/sass-embedded/-/sass-embedded-1.89.1.tgz",
"integrity": "sha512-alvGGlyYdkSXYKOfS/TTxUD0993EYOe3adIPtwCWEg037qe183p2dkYnbaRsCLJFKt+QoyRzhsrbCsK7sbR6MA==",
"dev": true,
"license": "MIT",
"dependencies": {
"@bufbuild/protobuf": "^2.0.0",
"buffer-builder": "^0.2.0",
"colorjs.io": "^0.5.0",
"immutable": "^5.0.2",
"rxjs": "^7.4.0",
"supports-color": "^8.1.1",
"sync-child-process": "^1.0.2",
"varint": "^6.0.0"
},
"bin": {
"sass": "dist/bin/sass.js"
},
"engines": {
"node": ">=16.0.0"
},
"optionalDependencies": {
"sass-embedded-android-arm": "1.89.1",
"sass-embedded-android-arm64": "1.89.1",
"sass-embedded-android-riscv64": "1.89.1",
"sass-embedded-android-x64": "1.89.1",
"sass-embedded-darwin-arm64": "1.89.1",
"sass-embedded-darwin-x64": "1.89.1",
"sass-embedded-linux-arm": "1.89.1",
"sass-embedded-linux-arm64": "1.89.1",
"sass-embedded-linux-musl-arm": "1.89.1",
"sass-embedded-linux-musl-arm64": "1.89.1",
"sass-embedded-linux-musl-riscv64": "1.89.1",
"sass-embedded-linux-musl-x64": "1.89.1",
"sass-embedded-linux-riscv64": "1.89.1",
"sass-embedded-linux-x64": "1.89.1",
"sass-embedded-win32-arm64": "1.89.1",
"sass-embedded-win32-x64": "1.89.1"
}
},
"node_modules/sass-embedded-android-arm": {
"version": "1.89.1",
"resolved": "https://registry.npmjs.org/sass-embedded-android-arm/-/sass-embedded-android-arm-1.89.1.tgz",
"integrity": "sha512-wVchZSz8zbJBwwOs9/iwco/M5G3L5BaeqwUF1EC3Gtzn1BsXYUEkJfftW2HxGl4hQz2YlpR7BY1GRN817uxADA==",
"cpu": [
"arm"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"android"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-android-arm64": {
"version": "1.89.1",
"resolved": "https://registry.npmjs.org/sass-embedded-android-arm64/-/sass-embedded-android-arm64-1.89.1.tgz",
"integrity": "sha512-Je6x7uuJRGQdr5ziSJdaPA4NhBSO26BU/E55qiuMUZpjq2EWBEJPbNeugu/cWlCEmfqoVuxj37r8aEU+KG0H1g==",
"cpu": [
"arm64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"android"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-android-riscv64": {
"version": "1.89.1",
"resolved": "https://registry.npmjs.org/sass-embedded-android-riscv64/-/sass-embedded-android-riscv64-1.89.1.tgz",
"integrity": "sha512-DhWe+A4RVtpHMVaQgdzRpiczAXKPl7XhyY9USkY9Xkhv94+csTfjyuFmsUuCpKSiQDQkD+rGByfg+9yQIk/RgQ==",
"cpu": [
"riscv64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"android"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-android-x64": {
"version": "1.89.1",
"resolved": "https://registry.npmjs.org/sass-embedded-android-x64/-/sass-embedded-android-x64-1.89.1.tgz",
"integrity": "sha512-LTEzxTXrv3evPiHBmDMtJtO5tEprg7bvNOwYTjDEhE9ZCYdb70l+haIY0dVyhGxyeaBJlyvatjWOKEduPP3Lyw==",
"cpu": [
"x64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"android"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-darwin-arm64": {
"version": "1.89.1",
"resolved": "https://registry.npmjs.org/sass-embedded-darwin-arm64/-/sass-embedded-darwin-arm64-1.89.1.tgz",
"integrity": "sha512-7qMO4BLdIOFMMc1M+hg5iWEjPxbPlH1XTPUCwyuXYqubz6kXkdrrtJXolNAAey/0ZOE6uXk0APugm93a/veQdQ==",
"cpu": [
"arm64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"darwin"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-darwin-x64": {
"version": "1.89.1",
"resolved": "https://registry.npmjs.org/sass-embedded-darwin-x64/-/sass-embedded-darwin-x64-1.89.1.tgz",
"integrity": "sha512-Jzuws3NNx4YtDdL2/skP8BvGqMBKn26XINehwLnD2kgbh0+k+vKNWt5JDomvIuZVLsK8zWrMoRkXpk4wuHdqrw==",
"cpu": [
"x64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"darwin"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-linux-arm": {
"version": "1.89.1",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-arm/-/sass-embedded-linux-arm-1.89.1.tgz",
"integrity": "sha512-8TvFr/lh7FARtNr9mM57m7NNvtSZwnlkXtfY1D48B81Ve6GgtLqQhELNzvTcfQ0WZa0aNnVjq9XUuWLlrMDaZQ==",
"cpu": [
"arm"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-linux-arm64": {
"version": "1.89.1",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-arm64/-/sass-embedded-linux-arm64-1.89.1.tgz",
"integrity": "sha512-h967EV2armjV+Re+hHv7LaIzCOvV6DoFod9GJhXTdnPvilqs7DAPTUfN07wOqbzjlaGEnITZXzLsWAoZ1Z7tWQ==",
"cpu": [
"arm64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-linux-musl-arm": {
"version": "1.89.1",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-arm/-/sass-embedded-linux-musl-arm-1.89.1.tgz",
"integrity": "sha512-Tl8wDL+3qFa/AhvZZBb1OvhN1SvIsRSLaPdGP8cv3VmKKVBdlLp2zedPTlcLJpR9dG/bjtGJYGX15kWHAvZ6mQ==",
"cpu": [
"arm"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-linux-musl-arm64": {
"version": "1.89.1",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-arm64/-/sass-embedded-linux-musl-arm64-1.89.1.tgz",
"integrity": "sha512-l4TrsUmE3AEPy2gDThb+OQV5xSyrb807DJbkQiFtTwvtOZAAkoVl1v2QeocW0npgKjc/W7nHMiSempJe0UcV7w==",
"cpu": [
"arm64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-linux-musl-riscv64": {
"version": "1.89.1",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-riscv64/-/sass-embedded-linux-musl-riscv64-1.89.1.tgz",
"integrity": "sha512-YJVZmz032U7dv4RW3u+SJGp+DQWmYWc5fX/aXzLuoL6PPUPon1/Sseaf/5YGtcuQf8RnxZBbM2nFHFVHDJfsQw==",
"cpu": [
"riscv64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-linux-musl-x64": {
"version": "1.89.1",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-musl-x64/-/sass-embedded-linux-musl-x64-1.89.1.tgz",
"integrity": "sha512-67ijpk87V0VlpdVTtgnfIzRkVUMtEH79nvGctvNpk0XT6v+oxoFRljFRiYItZOxb5gRZMnvtkgaz1VHVcMrhtg==",
"cpu": [
"x64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-linux-riscv64": {
"version": "1.89.1",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-riscv64/-/sass-embedded-linux-riscv64-1.89.1.tgz",
"integrity": "sha512-SQNWy5kUvlQJUKRXFy8jS05DBik+2ERIWDxOBk+QuJYEIktlA9fKKBU8c7RkgpZFNXSXZa0W1Gy27oOFCzhhuA==",
"cpu": [
"riscv64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-linux-x64": {
"version": "1.89.1",
"resolved": "https://registry.npmjs.org/sass-embedded-linux-x64/-/sass-embedded-linux-x64-1.89.1.tgz",
"integrity": "sha512-KUqGzBvTDZG6D3Pq41sCzqO1wkxM0WmxxlI7PTuVkvgciTywHf8F7mkg2alMLVZQ6APJEYtlnCGQgn4cCgYsqw==",
"cpu": [
"x64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"linux"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-win32-arm64": {
"version": "1.89.1",
"resolved": "https://registry.npmjs.org/sass-embedded-win32-arm64/-/sass-embedded-win32-arm64-1.89.1.tgz",
"integrity": "sha512-Lk6dYA18RasZxQhShT91G7Z2o7+F9necTNJ951a5AICsSJpTbg3tTnAGB7Rvd6xB5reQSZoXfB/zXKEKwtzaow==",
"cpu": [
"arm64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"win32"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded-win32-x64": {
"version": "1.89.1",
"resolved": "https://registry.npmjs.org/sass-embedded-win32-x64/-/sass-embedded-win32-x64-1.89.1.tgz",
"integrity": "sha512-YlvzrzFPHd4GKa04jMfP0t2DGJHPTm7zN4GEYtaOFqeS6BoEAUY5kBNYFy7zhwKesN3kGyU/D9rz1MfLRgGv0g==",
"cpu": [
"x64"
],
"dev": true,
"license": "MIT",
"optional": true,
"os": [
"win32"
],
"engines": {
"node": ">=14.0.0"
}
},
"node_modules/sass-embedded/node_modules/supports-color": {
"version": "8.1.1",
"resolved": "https://registry.npmjs.org/supports-color/-/supports-color-8.1.1.tgz",
"integrity": "sha512-MpUEN2OodtUzxvKQl72cUF7RQ5EiHsGvSsVG0ia9c5RbWGL2CI4C7EpPS8UTBIplnlzZiNuV56w+FuNxy3ty2Q==",
"dev": true,
"license": "MIT",
"dependencies": {
"has-flag": "^4.0.0"
},
"engines": {
"node": ">=10"
},
"funding": {
"url": "https://github.com/chalk/supports-color?sponsor=1"
}
},
"node_modules/schema-utils": {
"version": "4.3.3",
"resolved": "https://registry.npmjs.org/schema-utils/-/schema-utils-4.3.3.tgz",
@@ -11294,6 +11669,29 @@
"url": "https://github.com/sponsors/ljharb"
}
},
"node_modules/sync-child-process": {
"version": "1.0.2",
"resolved": "https://registry.npmjs.org/sync-child-process/-/sync-child-process-1.0.2.tgz",
"integrity": "sha512-8lD+t2KrrScJ/7KXCSyfhT3/hRq78rC0wBFqNJXv3mZyn6hW2ypM05JmlSvtqRbeq6jqA94oHbxAr2vYsJ8vDA==",
"dev": true,
"license": "MIT",
"dependencies": {
"sync-message-port": "^1.0.0"
},
"engines": {
"node": ">=16.0.0"
}
},
"node_modules/sync-message-port": {
"version": "1.1.3",
"resolved": "https://registry.npmjs.org/sync-message-port/-/sync-message-port-1.1.3.tgz",
"integrity": "sha512-GTt8rSKje5FilG+wEdfCkOcLL7LWqpMlr2c3LRuKt/YXxcJ52aGSbGBAdI4L3aaqfrBt6y711El53ItyH1NWzg==",
"dev": true,
"license": "MIT",
"engines": {
"node": ">=16.0.0"
}
},
"node_modules/tailwindcss": {
"version": "3.4.18",
"resolved": "https://registry.npmjs.org/tailwindcss/-/tailwindcss-3.4.18.tgz",
@@ -11945,6 +12343,13 @@
"spdx-expression-parse": "^3.0.0"
}
},
"node_modules/varint": {
"version": "6.0.0",
"resolved": "https://registry.npmjs.org/varint/-/varint-6.0.0.tgz",
"integrity": "sha512-cXEIW6cfr15lFv563k4GuVuW/fiwjknytD37jIOLSdSWuOI6WnO/oKwmP2FQTU2l01LP8/M5TSAJpzUaGe3uWg==",
"dev": true,
"license": "MIT"
},
"node_modules/vite": {
"version": "7.2.4",
"resolved": "https://registry.npmjs.org/vite/-/vite-7.2.4.tgz",

1
package.json
View File

@@ -43,6 +43,7 @@
"eslint-plugin-import": "^2.32.0",
"eslint-plugin-vue": "^10.6.0",
"postcss": "^8.5.6",
"sass-embedded": "^1.89.1",
"tailwindcss": "^3.4.18",
"typescript": "~4.5.4",
"vite": "^7.1.9",

2
src/electron/main/main.ts
View File

@@ -15,7 +15,7 @@ class AppMain {
init() {
this.registerLifecycle()
this.registerAppIPC()
this.registerLogIPC()
// this.registerLogIPC()
}
private createWindow(options?: { frameless?: boolean; route?: string }): BrowserWindow {

3
src/electron/preload/preload.ts
View File

@@ -64,6 +64,9 @@ const api: IPCAPI = {
// 发送日志
logToMain: (logLevel: string, message: string) => ipcRenderer.send('log-to-main', logLevel, message),
// 打开新窗口
openNewTab: (url: string) => ipcRenderer.invoke('open-new-tab', url)
}
contextBridge.exposeInMainWorld('ipcAPI', api)

15
src/renderer/App.vue
View File

@@ -1,18 +1,5 @@
<template>
<div id="app">
<router-view />
</div>
</template>
<script setup lang="ts">
import { useCounterStore } from "@store/counter";
// 使用 Pinia store
const counterStore = useCounterStore();
</script>
<style scoped>
#app {
@apply min-h-screen bg-gray-100;
}
</style>
<script setup lang="ts"></script>

6
src/renderer/components/Menus/index.vue
View File

@@ -1,5 +1,5 @@
<template>
<div class="w-[80px] h-full box-border pt-[12px] pb-[12px] flex flex-col items-center justify-center">
<div class="w-[80px] h-full box-border flex flex-col items-center justify-center">
<div :class="['flex flex-col gap-[16px]', { 'mt-auto mb-[8px] shrink-1': item.id === 7 }]"
v-for="(item) in menus" :key="item.id">
<div :class="['cursor-pointer flex flex-col items-center justify-center']" @click="handleClick(item)">
@@ -23,11 +23,13 @@
<script setup lang="ts">
import { ref } from 'vue'
import { menus } from '@constant/menus'
import { useRouter } from "vue-router";
const router = useRouter();
const currentId = ref(1)
const handleClick = async (item: any) => {
currentId.value = item.id
await (window as any).ipcAPI.tabs.create(item.url)
router.push(item.url);
}
</script>

56
src/renderer/components/TaskList/index.vue
View File

@@ -1,9 +1,59 @@
<template>
<div class="task-list w-[392px] h-full rounded-[16px] bg-white">
<slot></slot>
<div class="task p-[12px]">
<div class="flex border border-[#BEDBFF] h-[48px] p-[4px] rounded-[10px] bg-[#EFF6FF] task-tab">
<div v-for="item in tabs" :key="item.value"
class="flex-1 flex text-center items-center h-full align-middle text"
:class="active === item.value && 'active'" @click="changeTab(item.value)">
<div class="flex-1">{{ item.name }}<span v-if="item.total">{{ `（${item.total > 98 && item.total +
'+'
|| item.total}）` }}</span></div>
</div>
</div>
</div>
</div>
</template>
<script setup lang="ts"></script>
<script setup lang="ts">
import { ref, reactive } from "vue";
<style></style>
const tabs = reactive([{
name: '待处理',
value: 1,
total: 10,
}, {
name: '已处理',
value: 2,
total: 99,
}])
const active = ref(1);
const changeTab = (val: number) => {
active.value = val;
};
</script>
<style scoped>
.task-tab .text {
color: #525866;
font-size: 14px;
cursor: pointer;
}
.task-tab .active {
position: relative;
color: #2B7FFF;
background: #FFFFFF;
border-radius: 8px;
}
.task-tab .active::after {
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
content: '';
border-radius: 8px;
border: 1px solid #2B7FFF;
}
</style>

2
src/renderer/constant/menus.ts
View File

@@ -65,6 +65,6 @@ export const menus: MenuItem[] = [
icon: RiSettingsLine,
color: '#525866',
activeColor: '#2B7FFF',
url: '/settings',
url: '/setting',
},
]

13
src/renderer/layout/index.vue
View File

@@ -2,11 +2,16 @@
<div class="bg box-border w-full h-screen flex pt-[8px] pb-[8px] pl-[8px] ">
<div class="flex-1 flex gap-[8px]">
<div class="flex-1 h-full">
<slot></slot>
<router-view v-slot="{ Component, route }">
<transition name="fade-transform" mode="out-in">
<keep-alive>
<component :is="Component" :key="route.path" />
</keep-alive>
</transition>
</router-view>
</div>
<TaskList>
<slot name="task"></slot>
</TaskList>
<TaskList />
</div>
<Menus />

3
src/renderer/main.ts
View File

@@ -3,7 +3,6 @@ import { createApp } from "vue";
import { createPinia } from "pinia";
import router from "./router";
import App from "./App.vue";
import Layout from "./layout/index.vue";
import ElementPlus from 'element-plus'
import 'element-plus/dist/index.css'
import locale from 'element-plus/es/locale/lang/zh-cn'
@@ -14,8 +13,6 @@ const app = createApp(App);
// 使用 Pinia 状态管理
app.use(createPinia());
// 注册 Layout 组件
app.component('Layout', Layout);
// 使用 Vue Router
app.use(router);

50
src/renderer/router/index.ts
View File

@@ -1,4 +1,5 @@
import { createRouter, createWebHistory } from "vue-router";
import Layout from '@/layout/index.vue'
const routes = [
{
@@ -13,17 +14,53 @@ const routes = [
meta: { requiresAuth: true },
},
{
path: "/home",
name: "Home",
path: "/",
component: Layout,
children: [
{
path: "home",
component: () => import("@/views/home/index.vue"),
name: "Home",
meta: { requiresAuth: true },
},
{
path: "/rate",
path: "stock",
name: "Stock",
component: () => import("@/views/stock/index.vue"),
meta: { requiresAuth: true },
},
{
path: "rate",
name: "Rate",
component: () => import("@/views/rate/index.vue"),
meta: { requiresAuth: true },
},
{
path: "order",
name: "Order",
component: () => import("@/views/order/index.vue"),
meta: { requiresAuth: true },
},
{
path: "more",
name: "More",
component: () => import("@/views/more/index.vue"),
meta: { requiresAuth: true },
},
{
path: "setting",
name: "Setting",
component: () => import("@/views/setting/index.vue"),
meta: { requiresAuth: true },
},
{
path: "/dashboard",
name: "Dashboard",
component: () => import("@/views/dashboard/index.vue"),
meta: { requiresAuth: true },
},
]
},
{
path: "/about",
name: "About",
@@ -34,6 +71,13 @@ const routes = [
const router = createRouter({
history: createWebHistory(),
routes,
scrollBehavior(to: any, from: any, savedPosition: any) {
if (savedPosition) {
return savedPosition
}
return { top: 0 }
},
});
router.beforeEach((to: any, from: any, next: any) => {

13
src/renderer/views/dashboard/index.vue
View File

@@ -1,18 +1,7 @@
<template>
<Layout>
<template #task>
<Task />
</template>
</Layout>
<div>看板</div>
</template>
<script setup lang="ts">
import Task from '../components/Task/index.vue'
const openBaidu = () => {
(window as any).ipcAPI?.openBaidu()
// 发送日志
(window as any).ipcAPI?.logToMain('info', '打开百度')
}
</script>

15
src/renderer/views/home/index.vue
View File

@@ -1,18 +1,9 @@
<template>
<Layout>
<template #task>
<Task />
</template>
</Layout>
<div>
首页
</div>
</template>
<script setup lang="ts">
import Task from '../components/Task/index.vue'
const openBaidu = () => {
(window as any).ipcAPI?.openBaidu()
// 发送日志
(window as any).ipcAPI?.logToMain('info', '打开百度')
}
</script>

59
src/renderer/views/login/index.vue
View File

@@ -1,13 +1,12 @@
<template>
<div
class="h-screen box-border p-[8px] login-bg flex items-center justify-center"
>
<div class="h-screen box-border p-[8px] login-bg flex items-center justify-center">
<div class="w-[836px] h-full bg-white rounded-2xl p-[32px] flex flex-col">
<div class="flex items-center">
<img class="w-[48px] h-[48px]" src="@assets/images/login/blue_logo.png" />
<span class="ml-auto text-[14px] text-gray-600">没有账号？</span>
<button class="bg-sky-50 rounded-[8px] text-[14px] text-sky-600 px-[12px] py-[6px] focus-visible:outline-none">注册</button>
<button
class="bg-sky-50 rounded-[8px] text-[14px] text-sky-600 px-[12px] py-[6px] focus-visible:outline-none">注册</button>
</div>
<div class="flex flex-col items-center justify-center mb-[24px] box-border pt-[108px]">
@@ -20,37 +19,22 @@
<div class="font-[14px] text-gray-700 mb-2">账号</div>
<div class="border rounded-[10px] flex items-center gap-2 box-border px-[12px] py-[10px]">
<RiUser3Fill size="20px" color="#99A0AE" />
<input
class="flex-1 focus-visible:outline-none"
type="text"
v-model.trim="form.account"
placeholder="请输入账号"
@keyup.enter="onSubmit"
/>
<input class="flex-1 focus-visible:outline-none" type="text" v-model.trim="form.account" placeholder="请输入账号"
@keyup.enter="onSubmit" />
</div>
<p v-if="errors.account" class="mt-1 text-xs text-red-500">{{ errors.account }}</p>
<div class="font-[14px] text-gray-700 mb-[8px] mt-[12px]">密码</div>
<div class="flex items-center gap-2 border rounded-[10px] box-border px-[12px] py-[10px]">
<RiKey2Fill size="20px" color="#99A0AE" />
<input
class="flex-1 focus-visible:outline-none"
:type="showPwd ? 'text' : 'password'"
v-model.trim="form.password"
placeholder="请输入密码"
@keyup.enter="onSubmit"
/>
<input class="flex-1 focus-visible:outline-none" :type="showPwd ? 'text' : 'password'"
v-model.trim="form.password" placeholder="请输入密码" @keyup.enter="onSubmit" />
</div>
<p v-if="errors.password" class="mt-1 text-xs text-red-500">{{ errors.password }}</p>
<!-- 验证码 -->
<div class="font-[14px] text-gray-700 mb-[8px] mt-[12px]">验证码</div>
<div class="flex items-center gap-2 border rounded-[10px] box-border px-[12px] py-[10px]">
<input
class="flex-1 focus-visible:outline-none"
type="text"
v-model.trim="form.code"
placeholder="请输入验证码"
@keyup.enter="onSubmit"
/>
<input class="flex-1 focus-visible:outline-none" type="text" v-model.trim="form.code" placeholder="请输入验证码"
@keyup.enter="onSubmit" />
<img class="w-[80px] h-[40px]" src="" />
</div>
<p v-if="errors.code" class="mt-1 text-xs text-red-500">{{ errors.code }}</p>
@@ -58,31 +42,21 @@
<!-- 记住密码|忘记密码 -->
<div class="flex items-center justify-between mb-[24px] mt-[24px]">
<div class="flex items-center gap-2">
<input
type="checkbox"
v-model="showPwd"
class="w-[14px] h-[14px] rounded-[4px]"
/>
<input type="checkbox" v-model="showPwd" class="w-[14px] h-[14px] rounded-[4px]" />
<span class="text-[14px] text-gray-600">记住密码</span>
</div>
<span class="text-[14px] text-sky-600">忘记密码？</span>
</div>
<!-- 登录按钮 -->
<button
class="w-full py-2 bg-blue-600 text-white rounded-[8px] hover:bg-blue-700 disabled:bg-blue-300"
@click="onSubmit"
>
<button class="w-full py-2 bg-blue-600 text-white rounded-[8px] hover:bg-blue-700 disabled:bg-blue-300"
@click="onSubmit">
{{ loading ? '登录中…' : '登录' }}
</button>
<!-- 同意协议 -->
<div class="flex items-center justify-center gap-2 mt-[24px]">
<input
type="checkbox"
v-model="form.agreement"
class="w-[14px] h-[14px] rounded-[4px]"
/>
<input type="checkbox" v-model="form.agreement" class="w-[14px] h-[14px] rounded-[4px]" />
<span class="text-[14px] text-gray-600">我已同意</span>
<span class="text-[14px] text-sky-600">《使用协议》</span>
<span class="text-[14px] text-gray-600">和</span>
@@ -103,8 +77,8 @@
<script setup lang="ts">
import { ref, reactive } from "vue";
import { useRouter } from "vue-router";
import { login as apiLogin } from "@/renderer/api/login";
import { RiUser3Fill , RiKey2Fill} from '@remixicon/vue'
// import { login as apiLogin } from "@/renderer/api/login";
import { RiUser3Fill, RiKey2Fill } from '@remixicon/vue'
const router = useRouter();
const form = reactive({ account: "", password: "", agreement: "", code: "" });
@@ -131,7 +105,8 @@ const onSubmit = async () => {
// const token = res && (res.token || res.data?.token || res.access_token);
// if (!token) throw new Error("登录失败");
// localStorage.setItem("token", token);
await (window as any).ipcAPI.app.setFrameless('/home')
// await (window as any).ipcAPI.app.setFrameless('/home')
router.push('/home');
} finally {
// loading.value = false;
}

13
src/renderer/views/more/index.vue
View File

@@ -1,18 +1,7 @@
<template>
<Layout>
<template #task>
<Task />
</template>
</Layout>
<div>更多</div>
</template>
<script setup lang="ts">
import Task from '../components/Task/index.vue'
const openBaidu = () => {
(window as any).ipcAPI?.openBaidu()
// 发送日志
(window as any).ipcAPI?.logToMain('info', '打开百度')
}
</script>

13
src/renderer/views/order/index.vue
View File

@@ -1,18 +1,7 @@
<template>
<Layout>
<template #task>
<Task />
</template>
</Layout>
<div>订单</div>
</template>
<script setup lang="ts">
import Task from '../components/Task/index.vue'
const openBaidu = () => {
(window as any).ipcAPI?.openBaidu()
// 发送日志
(window as any).ipcAPI?.logToMain('info', '打开百度')
}
</script>

0
src/renderer/views/settings/index.vue → src/renderer/views/setting/index.vue
View File

13
src/renderer/views/stock/index.vue
View File

@@ -1,18 +1,7 @@
<template>
<Layout>
<template #task>
<Task />
</template>
</Layout>
<div>订单</div>
</template>
<script setup lang="ts">
import Task from '../components/Task/index.vue'
const openBaidu = () => {
(window as any).ipcAPI?.openBaidu()
// 发送日志
(window as any).ipcAPI?.logToMain('info', '打开百度')
}
</script>

2
src/shared/types/ipc.types.ts
View File

@@ -78,4 +78,6 @@ export interface IPCAPI {
},
readFile: (filePath: string) => Promise<{success: boolean, data?: string, error?: string}>,
logToMain: (logLevel: string, message: string) => void,
// 打开新窗口
openNewTab: (url: string) => Promise<void>,
}