kydc/progress/progress-list/progress-list.wxml

<view class="page">
  <view class="bg-orb bg-orb-right"></view>
  <view class="bg-orb bg-orb-left"></view>

  <scroll-view scroll-y class="content">
    <view class="header">
      <text class="title">复习档案</text>
      <text class="subtitle">您的词汇神经元网络正在构建中。</text>
    </view>

    <view class="tabs">
      <view class="tab tab-active">
        <text class="tab-label">待复习</text>
      </view>
      <view class="tab">
        <text class="tab-label">已掌握</text>
      </view>
    </view>

    <view wx:if="{{loading}}" class="empty-state">
      <text class="empty-title">加载中...</text>
      <text class="empty-subtitle">正在同步进度数据</text>
    </view>

    <view wx:elif="{{error}}" class="error-banner">
      <text class="error-text">{{error}}</text>
    </view>

    <view wx:else>
      <view class="section">
        <view class="section-head" bindtap="toggleSection" data-key="reviewWordCollapsed">
          <view class="section-title-wrap">
            <text class="section-pill section-pill-pink">待复习</text>
            <text class="section-title">单词</text>
          </view>
          <view class="section-toggle-chip {{reviewWordCollapsed ? 'collapsed' : 'expanded'}}">
            <text class="section-toggle-text">{{reviewWordCollapsed ? '展开' : '收起'}}</text>
          </view>
        </view>
        <view wx:if="{{!reviewWordCollapsed}}" class="grid">
          <block wx:for="{{reviewWords}}" wx:key="id">
            <view class="card card-pink">
              <view class="card-glow card-glow-pink"></view>
              <view class="card-head">
                <view>
                  <text class="word word-large">{{item.en_text}}</text>
                  <text class="desc desc-spaced">{{item.zh_text}}</text>
                </view>
                <view class="badge badge-pink">🔥</view>
              </view>
              <view class="progress-meta">
                <text class="progress-label">神经元连接强度</text>
                <text class="progress-value progress-pink">{{item.mastery_score}}%</text>
              </view>
              <view class="progress-track">
                <view class="progress-fill progress-fill-pink" style="width: {{item.mastery_score}}%;"></view>
              </view>
            </view>
          </block>
        </view>
      </view>

      <view class="section">
        <view class="section-head" bindtap="toggleSection" data-key="reviewSentenceCollapsed">
          <view class="section-title-wrap">
            <text class="section-pill section-pill-cyan">待复习</text>
            <text class="section-title">句子</text>
          </view>
          <view class="section-toggle-chip {{reviewSentenceCollapsed ? 'collapsed' : 'expanded'}}">
            <text class="section-toggle-text">{{reviewSentenceCollapsed ? '展开' : '收起'}}</text>
          </view>
        </view>
        <view wx:if="{{!reviewSentenceCollapsed}}" class="grid">
          <block wx:for="{{reviewSentences}}" wx:key="id">
            <view class="card card-cyan">
              <view class="card-glow card-glow-cyan"></view>
              <view class="card-head">
                <view>
                  <text class="word word-large">{{item.en_text}}</text>
                  <text class="desc desc-spaced">{{item.zh_text}}</text>
                </view>
                <view class="badge badge-cyan">📝</view>
              </view>
              <view class="progress-meta">
                <text class="progress-label">神经元连接强度</text>
                <text class="progress-value progress-cyan">{{item.mastery_score}}%</text>
              </view>
              <view class="progress-track">
                <view class="progress-fill progress-fill-cyan" style="width: {{item.mastery_score}}%;"></view>
              </view>
            </view>
          </block>
        </view>
      </view>

      <view class="section">
        <view class="section-head" bindtap="toggleSection" data-key="masteredWordCollapsed">
          <view class="section-title-wrap">
            <text class="section-pill section-pill-cyan">已掌握</text>
            <text class="section-title">单词</text>
          </view>
          <view class="section-toggle-chip {{masteredWordCollapsed ? 'collapsed' : 'expanded'}}">
            <text class="section-toggle-text">{{masteredWordCollapsed ? '展开' : '收起'}}</text>
          </view>
        </view>
        <view wx:if="{{!masteredWordCollapsed}}" class="grid">
          <block wx:for="{{masteredWords}}" wx:key="id">
            <view class="card card-cyan">
              <view class="card-glow card-glow-cyan"></view>
              <view class="card-head">
                <view>
                  <text class="word word-large">{{item.en_text}}</text>
                  <text class="desc desc-spaced">{{item.zh_text}}</text>
                </view>
                <view class="badge badge-cyan">✓</view>
              </view>
              <view class="progress-meta">
                <text class="progress-label">神经元连接强度</text>
                <text class="progress-value progress-cyan">{{item.mastery_score}}%</text>
              </view>
              <view class="progress-track">
                <view class="progress-fill progress-fill-cyan" style="width: {{item.mastery_score}}%;"></view>
              </view>
            </view>
          </block>
        </view>
      </view>

      <view class="section">
        <view class="section-head" bindtap="toggleSection" data-key="masteredSentenceCollapsed">
          <view class="section-title-wrap">
            <text class="section-pill section-pill-pink">已掌握</text>
            <text class="section-title">句子</text>
          </view>
          <view class="section-toggle-chip {{masteredSentenceCollapsed ? 'collapsed' : 'expanded'}}">
            <text class="section-toggle-text">{{masteredSentenceCollapsed ? '展开' : '收起'}}</text>
          </view>
        </view>
        <view wx:if="{{!masteredSentenceCollapsed}}" class="grid">
          <block wx:for="{{masteredSentences}}" wx:key="id">
            <view class="card card-pink">
              <view class="card-glow card-glow-pink"></view>
              <view class="card-head">
                <view>
                  <text class="word word-large">{{item.en_text}}</text>
                  <text class="desc desc-spaced">{{item.zh_text}}</text>
                </view>
                <view class="badge badge-pink">✓</view>
              </view>
              <view class="progress-meta">
                <text class="progress-label">神经元连接强度</text>
                <text class="progress-value progress-pink">{{item.mastery_score}}%</text>
              </view>
              <view class="progress-track">
                <view class="progress-fill progress-fill-pink" style="width: {{item.mastery_score}}%;"></view>
              </view>
            </view>
          </block>
        </view>
      </view>

      <view wx:if="{{!reviewList.length && !masteredList.length}}" class="empty-state small">
        <text class="empty-title">暂无进度内容</text>
      </view>
    </view>
  </scroll-view>
</view>