forked from zhouruizhe/gmTouringMiniApp
81 lines
1.9 KiB
JavaScript
81 lines
1.9 KiB
JavaScript
// pages/poi/poi.js
|
|
const userStore = require('../../userStore.js');
|
|
|
|
// 模拟的景点数据,实际项目中可以来自云端接口
|
|
const POI_LIST = [
|
|
{ id: 'poi_001', name: '西湖', icon: '🌊', desc: '杭州最著名的湖泊' },
|
|
{ id: 'poi_002', name: '灵隐寺', icon: '🛕', desc: '千年古刹,禅意悠远' },
|
|
{ id: 'poi_003', name: '雷峰塔', icon: '🗼', desc: '白娘子传说所在地' },
|
|
{ id: 'poi_004', name: '西溪湿地', icon: '🌾', desc: '城市中的绿色湿地' },
|
|
{ id: 'poi_005', name: '千岛湖', icon: '🏝️', desc: '碧水青山,湖光山色' }
|
|
];
|
|
|
|
Page({
|
|
data: {
|
|
points: 0,
|
|
badgeCount: 0,
|
|
pois: []
|
|
},
|
|
|
|
onLoad() {
|
|
this.refresh();
|
|
},
|
|
|
|
onShow() {
|
|
this.refresh();
|
|
},
|
|
|
|
// 每次刷新:把打卡状态合并到景点列表中,同时更新顶部积分/徽章数
|
|
refresh() {
|
|
const data = userStore.getUserData();
|
|
const checkedSet = new Set(data.checkIns.map(c => c.poiId));
|
|
|
|
const pois = POI_LIST.map(p => ({
|
|
...p,
|
|
checked: checkedSet.has(p.id)
|
|
}));
|
|
|
|
this.setData({
|
|
points: data.points,
|
|
badgeCount: data.badges.length,
|
|
pois
|
|
});
|
|
},
|
|
|
|
// 点击打卡按钮
|
|
onCheckIn(e) {
|
|
const { id, name } = e.currentTarget.dataset;
|
|
const res = userStore.checkIn(id, name);
|
|
|
|
wx.showToast({
|
|
title: res.message,
|
|
icon: res.success ? 'success' : 'none',
|
|
duration: 1500
|
|
});
|
|
|
|
if (res.success) {
|
|
this.refresh();
|
|
}
|
|
},
|
|
|
|
// 跳转到徽章页面
|
|
goBadges() {
|
|
wx.navigateTo({ url: '/pages/badges/badges' });
|
|
},
|
|
|
|
// 调试用:清空本地数据
|
|
onResetData() {
|
|
wx.showModal({
|
|
title: '确认清空',
|
|
content: '将清除所有积分、徽章和打卡记录',
|
|
success: (r) => {
|
|
if (r.confirm) {
|
|
wx.clearStorageSync();
|
|
this.refresh();
|
|
wx.showToast({ title: '已清空', icon: 'success' });
|
|
}
|
|
}
|
|
});
|
|
}
|
|
});
|