优化多个页面UI设计：my.vue, myAttention.vue, setting.vue

pages/index/my.vue

@@ -1,13 +1,13 @@
 <template>
 	<view class="page-content">
-		<view v-if="userStatus === 'verified'" class="user-box flex" :style="{'padding-top': statusBaeHeight + 60 + 'px'}">
+		<view v-if="userStatus === 'verified'" class="user-box flex" :style="{'padding-top': statusBaeHeight + 60 + 'px'}" @click="toSettings">
 			<image v-if="userInfo.avatar" :src="userInfo.avatar" class="avatar-img"></image>
 			<image v-else-if="barInfo.barLogo" :src="barInfo.barLogo" class="avatar-img"></image>	
 			<view v-else class="avatar-placeholder flex align-center justify-center">
 				<text class="cuIcon-people text-xl"></text>
 			</view>
 			<view class="flex-direction flex">
-				<text class="text-xl font-bold margin-bottom">{{ barInfo.nickName || barInfo.barContactPhone }}</text>
+				<text class="text-xl font-bold margin-bottom">{{ userInfo.nickName || barInfo.nickName || '未设置昵称' }}</text>
 				<text class="text-sm margin-bottom-sm text-gray">门店名称：{{ barInfo.barName || '-'}}</text>
 				<view class="flex align-center">
 					<text class="text-sm text-gray">门店ID：{{ barInfo.barNumber || '-' }}</text>
@@ -65,7 +65,7 @@
 			<view class="flex justify-between align-center margin-bottom" @click="toPage(2)">
 				<view class="flex align-center">
 					<image src="../../static/collect.png" class="icon"></image>
-					<text class="text-lg">我的收藏</text>
+					<text class="text-lg">我的关注</text>
 				</view>
 				<text class="cuIcon-right"></text>
 			</view>
@@ -424,21 +424,32 @@
 					url: '/pages/index/registration'
 				});
 			},
+			// 跳转到设置页面
+			toSettings() {
+				if (this.userStatus === 'verified') {
+					uni.navigateTo({
+						url: '/pagesMy/setting'
+					})
+				}
+			},
+			
 			// 显示修改头像提示
 			showChangeAvatar() {
 				uni.showActionSheet({
 					itemList: ['修改头像'],
 					success: () => {
-						this.toSetting();
+						this.toSettings();
 					}
 				});
 			},
 			
-			// 跳转到设置页面
+			// 跳转到设置页面（统一使用这个方法）
 			toSetting() {
+				if (this.userStatus === 'verified') {
 					uni.navigateTo({
 						url: '/pagesMy/setting'
 					});
+				}
 			},
 			
 			// 获取用户信息

pagesMy/myAttention.vue

@@ -61,16 +61,17 @@
 				<view v-if="tabCur == 1" class="my-brandSide">
 					<template v-if="favoriteBreweryList.length > 0">
 						<scroll-view style="height: 100%;" scroll-y="true" @scrolltolower="changeBreweryPage">
-							<view class="brandSide-box" v-for="(item, index) in favoriteBreweryList" :key="index"
+							<view class="brandSide-box" v-for="(item, index) in favoriteBreweryList" :key="index">
-								@click="toBrand(item)">
+								<view class="brand-info" @click="toBrand(item)">
-								<view class="flex align-center justify-start">
+									<image :src="item.brandLogo" class="logo" mode="aspectFill" @error="handleImageError"></image>
-									<image :src="item.brandLogo" class="logo"></image>
+									<view class="brand-detail">
-									<view>
 										<view class="title">{{ item.brandName }}</view>
+										<view class="desc">{{ item.brandDesc }}</view>
 									</view>
 								</view>
 								<view class="cu-btn radius bg-gray" @click.stop="cancelFavBrewery(item)">取消关注</view>
 							</view>
+							<view class="cu-load" :class="favoriteBreweryList.length == totalBrewery ? 'over' :'more'"></view>
 						</scroll-view>
 					</template>
 					<template v-else>
@@ -277,9 +278,11 @@
 				this.loading = true
 				
 				listMyFavoriteBrewery(this.breweryQuery).then(res => {
+					console.log('品牌列表数据:', res.rows)
 					this.totalBrewery = res.total
 					if (res.rows && res.rows.length > 0) {
 						res.rows.forEach(it => {
+							// 直接使用原始数据，不做字段映射
 							this.favoriteBreweryList.push(it)
 						})
 					}
@@ -348,6 +351,11 @@
 				this.favoriteBreweryList = []
 				this.getFavoriteBeerList()
 				this.getFavoriteBreweryList()
+			},
+			// 处理图片加载错误
+			handleImageError(e) {
+				const target = e.target;
+				target.src = '/static/default-brand.png'; // 设置默认图片
 			}
 		}
 	}
