From 0687205052b18f230f99e9b30cf8580514693400 Mon Sep 17 00:00:00 2001
From: Guo Tiantian <1431335589@qq.com>
Date: Fri, 29 Aug 2025 00:09:13 +0800
Subject: [PATCH] =?UTF-8?q?fix=EF=BC=9A=E6=9A=B4=E9=9C=B2=E9=A1=B9?=
 =?UTF-8?q?=E7=9B=AE=E9=85=8D=E7=BD=AE=E6=A0=B7=E5=BC=8F=E9=97=AE=E9=A2=98?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 frontend/src/lang/package/en.ts               |  1 +
 frontend/src/lang/package/zh-cn.ts            |  1 +
 .../src/layouts/components/Settings/index.vue | 11 +++-
 frontend/src/settings.ts                      | 50 ++++++++++++++++---
 frontend/src/types/auto-imports.d.ts          |  1 +
 .../views/dashboard/components/QuickStart.vue | 23 +++++----
 6 files changed, 68 insertions(+), 19 deletions(-)

diff --git a/frontend/src/lang/package/en.ts b/frontend/src/lang/package/en.ts
index b3301b0c..2b3df172 100644
--- a/frontend/src/lang/package/en.ts
+++ b/frontend/src/lang/package/en.ts
@@ -172,6 +172,7 @@ export default {
     interface: "Interface",
     navigation: "Navigation",
     themeColor: "Theme Color",
+    customColor: "Custom Color",
     showTagsView: "Show Tags View",
     showAppLogo: "Show App Logo",
     sidebarColorScheme: "Sidebar Color Scheme",
diff --git a/frontend/src/lang/package/zh-cn.ts b/frontend/src/lang/package/zh-cn.ts
index 6c3ce54a..30894cce 100644
--- a/frontend/src/lang/package/zh-cn.ts
+++ b/frontend/src/lang/package/zh-cn.ts
@@ -174,6 +174,7 @@ export default {
     navigation: "导航主题",
     themeColor: "主题颜色",
     themeColorTip: "主题颜色",
+    customColor: "自定义颜色",
     darkMode: "暗黑模式",
     layoutSetting: "布局设置",
     sidebarColorScheme: "侧边栏配色",
diff --git a/frontend/src/layouts/components/Settings/index.vue b/frontend/src/layouts/components/Settings/index.vue
index 846ce964..bcb18abb 100644
--- a/frontend/src/layouts/components/Settings/index.vue
+++ b/frontend/src/layouts/components/Settings/index.vue
@@ -350,10 +350,15 @@ const handleCloseDrawer = () => {
   min-height: 0; /* 确保内容区域可以收缩 */
 }
 
+
 /* 底部操作区域样式 */
 .action-footer {
-  flex-shrink: 0;
-  margin-top: auto; /* 将底部操作区域推到最下方 */
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 10;
+  padding: 0;
   background: var(--el-bg-color);
   border-top: 1px solid var(--el-border-color-light);
 
@@ -361,6 +366,8 @@ const handleCloseDrawer = () => {
     display: none; /* 移除重复的分割线 */
   }
 
+
+
   .action-card {
     padding: 16px 20px;
     margin: 0;
diff --git a/frontend/src/settings.ts b/frontend/src/settings.ts
index ab84d461..87b6b9c1 100644
--- a/frontend/src/settings.ts
+++ b/frontend/src/settings.ts
@@ -37,17 +37,55 @@ export const defaultSettings: AppSettings = {
   guideVisible: false,
 };
 
-// 主题色预设 - 经典配色方案
+// 主题色预设 - 现代化配色方案
 // 注意：修改默认主题色时，需要同步修改 src/styles/variables.scss 中的 primary.base 值
 export const themeColorPresets = [
+  // === 蓝色系 - 科技与专业 ===
   "#4080FF", // Arco Design 蓝 - 现代感强
   "#1890FF", // Ant Design 蓝 - 经典商务
   "#409EFF", // Element Plus 蓝 - 清新自然
-  "#FA8C16", // 活力橙 - 温暖友好
-  "#722ED1", // 优雅紫 - 高端大气
-  "#13C2C2", // 青色 - 科技感
-  "#52C41A", // 成功绿 - 活力清新
-  "#F5222D", // 警示红 - 醒目强烈
   "#2F54EB", // 深蓝 - 稳重专业
+  "#1E40AF", // 深蓝色 - 商务精英
+  "#1D4ED8", // 皇家蓝 - 高端商务
+
+  // === 绿色系 - 自然与活力 ===
+  "#52C41A", // 成功绿 - 活力清新
+  "#10B981", // 翠绿色 - 清新自然
+  "#059669", // 森林绿 - 生态环保
+  "#16A34A", // 草绿色 - 健康活力
+  "#15803D", // 深绿色 - 稳重大气
+
+  // === 紫色系 - 创意与优雅 ===
+  "#722ED1", // 优雅紫 - 高端大气
+  "#7C3AED", // 紫罗兰 - 创意无限
+  "#8B5CF6", // 浅紫色 - 时尚现代
+  "#6D28D9", // 深紫色 - 神秘高端
+  "#5B21B6", // 皇家紫 - 王者风范
+
+  // === 橙色系 - 温暖与活力 ===
+  "#FA8C16", // 活力橙 - 温暖友好
+  "#F97316", // 火橙色 - 热情奔放
+  "#EA580C", // 深橙色 - 阳光活力
+  "#DC2626", // 珊瑚红 - 温暖亲切
+
+  // === 青色系 - 科技与清新 ===
+  "#13C2C2", // 青色 - 科技感
+  "#0891B2", // 天蓝色 - 清新自然
+  "#0E7490", // 深青色 - 专业科技
+  "#06B6D4", // 青蓝色 - 海洋清新
+
+  // === 红色系 - 激情与警示 ===
+  "#F5222D", // 警示红 - 醒目强烈
+  "#DC2626", // 猩红色 - 激情四射
+  "#B91C1C", // 深红色 - 庄重严肃
+
+  // === 粉色系 - 温柔与时尚 ===
   "#EB2F96", // 品红 - 时尚个性
+  "#EC4899", // 玫瑰粉 - 浪漫温馨
+  "#F472B6", // 浅粉色 - 柔美可爱
+
+  // === 灰色系 - 简约与现代 ===
+  "#6B7280", // 经典灰 - 简约现代
+  "#4B5563", // 深灰色 - 商务专业
+  "#374151", // 石板灰 - 高端商务
 ];
diff --git a/frontend/src/types/auto-imports.d.ts b/frontend/src/types/auto-imports.d.ts
index 96afad15..d800967e 100644
--- a/frontend/src/types/auto-imports.d.ts
+++ b/frontend/src/types/auto-imports.d.ts
@@ -587,6 +587,7 @@ declare module 'vue' {
     readonly useThrottleFn: UnwrapRef<typeof import('@vueuse/core')['useThrottleFn']>
     readonly useThrottledRefHistory: UnwrapRef<typeof import('@vueuse/core')['useThrottledRefHistory']>
     readonly useTimeAgo: UnwrapRef<typeof import('@vueuse/core')['useTimeAgo']>
+    readonly useTimeAgoIntl: UnwrapRef<typeof import('@vueuse/core')['useTimeAgoIntl']>
     readonly useTimeout: UnwrapRef<typeof import('@vueuse/core')['useTimeout']>
     readonly useTimeoutFn: UnwrapRef<typeof import('@vueuse/core')['useTimeoutFn']>
     readonly useTimeoutPoll: UnwrapRef<typeof import('@vueuse/core')['useTimeoutPoll']>
diff --git a/frontend/src/views/dashboard/components/QuickStart.vue b/frontend/src/views/dashboard/components/QuickStart.vue
index 05e43656..3f299f68 100644
--- a/frontend/src/views/dashboard/components/QuickStart.vue
+++ b/frontend/src/views/dashboard/components/QuickStart.vue
@@ -197,28 +197,29 @@ onUnmounted(() => {
 <style lang="scss" scoped>
 // 快速链接容器样式
 .quick-links-container {
-  padding: 16px 0;
+  padding: 16px;
 
   .quick-links-grid {
     display: grid;
-    grid-template-columns: repeat(3, 1fr);
-    gap: 12px;
+    grid-template-columns: repeat(3, minmax(0, 1fr));
+    gap: 32px;
+    max-width: 400px; /* 限制最大宽度 */
+    margin: 0 auto; /* 居中对齐 */
   }
 
   .quick-link-item {
     border-radius: 6px;
-    border: 1px solid #e4e7ed;
+    border: 1px solid var(--el-border-color-light);
     transition: all 0.3s ease;
     width: 100%;
     height: 100px;
-    max-width: 120px;
     display: flex;
     align-items: center;
     justify-content: center;
 
     &:hover {
       transform: translateY(-2px);
-      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
+      box-shadow: var(--el-box-shadow);
     }
 
     .link-content-wrapper {
@@ -262,7 +263,7 @@ onUnmounted(() => {
           font-size: 10px;
           font-weight: 400;
           background-color: var(--el-color-primary);
-          color: #ffffff;
+          color: var(--el-color-primary-contrast);
           padding: 1px 4px;
           border-radius: 2px;
           line-height: 1.2;
@@ -279,7 +280,7 @@ onUnmounted(() => {
 
     &:hover {
       .link-icon {
-        background-color: #e8f4ff;
+        background-color: var(--el-color-primary-light-9);
       }
     }
   }
@@ -287,11 +288,11 @@ onUnmounted(() => {
 
 // 删除菜单项样式
 :deep(.delete-item) {
-  color: #f56c6c;
+  color: var(--el-color-danger);
 
   &:hover {
-    background-color: #fef0f0;
-    color: #f56c6c;
+    background-color: var(--el-color-danger-light-9);
+    color: var(--el-color-danger-dark-2);
   }
 }
 </style>