Initial commit

wechat-mini-program/pages/message/index.js

@@ -0,0 +1,42 @@
+const app = getApp()
+const { request } = require('../../utils/request.js')
+
+Page({
+  data: {
+    notifications: [],
+    loading: false
+  },
+
+  onShow() {
+    this.fetchNotifications()
+    this.readAllNotifications()
+  },
+
+  fetchNotifications() {
+    this.setData({ loading: true })
+    request({ url: '/notifications/' })
+      .then(res => {
+        // Handle paginated response if any, or direct list
+        const list = Array.isArray(res) ? res : (res.results || [])
+        this.setData({
+          notifications: list,
+          loading: false
+        })
+      })
+      .catch(err => {
+        console.error(err)
+        this.setData({ loading: false })
+      })
+  },
+
+  readAllNotifications() {
+    request({ 
+      url: '/notifications/read_all/',
+      method: 'POST'
+    })
+      .then(res => {
+        console.log('All read')
+      })
+      .catch(err => console.error(err))
+  }
+})

wechat-mini-program/pages/message/index.json

@@ -0,0 +1,3 @@
+{
+  "navigationBarTitleText": "消息通知"
+}

wechat-mini-program/pages/message/index.wxml

@@ -0,0 +1,16 @@
+<view class="container">
+  <view class="notification-list" wx:if="{{notifications.length > 0}}">
+    <view class="notification-item" wx:for="{{notifications}}" wx:key="id">
+      <view class="notification-header">
+        <text class="title">{{item.title}}</text>
+        <text class="time">{{item.created_at}}</text>
+      </view>
+      <view class="notification-content">
+        {{item.content}}
+      </view>
+    </view>
+  </view>
+  <view class="empty-state" wx:else>
+    <text>暂无消息</text>
+  </view>
+</view>

wechat-mini-program/pages/message/index.wxss

@@ -0,0 +1,46 @@
+.container {
+  padding: 20rpx;
+  background-color: #f8f8f8;
+  min-height: 100vh;
+}
+
+.notification-item {
+  background-color: #fff;
+  border-radius: 12rpx;
+  padding: 30rpx;
+  margin-bottom: 20rpx;
+  box-shadow: 0 2rpx 8rpx rgba(0,0,0,0.05);
+}
+
+.notification-header {
+  display: flex;
+  justify-content: space-between;
+  align-items: center;
+  margin-bottom: 16rpx;
+}
+
+.title {
+  font-size: 32rpx;
+  font-weight: bold;
+  color: #333;
+}
+
+.time {
+  font-size: 24rpx;
+  color: #999;
+}
+
+.notification-content {
+  font-size: 28rpx;
+  color: #666;
+  line-height: 1.5;
+}
+
+.empty-state {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  padding-top: 200rpx;
+  color: #999;
+  font-size: 28rpx;
+}