feat: login rest

This commit is contained in:
Blizzard
2026-02-12 09:26:39 +08:00
parent e97fd30fa3
commit 5553e2711a
115 changed files with 4090 additions and 3499 deletions
+105
View File
@@ -0,0 +1,105 @@
import request from '../../../utils/request';
Page({
data: {
userLevel: 0,
userLevelTag: '',
currentExp: 0,
maxExp: 1000,
maxExp: 1000,
nextLevelExp: 1000,
showLevelsPopup: false,
allLevels: [],
badges: [
{ id: 1, name: '初级播种者', desc: '成功种植第一棵植物', iconName: 'flower', color: '#4CAF50', unlocked: true },
{ id: 2, name: '勤劳园丁', desc: '总养护次数达到10次', iconName: 'tools', color: '#2196F3', unlocked: true },
{ id: 3, name: '植物专家', desc: '成功识别50种植物', iconName: 'scan', color: '#9C27B0', unlocked: false, progress: '12/50' },
{ id: 4, name: '全勤奖', desc: '连续30天打卡', iconName: 'calendar', color: '#FF9800', unlocked: false, progress: '5/30' },
{ id: 5, name: '分享大师', desc: '发布10条动态', iconName: 'share', color: '#E91E63', unlocked: false, progress: '3/10' },
{ id: 6, name: '收藏家', desc: '收藏20个植物百科', iconName: 'star', color: '#FFC107', unlocked: false, progress: '8/20' }
]
},
onLoad() {
this.fetchData();
},
async fetchData() {
wx.showLoading({ title: '加载中...' });
try {
const [levelRes, profileRes] = await Promise.all([
request.get('/config/level/list'),
request.get('/profile/detail')
]);
this.processData(levelRes, profileRes);
} catch (e) {
console.error('Fetch badges data failed', e);
wx.showToast({ title: '加载失败', icon: 'none' });
} finally {
wx.hideLoading();
}
},
processData(levelsData, profile) {
const levelList = levelsData && levelsData.list ? levelsData.list : [];
levelList.sort((a, b) => a.minSunlight - b.minSunlight); // Ensure sorted by threshold
const totalSunlight = profile.totalSunlight || 0;
// Find current level: highest level where minSunlight <= totalSunlight
let currentLevelConfig = null;
for (let i = levelList.length - 1; i >= 0; i--) {
if (totalSunlight >= levelList[i].minSunlight) {
currentLevelConfig = levelList[i];
break;
}
}
// Check if no level matched (e.g. 0 sunlight but level 1 starts at 0? Logic handles it if sorted)
if (!currentLevelConfig && levelList.length > 0) {
// Fallback to absolute lowest or specific logic
// Assuming level 1 starts at 0, it should be caught.
currentLevelConfig = levelList[0];
}
const currentLevelVal = currentLevelConfig ? currentLevelConfig.level : 0;
// Find next level
const nextLevelConfig = levelList.find(l => l.minSunlight > totalSunlight);
let maxExp = 0;
let nextPerk = '';
if (nextLevelConfig) {
maxExp = nextLevelConfig.minSunlight;
nextPerk = nextLevelConfig.perks;
} else {
// Max level
maxExp = totalSunlight > 0 ? totalSunlight : 100;
nextPerk = '已达到最高等级';
}
// Sanity
if (maxExp < totalSunlight) maxExp = totalSunlight;
const tag = currentLevelConfig ? `Lv.${currentLevelVal} ${currentLevelConfig.title}` : 'Lv.0 园艺新手';
this.setData({
userLevel: currentLevelVal,
userLevelTag: tag,
currentExp: totalSunlight,
maxExp: maxExp,
nextLevelExp: Math.max(0, maxExp - totalSunlight),
nextPerk: nextPerk,
allLevels: levelList // Save for popup
});
},
showLevelList() {
wx.navigateTo({
url: `/pages/profile/badges/level-detail/index?sunlight=${this.data.currentExp}`
});
},
});
+8
View File
@@ -0,0 +1,8 @@
{
"navigationBarTitleText": "成就徽章",
"navigationBarBackgroundColor": "#F4F6F0",
"navigationBarTextStyle": "black",
"usingComponents": {
"t-icon": "tdesign-miniprogram/icon/icon"
}
}
+45
View File
@@ -0,0 +1,45 @@
<view class="badges-page">
<scroll-view scroll-y class="badges-scroll" enhanced show-scrollbar="{{false}}">
<!-- Level Card -->
<view class="level-card-large" bindtap="showLevelList">
<view class="level-card-bg"></view>
<view class="level-header">
<view class="level-info-large">
<text class="level-label">当前等级</text>
<text class="level-value">{{userLevelTag}}</text>
</view>
<t-icon name="trophy" size="80rpx" color="#FFD700" />
</view>
<view class="level-progress-section">
<view class="progress-text">
<text>阳光值</text>
<text>{{currentExp}} / {{maxExp}}</text>
</view>
<view class="level-progress-bar-bg">
<view class="level-progress-bar-fill" style="width: {{currentExp * 100 / maxExp}}%;"></view>
</view>
<text class="next-level-tip">距离下一级还需要 {{nextLevelExp}} 阳光</text>
<text class="next-level-perk" wx:if="{{nextPerk}}">下一级奖励: {{nextPerk}}</text>
</view>
<view class="click-hint">点击查看等级详情 ></view>
</view>
<view class="section-title-badges">所有徽章 ({{badges.length}})</view>
<view class="badges-grid">
<view wx:for="{{badges}}" wx:key="id" class="badge-item {{item.unlocked ? 'unlocked' : 'locked'}}">
<view class="badge-icon-circle" style="background: {{item.unlocked ? item.color + '20' : '#F5F5F5'}}">
<t-icon wx:if="{{item.unlocked}}" name="{{item.iconName}}" size="48rpx" color="{{item.color}}" />
<t-icon wx:else name="lock-on" size="40rpx" color="#BDBDBD" />
</view>
<text class="badge-name">{{item.name}}</text>
<text class="badge-desc">{{item.desc}}</text>
<text wx:if="{{item.progress}}" class="badge-progress">{{item.progress}}</text>
</view>
</view>
<view style="height: 60rpx;"></view>
</scroll-view>
</view>
+273
View File
@@ -0,0 +1,273 @@
page {
background: #F4F6F0;
}
.badges-page {
height: 100vh;
display: flex;
flex-direction: column;
}
.badges-scroll {
flex: 1;
padding: 32rpx;
box-sizing: border-box;
}
/* Level Card */
.level-card-large {
background: linear-gradient(135deg, #2c3e50 0%, #4ca1af 100%);
border-radius: 40rpx;
padding: 40rpx;
color: white;
margin-bottom: 48rpx;
box-shadow: 0 20rpx 40rpx rgba(44, 62, 80, 0.2);
position: relative;
overflow: hidden;
}
.level-card-bg {
position: absolute;
top: -100rpx;
right: -100rpx;
width: 300rpx;
height: 300rpx;
background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);
border-radius: 50%;
}
.level-header {
display: flex;
justify-content: space-between;
align-items: flex-start;
margin-bottom: 40rpx;
position: relative;
z-index: 2;
}
.level-info-large {
display: flex;
flex-direction: column;
gap: 8rpx;
}
.level-label {
font-size: 24rpx;
opacity: 0.8;
letter-spacing: 2rpx;
text-transform: uppercase;
}
.level-value {
font-size: 48rpx;
font-weight: 800;
}
.level-progress-section {
position: relative;
z-index: 2;
}
.progress-text {
display: flex;
justify-content: space-between;
font-size: 26rpx;
margin-bottom: 16rpx;
font-weight: 600;
opacity: 0.9;
}
.level-progress-bar-bg {
height: 16rpx;
background: rgba(0,0,0,0.2);
border-radius: 8rpx;
margin-bottom: 24rpx;
border: 2rpx solid rgba(255,255,255,0.1);
}
.level-progress-bar-fill {
height: 100%;
background: linear-gradient(90deg, #FFD700, #FDB931);
border-radius: 8rpx;
box-shadow: 0 0 12rpx rgba(255, 215, 0, 0.4);
}
.next-level-tip {
font-size: 24rpx;
color: rgba(255,255,255,0.7);
display: block;
text-align: right;
}
/* Click Hint */
.click-hint {
text-align: right;
font-size: 22rpx;
color: rgba(255,255,255,0.7);
margin-top: 24rpx;
font-weight: 500;
}
.next-level-perk {
font-size: 22rpx;
color: #FFD700;
margin-top: 8rpx;
display: block;
text-align: right;
font-weight: 500;
}
/* Popup Styles */
.level-popup-content {
background: white;
border-radius: 24rpx 24rpx 0 0;
padding: 32rpx 40rpx;
max-height: 80vh;
box-sizing: border-box;
}
.popup-title {
display: flex;
justify-content: space-between;
align-items: center;
font-size: 34rpx;
font-weight: 700;
margin-bottom: 32rpx;
color: #333;
}
.level-list-scroll {
max-height: 60vh;
box-sizing: border-box;
}
.level-list-item {
position: relative;
background: #f9f9f9;
border-radius: 16rpx;
padding: 24rpx;
margin-bottom: 20rpx;
border: 2rpx solid transparent;
}
.level-list-item.achieved {
background: #F1F8E9;
border-color: #A5D6A7;
}
.level-item-top {
display: flex;
align-items: center;
margin-bottom: 12rpx;
}
.level-tag-badge {
background: #CFD8DC;
color: #546E7A;
font-size: 20rpx;
padding: 4rpx 10rpx;
border-radius: 8rpx;
margin-right: 16rpx;
font-weight: 700;
}
.achieved .level-tag-badge {
background: #4CAF50;
color: white;
}
.level-item-title {
font-size: 28rpx;
font-weight: 700;
color: #333;
}
.level-spacer {
flex: 1;
}
.level-item-req {
font-size: 24rpx;
color: #999;
font-weight: 600;
}
.achieved .level-item-req {
color: #4CAF50;
}
.level-item-desc {
font-size: 24rpx;
color: #666;
line-height: 1.4;
padding-top: 12rpx;
border-top: 2rpx dashed #eee;
}
.achieved .level-item-desc {
border-top-color: rgba(76, 175, 80, 0.2);
color: #388E3C;
}
.level-achieve-icon {
position: absolute;
right: 24rpx;
top: 24rpx;
}
.section-title-badges {
font-size: 32rpx;
font-weight: 700;
color: #1F2937;
margin-bottom: 32rpx;
margin-left: 12rpx;
}
.badges-grid {
display: grid;
grid-template-columns: repeat(3, 1fr);
gap: 20rpx;
}
.badge-item {
background: #fff;
border-radius: 24rpx;
padding: 32rpx 16rpx;
display: flex;
flex-direction: column;
align-items: center;
text-align: center;
box-shadow: 0 4rpx 16rpx rgba(0,0,0,0.02);
}
.badge-item.locked {
background: #F8F9FA;
border: 2rpx dashed #E5E7EB;
box-shadow: none;
}
.badge-icon-circle {
width: 88rpx;
height: 88rpx;
border-radius: 30rpx;
display: flex;
align-items: center;
justify-content: center;
margin-bottom: 20rpx;
}
.badge-name {
font-size: 26rpx;
font-weight: 700;
color: #374151;
margin-bottom: 6rpx;
}
.badge-desc {
font-size: 20rpx;
color: #9CA3AF;
}
.badge-progress {
margin-top: 12rpx;
font-size: 20rpx;
background: #F3F4F6;
padding: 4rpx 12rpx;
border-radius: 12rpx;
color: #6B7280;
}
@@ -0,0 +1,79 @@
import request from '../../../../utils/request';
Page({
data: {
levels: [],
currentSunlight: 0,
currentLevel: 0
},
onLoad(options) {
let sunlight;
if (options.sunlight !== undefined) {
sunlight = parseInt(options.sunlight, 10);
if (!isNaN(sunlight)) {
this.setData({ currentSunlight: sunlight });
} else {
sunlight = undefined;
}
}
this.fetchData(sunlight);
},
async fetchData(passedSunlight) {
wx.showLoading({ title: '加载中...' });
try {
// Fetch levels
const levelRes = await request.get('/config/level/list');
console.log('Level Detail - API Response:', levelRes);
let list = [];
if (levelRes) {
if (Array.isArray(levelRes)) {
list = levelRes;
} else if (Array.isArray(levelRes.list)) {
list = levelRes.list;
} else if (levelRes.data && Array.isArray(levelRes.data.list)) {
list = levelRes.data.list;
} else if (levelRes.data && Array.isArray(levelRes.data)) {
list = levelRes.data;
}
}
console.log('Level Detail - Parsed List:', list);
list.sort((a, b) => a.minSunlight - b.minSunlight);
// Fetch profile if sunlight not passed
let currentSunlight = passedSunlight;
if (currentSunlight === undefined) {
const profileRes = await request.get('/profile/detail');
console.log('Level Detail - Profile:', profileRes);
currentSunlight = profileRes.totalSunlight || 0;
this.setData({ currentSunlight });
}
// Calculate current level
let currentLevel = 0;
// Iterate finding the highest level where minSunlight <= currentSunlight
for (let i = list.length - 1; i >= 0; i--) {
if (currentSunlight >= list[i].minSunlight) {
currentLevel = list[i].level;
break;
}
}
console.log('Level Detail - Calculated Level:', currentLevel);
this.setData({
levels: list,
currentLevel
});
} catch (e) {
console.error('Fetch level detail failed', e);
wx.showToast({ title: '数据加载失败', icon: 'none' });
} finally {
wx.hideLoading();
}
}
});
@@ -0,0 +1,6 @@
{
"navigationBarTitleText": "等级说明",
"usingComponents": {
"t-icon": "tdesign-miniprogram/icon/icon"
}
}
@@ -0,0 +1,32 @@
<view class="level-detail-page">
<view class="header-card">
<view class="header-title">累计阳光值</view>
<view class="header-value">{{currentSunlight}}</view>
</view>
<scroll-view scroll-y class="timeline-scroll">
<view class="timeline">
<view wx:for="{{levels}}" wx:key="level" class="timeline-item {{item.level <= currentLevel ? 'active' : ''}}">
<view class="timeline-left">
<view class="dot-line-top"></view>
<view class="status-dot">
<t-icon wx:if="{{item.level <= currentLevel}}" name="check" size="24rpx" color="#fff" />
</view>
<view class="dot-line-bottom"></view>
</view>
<view class="timeline-content">
<view class="level-card {{item.level === currentLevel ? 'current' : ''}}">
<view class="card-header">
<text class="card-lv">Lv.{{item.level}}</text>
<text class="card-title">{{item.title}}</text>
<view class="flex-spacer"></view>
<text class="card-sun">{{item.minSunlight}} 阳光</text>
</view>
<view class="card-perks" wx:if="{{item.perks}}">{{item.perks}}</view>
</view>
</view>
</view>
</view>
<view style="height: 60rpx;"></view>
</scroll-view>
</view>
@@ -0,0 +1,179 @@
page {
background: #F4F6F0;
height: 100vh;
display: flex;
flex-direction: column;
}
.level-detail-page {
height: 100%;
display: flex;
flex-direction: column;
}
.header-card {
background: linear-gradient(135deg, #2c3e50, #4ca1af);
padding: 60rpx 40rpx;
color: white;
text-align: center;
border-radius: 0 0 40rpx 40rpx;
box-shadow: 0 10rpx 30rpx rgba(44, 62, 80, 0.2);
margin-bottom: 40rpx;
flex-shrink: 0;
}
.header-title {
font-size: 28rpx;
opacity: 0.8;
margin-bottom: 12rpx;
}
.header-value {
font-size: 64rpx;
font-weight: 800;
}
.timeline-scroll {
flex: 1;
overflow-y: auto;
}
.timeline {
padding: 0 40rpx;
}
.timeline-item {
display: flex;
position: relative;
min-height: 140rpx;
}
.timeline-left {
display: flex;
flex-direction: column;
align-items: center;
width: 60rpx;
margin-right: 20rpx;
}
.dot-line-top, .dot-line-bottom {
width: 4rpx;
background: #E0E0E0;
flex: 1;
}
.timeline-item:first-child .dot-line-top {
visibility: hidden;
}
.timeline-item:last-child .dot-line-bottom {
visibility: hidden;
}
.status-dot {
width: 40rpx;
height: 40rpx;
border-radius: 50%;
background: #E0E0E0;
display: flex;
align-items: center;
justify-content: center;
margin: 8rpx 0;
z-index: 1;
flex-shrink: 0;
}
.timeline-item.active .status-dot {
background: #4CAF50;
box-shadow: 0 0 0 6rpx rgba(76, 175, 80, 0.2);
}
/* Logic for lines:
The top line of THIS item should be green if THIS item is active.
Wait, if item 2 is active, item 1 is also active.
Line connecting 1 and 2 is bottom of 1 and top of 2.
If 2 is active, top of 2 is green.
If 1 is active, bottom of 1 is green?
Easier: make lines background #E0E0E0.
Use a pseudo element or simply rely on active class.
*/
.timeline-item.active .dot-line-top {
background: #4CAF50;
}
/* If next item is active, make this item's bottom line green */
/* CSS cannot select based on next sibling easily without :has */
/* So just color top line of active item green. Bottom line stays gray? No. */
/* Just color all lines of active items green, EXCEPT the line connecting active to inactive. */
/* For simplicity, let's keep lines gray or improve logic. */
/* If I color .timeline-item.active .dot-line-bottom green, then if next is NOT active, it looks weird. */
/* Correct way: .timeline-item.active .dot-line-top is Green. */
.timeline-content {
flex: 1;
padding-bottom: 40rpx;
}
.level-card {
background: white;
border-radius: 20rpx;
padding: 24rpx;
border: 2rpx solid transparent;
box-shadow: 0 4rpx 16rpx rgba(0,0,0,0.02);
}
.level-card.current {
border-color: #4CAF50;
background: #F1F8E9;
}
.card-header {
display: flex;
align-items: center;
margin-bottom: 16rpx;
}
.card-lv {
background: #eceff1;
color: #546e7a;
font-size: 20rpx;
padding: 4rpx 12rpx;
border-radius: 8rpx;
font-weight: 700;
margin-right: 16rpx;
}
.timeline-item.active .card-lv {
background: #4CAF50;
color: white;
}
.card-title {
font-size: 30rpx;
font-weight: 700;
color: #333;
}
.flex-spacer {
flex: 1;
}
.card-sun {
font-size: 24rpx;
color: #999;
font-weight: 600;
}
.card-perks {
font-size: 26rpx;
color: #666;
line-height: 1.4;
padding-top: 16rpx;
border-top: 2rpx dashed #eee;
}
.level-card.current .card-perks {
border-top-color: rgba(76, 175, 80, 0.2);
color: #388E3C;
}
+73 -56
View File
@@ -40,58 +40,52 @@ Page({
if (typeof this.getTabBar === 'function' && this.getTabBar()) {
this.getTabBar().setData({ selected: 4 });
}
// Always fetch fresh profile data
this.loadUserInfo();
},
// ======== User Info ========
loadUserInfo() {
// Try to get from globalData or storage
const userInfo = app.globalData.userInfo || wx.getStorageSync('userInfo');
if (userInfo && userInfo.name) {
this.setData({
userName: userInfo.name || '植物爱好者',
userAvatar: userInfo.avatarUrl || userInfo.avatar || ''
});
return; // Use cached data, no API call
}
request.get('/profile/detail').then(res => {
if (!res) return;
// Map stats and level info
const avatarUrl = res.avatar && res.avatar.url ? res.avatar.url : '';
const levelInfo = res.level || {};
const levelTag = levelInfo.level ? `Lv.${levelInfo.level} ${levelInfo.title || ''}` : '';
// Only fetch from backend if no cached info
request.get('/user/info').then(user => {
if (!user) return;
const avatarUrl = user.avatar ? user.avatar.url : '';
this.setData({
userName: user.name || '植物爱好者',
userAvatar: avatarUrl
userName: res.nickname || '植物爱好者',
userAvatar: avatarUrl,
// Stats
plantCount: res.plantCount || 0,
taskDoneCount: res.careCount || 0,
postCount: res.postCount || 0,
// Level (if available)
userLevel: levelInfo.level || 0,
userLevelTag: levelTag,
// EXP / Sunlight
userExp: res.currentSunlight || 0
});
// Update global cache
const info = {
id: user.id,
name: user.name,
avatarUrl: avatarUrl,
account: user.account,
phone: user.phone,
avatarId: user.avatarId
...res,
avatarId: res.avatarId || (res.avatar ? res.avatar.id : '')
};
app.globalData.userInfo = info;
wx.setStorageSync('userInfo', info);
}).catch(() => { });
}).catch(err => {
console.error('Load profile failed', err);
});
},
// ======== Stats ========
loadStats() {
// Fetch plant count
request.post('/plant/page', { current: 1, pageSize: 1 }).then(res => {
this.setData({ plantCount: res.total || 0 });
}).catch(() => { });
// Fetch post count - user's own posts
request.post('/post/page', { current: 1, pageSize: 1, onlyMine: true }).then(res => {
this.setData({ postCount: res.total || 0 });
}).catch(() => { });
// Fetch completed tasks count
request.get('/plant/taskCount').then(res => {
this.setData({ taskDoneCount: res || 0 });
}).catch(() => { });
},
// ======== Navigation ========
setView(e) {
@@ -222,6 +216,10 @@ Page({
wx.navigateTo({ url: '/pages/profile/identify-history/index' });
},
goToBadges() {
wx.navigateTo({ url: '/pages/profile/badges/index' });
},
goToNotificationSettings() {
// Open WeChat notification settings
wx.openSetting({
@@ -284,10 +282,14 @@ Page({
},
async saveProfile() {
const { tempAvatar, tempNickname } = this.data;
const { tempAvatar, tempNickname, userName, userAvatar } = this.data;
if (!tempAvatar && !tempNickname) {
wx.showToast({ title: '请选择头像或输入昵称', icon: 'none' });
// Check if anything changed
const isNameChanged = tempNickname && tempNickname !== userName;
const isAvatarChanged = tempAvatar && tempAvatar !== userAvatar;
if (!isNameChanged && !isAvatarChanged) {
this.setData({ showProfileEditor: false });
return;
}
@@ -297,36 +299,51 @@ Page({
const updatePayload = {};
// 1. Upload avatar if changed
if (tempAvatar) {
const data = await request.upload(tempAvatar);
const fileData = data?.file || {};
if (fileData.id) {
updatePayload.avatar_id = fileData.id;
// Update local display
this.setData({ userAvatar: fileData.url || tempAvatar });
if (isAvatarChanged) {
const uploadRes = await request.upload(tempAvatar);
// Correctly extract ID from file object based on known API response
let fileId = '';
if (uploadRes && uploadRes.file && uploadRes.file.id) {
fileId = uploadRes.file.id;
} else if (uploadRes && uploadRes.id) {
fileId = uploadRes.id;
}
if (fileId) {
updatePayload.avatarId = fileId;
}
}
// 2. Set name if provided
if (tempNickname) {
updatePayload.name = tempNickname;
this.setData({ userName: tempNickname });
// 2. Set nickname if changed
if (isNameChanged) {
updatePayload.nickname = tempNickname;
}
// 3. Call update API
if (Object.keys(updatePayload).length > 0) {
await request.post('/user/update', updatePayload);
await request.post('/profile/update', updatePayload);
}
wx.hideLoading();
this.setData({ showProfileEditor: false });
// 4. Update local state
this.setData({
userName: tempNickname || userName,
userAvatar: tempAvatar || userAvatar, // Use tempAvatar for immediate display
showProfileEditor: false
});
wx.showToast({ title: '资料已更新', icon: 'success' });
// Update globalData
// 5. Update globalData
const userInfo = app.globalData.userInfo || {};
if (updatePayload.name) userInfo.name = updatePayload.name;
if (updatePayload.avatar_id) userInfo.avatarId = updatePayload.avatar_id;
if (updatePayload.nickname) userInfo.name = updatePayload.nickname;
if (updatePayload.avatarId) userInfo.avatarId = updatePayload.avatarId;
// Also update URL if we have it locally?
// Better to re-fetch profile to get canonical URL, but optimistic update is fine.
userInfo.avatar = tempAvatar;
app.globalData.userInfo = userInfo;
} catch (err) {
wx.hideLoading();
console.error('Save profile failed', err);
+5 -49
View File
@@ -61,51 +61,7 @@
</scroll-view>
</view>
<!-- ======== BADGES VIEW ======== -->
<view wx:elif="{{view === 'badges'}}" class="sub-view info-view-anim">
<view class="sub-nav" bindtap="goBack">
<t-icon name="chevron-left" size="40rpx" />
<text class="sub-nav-title">成就徽章</text>
</view>
<scroll-view scroll-y class="sub-scroll">
<!-- Level Card -->
<view class="level-card-large">
<view class="level-card-bg"></view>
<view class="level-header">
<view class="level-info-large">
<text class="level-label">当前等级</text>
<text class="level-value">Lv.4 资深植人</text>
</view>
<t-icon name="trophy" size="80rpx" color="#FFD700" />
</view>
<view class="level-progress-section">
<view class="progress-text">
<text>经验值</text>
<text>350 / 500</text>
</view>
<view class="level-progress-bar-bg">
<view class="level-progress-bar-fill" style="width: 70%;"></view>
</view>
<text class="next-level-tip">距离 Lv.5 园艺大师 还需 150 经验</text>
</view>
</view>
<view class="section-title-badges">所有徽章 (3/6)</view>
<view class="badges-grid">
<view wx:for="{{badges}}" wx:key="id" class="badge-item {{item.unlocked ? 'unlocked' : 'locked'}}">
<view class="badge-icon-circle" style="background: {{item.unlocked ? item.color + '20' : '#F5F5F5'}}">
<t-icon wx:if="{{item.unlocked}}" name="{{item.iconName}}" size="48rpx" color="{{item.color}}" />
<t-icon wx:else name="lock-on" size="40rpx" color="#BDBDBD" />
</view>
<text class="badge-name">{{item.name}}</text>
<text class="badge-desc">{{item.desc}}</text>
<text wx:if="{{item.progress}}" class="badge-progress">{{item.progress}}</text>
</view>
</view>
</scroll-view>
</view>
<!-- ======== ABOUT VIEW ======== -->
<view wx:elif="{{view === 'about'}}" class="sub-view info-view-anim">
@@ -143,7 +99,7 @@
</view>
<view class="user-text" bindtap="openProfileEditor">
<view class="user-name">{{userName}}</view>
<view class="level-badge">Lv.4 资深植人</view>
<view class="level-badge">{{userLevelTag || 'Lv.0 园艺新手'}}</view>
</view>
</view>
<view class="settings-btn" bindtap="goToNotificationSettings">
@@ -206,7 +162,7 @@
<t-icon name="chevron-right" size="36rpx" color="#ccc" />
</view>
<view class="menu-item" bindtap="setView" data-view="badges">
<view class="menu-item" bindtap="goToBadges">
<view class="menu-left">
<view class="menu-icon-bg" style="background: #F3E5F5">
<t-icon name="award" size="36rpx" color="#9C27B0" />
@@ -214,7 +170,7 @@
<text class="menu-text">成就徽章</text>
</view>
<view class="menu-right-info">
<text class="menu-badge-text">已获 3 个</text>
<!-- <text class="menu-badge-text">已获 3 个</text> -->
<t-icon name="chevron-right" size="36rpx" color="#ccc" />
</view>
</view>
@@ -246,7 +202,7 @@
</view>
</view>
<view class="edit-row" bindtap="onChooseAvatar">
<button class="edit-row avatar-btn" open-type="chooseAvatar" bind:chooseavatar="onChooseAvatar">
<text class="edit-row-label">头像</text>
<view class="edit-row-right">
<t-avatar
@@ -257,7 +213,7 @@
<t-avatar wx:else icon="user" size="96rpx" />
<t-icon name="chevron-right" size="32rpx" color="#C5C5C5" />
</view>
</view>
</button>
<view class="edit-row">
<text class="edit-row-label">昵称</text>
+21
View File
@@ -621,3 +621,24 @@
box-shadow: 0 4rpx 12rpx rgba(0,0,0,0.02);
margin-bottom: 40rpx;
}
/* Avatar Button Reset */
button.edit-row.avatar-btn {
background: transparent;
padding-left: 0;
padding-right: 0;
margin: 0;
display: flex;
justify-content: space-between;
align-items: center;
width: 100%;
line-height: inherit;
font-size: inherit;
border-radius: 0;
text-align: left;
}
button.edit-row.avatar-btn::after {
border: none;
display: none;
}