feat: redesign discovery and messages tabs

miniapp/pages/messages/messages.js

@@ -57,10 +57,27 @@ Page({
   },
 
   onGoChat(e) {
-    const { conversationId } = e.detail;
+    const { conversationId, canSendMessage } = e.detail;
+    if (!canSendMessage) {
+      appStore.toastError('当前会话已停用，无法继续聊天');
+      return;
+    }
     wx.navigateTo({ url: to.chat(conversationId) });
   },
 
+  onShortcutTap(e) {
+    const key = e.currentTarget.dataset.key;
+    if (key === 'new-friends') {
+      wx.switchTab({ url: ROUTE.TAB.DISCOVER });
+      return;
+    }
+    if (key === 'system') {
+      wx.navigateTo({ url: ROUTE.SETTINGS.NOTIFICATIONS });
+      return;
+    }
+    wx.navigateTo({ url: ROUTE.MAIN.FATE_CENTER });
+  },
+
   onEmptyAction(e) {
     if (e.detail.event === 'home') {
       wx.switchTab({ url: ROUTE.TAB.HOME });

miniapp/pages/messages/messages.json

@@ -1,5 +1,6 @@
 {
   "navigationBarTitleText": "消息",
+  "navigationStyle": "custom",
   "enablePullDownRefresh": true,
   "backgroundColor": "#F7F8FA",
   "backgroundTextStyle": "dark",

miniapp/pages/messages/messages.wxml

@@ -1,42 +1,52 @@
-<!-- 消息列表页 U23 -->
-<view class="page reference-page">
-  <ui-section-header
-    wx:if="{{conversations.length > 0}}"
-    title="消息"
-    subtitle="{{unreadTotal > 0 ? unreadTotal + ' 条未读' : '全部已读'}}"
-  />
+<!-- 消息列表页：仅服务端允许的 Mutual Match 会话可进入聊天 -->
+<view class="page app-page reference-page">
+  <view class="messages-hero">
+    <view class="messages-nav">
+      <text class="messages-title">消息</text>
+      <image class="messages-search" src="/assets/icons/ui/search.png" mode="aspectFit" />
+    </view>
+    <view class="message-shortcuts">
+      <view class="message-shortcut" bindtap="onShortcutTap" data-key="new-friends">
+        <view class="shortcut-icon shortcut-icon--blue"><image src="/assets/icons/home/find-object.png" mode="aspectFit" /></view>
+        <text>新朋友</text>
+      </view>
+      <view class="message-shortcut" bindtap="onShortcutTap" data-key="likes">
+        <view class="shortcut-icon shortcut-icon--pink"><image src="/assets/brand/logo-mark.png" mode="aspectFit" /></view>
+        <text>互动喜欢</text>
+      </view>
+      <view class="message-shortcut" bindtap="onShortcutTap" data-key="following">
+        <view class="shortcut-icon shortcut-icon--purple"><image src="/assets/icons/home/matchmaker.png" mode="aspectFit" /></view>
+        <text>我的关注</text>
+      </view>
+      <view class="message-shortcut" bindtap="onShortcutTap" data-key="system">
+        <view class="shortcut-icon shortcut-icon--coral"><image src="/assets/icons/ui/warning.png" mode="aspectFit" /></view>
+        <text>系统通知</text>
+      </view>
+    </view>
+  </view>
 
-  <!-- 加载中（首次） -->
-  <ui-loading
-    wx:if="{{loading && conversations.length === 0}}"
-    mode="skeleton"
-    rows="4"
-  />
+  <view class="messages-content">
+    <ui-section-header title="最近联系" subtitle="{{unreadTotal > 0 ? unreadTotal + ' 条未读' : '全部已读'}}" />
 
-  <!-- 会话列表 -->
-  <block wx:elif="{{conversations.length > 0}}">
-    <ui-conversation-item
-      wx:for="{{conversations}}"
-      wx:key="conversationId"
-      conversation="{{item}}"
-      bind:tap="onGoChat"
+    <ui-loading wx:if="{{loading && conversations.length === 0}}" mode="skeleton" rows="4" />
+
+    <view wx:elif="{{conversations.length > 0}}" class="conversation-list">
+      <ui-conversation-item
+        wx:for="{{conversations}}"
+        wx:key="conversationId"
+        conversation="{{item}}"
+        bind:tap="onGoChat"
+      />
+      <ui-loading wx:if="{{loading}}" mode="spinner" text="加载更多会话" inline />
+    </view>
+
+    <ui-empty
+      wx:elif="{{!loading}}"
+      illustration="message"
+      title="还没有消息"
+      description="互相喜欢后可以开始聊天。去看看今天为你推荐的人吧。"
+      actions="{{emptyActions}}"
+      bind:action="onEmptyAction"
     />
-    <!-- 加载更多 -->
-    <ui-loading
-      wx:if="{{loading && conversations.length > 0}}"
-      mode="spinner"
-      text="加载更多会话…"
-      inline
-    />
-  </block>
-
-  <!-- 空状态 -->
-  <ui-empty
-    wx:elif="{{!loading}}"
-    illustration="message"
-    title="还没有消息"
-    description="互相喜欢后可以开始聊天。去看看今天为你推荐的人吧。"
-    actions="{{emptyActions}}"
-    bind:action="onEmptyAction"
-  />
+  </view>
 </view>

miniapp/pages/messages/messages.wxss

@@ -1,7 +1,79 @@
-/**
- * 消息列表页样式（重构后大幅简化，主体样式封装在 ui-conversation-item 内）
- */
 .page {
   min-height: 100vh;
-  background: var(--color-bg-page);
+  background: #f4f5fa;
+}
+
+.messages-hero {
+  padding: env(safe-area-inset-top) 24rpx 34rpx;
+  border-radius: 0 0 36rpx 36rpx;
+  background: linear-gradient(160deg, var(--mini-night-start), var(--mini-night-end));
+  box-shadow: var(--mini-shadow);
+}
+
+.messages-nav {
+  position: relative;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 88rpx;
+}
+
+.messages-title {
+  color: #fff;
+  font-size: 31rpx;
+  font-weight: 700;
+}
+
+.messages-search {
+  position: absolute;
+  right: 14rpx;
+  width: 34rpx;
+  height: 34rpx;
+}
+
+.message-shortcuts {
+  display: grid;
+  grid-template-columns: repeat(4, 1fr);
+  padding: 22rpx 8rpx 4rpx;
+}
+
+.message-shortcut {
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+  color: rgba(255, 255, 255, .88);
+  font-size: 20rpx;
+}
+
+.shortcut-icon {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  width: 72rpx;
+  height: 72rpx;
+  margin-bottom: 12rpx;
+  border: 1rpx solid rgba(255, 255, 255, .2);
+  border-radius: 26rpx;
+}
+
+.shortcut-icon image {
+  width: 45rpx;
+  height: 45rpx;
+}
+
+.shortcut-icon--blue { background: rgba(79, 139, 255, .28); }
+.shortcut-icon--pink { background: rgba(255, 92, 130, .28); }
+.shortcut-icon--purple { background: rgba(154, 107, 255, .28); }
+.shortcut-icon--coral { background: rgba(240, 106, 100, .28); }
+
+.messages-content {
+  padding: 16rpx 24rpx 40rpx;
+}
+
+.conversation-list {
+  overflow: hidden;
+  margin-top: 8rpx;
+  border-radius: 28rpx;
+  background: #fff;
+  box-shadow: 0 10rpx 32rpx rgba(34, 35, 91, .08);
 }