qt_books/pages/audio/audio.wxml

<!--pages/audio/audio.wxml-->
<view class="container" wx:if="{{!loading && audio}}">
  <!-- 封面和标题 -->
  <view class="header">
    <image class="cover" src="/images/default-cover.png" mode="aspectFill"></image>
    <view class="title">{{audio.chapterTitle}}</view>
    <view class="narrator" wx:if="{{audio.narrator}}">播讲：{{audio.narrator}}</view>
  </view>

  <!-- 播放进度 -->
  <view class="progress-section">
    <text class="time-text">{{formatTime(currentTime)}}</text>
    <slider 
      class="progress-slider"
      min="0"
      max="{{duration || 100}}"
      value="{{currentTime}}"
      step="1"
      bindchange="onSeek"
      activeColor="#667eea"
      backgroundColor="#e0e0e0"
      block-color="#667eea"
    />
    <text class="time-text">{{formatTime(duration)}}</text>
  </view>

  <!-- 播放控制 -->
  <view class="controls">
    <view class="control-btn" bindtap="prevChapter">
      <text class="icon">◀◀</text>
      <text class="label">上一章</text>
    </view>
    <view class="control-btn play-btn" bindtap="togglePlay">
      <text class="icon">{{playing ? '⏸' : '▶'}}</text>
    </view>
    <view class="control-btn" bindtap="nextChapter">
      <text class="icon">▶▶</text>
      <text class="label">下一章</text>
    </view>
  </view>

  <!-- 播放设置 -->
  <view class="settings">
    <view class="setting-item">
      <text class="setting-label">播放速度</text>
      <slider 
        class="speed-slider"
        min="0.5"
        max="2.0"
        step="0.25"
        value="{{speed}}"
        bindchange="changeSpeed"
        activeColor="#fff"
        backgroundColor="rgba(255,255,255,0.3)"
      />
      <text class="speed-text">{{speed}}x</text>
    </view>
    <view class="setting-item">
      <button class="chapter-list-btn" bindtap="showChapterList">查看目录</button>
    </view>
  </view>
</view>

<view class="loading" wx:if="{{loading}}">
  <text>加载中...</text>
</view>