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

<view class="detail-page">
  <!-- 背景 -->
  <view class="bg-blur"></view>
  
  <!-- 加载中状态 -->
  <view class="loading-container" wx:if="{{loading}}">
    <view class="loading-spinner"></view>
    <text>加载中...</text>
  </view>

  <!-- 主要内容 -->
  <scroll-view 
    class="detail-scroll" 
    scroll-y 
    enhanced
    show-scrollbar="{{false}}"
    wx:else
  >
    <view class="detail-content" wx:if="{{noticeDetail.id}}">
      <!-- 标题卡片 -->
      <view class="title-card">
        <!-- 分类标签 -->
        <view class="category-wrap">
          <view class="category-tag" style="background: {{getTagBg(noticeDetail.warningType)}}; color: {{getLevelColor(noticeDetail.warningLevel)}};">
            {{noticeDetail.warningType || '通知公告'}}
          </view>
          <view class="level-tag" style="background: {{getLevelBg(noticeDetail.warningLevel)}}; color: {{getLevelColor(noticeDetail.warningLevel)}};">
            {{noticeDetail.warningLevel}}
          </view>
        </view>
        
        <!-- 标题 -->
        <text class="title">{{noticeDetail.title}}</text>
        
        <!-- 时间信息 -->
        <view class="time-info">
          <text class="time-icon">📅</text>
          <text class="time-text">发布时间：{{noticeDetail.createdTime || noticeDetail.lastUpdated || '未知时间'}}</text>
        </view>
      </view>

      <!-- 影响区域卡片 -->
      <view class="info-card" wx:if="{{noticeDetail.affectedRegions}}">
        <view class="info-header">
          <text class="info-icon">📍</text>
          <text class="info-title">影响区域</text>
        </view>
        <view class="region-tags">
          <text class="region-tag">
            {{noticeDetail.affectedRegions}}
          </text>
        </view>
      </view>

      <!-- 简要内容卡片 -->
      <view class="content-card" wx:if="{{noticeDetail.briefContent}}">
        <view class="content-header">
          <text class="content-icon">📋</text>
          <text class="content-title">简要内容</text>
        </view>
        <view class="brief-content">
          <rich-text nodes="{{noticeDetail.briefContent}}" space="emsp"></rich-text>
        </view>
      </view>

      <!-- 详细内容卡片 -->
      <view class="content-card" wx:if="{{noticeDetail.detailContent}}">
        <view class="content-header">
          <text class="content-icon">📄</text>
          <text class="content-title">详细内容</text>
        </view>
        <view class="detail-body">
          <rich-text nodes="{{noticeDetail.detailContent}}" space="emsp"></rich-text>
        </view>
      </view>

      <!-- 应对措施卡片 -->
      <view class="measures-card" wx:if="{{noticeDetail.responseMeasures}}">
        <view class="measures-header">
          <text class="measures-icon">🛡️</text>
          <text class="measures-title">应对措施</text>
        </view>
        <view class="measures-list">
          <view class="measure-item" >
            <text class="measure-text">{{noticeDetail.responseMeasures}}</text>
          </view>
        </view>
      </view>

      <!-- 底部留白 -->
      <view class="bottom-space"></view>
    </view>

    <!-- 错误状态 -->
    <view class="error-state" wx:else>
      <image src="/images/empty-notice.png" mode="aspectFit" style="width: 240rpx; height: 240rpx;" wx:if="{{false}}"></image>
      <text class="error-emoji">📭</text>
      <text class="error-text">公告不存在或已删除</text>
      <button class="back-btn" bindtap="goBack">返回列表</button>
    </view>
  </scroll-view>
</view>