lrj
19 小时以前 ae3349d2ff53767b5bc9cb30e1bf7e15f9e814ee
wx/pages/activity/detail.wxml
@@ -1,119 +1,70 @@
<!--pages/activity/detail.wxml-->
<view class="container" wx:if="{{!loading && activity}}">
  <!-- 头部媒体区域 -->
  <view class="media-section">
    <swiper
      class="media-swiper"
      indicator-dots="{{mediaFiles.length > 1}}"
      autoplay="{{false}}"
      duration="{{500}}"
    >
      <swiper-item
        wx:for="{{mediaFiles}}"
        wx:key="url"
        bindtap="onMediaTap"
        data-index="{{index}}"
      >
        <image
          wx:if="{{item.type === 'image'}}"
          class="media-image"
          src="{{item.url}}"
          mode="aspectFill"
        />
        <view wx:if="{{item.type === 'video'}}" class="video-wrapper">
          <image class="video-poster" src="{{item.url}}" mode="aspectFill" />
          <view class="video-play-btn">▶</view>
        </view>
<wxs src="./detail.wxs" module="filters" />
<view class="container">
  <view wx:if="{{loading}}" class="loading-wrapper">
    <view class="loading"></view>
    <text>加载中...</text>
  </view>
  <view wx:elif="{{error}}" class="error-wrapper">
    <text>{{error}}</text>
  </view>
  <block wx:else>
    <!-- 顶部 Banner -->
    <swiper class="banner-swiper" indicator-dots="{{true}}" autoplay="{{true}}">
      <swiper-item wx:if="{{activity.coverImage}}">
        <image class="banner-image" src="{{activity.coverImage.fullUrl}}" mode="aspectFill" />
      </swiper-item>
      <swiper-item wx:for="{{activity.images}}" wx:key="index">
        <image class="banner-image" src="{{item.fullUrl}}" mode="aspectFill" />
      </swiper-item>
    </swiper>
    <!-- 状态标签 -->
    <view class="status-badge {{getStatusClass(activity.state)}}">
      {{getStatusText(activity.state)}}
    </view>
  </view>
  <!-- 基本信息 -->
  <view class="info-section card">
    <view class="card-body">
      <view class="activity-title">{{activity.name}}</view>
      <view class="activity-desc">{{activity.description}}</view>
      <!-- 时间信息 -->
      <view class="time-info">
        <view class="time-item">
          <view class="time-label">活动时间</view>
          <view class="time-value">{{activity.formattedMatchTime || '待定'}}</view>
        </view>
        <view class="time-item">
          <view class="time-label">报名截止</view>
          <view class="time-value">{{activity.formattedSignupDeadline || '待定'}}</view>
    <view class="content-wrapper">
      <!-- 比赛信息 -->
      <view class="section-card">
        <view class="section-title main-title">{{activity.name}}</view>
        <view class="info-grid">
          <view class="info-row">
            <text class="info-label">报名截止时间</text>
            <text class="info-value">{{filters.formatDateTime(activity.signupDeadline)}}</text>
          </view>
          <view class="info-row">
            <text class="info-label">比赛开始时间</text>
            <text class="info-value">{{filters.formatDateTime(activity.matchTime)}}</text>
          </view>
        </view>
      </view>
      <!-- 地点信息 -->
      <view class="location-info" wx:if="{{activity.address}}">
        <view class="location-label">📍 活动地点</view>
        <view class="location-value">
          <text class="address">{{activity.address}}</text>
      <!-- 比赛阶段 -->
      <view class="section-card" wx:if="{{activity.stages && activity.stages.length > 0}}">
        <view class="section-title">比赛阶段</view>
        <view class="timeline">
          <view class="timeline-item" wx:for="{{activity.stages}}" wx:key="id">
            <view class="timeline-icon">
              <view class="icon-calendar-bg"></view>
            </view>
            <view class="timeline-content">
              <view class="stage-name">{{item.name}}</view>
              <view class="stage-date">{{filters.formatDate(item.matchTime)}}</view>
            </view>
          </view>
        </view>
      </view>
      <!-- 报名进度 -->
      <view class="registration-progress" wx:if="{{activity.playerMax > 0}}">
        <view class="progress-header">
          <view class="progress-label">报名进度</view>
          <view class="progress-count">{{currentParticipants}}/{{activity.playerMax}}</view>
      <!-- 比赛介绍 -->
      <view class="section-card" wx:if="{{activity.description}}">
        <view class="section-title">比赛介绍</view>
        <view class="description-content">
          <text>{{activity.description}}</text>
        </view>
        <view class="progress-bar">
          <view
            class="progress-fill"
            style="width: {{getRegistrationProgress()}}%"
          ></view>
        </view>
        <view class="progress-percent">{{getRegistrationProgress()}}%</view>
      </view>
    </view>
  </view>
  <!-- 底部操作栏 -->
  <view class="bottom-actions">
    <view class="action-left">
      <view class="share-btn" bindtap="onShareTap">
        <text class="share-icon">📤</text>
        <text class="share-text">分享</text>
      </view>
    </view>
    <view class="action-right">
      <!-- 统一的报名按钮 -->
      <view
        class="register-btn btn {{registerButtonDisabled ? 'btn-disabled' : (canRegisterStatus ? 'btn-primary' : 'btn-secondary')}}"
        bindtap="onRegisterTap"
      >
        {{registerButtonText}}
      </view>
    <!-- 底部操作栏 -->
    <view class="footer-actions">
      <button class="register-btn" bindtap="handleRegister" disabled="{{buttonDisabled}}">{{buttonText}}</button>
    </view>
  </view>
</view>
<!-- 加载状态 -->
<view class="loading-wrapper" wx:if="{{loading}}">
  <view class="loading"></view>
  <text class="loading-text">加载中...</text>
</view>
<!-- 视频预览弹窗 -->
<view class="media-preview-modal" wx:if="{{showMediaPreview}}" bindtap="closeMediaPreview">
  <view class="modal-content" catchtap="">
    <video
      class="preview-video"
      src="{{mediaFiles[currentMediaIndex].url}}"
      controls="{{true}}"
      autoplay="{{true}}"
    ></video>
    <view class="close-btn" bindtap="closeMediaPreview">✕</view>
  </view>
  </block>
</view>