@@ -495,32 +503,56 @@
 
 		.my-brandSide {
 			padding: 28rpx 36rpx;
-			height: calc(100vh - 100rpx);
+			margin-top: 88rpx;  // 为固定定位的导航栏留出空间
+			height: calc(100vh - 88rpx);
 
 			.brandSide-box {
 				display: flex;
 				align-items: center;
 				justify-content: space-between;
-				padding: 30rpx 0;
-				border-bottom: 1rpx solid #F0F4F9;
 				padding: 32rpx 0;
+				border-bottom: 1rpx solid #F0F4F9;
+				
+				.brand-info {
+					display: flex;
+					align-items: center;
+					flex: 1;
+					margin-right: 20rpx;
 					
 					.logo {
 						width: 108rpx;
 						height: 108rpx;
 						border-radius: 50%;
 						margin-right: 28rpx;
+						background-color: #f5f5f5;
+						flex-shrink: 0;
 					}
 					
+					.brand-detail {
+						flex: 1;
+						min-width: 0;
+						
 						.title {
 							font-size: 28rpx;
 							color: #19191B;
-					margin-bottom: 20rpx;
+							margin-bottom: 12rpx;
+							font-weight: 500;
+							overflow: hidden;
+							text-overflow: ellipsis;
+							white-space: nowrap;
 						}
 						
 						.desc {
-					font-size: 20rpx;
+							font-size: 24rpx;
 							color: #9C9BA6;
+							line-height: 1.4;
+							overflow: hidden;
+							text-overflow: ellipsis;
+							display: -webkit-box;
+							-webkit-line-clamp: 2;
+							-webkit-box-orient: vertical;
+						}
+					}
 				}
 			}
 		}

pagesMy/setting.vue

@@ -337,6 +337,7 @@
 		editBarInfo,
 		reAuth
 	} from '@/api/bar.js'
+	import { getToken } from '@/utils/auth.js'
 	export default {
 		data() {
 			return {
@@ -538,57 +539,82 @@
 					url: '/pages/index/index'
 				})
 			},
-			// 只保留微信头像选择方法
+			// 选择头像
-			onChooseAvatar(e) {
+			async onChooseAvatar(e) {
-				const avatarUrl = e.detail.avatarUrl;
-				uni.showLoading({
-					title: '上传中'
-				});
-				// 上传头像到服务器
-				uni.uploadFile({
-					url: base_url + '/bar/common/upload',
-					filePath: avatarUrl,
-					name: 'file',
-					formData: {
-						type: 'image'
-					},
-					success: (uploadFileRes) => {
 				try {
-							let result;
+					// 获取头像临时路径
-							if (typeof uploadFileRes.data === 'string') {
+					const avatarUrl = e.detail.avatarUrl;
-								result = JSON.parse(uploadFileRes.data);
+					
-							} else {
+					if (!avatarUrl) {
-								result = uploadFileRes.data;
+						throw new Error('未获取到头像');
 					}
 					
-							if (result && result.code === 200) {
+					uni.showLoading({
-								this.form.barLogo = result.data;  // 使用data字段获取URL
+						title: '上传中...'
-								uni.hideLoading();
+					});
+					
+					// 上传头像
+					const uploadRes = await uni.uploadFile({
+						url: base_url + '/bar/common/upload', // 使用正确的API路径
+						filePath: avatarUrl,
+						name: 'file', // 使用正确的参数名
+						header: {
+							'Authorization': getToken()
+						},
+						formData: {
+							type: 'image' // 指定上传类型为图片
+						}
+					});
+					
+					// 解析响应数据
+					let result;
+					try {
+						// 检查响应数据是否为JSON字符串
+						if (typeof uploadRes.data === 'string' && uploadRes.data.trim().startsWith('{')) {
+							result = JSON.parse(uploadRes.data);
+						} else {
+							// 如果不是JSON，尝试直接使用响应数据
+							result = {
+								code: uploadRes.statusCode === 200 ? 200 : 500,
+								data: uploadRes.data,
+								msg: uploadRes.statusCode === 200 ? '上传成功' : '上传失败'
+							};
+						}
+					} catch (e) {
+						console.error('解析响应数据失败:', e);
+						// 如果解析失败，使用默认响应
+						result = {
+							code: uploadRes.statusCode === 200 ? 200 : 500,
+							data: uploadRes.data,
+							msg: '解析响应失败'
+						};
+					}
+					
+					if (result.code === 200) {
+						// 更新表单数据
+						this.form.barLogo = result.data;
+						
+						// 更新本地存储的门店信息
+						const barInfo = uni.getStorageSync('barInfo') || {};
+						barInfo.barLogo = result.data;
+						uni.setStorageSync('barInfo', barInfo);
+						
 						uni.showToast({
-									title: '上传成功',
+							title: '更新成功',
 							icon: 'success'
 						});
 					} else {
-								throw new Error(result?.msg || '上传失败');
+						throw new Error(result.msg || '上传失败');
 					}
 				} catch (error) {
-							console.error('Upload response parsing error:', error);
+					console.error('选择头像失败:', error);
-							uni.hideLoading();
 					uni.showToast({
-								title: error.message || '上传失败',
+						title: error.message || '选择头像失败',
 						icon: 'none'
 					});
-						}
+				} finally {
-					},
-					fail: (err) => {
-						console.error('Upload failed:', err);
 					uni.hideLoading();
-						uni.showToast({
-							title: '头像上传失败',
-							icon: 'none'
-						});
 				}
-				});
 			},
 			// 跳转到地址页面
 			toAddress() {