<view class="detail-page {{pageClass}}">
  <custom-nav padding-x="42">
    <view class="detail-nav">
      <view class="nav-back" bindtap="handleBack"><text></text></view>
      <text class="nav-title">{{pageTitle}}</text>
      <view class="nav-placeholder"></view>
    </view>
  </custom-nav>

  <view class="detail-content">
    <block wx:if="{{isFailed}}">
      <view class="failure-alert">
        <view class="alert-icon">!</view>
        <view class="alert-copy">
          <text class="alert-title">本次生成失败</text>
          <text class="alert-desc">{{detail.failureMessage}}</text>
        </view>
      </view>

      <view class="info-card fail-info-card">
        <view class="info-row"><text class="info-label">失败时间</text><text class="info-value">{{detail.failureDisplayTime}}</text></view>
        <view class="info-row"><text class="info-label">数字人形象</text><view class="value-with-thumb"><image class="mini-avatar icon-placeholder" src="{{detail.avatarImage}}" mode="aspectFit"></image><text>{{detail.avatar.name}}</text></view></view>
        <view class="info-row"><text class="info-label">背景模板</text><view class="value-with-thumb"><image class="mini-scene living-scene icon-placeholder" src="{{detail.backgroundImage}}" mode="aspectFit"></image><text>{{detail.background.name}}</text></view></view>
        <view class="info-row"><text class="info-label">音色状态</text><view class="voice-error"><text class="error-dot">未</text><text>{{detail.voice.name}}</text></view></view>
        <view class="info-row reason-row"><text class="info-label">失败原因</text><text class="reason-text">{{detail.failureMessage}}</text></view>
      </view>

      <view class="advice-card"><view class="advice-head"><image class="bulb-icon icon-placeholder" src="/static/images/my/image.png" mode="aspectFit"></image><text>建议</text></view><text class="advice-text">建议检查数字人形象、音色和口播文案后重新生成。</text></view>
      <view class="primary-action" bindtap="handleRetry">重新生成</view>
      <view class="outline-action" bindtap="handleRecordVoice"><image class="voice-icon icon-placeholder" src="/static/images/my/image.png" mode="aspectFit"></image><text>重新录取音色</text></view>
      <view class="delete-link" bindtap="handleDelete">删除记录</view>
    </block>

    <block wx:elif="{{isProcessing}}">
      <view class="processing-card">
        <view class="processing-head">
          <view class="ai-visual"><view class="ai-box">AI</view><view class="ai-base"></view></view>
          <view class="processing-copy">
            <text class="processing-title">AI 正在生成中</text>
            <text class="processing-desc">请耐心等待，精彩内容即将呈现</text>
            <view class="progress-row"><view class="progress-track"><view class="progress-fill" style="{{progressStyle}}"></view></view><text>{{detail.progress}}%</text></view>
          </view>
        </view>
        <view class="stage-row">
          <view wx:for="{{detail.steps}}" wx:key="code" class="stage-item {{item.status === 2 ? 'done' : item.status === 1 ? 'active' : ''}}"><view class="stage-dot {{item.status === 1 ? 'loading' : item.status === 0 ? 'empty' : ''}}"><text wx:if="{{item.status === 2}}"></text></view><text>{{item.name}}</text></view>
        </view>
      </view>

      <view class="info-card processing-info-card">
        <view class="info-row"><text class="info-label">任务ID</text><text class="info-value">{{detail.taskDisplayId}}</text></view>
        <view class="info-row"><text class="info-label">数字人形象</text><view class="value-with-thumb"><image class="mini-avatar icon-placeholder" src="{{detail.avatarImage}}" mode="aspectFit"></image><text>{{detail.avatar.name}}</text></view></view>
        <view class="info-row"><text class="info-label">背景模板</text><view class="value-with-thumb"><image class="mini-scene product-scene icon-placeholder" src="{{detail.backgroundImage}}" mode="aspectFit"></image><text>{{detail.background.name}}</text></view></view>
        <view class="info-row"><text class="info-label">音色</text><view class="value-with-thumb"><image class="audio-thumb icon-placeholder" src="/static/images/my/image.png" mode="aspectFit"></image><text>{{detail.voice.name}}</text></view></view>
        <view class="info-row"><text class="info-label">创建时间</text><view class="value-with-thumb"><image class="clock-icon icon-placeholder" src="/static/images/my/image.png" mode="aspectFit"></image><text>{{detail.createTime}}</text></view></view>
      </view>

      <view class="primary-action" bindtap="handleBackToHistory">返回创作记录</view>
      <view class="outline-action" bindtap="handleCancel">取消任务</view>
      <view class="bottom-tip"><image class="bulb-icon icon-placeholder" src="/static/images/my/image.png" mode="aspectFit"></image><text>生成完成后会自动保存到创作记录</text></view>
    </block>

    <block wx:else>
      <view class="video-card scene-live"><image class="speaker-avatar icon-placeholder" src="{{detail.videoCover}}" mode="aspectFit"></image><image class="play-circle icon-placeholder" src="/static/images/my/image.png" mode="aspectFit"></image><view class="duration-badge">{{detail.duration}}</view></view>

      <view class="info-card work-info-card">
        <view class="info-row"><text class="info-label">创作状态</text><text class="status-done">{{detail.statusText}}</text></view>
        <view class="info-row"><text class="info-label">生成时间</text><text class="info-value">{{detail.successTime}}</text></view>
        <view class="info-row"><text class="info-label">数字人形象</text><view class="value-with-thumb"><image class="mini-avatar icon-placeholder" src="{{detail.avatarImage}}" mode="aspectFit"></image><text>{{detail.avatar.name}}</text></view></view>
        <view class="info-row"><text class="info-label">背景模板</text><view class="value-with-thumb"><image class="mini-scene live-scene icon-placeholder" src="{{detail.backgroundImage}}" mode="aspectFit"></image><text>{{detail.background.name}}</text></view></view>
        <view class="info-row"><text class="info-label">音色</text><view class="value-with-thumb"><image class="audio-thumb icon-placeholder" src="/static/images/my/image.png" mode="aspectFit"></image><text>{{detail.voice.name}}</text></view></view>
        <view class="info-row copy-row"><text class="info-label">口播文案</text><view class="copy-content"><text>{{detail.scriptDisplayText}}</text><view class="view-copy" bindtap="handleViewCopy">复制文案 <text></text></view></view></view>
      </view>

      <view class="action-buttons"><view class="download-action" bindtap="handleDownload"><image class="download-icon icon-placeholder" src="/static/images/my/image.png" mode="aspectFit"></image><text>下载视频</text></view><view class="outline-action small" bindtap="handleRetry"><image class="refresh-icon icon-placeholder" src="/static/images/my/image.png" mode="aspectFit"></image><text>重新生成</text></view><view class="outline-action small" bindtap="handleEdit"><image class="edit-icon icon-placeholder" src="/static/images/my/image.png" mode="aspectFit"></image><text>继续编辑</text></view></view>
      <view class="related-card"><text class="related-title">相关操作</text><view class="related-item" bindtap="handleCopyText"><image class="copy-icon icon-placeholder" src="/static/images/my/image.png" mode="aspectFit"></image><text>复制文案</text><text class="item-arrow"></text></view><view class="related-item" bindtap="handleSame"><image class="refresh-icon icon-placeholder" src="/static/images/my/image.png" mode="aspectFit"></image><text>再次生成同款</text><text class="item-arrow"></text></view><view class="related-item danger" bindtap="handleDelete"><image class="trash-icon icon-placeholder" src="/static/images/my/image.png" mode="aspectFit"></image><text>删除记录</text><text class="item-arrow"></text></view></view>
    </block>
  </view>
</view>

