From 6cce9581fb3e47ed4fb2b346db6567d98231d4b1 Mon Sep 17 00:00:00 2001
From: zimo493 <2081182432@qq.com>
Date: Thu, 4 Sep 2025 16:23:40 +0800
Subject: [PATCH] =?UTF-8?q?style:=20:lipstick:=20(settings)=E4=BC=98?=
 =?UTF-8?q?=E5=8C=96=E8=AE=BE=E7=BD=AE=E9=A1=B5=E9=9D=A2=E5=B8=83=E5=B1=80?=
 =?UTF-8?q?=E5=92=8C=E6=A0=B7=E5=BC=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- 将底部按钮放入footer插槽中，保留原有的样式

#ICWDUU
---
 src/layouts/components/Settings/index.vue | 104 ++++++++--------------
 1 file changed, 37 insertions(+), 67 deletions(-)

diff --git a/src/layouts/components/Settings/index.vue b/src/layouts/components/Settings/index.vue
index 2ebb6bb5..7c26f240 100644
--- a/src/layouts/components/Settings/index.vue
+++ b/src/layouts/components/Settings/index.vue
@@ -107,40 +107,35 @@
     </div>
 
     <!-- 操作按钮区域 - 固定到底部 -->
-    <div class="action-footer">
-      <div class="action-divider"></div>
-      <div class="action-card">
-        <div class="action-buttons">
-          <el-tooltip
-            content="复制配置将生成当前设置的代码，覆盖 src/settings.ts 下的 defaultSettings 变量"
-            placement="top"
+    <template #footer>
+      <div class="action-buttons">
+        <el-tooltip
+          content="复制配置将生成当前设置的代码，覆盖 src/settings.ts 下的 defaultSettings 变量"
+          placement="top"
+        >
+          <el-button
+            type="primary"
+            size="default"
+            :icon="copyIcon"
+            :loading="copyLoading"
+            @click="handleCopySettings"
           >
-            <el-button
-              type="primary"
-              size="default"
-              :icon="copyIcon"
-              :loading="copyLoading"
-              class="action-btn"
-              @click="handleCopySettings"
-            >
-              {{ copyLoading ? "复制中..." : t("settings.copyConfig") }}
-            </el-button>
-          </el-tooltip>
-          <el-tooltip content="重置将恢复所有设置为默认值" placement="top">
-            <el-button
-              type="warning"
-              size="default"
-              :icon="resetIcon"
-              :loading="resetLoading"
-              class="action-btn"
-              @click="handleResetSettings"
-            >
-              {{ resetLoading ? "重置中..." : t("settings.resetConfig") }}
-            </el-button>
-          </el-tooltip>
-        </div>
+            {{ copyLoading ? "复制中..." : t("settings.copyConfig") }}
+          </el-button>
+        </el-tooltip>
+        <el-tooltip content="重置将恢复所有设置为默认值" placement="top">
+          <el-button
+            type="warning"
+            size="default"
+            :icon="resetIcon"
+            :loading="resetLoading"
+            @click="handleResetSettings"
+          >
+            {{ resetLoading ? "重置中..." : t("settings.resetConfig") }}
+          </el-button>
+        </el-tooltip>
       </div>
-    </div>
+    </template>
   </el-drawer>
 </template>
 
@@ -326,47 +321,22 @@ const handleCloseDrawer = () => {
 .settings-content {
   height: calc(100vh - 120px); /* 减去头部和底部按钮的高度 */
   padding: 20px;
-  padding-bottom: 20px;
   overflow-y: auto;
 }
 
 /* 底部操作区域样式 */
-.action-footer {
-  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);
+.action-buttons {
+  display: flex;
 
-  .action-divider {
-    display: none; /* 移除重复的分割线 */
-  }
+  & > .el-button {
+    flex: 1;
+    font-size: 14px;
+    border-radius: 8px;
+    transition: all 0.3s ease;
 
-  .action-card {
-    padding: 16px 20px;
-    margin: 0;
-    background: var(--el-fill-color-extra-light);
-    border: none;
-    border-radius: 0;
-
-    .action-buttons {
-      display: flex;
-      gap: 12px;
-
-      .action-btn {
-        flex: 1;
-        font-size: 14px;
-        border-radius: 8px;
-        transition: all 0.3s ease;
-
-        &:hover {
-          box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
-          transform: translateY(-2px);
-        }
-      }
+    &:hover {
+      box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
+      transform: translateY(-2px);
     }
   }
 }