fix nav
This commit is contained in:
@@ -10,15 +10,6 @@ import NavBar from "@/components/NavBar.vue";
|
|||||||
<div class="header-brand">
|
<div class="header-brand">
|
||||||
<div class="brand-icon">
|
<div class="brand-icon">
|
||||||
<img src="@/assets/logo.png" width="50" alt="" />
|
<img src="@/assets/logo.png" width="50" alt="" />
|
||||||
<!-- <svg width="28" height="28" viewBox="0 0 24 24" fill="none">
|
|
||||||
<path
|
|
||||||
d="M12 2L2 7l10 5 10-5-10-5zM2 17l10 5 10-5M2 12l10 5 10-5"
|
|
||||||
stroke="currentColor"
|
|
||||||
stroke-width="2"
|
|
||||||
stroke-linecap="round"
|
|
||||||
stroke-linejoin="round"
|
|
||||||
/>
|
|
||||||
</svg> -->
|
|
||||||
</div>
|
</div>
|
||||||
<h1 class="brand-title">GPT Load</h1>
|
<h1 class="brand-title">GPT Load</h1>
|
||||||
</div>
|
</div>
|
||||||
@@ -45,7 +36,6 @@ import NavBar from "@/components/NavBar.vue";
|
|||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.main-layout {
|
.main-layout {
|
||||||
/* height: 100vh; */
|
|
||||||
background: transparent;
|
background: transparent;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -66,8 +56,8 @@ import NavBar from "@/components/NavBar.vue";
|
|||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
justify-content: space-between;
|
justify-content: space-between;
|
||||||
height: 100%;
|
padding: 8px;
|
||||||
padding: 0 8px;
|
overflow-x: auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.header-brand {
|
.header-brand {
|
||||||
@@ -83,10 +73,6 @@ import NavBar from "@/components/NavBar.vue";
|
|||||||
justify-content: center;
|
justify-content: center;
|
||||||
width: 40px;
|
width: 40px;
|
||||||
height: 40px;
|
height: 40px;
|
||||||
/* background: var(--primary-gradient);
|
|
||||||
border-radius: var(--border-radius-md);
|
|
||||||
color: white;
|
|
||||||
box-shadow: var(--shadow-md); */
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.brand-title {
|
.brand-title {
|
||||||
@@ -100,19 +86,8 @@ import NavBar from "@/components/NavBar.vue";
|
|||||||
letter-spacing: -0.3px;
|
letter-spacing: -0.3px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.header-nav {
|
|
||||||
position: absolute;
|
|
||||||
left: 50%;
|
|
||||||
transform: translateX(-50%);
|
|
||||||
width: 100%;
|
|
||||||
max-width: 600px;
|
|
||||||
display: flex;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
.header-actions {
|
.header-actions {
|
||||||
flex-shrink: 0;
|
flex-shrink: 0;
|
||||||
margin-left: auto;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.layout-content {
|
.layout-content {
|
||||||
@@ -126,42 +101,4 @@ import NavBar from "@/components/NavBar.vue";
|
|||||||
margin: 0 auto;
|
margin: 0 auto;
|
||||||
padding: 24px 12px;
|
padding: 24px 12px;
|
||||||
}
|
}
|
||||||
|
|
||||||
/* 响应式设计 */
|
|
||||||
@media (max-width: 768px) {
|
|
||||||
.header-content {
|
|
||||||
padding: 0 4px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.brand-title {
|
|
||||||
font-size: 1.2rem;
|
|
||||||
}
|
|
||||||
|
|
||||||
.content-wrapper {
|
|
||||||
padding: 16px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.header-nav {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 480px) {
|
|
||||||
.brand-title {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.content-wrapper {
|
|
||||||
padding: 12px;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
:deep(.n-layout-header) {
|
|
||||||
height: 64px;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
:deep(.n-layout-content) {
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
@@ -37,34 +37,32 @@ function renderMenuItem(key: string, label: string, icon: string): MenuOption {
|
|||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
<div class="navbar-container">
|
<div>
|
||||||
<n-menu mode="horizontal" :options="menuOptions" :value="activeMenu" class="modern-menu" />
|
<n-menu
|
||||||
|
mode="horizontal"
|
||||||
|
:options="menuOptions"
|
||||||
|
:value="activeMenu"
|
||||||
|
responsive
|
||||||
|
class="modern-menu"
|
||||||
|
/>
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<style scoped>
|
<style scoped>
|
||||||
.navbar-container {
|
|
||||||
flex: 1;
|
|
||||||
display: flex;
|
|
||||||
max-width: 600px;
|
|
||||||
}
|
|
||||||
|
|
||||||
:deep(.nav-menu-item) {
|
:deep(.nav-menu-item) {
|
||||||
display: flex;
|
display: flex;
|
||||||
align-items: center;
|
align-items: center;
|
||||||
gap: 8px;
|
gap: 8px;
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
color: inherit;
|
color: inherit;
|
||||||
padding: 8px 16px;
|
padding: 8px;
|
||||||
border-radius: var(--border-radius-md);
|
border-radius: var(--border-radius-md);
|
||||||
transition: all 0.2s ease;
|
transition: all 0.2s ease;
|
||||||
font-weight: 500;
|
font-weight: 500;
|
||||||
}
|
}
|
||||||
|
|
||||||
:deep(.nav-item-icon) {
|
:deep(.n-menu-item-content) {
|
||||||
font-size: 1.1rem;
|
padding: 0 10px !important;
|
||||||
display: flex;
|
|
||||||
align-items: center;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
:deep(.nav-item-text) {
|
:deep(.nav-item-text) {
|
||||||
@@ -72,12 +70,6 @@ function renderMenuItem(key: string, label: string, icon: string): MenuOption {
|
|||||||
letter-spacing: 0.2px;
|
letter-spacing: 0.2px;
|
||||||
}
|
}
|
||||||
|
|
||||||
:deep(.n-menu) {
|
|
||||||
background: transparent;
|
|
||||||
border-bottom: none;
|
|
||||||
justify-content: center;
|
|
||||||
}
|
|
||||||
|
|
||||||
:deep(.n-menu-item) {
|
:deep(.n-menu-item) {
|
||||||
border-radius: var(--border-radius-md);
|
border-radius: var(--border-radius-md);
|
||||||
margin: 0 4px;
|
margin: 0 4px;
|
||||||
@@ -100,18 +92,4 @@ function renderMenuItem(key: string, label: string, icon: string): MenuOption {
|
|||||||
background: linear-gradient(135deg, #5a6fd8 0%, #6a4190 100%);
|
background: linear-gradient(135deg, #5a6fd8 0%, #6a4190 100%);
|
||||||
transform: translateY(-1px);
|
transform: translateY(-1px);
|
||||||
}
|
}
|
||||||
|
|
||||||
:deep(.n-menu-item-content) {
|
|
||||||
border-radius: var(--border-radius-md);
|
|
||||||
}
|
|
||||||
|
|
||||||
:deep(.n-menu-item-content-header) {
|
|
||||||
overflow: visible;
|
|
||||||
}
|
|
||||||
|
|
||||||
@media (max-width: 768px) {
|
|
||||||
.navbar-container {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
</style>
|
</style>
|
||||||
|
@@ -1,7 +1,7 @@
|
|||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
import { keysApi } from "@/api/keys";
|
import { keysApi } from "@/api/keys";
|
||||||
import { settingsApi } from "@/api/settings";
|
import { settingsApi } from "@/api/settings";
|
||||||
import type { Group, GroupConfigOption, Upstream } from "@/types/models";
|
import type { Group, GroupConfigOption, UpstreamInfo } from "@/types/models";
|
||||||
import {
|
import {
|
||||||
NButton,
|
NButton,
|
||||||
NCard,
|
NCard,
|
||||||
@@ -53,7 +53,7 @@ const formData = reactive<any>({
|
|||||||
url: "",
|
url: "",
|
||||||
weight: 1,
|
weight: 1,
|
||||||
},
|
},
|
||||||
] as Upstream[],
|
] as UpstreamInfo[],
|
||||||
channel_type: "openai",
|
channel_type: "openai",
|
||||||
sort: 1,
|
sort: 1,
|
||||||
test_model: "",
|
test_model: "",
|
||||||
@@ -211,11 +211,13 @@ async function handleSubmit() {
|
|||||||
|
|
||||||
// 验证 JSON 格式
|
// 验证 JSON 格式
|
||||||
let paramOverrides = {};
|
let paramOverrides = {};
|
||||||
try {
|
if (formData.param_overrides) {
|
||||||
paramOverrides = JSON.parse(formData.param_overrides);
|
try {
|
||||||
} catch {
|
paramOverrides = JSON.parse(formData.param_overrides);
|
||||||
message.error("参数覆盖必须是有效的 JSON 格式");
|
} catch {
|
||||||
return;
|
message.error("参数覆盖必须是有效的 JSON 格式");
|
||||||
|
return;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 将configItems转换为config对象
|
// 将configItems转换为config对象
|
||||||
@@ -231,11 +233,11 @@ async function handleSubmit() {
|
|||||||
name: formData.name,
|
name: formData.name,
|
||||||
display_name: formData.display_name,
|
display_name: formData.display_name,
|
||||||
description: formData.description,
|
description: formData.description,
|
||||||
upstreams: formData.upstreams.filter(upstream => upstream.url.trim()),
|
upstreams: formData.upstreams.filter((upstream: UpstreamInfo) => upstream.url.trim()),
|
||||||
channel_type: formData.channel_type,
|
channel_type: formData.channel_type,
|
||||||
sort: formData.sort,
|
sort: formData.sort,
|
||||||
test_model: formData.test_model,
|
test_model: formData.test_model,
|
||||||
param_overrides: paramOverrides,
|
param_overrides: formData.param_overrides ? paramOverrides : null,
|
||||||
config,
|
config,
|
||||||
};
|
};
|
||||||
|
|
||||||
|
Reference in New Issue
Block a user