每日运势小程序

DailyFortuneGuide/pages/history/index.js

@@ -0,0 +1,51 @@
+const fortuneStore = require("../../store/fortuneStore");
+const messages = require("../../constants/messages");
+const { formatDisplayDateTime } = require("../../utils/date");
+const { formatRegionDisplay, normalizeRegionArray } = require("../../utils/region");
+const { getPageSafeTop } = require("../../utils/safeArea");
+
+Page({
+  data: {
+    safeAreaTop: 64,
+    history: [],
+    emptyText: messages.HISTORY_EMPTY
+  },
+  onLoad() {
+    this.updateSafeAreaPadding();
+  },
+  onShow() {
+    fortuneStore.loadHistory();
+    const { history } = fortuneStore.getState();
+    const normalized = history.map((item) => {
+      const snapshot = item.formSnapshot || {};
+      const fortune = item.fortune || {};
+      const regionValue = normalizeRegionArray(snapshot.birthRegion);
+      const fallbackSegments = [snapshot.birthProvince, snapshot.birthCity, snapshot.birthDistrict].filter(Boolean);
+      const regionLabel = formatRegionDisplay(regionValue, fallbackSegments);
+      const fortuneDate = fortune.fortuneDate || fortune.FortuneDate || "";
+      const summary = fortune.summary || fortune.Summary || "";
+      return {
+        id: item.id,
+        createdAt: item.createdAt,
+        displayTime: formatDisplayDateTime(item.createdAt),
+        city: regionLabel || snapshot.birthCity || snapshot.birthProvince || "",
+        fortuneDate,
+        summary
+      };
+    });
+    this.setData({ history: normalized });
+  },
+  handleViewDetail(event) {
+    const { id } = event.currentTarget.dataset;
+    if (!id) {
+      return;
+    }
+    if (typeof tt !== "undefined" && tt.navigateTo) {
+      tt.navigateTo({ url: `/pages/history-detail/index?id=${id}` });
+    }
+  },
+  updateSafeAreaPadding() {
+    const padding = getPageSafeTop();
+    this.setData({ safeAreaTop: padding });
+  }
+});

DailyFortuneGuide/pages/history/index.json

@@ -0,0 +1,3 @@
+{
+  "navigationStyle": "custom"
+}

DailyFortuneGuide/pages/history/index.ttml

@@ -0,0 +1,19 @@
+<view class="page">
+  <scroll-view class="content" scroll-y="true" style="padding-top: {{safeAreaTop}}px;">
+    <view class="empty" tt:if="{{!history.length}}">
+      <text class="empty-text">{{emptyText}}</text>
+    </view>
+
+    <block tt:for="{{history}}" tt:key="id">
+      <view class="history-card" bindtap="handleViewDetail" data-id="{{item.id}}">
+        <view class="card-header">
+          <text class="card-date">{{item.displayTime}}</text>
+          <text class="card-city">{{item.city}}</text>
+        </view>
+        <text class="card-summary" tt:if="{{item.summary}}">{{item.summary}}</text>
+        <text class="card-summary" tt:else>鏈娴嬬畻宸蹭繚瀛橈紝鍙偣鍑绘煡鐪嬭鎯?/text>
+      </view>
+    </block>
+  </scroll-view>
+</view>
+

DailyFortuneGuide/pages/history/index.ttss

@@ -0,0 +1,48 @@
+.page {
+  min-height: 100vh;
+  padding: 24rpx;
+  box-sizing: border-box;
+}
+
+.content {
+  min-height: 100vh;
+  box-sizing: border-box;
+}
+
+.empty {
+  margin-top: 200rpx;
+  text-align: center;
+  color: rgba(255, 255, 255, 0.5);
+  font-size: 28rpx;
+}
+
+.history-card {
+  background: rgba(255, 255, 255, 0.08);
+  border-radius: 22rpx;
+  padding: 28rpx;
+  margin-bottom: 24rpx;
+  border: 1px solid rgba(255, 255, 255, 0.08);
+}
+
+.card-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  margin-bottom: 12rpx;
+}
+
+.card-date {
+  font-size: 26rpx;
+  color: #ffead1;
+}
+
+.card-city {
+  font-size: 24rpx;
+  color: rgba(255, 255, 255, 0.6);
+}
+
+.card-summary {
+  font-size: 26rpx;
+  color: rgba(255, 255, 255, 0.72);
+  line-height: 40rpx;
+}