wxamp-ymtxUser/pagesA/pages/noticeList/noticeList.wxml

<view class="notice-page">
  <!-- 毛玻璃背景装饰 -->
  <view class="bg-blur"></view>
  
  <!-- 主内容区 -->
  <view class="content">
    <!-- 头部标题 & 搜索栏一体化 -->
    <view class="header">
      <text class="title">📋 公告·通知</text>
      <view class="search-box">
        <text class="icon">🔍</text>
        <input 
          type="text" 
          placeholder="搜索标题或摘要..." 
          placeholder-class="placeholder"
          bindinput="onSearchInput"
          value="{{searchKeyword}}"
          confirm-type="search"
          bindconfirm="handleSearch"
        />
        <text class="clear-icon" wx:if="{{searchKeyword}}" bindtap="clearSearch">✕</text>
      </view>
    </view>

    <!-- 分类导航 - 滑动流畅 -->
    <scroll-view class="category-scroll" scroll-x show-scrollbar="{{false}}" enhanced>
      <view class="category-list">
        <view 
          wx:for="{{categories}}" 
          wx:key="index"
          class="category-item {{currentCategory === item.value ? 'active' : ''}}"
          bindtap="switchCategory"
          data-category="{{item.value}}"
        >
          <text>{{item.name}}</text>
          <text class="dot" wx:if="{{currentCategory === item.value}}"></text>
        </view>
      </view>
    </scroll-view>

    <!-- 列表内容区域 -->
    <view class="list-container">
      <!-- 骨架屏 / 加载提示 -->
      <block wx:if="{{loading && noticeList.length === 0}}">
        <view class="skeleton-list">
          <view wx:for="{{4}}" wx:key="*this" class="skeleton-item"></view>
        </view>
      </block>

      <!-- 列表渲染 -->
      <scroll-view 
        class="notice-scroll" 
        scroll-y 
        enhanced
        show-scrollbar="{{false}}"
        bindscrolltolower="loadMore"
        lower-threshold="50"
        refresher-enabled
        refresher-triggered="{{refreshing}}"
        bindrefresherrefresh="onRefresh"
      >
        <view class="notice-list">
          <view 
            wx:for="{{noticeList}}" 
            wx:key="id"
            class="notice-card"
            bindtap="viewDetail"
            data-id="{{item.id}}"
          >
            <!-- 重要性标记装饰 -->
            <view class="card-left-bar" style="background: {{item.importanceColor}};"></view>
            <view class="card-content">
              <view class="card-header">
                <text class="notice-title">{{item.title}}</text>
                <text class="notice-tag" style="background: {{item.tagBg}};">{{item.warningType}}</text>
              </view>
              <view class="notice-abstract">{{item.responseMeasures}}</view>
              <view class="card-footer">
                <view class="date-time">
                  <text class="date-icon">📅</text>
                  <text>{{item.createdTime}}</text>
                </view>
              </view>
            </view>
          </view>
        </view>

        <!-- 上拉加载更多状态 -->
        <view class="load-more" wx:if="{{noticeList.length > 0}}">
          <block wx:if="{{hasMore}}">
            <text class="loading-icon">⋯</text>
            <text>加载更多</text>
          </block>
          <block wx:else>
            <text>—— 已经到底了 ——</text>
          </block>
        </view>

        <!-- 空状态展示 -->
        <view class="empty-state" wx:if="{{!loading && noticeList.length === 0}}">
          <image src="/images/empty-notice.png" mode="aspectFit" style="width: 160rpx; height: 160rpx;" wx:if="{{false}}"></image>
          <text>📭 暂无相关公告</text>
          <text style="font-size: 28rpx; color: #999; margin-top: 16rpx;">试试其他关键词或分类</text>
        </view>
      </scroll-view>
    </view>
  </view>
</view>