From 7ce7b882e1c52862b4db7457f97c7a45ceaa6fc3 Mon Sep 17 00:00:00 2001
From: Timi <imyeyu6@qq.com>
Date: Tue, 18 Aug 2026 17:42:05 +0800
Subject: [PATCH] update style

---
 src/pages/user/UserProfile.vue | 37 +++++++++++++++++-----------------
 1 file changed, 19 insertions(+), 18 deletions(-)

diff --git a/src/pages/user/UserProfile.vue b/src/pages/user/UserProfile.vue
index af5d8e7..55e52dd 100644
--- a/src/pages/user/UserProfile.vue
+++ b/src/pages/user/UserProfile.vue
@@ -33,6 +33,15 @@
 				</div>
 			</t-form-item>
 		</t-form>
+		<t-cell-group theme="card">
+			<t-cell title="修改密码" arrow hover @click="toPassword" />
+		</t-cell-group>
+		<t-button
+			class="logout bg-white"
+			theme="danger"
+			@click="confirmLogout"
+			variant="outline"
+		>退出登录</t-button>
 		<input
 			ref="avatarInputRef"
 			class="avatar-input"
@@ -40,11 +49,6 @@
 			accept="image/*"
 			@change="handleAvatarSelected"
 		>
-		<t-cell-group theme="card">
-			<t-cell title="修改密码" arrow hover @click="toPassword" />
-		</t-cell-group>
-		<t-button class="save" theme="primary" :loading="isSaving" @click="saveProfile">保存</t-button>
-		<t-button class="logout bg-white" theme="danger" variant="outline" @click="confirmLogout">退出登录</t-button>
 	</div>
 </template>
 
@@ -52,6 +56,7 @@
 import { DialogPlugin, Toast } from "tdesign-mobile-vue";
 import { AttachmentAPI, type Gender, UserAPI, useUserStore } from "timi-web";
 import PhotoField from "@/components/PhotoField.vue";
+import { useNavBarStore } from "@/store/navBarStore";
 import { buildFallbackAvatar } from "@/utils/avatar";
 import { compressUploadImage } from "@/utils/imageCompression";
 
@@ -65,6 +70,7 @@ defineOptions({
 });
 
 const router = useRouter();
+const navBarStore = useNavBarStore();
 const userStore = useUserStore();
 
 // ---------- 头像 ----------
@@ -210,14 +216,19 @@ function buildUserAvatar(user?: UserAvatarSource): string {
 }
 
 onMounted(() => {
+	navBarStore.setRightText("保存", "var(--td-brand-color)", saveProfile);
 	fillForm();
 });
+
+onUnmounted(() => {
+	navBarStore.clearRight();
+});
 </script>
 
 <style scoped lang="less">
 .profile-page {
 	gap: 1rem;
-	padding: calc(var(--app-nav-height) + 1rem) 0 6rem 0;
+	padding: calc(var(--app-nav-height) + 1rem) 0 calc(1rem + env(safe-area-inset-bottom, 0)) 0;
 	display: flex;
 	flex-direction: column;
 
@@ -242,19 +253,9 @@ onMounted(() => {
 		line-height: 1.5rem;
 	}
 
-	.save,
 	.logout {
-		left: 1rem;
-		right: 1rem;
-		position: fixed;
-	}
-
-	.save {
-		bottom: calc(3.75rem + env(safe-area-inset-bottom, 0));
-	}
-
-	.logout {
-		bottom: calc(.75rem + env(safe-area-inset-bottom, 0));
+		margin: 1rem auto;
+		padding: 0 2rem;
 	}
 }