YD_Event.miniApp/pages/detail/detail.wxml

<view class="page-detail">
  <image wx:if="{{heroImage}}" class="detail-hero" src="{{heroImage}}" mode="aspectFill" />
  <view wx:else class="detail-hero detail-hero--placeholder" />

  <view class="main-sheet">
    <view class="title-block">
      <view class="title-row">
        <view class="format-tag" wx:if="{{eventFormatTag}}">{{eventFormatTag}}</view>
        <view class="event-title">{{eventTitle || '—'}}</view>
      </view>
    </view>

    <view class="info-list">
      <view class="info-row info-row1">
        <text class="info-label">报名方式：</text>
        <text class="info-value">{{registrationMethodText || '—'}}</text>
      </view>
      <view class="info-row info-row1">
        <text class="info-label">收费模式：</text>
        <view class="info-value info-value--fee">
          <text class="info-value-txt">{{feeModeLabel}}</text>
          <view wx:if="{{priceDisplay != null}}" class="fee-inline">
            <text class="fee-currency">￥</text>
            <text class="fee-digits">{{priceDisplay}}</text>
          </view>
          <view class="info-i" wx:if="{{priceDisplay != null}}">i</view>
        </view>
      </view>
      <view class="info-row">
        <text class="info-label">报名时间：</text>
        <text class="info-value info-value--wrap">{{registrationStartText}}~{{registrationEndText}}</text>
      </view>
      <view class="info-row" wx:if="{{materialRangeText}}">
        <text class="info-label">上传素材截止时间：</text>
        <text class="info-value info-value--wrap">{{materialRangeText}}</text>
      </view>
      <view class="info-row">
        <text class="info-label">比赛时间：</text>
        <text class="info-value info-value--wrap">{{matchStartText}}~{{matchEndText}}</text>
      </view>
      <view class="info-row" wx:if="{{uploadMaterialRemark}}">
        <text class="info-label">上传素材备注：</text>
        <text class="info-value info-value--wrap">{{uploadMaterialRemark}}</text>
      </view>
      <view class="info-row" wx:if="{{eventAddress}}">
        <text class="info-label">赛事地址：</text>
        <text class="info-value info-value--wrap">{{eventAddress}}</text>
      </view>
    </view>

    <view class="notice-card" wx:if="{{hasNoticeBlock}}">
      <view class="card-head card-head--notice">
        <view class="card-icon card-icon--speaker">
          <image class="icon-img" src="https://yuedong-wechatapplet.oss-cn-shanghai.aliyuncs.com/static/event_miniapp/event-1.png" mode="aspectFit" />
        </view>
        <text class="card-head-title">赛事须知</text>
      </view>
      <view class="notice-body">
        <view class="notice-p" wx:if="{{refundRulesText}}">
          <text class="notice-strong">退款规则：</text>
          <text class="notice-text">{{refundRulesText}}</text>
        </view>
        <view class="notice-row" wx:if="{{participationPointsLabel}}">
          <text class="notice-strong">参与积分：</text>
          <text class="notice-text">{{participationPointsLabel}}</text>
        </view>
        <view class="notice-ranking" wx:if="{{rankingPointsLines.length}}">
          <text class="notice-strong">名次积分：</text>
          <view class="ranking-lines">
            <text class="notice-text ranking-line" wx:for="{{rankingPointsLines}}" wx:for-index="ri" wx:key="ri">{{item}}</text>
          </view>
        </view>
      </view>
    </view>

    <view class="section-with-bullet" wx:if="{{hasRegistrationLimit || projectTableRows.length}}">
      <view class="section-head">
        <view class="section-bullet" />
        <text class="section-title">限报与项目</text>
      </view>

      <view class="section-stack limit-card">
        <view class="" wx:if="{{hasRegistrationLimit}}">
          <view class="card-head card-head--limit">
            <view class="card-icon card-icon--speaker">
            <image class="icon-img" src="https://yuedong-wechatapplet.oss-cn-shanghai.aliyuncs.com/static/event_miniapp/event-2.png" mode="aspectFit" />
            </view>
            <text class="card-head-title">报名限制</text>
          </view>
          <view class="limit-list">
            <view class="limit-item" wx:for="{{registrationLimitLines}}" wx:for-index="idx" wx:key="idx">
              <text class="limit-num">({{idx + 1}})</text>
              <text class="limit-text">{{item}}</text>
            </view>
          </view>
        </view>

        <view class="project-panel" wx:if="{{projectTableRows.length}}">
          <view class="card-head card-head--project">
            <view class="card-icon card-icon--doc">
            <image class="icon-img" src="https://yuedong-wechatapplet.oss-cn-shanghai.aliyuncs.com/static/event_miniapp/event-3.png" mode="aspectFit" />
            </view>
            <text class="card-head-title">项目列表</text>
          </view>
          <view class="table-wrap">
            <view class="table-head">
              <text class="th th-type">类型</text>
              <text class="th th-proj">项目</text>
              <text class="th th-group">组别</text>
              <text class="th th-fee">费用（元）</text>
            </view>
            <view class="table-body">
              <view class="tr" wx:for="{{projectTableRows}}" wx:key="rowKey">
                <text class="td td-type">{{item.typeName}}</text>
                <text class="td td-proj">{{item.projectName}}</text>
                <text class="td td-group">{{item.groupName}}</text>
                <text class="td td-fee">{{item.fee}}</text>
              </view>
            </view>
          </view>
        </view>
      </view>
    </view>

    <view class="section-with-bullet" wx:if="{{introductionText || introImage}}">
      <view class="section-head">
        <view class="section-bullet" />
        <text class="section-title">赛事简介</text>
      </view>
      <view class="intro-block">
        <text class="intro-text" wx:if="{{introductionText}}">{{introductionText}}</text>
        <image wx:if="{{introImage}}" class="intro-image" src="{{introImage}}" mode="widthFix" />
      </view>
    </view>

    <view class="participant-section" wx:if="{{unitGroups.length > 0}}">
      <view class="participant-head">
        <view class="participant-hex" />
        <text class="participant-title">参与单位</text>
      </view>
      <view class="participant-card">
        <view class="participant-row" wx:for="{{unitGroups}}" wx:key="label">
          <text class="participant-label">{{item.label}}：</text>
          <view class="participant-names">
            <text class="participant-value" wx:for="{{item.names}}" wx:for-item="name" wx:key="*this">{{name}}</text>
          </view>
        </view>
      </view>
    </view>
  </view>

  <view class="bottom-bar">
    <button
      class="apply-btn {{canApply ? '' : 'apply-btn--disabled'}}"
      type="primary"
      disabled="{{!canApply}}"
      bindtap="onApplyTap"
    >{{applyButtonText}}</button>
  </view>
</view>