diff --git a/miniprogram/pages/my/my.js b/miniprogram/pages/my/my.js index 0ba9d85..b570100 100644 --- a/miniprogram/pages/my/my.js +++ b/miniprogram/pages/my/my.js @@ -73,9 +73,14 @@ Page({ title: `章节 ${id}` })) + // 截短用户ID显示 + const userId = userInfo.id || '' + const userIdShort = userId.length > 20 ? userId.slice(0, 10) + '...' + userId.slice(-6) : userId + this.setData({ isLoggedIn: true, userInfo, + userIdShort, purchasedCount: hasFullBook ? this.data.totalSections : (purchasedSections?.length || 0), referralCount: userInfo.referralCount || 0, earnings: userInfo.earnings || 0, @@ -87,6 +92,7 @@ Page({ this.setData({ isLoggedIn: false, userInfo: null, + userIdShort: '', purchasedCount: 0, referralCount: 0, earnings: 0, @@ -95,6 +101,77 @@ Page({ }) } }, + + // 编辑用户资料(头像和昵称) + editProfile() { + wx.showActionSheet({ + itemList: ['修改头像', '修改昵称'], + success: (res) => { + if (res.tapIndex === 0) { + this.chooseAvatar() + } else if (res.tapIndex === 1) { + this.editNickname() + } + } + }) + }, + + // 选择头像 + chooseAvatar() { + wx.chooseMedia({ + count: 1, + mediaType: ['image'], + sourceType: ['album', 'camera'], + success: async (res) => { + const tempFilePath = res.tempFiles[0].tempFilePath + wx.showLoading({ title: '上传中...', mask: true }) + + try { + // 更新本地显示 + const userInfo = this.data.userInfo + userInfo.avatar = tempFilePath + this.setData({ userInfo }) + app.globalData.userInfo = userInfo + wx.setStorageSync('userInfo', userInfo) + + // TODO: 上传到服务器 + wx.hideLoading() + wx.showToast({ title: '头像已更新', icon: 'success' }) + } catch (e) { + wx.hideLoading() + wx.showToast({ title: '上传失败', icon: 'none' }) + } + } + }) + }, + + // 修改昵称 + editNickname() { + wx.showModal({ + title: '修改昵称', + editable: true, + placeholderText: '请输入新昵称', + success: async (res) => { + if (res.confirm && res.content) { + const newNickname = res.content.trim() + if (newNickname.length < 1 || newNickname.length > 20) { + wx.showToast({ title: '昵称1-20个字符', icon: 'none' }) + return + } + + // 更新本地 + const userInfo = this.data.userInfo + userInfo.nickname = newNickname + this.setData({ userInfo }) + app.globalData.userInfo = userInfo + wx.setStorageSync('userInfo', userInfo) + + // TODO: 上传到服务器 + wx.showToast({ title: '昵称已更新', icon: 'success' }) + } + } + }) + }, // 切换Tab switchTab(e) { diff --git a/miniprogram/pages/my/my.wxml b/miniprogram/pages/my/my.wxml index 3f74965..65de111 100644 --- a/miniprogram/pages/my/my.wxml +++ b/miniprogram/pages/my/my.wxml @@ -26,17 +26,29 @@ - - - {{userInfo.nickname[0] || 'U'}} + + + + + + {{userInfo.nickname[0] || '微'}} + + + + - - - - 创业伙伴 + + + diff --git a/miniprogram/pages/my/my.wxss b/miniprogram/pages/my/my.wxss index c526575..27910f8 100644 --- a/miniprogram/pages/my/my.wxss +++ b/miniprogram/pages/my/my.wxss @@ -61,23 +61,53 @@ border: 2rpx solid rgba(0, 206, 209, 0.2); } -.user-header { +/* ===== 新版用户头部布局 ===== */ +.user-header-row { display: flex; align-items: center; - gap: 24rpx; - margin-bottom: 32rpx; + gap: 28rpx; + margin-bottom: 36rpx; +} + +.avatar-wrapper { + position: relative; + flex-shrink: 0; } .avatar { - width: 128rpx; - height: 128rpx; + width: 120rpx; + height: 120rpx; border-radius: 50%; border: 4rpx solid #00CED1; display: flex; align-items: center; justify-content: center; background: linear-gradient(135deg, rgba(0, 206, 209, 0.2) 0%, transparent 100%); - flex-shrink: 0; + overflow: hidden; +} + +.avatar-img { + width: 100%; + height: 100%; +} + +.avatar-edit-hint { + position: absolute; + bottom: 0; + right: 0; + width: 36rpx; + height: 36rpx; + background: #00CED1; + border-radius: 50%; + display: flex; + align-items: center; + justify-content: center; + border: 3rpx solid #000; +} + +.edit-icon { + font-size: 20rpx; + color: #000; } .avatar-empty { @@ -91,11 +121,63 @@ } .avatar-text { - font-size: 48rpx; + font-size: 44rpx; font-weight: 700; color: #00CED1; } +.user-info-block { + flex: 1; + display: flex; + flex-direction: column; + gap: 8rpx; +} + +.user-name-row { + display: flex; + align-items: center; + gap: 16rpx; + flex-wrap: wrap; +} + +.user-name { + font-size: 34rpx; + font-weight: 600; + color: #ffffff; +} + +.user-badge-small { + display: inline-flex; + align-items: center; + gap: 6rpx; + padding: 6rpx 14rpx; + background: rgba(0, 206, 209, 0.15); + border: 1rpx solid rgba(0, 206, 209, 0.3); + border-radius: 20rpx; +} + +.badge-star { + font-size: 18rpx; +} + +.badge-label { + font-size: 20rpx; + color: #00CED1; +} + +.user-id { + font-size: 24rpx; + color: rgba(255, 255, 255, 0.35); +} + +/* 兼容旧样式 */ +.user-header { + display: flex; + align-items: center; + gap: 24rpx; + margin-bottom: 32rpx; +} + .user-info { flex: 1; } diff --git a/miniprogram/pages/settings/settings.wxml b/miniprogram/pages/settings/settings.wxml index 965a4cb..c4e9acd 100644 --- a/miniprogram/pages/settings/settings.wxml +++ b/miniprogram/pages/settings/settings.wxml @@ -73,34 +73,6 @@ 提示:绑定至少一个支付方式(微信或支付宝)才能使用提现功能 - - - - - 💬 - 联系客服 - - - - - - 🗑️ - 清除缓存 - - - - - - - - - ℹ️ - 当前版本 - - v{{version}} - - - 退出登录