toutoukan_front/miniprogram/pages/notifications/notifications.wxml

<view class="container">
  <block wx:for="{{ messageList }}" wx:key="id">
    <view 
      class="card" 
      bind:tap="handleNavigate" 
      data-target="{{item.target}}"
      hover-class="card-hover"
    >
      <view class="card-header">
        <view class="card-title-box">
          <image class="card-icon" src="{{ item.type === 'system' ? systemIcon : userIcon }}"></image>
          <text class="card-title">{{ item.title }}</text>
          <view class="unread-dot" wx:if="{{ item.is_read === 0 }}"></view>
        </view>
        <text class="card-time">{{ item.timestamp }}</text>
      </view>

      <view class="card-body">
        <text class="card-content">{{ item.content }}</text>
      </view>

      <view class="divider"></view>

      <view class="card-footer">
        <text>查看详情</text>
        <text class="arrow">›</text>
      </view>
    </view>
  </block>

  <view class="no-message" wx:if="{{ messageList.length === 0 }}">
    <image class="no-message-icon" src="/path/to/your/empty-icon.png"></image>
    <text>暂无新消息</text>
  </view>
</view>