优化退出登录

pages/userManage/index.scss

@@ -8,9 +8,10 @@
 	  display: flex;
 	  
 	  .petMaster {
-		  width: 140rpx;
-		  height: auto;
-		  margin: 0rpx 10rpx;
+		  display: block;
+		  width: 125rpx;
+		  height: 34rpx;
+		  margin-left: 10rpx;
 	  }
   }
 }

pages/userManage/index.vue

@@ -9,12 +9,12 @@
 
 				<view style="width: calc(100% - 120rpx); padding-left: 20rpx;box-sizing: border-box;">
 					<view class="base-leavel">
-						{{getIsLogin()?userInfo.userName:"欢迎来到版宠师"}}
-						<image class="petMaster" :src="petMaster" mode="aspectFit"></image>
-						<image class="petMaster" :src="partnerMaster" mode="aspectFit"></image>
+						<text>{{getIsLogin()?userInfo.userName:"欢迎来到版宠师"}}</text>
+						<image class="petMaster" :src="petMaster" mode="aspectFill"></image>
+						<image class="petMaster" :src="partnerMaster" mode="aspectFill"></image>
 					</view>
 					<view>
-						手机号{{ userInfo?.userTelephone }}
+						手机号:{{ userInfo?.userTelephone }}
 					</view>
 				</view>
 
@@ -102,6 +102,14 @@
 						</view>
 					</button>
 				</view>
+				<view class="flex flex-between font28 flex-wrap mt20">
+					<view class="icon-list" @click="logout">
+						<up-image class="mb20"
+							src="https://cdn.catmdogd.com/2025/04/01ab556ca51d2a4f82896c1e6fd0034a8b7shDr3f7qeDQ527d93075294e7237cee8b6c7d613be8.png"
+							width="68rpx" height="68rpx" bgColor="#ffffff"></up-image>
+						<view>退出登录</view>
+					</view>
+				</view>
 			</view>
 		</view>
 	</view>
@@ -109,6 +117,14 @@
 	<up-popup :show="show" @close="close" :round="10">
 		<view style="padding: 10rpx 20rpx;height: 50vh;overflow-y: scroll;" v-html="content"></view>
 	</up-popup>
+
+	<Modal @confirm="confirmLogout" @cancel="cancelLogout" ref="modal">
+		<template>
+			<view class="tip">
+				确认退出登录?
+			</view>
+		</template>
+	</Modal>
 </template>
 
 <script setup>
@@ -124,6 +140,7 @@
 		removeIsLogin
 	} from "../../utils/auth";
 	import tab from "../../plugins/tab";
+	import Modal from "@/components/Modal/index.vue"
 	import {
 		useStore
 	} from "vuex"
@@ -168,17 +185,18 @@
 	const pet = ref({})
 	const show = ref(false)
 	const content = ref("")
-	const petMasterLevel = ref(1);
-	const partnerLevel = ref(0);
+	const modal = ref(null)
+	const petMasterLevel = ref(1)
+	const partnerLevel = ref(0)
 
-	// 伴宠师图标
+	// 按伴宠师等级选中图标
 	const petMaster = computed(() => {
 		const paths = [configList.value?.pet_primary?.paramValueImage, configList.value?.pet_senior
 			?.paramValueImage
 		];
 		return paths[petMasterLevel.value];
 	})
-	// 合伙人图标
+	// 按合伙人等级选中图标
 	const partnerMaster = computed(() => {
 		const paths = [configList.value?.partner_intermediate?.paramValueImage, configList.value?.partner_senior
 			?.paramValueImage
@@ -209,13 +227,7 @@
 	}
 
 	const logout = () => {
-		store.commit("setUserInfo", {});
-		uni.removeStorageSync("token")
-		uni.removeStorageSync("baseInfo")
-		removeIsLogin();
-		uni.navigateTo({
-			url: "/pages/login/index"
-		})
+		modal.value.open();
 	}
 
 	// 跳转提现
@@ -243,10 +255,24 @@
 		show.value = false;
 	}
 
+	const confirmLogout = () => {
+		store.commit("setUserInfo", {});
+		uni.removeStorageSync("token")
+		uni.removeStorageSync("baseInfo")
+		removeIsLogin();
+		uni.navigateTo({
+			url: "/pages/login/index"
+		})
+	}
+
 	const platformProtocol = () => {
 		show.value = true;
 	}
 
+	const cancelLogout = () => {
+		// 取消退出登录回调
+	}
+
 	// 定义 openCustomerServiceChat 方法，用于唤起客服会话界面
 	const openCustomerServiceChat = () => {
 		uni.openCustomerServiceChat({
@@ -267,4 +293,9 @@
 </script>
 <style scoped lang="scss">
 	@import "index";
+
+	.tip {
+		text-align: center;
+		padding: 25rpx 0rpx;
+	}
 </style>