<!-- 助教看板页 — 忠于 H5 原型结构 -->

<!-- 加载态（toast 浮层，不白屏） -->
<view class="g-toast-loading" wx:if="{{pageState === 'loading'}}">
  <view class="g-toast-loading-inner">
    <t-loading theme="circular" size="40rpx" />
    <text class="g-toast-loading-text">加载中...</text>
  </view>
</view>

<!-- 空状态 -->
<view class="page-empty" wx:elif="{{pageState === 'empty'}}">
  <t-empty description="暂无助教数据" />
</view>

<!-- 错误态 -->
<view class="page-error" wx:elif="{{pageState === 'error'}}">
  <t-empty description="加载失败" />
  <view class="retry-btn" bindtap="onRetry">点击重试</view>
</view>

<!-- 正常态 -->
<block wx:else>
  <!-- 顶部看板 Tab -->
  <view class="board-tabs">
    <view class="board-tab" data-tab="finance" bindtap="onTabChange">
      <text>财务</text>
    </view>
    <view class="board-tab" data-tab="customer" bindtap="onTabChange">
      <text>客户</text>
    </view>
    <view class="board-tab board-tab--active" data-tab="coach">
      <text>助教</text>
    </view>
  </view>

  <!-- 筛选区域 -->
  <view class="filter-bar {{filterBarVisible ? '' : 'filter-bar--hidden'}}">
    <view class="filter-bar-inner">
      <view class="filter-item filter-item--wide">
        <filter-dropdown label="定档业绩最高" options="{{sortOptions}}" value="{{selectedSort}}" bind:change="onSortChange" />
      </view>
      <view class="filter-item">
        <filter-dropdown label="不限" options="{{skillOptions}}" value="{{selectedSkill}}" bind:change="onSkillChange" />
      </view>
      <view class="filter-item">
        <filter-dropdown label="本月" options="{{timeOptions}}" value="{{selectedTime}}" bind:change="onTimeChange" />
      </view>
    </view>
  </view>

  <!-- 助教列表 -->
  <view class="coach-list">
    <view class="coach-card" wx:for="{{coaches}}" wx:key="id" data-id="{{item.id}}" bindtap="onCoachTap" hover-class="coach-card--hover">
      <view class="card-row">
        <!-- 头像 -->
        <view class="card-avatar avatar-{{item.avatarGradient}}">
          <text class="avatar-text">{{item.initial}}</text>
        </view>

        <!-- 信息区 -->
        <view class="card-info">
          <!-- 第一行：姓名 + 等级 + 技能 + 右侧指标 -->
          <view class="card-name-row">
            <text class="card-name">{{item.name}}</text>
            <coach-level-tag level="{{item.level}}" shadowColor="rgba(0,0,0,0)" />
            <text class="skill-tag {{skill.cls}}" wx:for="{{item.skills}}" wx:for-item="skill" wx:key="text">{{skill.text}}</text>

            <!-- 定档业绩维度 -->
            <view class="card-right" wx:if="{{dimType === 'perf'}}">
              <text class="right-text">定档 <text class="right-highlight">{{item.perfHoursLabel}}</text></text>
              <text class="right-sub" wx:if="{{item.perfHoursBeforeLabel}}">折前 <text class="right-sub-val">{{item.perfHoursBeforeLabel}}</text></text>
            </view>

            <!-- 工资维度 -->
            <view class="card-right" wx:elif="{{dimType === 'salary'}}">
              <text class="salary-tag">预估</text>
              <text class="salary-amount">{{item.salaryLabel}}</text>
            </view>

            <!-- 客源储值维度 -->
            <view class="card-right" wx:elif="{{dimType === 'sv'}}">
              <text class="right-sub">储值</text>
              <text class="salary-amount">{{item.svAmountLabel}}</text>
            </view>

            <!-- 任务维度 -->
            <view class="card-right" wx:elif="{{dimType === 'task'}}">
              <text class="right-text">召回 <text class="right-highlight">{{item.taskRecallLabel}}</text></text>
            </view>
          </view>

          <!-- 第二行：客户列表 + 右侧补充 -->
          <view class="card-bottom-row">
            <view class="customer-list">
              <block wx:for="{{item.topCustomers}}" wx:for-item="cust" wx:for-index="custIdx" wx:key="*this">
                <text class="customer-item" wx:if="{{dimType !== 'sv' || custIdx < 2}}">{{cust}}</text>
              </block>
            </view>

            <!-- 定档业绩：距升档/已达标 -->
            <text class="bottom-right bottom-right--warning" wx:if="{{dimType === 'perf' && !item.perfReached}}">{{item.perfGap}}</text>
            <text class="bottom-right bottom-right--success" wx:elif="{{dimType === 'perf' && item.perfReached}}">✅ 已达标</text>

            <!-- 工资：定档/折前 -->
            <view class="bottom-right-group" wx:elif="{{dimType === 'salary'}}">
              <text class="bottom-perf">定档 <text class="bottom-perf-val">{{item.salaryPerfHoursLabel}}</text></text>
              <text class="bottom-sub" wx:if="{{item.salaryPerfBeforeLabel}}">折前 <text class="bottom-sub-val">{{item.salaryPerfBeforeLabel}}</text></text>
            </view>

            <!-- 客源储值：客户数 | 消耗 -->
            <view class="bottom-right-group" wx:elif="{{dimType === 'sv'}}">
              <text class="bottom-sub">客户 <text class="bottom-perf-val">{{item.svCustomerCountLabel}}</text></text>
              <text class="bottom-divider">|</text>
              <text class="bottom-sub">消耗 <text class="bottom-perf-val">{{item.svConsumeLabel}}</text></text>
            </view>

            <!-- 任务：回访数 -->
            <text class="bottom-sub" wx:elif="{{dimType === 'task'}}">回访 <text class="bottom-perf-val">{{item.taskCallbackLabel}}</text></text>
          </view>
        </view>
      </view>
    </view>
  </view>

  <!-- 底部安全区（为自定义导航栏留空间） -->
  <view class="safe-bottom"></view>
</block>

<!-- 自定义底部导航栏 -->
<board-tab-bar active="board" />

<!-- AI 悬浮按钮 — 在导航栏上方 -->
<ai-float-button />

<dev-fab wx:if="{{false}}" />