Initial commit: gmTouringMiniApp project

2026-07-30 16:04:34 +08:00
commit ebcae02d35
201 changed files with 49545 additions and 0 deletions
@@ -0,0 +1,52 @@
+// pages/badges/badges.js
+const userStore = require('../../userStore.js');
+
+Page({
+  data: {
+    points: 0,
+    badges: []
+  },
+
+  onLoad() {
+    this.refresh();
+  },
+
+  // 每次显示都刷新一次，保证从其他页面打卡回来后数据是最新的
+  onShow() {
+    this.refresh();
+  },
+
+  refresh() {
+    const data = userStore.getUserData();
+
+    // 将徽章数据处理为渲染友好的结构（格式化获得时间、补默认图标）
+    const badges = (data.badges || []).map(b => ({
+      name: b.name,
+      icon: this.getBadgeIcon(b.name),
+      obtainedAtText: this.formatTime(b.obtainedAt)
+    }));
+
+    this.setData({
+      points: data.points || 0,
+      badges
+    });
+  },
+
+  // 根据徽章名称返回对应的 emoji 图标（也可换成图片路径）
+  getBadgeIcon(name) {
+    const map = {
+      '探索者': '🧭',
+      '旅行家': '🌍',
+      '打卡达人': '🏆'
+    };
+    return map[name] || '🎖️';
+  },
+
+  // 格式化时间戳为 "YYYY-MM-DD HH:mm"
+  formatTime(ts) {
+    if (!ts) return '';
+    const d = new Date(ts);
+    const pad = n => (n < 10 ? '0' + n : '' + n);
+    return `${d.getFullYear()}-${pad(d.getMonth() + 1)}-${pad(d.getDate())} ${pad(d.getHours())}:${pad(d.getMinutes())}`;
+  }
+});
@@ -0,0 +1,6 @@
+{
+  "navigationBarTitleText": "我的徽章",
+  "navigationBarBackgroundColor": "#fff8ec",
+  "navigationBarTextStyle": "black",
+  "backgroundColor": "#fff8ec"
+}
@@ -0,0 +1,37 @@
+<!--pages/badges/badges.wxml-->
+<view class="page">
+
+  <!-- 顶部积分卡片 -->
+  <view class="header-card">
+    <view class="header-label">我的总积分</view>
+    <view class="header-points">
+      <text class="points-num">{{points}}</text>
+      <text class="points-unit"> 分</text>
+    </view>
+  </view>
+
+  <!-- 徽章墙标题 -->
+  <view class="section-title">
+    <text>徽章墙</text>
+    <text class="section-count">共 {{badges.length}} 枚</text>
+  </view>
+
+  <!-- 徽章网格 -->
+  <block wx:if="{{badges.length > 0}}">
+    <view class="badge-grid">
+      <view class="badge-item" wx:for="{{badges}}" wx:key="name">
+        <view class="badge-icon">{{item.icon}}</view>
+        <view class="badge-name">{{item.name}}</view>
+        <view class="badge-time">{{item.obtainedAtText}}</view>
+      </view>
+    </view>
+  </block>
+
+  <!-- 空状态 -->
+  <view class="empty" wx:else>
+    <view class="empty-icon">🎖️</view>
+    <view class="empty-text">还没有获得徽章</view>
+    <view class="empty-tip">去景点打卡，赢取你的第一枚徽章吧～</view>
+  </view>
+
+</view>
@@ -0,0 +1,127 @@
+/* pages/badges/badges.wxss */
+
+.page {
+  min-height: 100vh;
+  padding: 24rpx;
+  box-sizing: border-box;
+  background: #fff8ec;
+}
+
+/* 顶部积分卡片 */
+.header-card {
+  background: linear-gradient(135deg, #ffb347 0%, #ff7e5f 100%);
+  border-radius: 24rpx;
+  padding: 40rpx 32rpx;
+  color: #fff;
+  box-shadow: 0 8rpx 24rpx rgba(255, 126, 95, 0.25);
+}
+
+.header-label {
+  font-size: 28rpx;
+  opacity: 0.9;
+}
+
+.header-points {
+  margin-top: 12rpx;
+  display: flex;
+  align-items: baseline;
+}
+
+.points-num {
+  font-size: 72rpx;
+  font-weight: 700;
+  line-height: 1;
+}
+
+.points-unit {
+  font-size: 30rpx;
+  margin-left: 8rpx;
+}
+
+/* 分区标题 */
+.section-title {
+  margin: 40rpx 8rpx 20rpx;
+  font-size: 32rpx;
+  font-weight: 600;
+  color: #333;
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+}
+
+.section-count {
+  font-size: 24rpx;
+  font-weight: 400;
+  color: #999;
+}
+
+/* 徽章网格 */
+.badge-grid {
+  display: grid;
+  grid-template-columns: repeat(3, 1fr);
+  gap: 20rpx;
+}
+
+.badge-item {
+  background: #ffffff;
+  border-radius: 20rpx;
+  padding: 28rpx 12rpx;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  box-shadow: 0 4rpx 12rpx rgba(0, 0, 0, 0.05);
+  transition: transform 0.2s;
+}
+
+.badge-item:active {
+  transform: scale(0.96);
+}
+
+.badge-icon {
+  width: 100rpx;
+  height: 100rpx;
+  border-radius: 50%;
+  background: linear-gradient(135deg, #fff2d6, #ffe0b3);
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  font-size: 56rpx;
+  margin-bottom: 16rpx;
+}
+
+.badge-name {
+  font-size: 28rpx;
+  color: #333;
+  font-weight: 600;
+  margin-bottom: 6rpx;
+}
+
+.badge-time {
+  font-size: 20rpx;
+  color: #999;
+  text-align: center;
+}
+
+/* 空状态 */
+.empty {
+  margin-top: 120rpx;
+  text-align: center;
+  color: #999;
+}
+
+.empty-icon {
+  font-size: 120rpx;
+  opacity: 0.5;
+}
+
+.empty-text {
+  margin-top: 24rpx;
+  font-size: 30rpx;
+  color: #666;
+}
+
+.empty-tip {
+  margin-top: 12rpx;
+  font-size: 24rpx;
+  color: #aaa;
+}