feat: 支持上课统计功能；优化会员管理默认筛选状态

packages/app/src/pages.json

@@ -3,6 +3,7 @@
     "autoscan": true
   },
   "pages": [
+    { "path": "pages/admin/analytics", "style": { "navigationStyle": "custom", "enablePullDownRefresh": true } },
     {
       "path": "pages/home/index",
       "style": {

packages/app/src/pages/admin/analytics.vue

@@ -0,0 +1,279 @@
+<template>
+  <view class="report" :style="{ paddingTop: navBarHeight }">
+    <CustomNavBar title="统计分析" show-back />
+    <view class="intro">
+      <text class="eyebrow">PILATES · MONTHLY REVIEW</text>
+      <text class="title">每一节课，都有迹可循。</text>
+      <text class="muted">工作室月度统计 · 按课程日期归档</text>
+    </view>
+    <view class="month-nav">
+      <button aria-label="上个月" :disabled="month === '2000-01'" @tap="shiftMonth(-1)">‹</button>
+      <picker mode="date" fields="month" :value="month" start="2000-01" end="2099-12" @change="changeMonth($event.detail.value)">
+        <view class="month-label">{{ month.replace('-', ' 年 ') }} 月 ⌄</view>
+      </picker>
+      <button aria-label="下个月" :disabled="month === '2099-12'" @tap="shiftMonth(1)">›</button>
+    </view>
+    <view class="toolbar">
+      <button v-if="month !== currentMonth" @tap="changeMonth(currentMonth)">回到本月</button>
+      <text v-else>本月持续更新</text>
+      <button :disabled="loading" @tap="load">刷新数据 ↻</button>
+    </view>
+    <view v-if="!loggedIn || !isAdmin" class="empty">仅登录后的管理员可查看教学统计</view>
+    <view v-else-if="loading" class="empty">正在整理这个月的上课记录…</view>
+    <view v-else-if="error" class="empty"><text>{{ error }}</text><button class="outline" @tap="load">重新加载</button></view>
+    <template v-else-if="report">
+      <view class="hero">
+        <text class="hero-label">已上课程</text>
+        <view class="hero-number">{{ report.summary.sessions }}<text>节</text></view>
+        <text class="hero-note">{{ report.previousMonth }} 全月 {{ report.previous.sessions }} 节 · {{ month === currentMonth ? '本月尚未结束' : '按完整自然月统计' }}</text>
+        <view class="hero-footer">
+          <view><text class="metric">{{ hours(report.summary.minutes) }}</text><text>授课小时</text></view>
+          <view><text class="metric">{{ report.summary.teachingDays }}</text><text>上课天数</text></view>
+          <view><text class="metric">{{ average }}</text><text>人均上课次数</text></view>
+        </view>
+      </view>
+      <view class="metrics">
+        <view><text class="metric">{{ report.summary.attendances }}<text class="unit">人次</text></text><text>已完成上课</text></view>
+        <view><text class="metric">{{ report.summary.students }}<text class="unit">人</text></text><text>本月上课学员</text></view>
+      </view>
+      <button v-if="reviewCount" class="notice" @tap="showReview"><text>{{ reviewCount }} 条已过结束时间的预约仍待处理</text><text>核对明细 ›</text></button>
+      <view v-if="!report.records.length" class="empty compact">这个月暂无预约记录，可切换月份查看历史教学情况。</view>
+      <view class="section">
+        <view class="heading"><text>上课日历</text><text class="muted small">数字为已完成课程节数</text></view>
+        <view class="calendar">
+          <text v-for="label in weekdays" :key="label" class="weekday">{{ label }}</text>
+          <view v-for="n in offset" :key="`blank-${n}`" />
+          <button v-for="day in days" :key="day.date" class="day" :class="{ taught: day.count > 0, selected: selectedDate === day.date }" :aria-label="`${day.date}，已上${day.count}节`" @tap="selectDay(day.date)">
+            <text>{{ day.day }}</text><text class="day-count">{{ day.count ? `${day.count}节` : '·' }}</text>
+          </button>
+        </view>
+        <text class="footnote">点击日期查看当天明细，再次点击取消筛选</text>
+      </view>
+      <view class="section">
+        <view class="heading"><text>学员上课排行</text><text class="muted small">已完成 · {{ students.length }} 人</text></view>
+        <input v-model="search" class="search" placeholder="搜索学员姓名" :maxlength="60" @input="studentLimit = 10" />
+        <text v-if="!filteredStudents.length" class="footnote">{{ search ? '没有匹配的上课学员' : '本月还没有已完成的上课记录' }}</text>
+        <button v-for="(student, index) in filteredStudents.slice(0, studentLimit)" :key="student.id" class="student-row" @tap="selectStudent(student)">
+          <text class="rank">{{ String(index + 1).padStart(2, '0') }}</text>
+          <view class="student-main">
+            <text class="student-name">{{ student.name }}</text>
+            <view class="track"><view class="fill" :style="{ width: `${student.count / maxCount * 100}%` }" /></view>
+            <text class="small muted">{{ student.days }} 天 · 最近 {{ student.last.slice(5) }}</text>
+          </view>
+          <text class="student-count">{{ student.count }}<text class="small"> 次 ›</text></text>
+        </button>
+        <button v-if="filteredStudents.length > studentLimit" class="more" @tap="studentLimit += 10">查看更多学员</button>
+      </view>
+      <view class="section">
+        <view class="heading"><text>上课用卡分布</text><text class="muted small">已完成人次</text></view>
+        <view v-for="card in cards" :key="card.name" class="distribution"><text>{{ card.name }}</text><text>{{ card.count }} 人次 · {{ Math.round(card.count / report.summary.attendances * 100) }}%</text></view>
+        <text v-if="!cards.length" class="footnote">暂无已完成记录</text>
+      </view>
+      <view id="lesson-details" class="section">
+        <view class="heading"><text>上课明细</text><text class="muted small">{{ filteredRecords.length }} 条</text></view>
+        <scroll-view scroll-x class="status-scroll"><view class="status-tabs">
+          <button v-for="item in statuses" :key="item.value" :class="{ active: status === item.value }" @tap="setStatus(item.value)">{{ item.label }} {{ countStatus(item.value) }}</button>
+        </view></scroll-view>
+        <view v-if="selectedDate || selectedStudent || reviewOnly" class="filters">
+          <text>{{ selectedDate || '全月' }}{{ selectedStudent ? ` · ${selectedStudent.name}` : '' }}{{ reviewOnly ? ' · 待核对' : '' }}</text>
+          <button @tap="clearFilters">清除筛选 ×</button>
+        </view>
+        <text v-if="!filteredRecords.length" class="footnote">当前条件下没有上课记录</text>
+        <view v-for="row in filteredRecords.slice(0, detailLimit)" :key="row.id" class="record">
+          <view class="record-top"><button class="record-name" @tap="openMember(row.userId)">{{ row.nickname || '未命名学员' }} ›</button><text class="badge" :class="{ completed: row.status === 'COMPLETED' }">{{ statusName(row.status) }}</text></view>
+          <text class="record-date">{{ row.date.slice(5).replace('-', '月') }}日 · {{ row.startTime }}–{{ row.endTime }}</text>
+          <text class="muted small">{{ row.cardName }}{{ row.needsReview ? ' · 已过结束时间，请核对' : '' }}</text>
+        </view>
+        <button v-if="filteredRecords.length > detailLimit" class="more" @tap="detailLimit += 20">再显示 20 条</button>
+        <text v-else-if="filteredRecords.length" class="footnote">已显示全部 {{ filteredRecords.length }} 条记录</text>
+      </view>
+      <view class="notes">
+        <text class="notes-title">关于这份月报</text>
+        <text>统计整个工作室，暂不区分老师。已上课程按已完成预约的时段去重；同一节课多人参加，只计 1 节课、多人次。授课时长按该时段排课时长计算。</text>
+        <text>“已完成”包含系统自动完成，不代表现场签到。其他状态不计入已上课程；没有日期的历史补录不计入月报。用卡分布按当前卡种名称归类。</text>
+        <text>更新于 {{ updatedLabel }} · 下拉可刷新</text>
+      </view>
+    </template>
+  </view>
+</template>
+
+<script setup lang="ts">
+import { computed, nextTick, ref } from 'vue'
+import { onShow, onPullDownRefresh } from '@dcloudio/uni-app'
+import { storeToRefs } from 'pinia'
+import type { TeachingAnalytics } from '@mp-pilates/shared'
+import CustomNavBar from '../../components/CustomNavBar.vue'
+import { useAdminStore } from '../../stores/admin'
+import { useUserStore } from '../../stores/user'
+import { getSystemLayout } from '../../utils/system'
+import { getErrorMessage } from '../../utils/auth'
+
+const navBarHeight = `${getSystemLayout().navBarHeight}px`
+const { loggedIn, isAdmin } = storeToRefs(useUserStore())
+const store = useAdminStore()
+const currentMonth = ref(chinaMonth())
+const month = ref(currentMonth.value)
+const report = ref<TeachingAnalytics | null>(null)
+const loading = ref(false)
+const error = ref('')
+const selectedDate = ref('')
+const selectedStudent = ref<{ id: string; name: string } | null>(null)
+const status = ref('ALL')
+const reviewOnly = ref(false)
+const search = ref('')
+const studentLimit = ref(10)
+const detailLimit = ref(20)
+let requestId = 0
+const weekdays = ['一', '二', '三', '四', '五', '六', '日']
+const statuses = [
+  { value: 'ALL', label: '全部' }, { value: 'COMPLETED', label: '已完成' },
+  { value: 'CONFIRMED', label: '已确认' }, { value: 'PENDING_CONFIRMATION', label: '待确认' },
+  { value: 'CANCELLED', label: '已取消' }, { value: 'NO_SHOW', label: '未出席' },
+]
+const rows = computed(() => report.value?.records ?? [])
+const completed = computed(() => rows.value.filter(row => row.status === 'COMPLETED'))
+const average = computed(() => report.value?.summary.students ? (report.value.summary.attendances / report.value.summary.students).toFixed(1) : '—')
+const reviewCount = computed(() => rows.value.filter(row => row.needsReview).length)
+const offset = computed(() => (new Date(`${month.value}-01T00:00:00Z`).getUTCDay() + 6) % 7)
+const days = computed(() => {
+  const [year, number] = month.value.split('-').map(Number)
+  const counts = new Map<string, Set<string>>()
+  completed.value.forEach(row => {
+    if (!counts.has(row.date)) counts.set(row.date, new Set())
+    counts.get(row.date)!.add(row.slotId)
+  })
+  return Array.from({ length: new Date(Date.UTC(year, number, 0)).getUTCDate() }, (_, i) => {
+    const date = `${month.value}-${String(i + 1).padStart(2, '0')}`
+    return { date, day: i + 1, count: counts.get(date)?.size ?? 0 }
+  })
+})
+const students = computed(() => {
+  const map = new Map<string, { id: string; name: string; count: number; dates: Set<string>; last: string }>()
+  completed.value.forEach(row => {
+    const student = map.get(row.userId) ?? { id: row.userId, name: row.nickname || '未命名学员', count: 0, dates: new Set<string>(), last: row.date }
+    student.count++
+    student.dates.add(row.date)
+    if (row.date > student.last) student.last = row.date
+    map.set(row.userId, student)
+  })
+  return [...map.values()].map(({ dates, ...student }) => ({ ...student, days: dates.size }))
+    .sort((a, b) => b.count - a.count || a.id.localeCompare(b.id))
+})
+const filteredStudents = computed(() => students.value.filter(student => student.name.toLowerCase().includes(search.value.trim().toLowerCase())))
+const maxCount = computed(() => students.value[0]?.count || 1)
+const cards = computed(() => {
+  const map = new Map<string, number>()
+  completed.value.forEach(row => map.set(row.cardName, (map.get(row.cardName) ?? 0) + 1))
+  return [...map].map(([name, count]) => ({ name, count })).sort((a, b) => b.count - a.count)
+})
+const scopedRecords = computed(() => rows.value.filter(row =>
+  (!selectedDate.value || row.date === selectedDate.value) &&
+  (!selectedStudent.value || row.userId === selectedStudent.value.id) &&
+  (!reviewOnly.value || row.needsReview)))
+const filteredRecords = computed(() => scopedRecords.value.filter(row => status.value === 'ALL' || row.status === status.value).slice().reverse())
+const updatedLabel = computed(() => report.value ? new Date(new Date(report.value.generatedAt).getTime() + 8 * 3600000).toISOString().slice(0, 16).replace('T', ' ') : '')
+
+function chinaMonth() { return new Date(Date.now() + 8 * 3600000).toISOString().slice(0, 7) }
+function hours(minutes: number) { return Number((minutes / 60).toFixed(1)) }
+function countStatus(value: string) { return scopedRecords.value.filter(row => value === 'ALL' || row.status === value).length }
+function statusName(value: string) { return statuses.find(item => item.value === value)?.label ?? value }
+function clearFilters() {
+  selectedDate.value = ''; selectedStudent.value = null; reviewOnly.value = false
+  status.value = 'ALL'; detailLimit.value = 20
+}
+function setStatus(value: string) { status.value = value; detailLimit.value = 20 }
+async function scrollDetails() {
+  await nextTick()
+  uni.pageScrollTo({ selector: '#lesson-details', offsetTop: -getSystemLayout().navBarHeight - 12, duration: 250 })
+}
+function selectDay(date: string) {
+  selectedDate.value = selectedDate.value === date ? '' : date
+  reviewOnly.value = false; detailLimit.value = 20; scrollDetails()
+}
+function selectStudent(student: { id: string; name: string }) {
+  selectedStudent.value = { id: student.id, name: student.name }
+  selectedDate.value = ''; reviewOnly.value = false; setStatus('COMPLETED'); scrollDetails()
+}
+function showReview() { clearFilters(); reviewOnly.value = true; scrollDetails() }
+function openMember(id: string) { uni.navigateTo({ url: `/pages/admin/member-detail?userId=${encodeURIComponent(id)}` }) }
+function shiftMonth(amount: number) {
+  const [year, number] = month.value.split('-').map(Number)
+  changeMonth(new Date(Date.UTC(year, number - 1 + amount, 1)).toISOString().slice(0, 7))
+}
+function changeMonth(value: string) {
+  if (value === month.value || value < '2000-01' || value > '2099-12') return
+  month.value = value; clearFilters(); search.value = ''; studentLimit.value = 10; load()
+}
+async function load() {
+  const id = ++requestId
+  report.value = null; error.value = ''; loading.value = false
+  if (!loggedIn.value || !isAdmin.value) return
+  loading.value = true
+  try {
+    const data = await store.fetchTeachingAnalytics(month.value)
+    if (id === requestId) report.value = data
+  } catch (err) {
+    if (id === requestId) error.value = getErrorMessage(err, '统计暂时无法加载，请重试')
+  } finally {
+    if (id === requestId) loading.value = false
+  }
+}
+onShow(() => { currentMonth.value = chinaMonth(); load() })
+onPullDownRefresh(async () => { try { await load() } finally { uni.stopPullDownRefresh() } })
+</script>
+
+<style scoped lang="scss">
+.report { min-height: 100vh; box-sizing: border-box; background: #f7f5ef; color: #35483e; padding: 0 30rpx calc(48rpx + env(safe-area-inset-bottom)); }
+button { margin: 0; padding: 0; background: transparent; border-radius: 0; font-size: inherit; color: inherit; line-height: 1.5; &::after { border: 0; } &:active { opacity: .65; } }
+.intro { padding: 40rpx 4rpx 28rpx; display: flex; flex-direction: column; gap: 14rpx; }
+.eyebrow { font-size: 18rpx; letter-spacing: 4rpx; color: #687d6e; }
+.title { font-family: 'Songti SC', 'STSong', serif; font-size: 40rpx; line-height: 1.6; }
+.muted { color: #73796f; font-size: 23rpx; }
+.small { font-size: 22rpx; }
+.month-nav { display: flex; justify-content: space-between; align-items: center; border-top: 1rpx solid #d9ddd2; border-bottom: 1rpx solid #d9ddd2; button { width: 80rpx; line-height: 88rpx; font-size: 40rpx; } }
+.month-label { padding: 20rpx; font-size: 33rpx; font-family: 'Songti SC', 'STSong', serif; }
+.toolbar { display: flex; justify-content: space-between; align-items: center; font-size: 22rpx; color: #677765; min-height: 76rpx; button { padding: 16rpx 0; } }
+.hero { background: #344f42; color: #faf7e9; border-radius: 12rpx 12rpx 48rpx 12rpx; padding: 36rpx; }
+.hero-label { font-size: 25rpx; letter-spacing: 3rpx; }
+.hero-number { font-family: 'Baskerville', 'Times New Roman', serif; font-size: 116rpx; line-height: 1.25; text { font-size: 26rpx; padding-left: 18rpx; } }
+.hero-note { font-size: 21rpx; color: #d1dbc9; }
+.hero-footer { display: flex; margin-top: 30rpx; padding-top: 26rpx; border-top: 1rpx solid #6d8070; gap: 18rpx; > view { flex: 1; display: flex; flex-direction: column; font-size: 21rpx; gap: 8rpx; } }
+.metric { font-size: 40rpx; font-family: 'Baskerville', 'Times New Roman', serif; font-variant-numeric: tabular-nums; }
+.unit { font-size: 22rpx; margin-left: 14rpx; }
+.metrics { display: flex; padding: 30rpx 0; border-bottom: 1rpx solid #d9ddd2; > view { flex: 1; display: flex; flex-direction: column; gap: 12rpx; font-size: 24rpx; padding-left: 30rpx; &:last-child { border-left: 1rpx solid #d9ddd2; } } }
+.notice { width: 100%; text-align: left; margin-top: 26rpx; padding: 24rpx; display: flex; flex-direction: column; gap: 12rpx; background: #f0e5d2; color: #805c30; font-size: 23rpx; border-radius: 12rpx; }
+.section { margin-top: 28rpx; background: #fffefa; border: 1rpx solid #e3e5da; border-radius: 16rpx; padding: 28rpx; }
+.heading { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 12rpx; margin-bottom: 24rpx; font-size: 30rpx; }
+.heading > text:first-child { font-family: 'Songti SC', 'STSong', serif; }
+.calendar { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 8rpx; }
+.weekday { text-align: center; font-size: 21rpx; color: #73796f; padding-bottom: 14rpx; }
+.day { display: flex; flex-direction: column; justify-content: center; align-items: center; min-height: 92rpx; border-radius: 10rpx; font-size: 25rpx; border: 2rpx solid transparent; }
+.day-count { font-size: 18rpx; margin-top: 7rpx; color: #66785f; }
+.taught { background: #e8eee2; }
+.selected { border-color: #344f42; background: #344f42; color: #fff; .day-count { color: #fff; } }
+.footnote { display: block; color: #73796f; font-size: 22rpx; line-height: 1.8; padding-top: 24rpx; }
+.search { background: #f2f3ec; border-radius: 10rpx; padding: 20rpx; font-size: 25rpx; margin-bottom: 14rpx; }
+.student-row { display: flex; align-items: center; gap: 20rpx; width: 100%; padding: 24rpx 0; text-align: left; border-bottom: 1rpx solid #eeeee5; }
+.rank { color: #77836e; font-family: 'Baskerville', serif; font-size: 26rpx; }
+.student-main { flex: 1; min-width: 0; }
+.student-name { display: block; font-size: 28rpx; word-break: break-all; }
+.track { height: 5rpx; background: #eef0e6; margin: 14rpx 0 8rpx; }
+.fill { height: 100%; background: #91a180; }
+.student-count { flex-shrink: 0; font-size: 34rpx; }
+.more { padding: 24rpx 0 0; width: 100%; font-size: 24rpx; color: #52714e; }
+.distribution { display: flex; justify-content: space-between; gap: 20rpx; padding: 20rpx 0; border-bottom: 1rpx solid #eeeee5; font-size: 24rpx; > text:first-child { flex: 1; word-break: break-all; } }
+.status-scroll { width: 100%; }
+.status-tabs { display: flex; gap: 12rpx; padding-bottom: 12rpx; white-space: nowrap; button { flex-shrink: 0; padding: 16rpx 20rpx; border-radius: 8rpx; background: #f1f2eb; font-size: 22rpx; } .active { color: white; background: #344f42; } }
+.filters { margin-top: 16rpx; font-size: 22rpx; color: #647b58; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; button { padding: 16rpx 0; } }
+.record { display: flex; flex-direction: column; gap: 12rpx; border-bottom: 1rpx solid #e9ebdf; padding: 24rpx 0; }
+.record-top { display: flex; align-items: center; justify-content: space-between; gap: 16rpx; }
+.record-name { font-size: 28rpx; text-align: left; word-break: break-all; }
+.badge { flex-shrink: 0; font-size: 20rpx; color: #867257; background: #f3eee4; padding: 6rpx 12rpx; border-radius: 6rpx; }
+.completed { color: #53704b; background: #eaf0e2; }
+.record-date { font-size: 25rpx; }
+.notes { padding: 32rpx 8rpx; display: flex; flex-direction: column; gap: 16rpx; font-size: 22rpx; line-height: 1.9; color: #73796f; }
+.notes-title { color: #455d49; font-size: 25rpx; }
+.empty { padding: 80rpx 28rpx; text-align: center; font-size: 26rpx; line-height: 1.8; color: #737e70; }
+.compact { padding: 36rpx 20rpx 0; }
+.outline { padding: 20rpx; margin-top: 24rpx; border: 1rpx solid #b2bfaa; border-radius: 12rpx; }
+</style>

packages/app/src/pages/admin/index.vue

@@ -27,6 +27,16 @@
       </view>
     </view>
 
+    <view class="section-header"><text class="section-title">教学报告</text></view>
+    <view class="list">
+      <view class="list-item" @tap="navigate('/pages/admin/analytics')">
+        <view class="item-left">
+          <view class="item-icon-wrap icon--subscribe"><text class="item-icon-text">▥</text></view>
+          <view class="item-text-group"><text class="item-title">统计分析</text><text class="item-desc">月度课次 · 学员出勤 · 上课明细</text></view>
+        </view>
+        <view class="item-arrow"><text class="arrow-text">›</text></view>
+      </view>
+    </view>
     <!-- Section header: 课程管理 -->
     <view class="section-header">
       <text class="section-title">课程管理</text>

packages/app/src/pages/admin/members.vue

@@ -3,6 +3,7 @@
     <CustomNavBar title="会员管理" show-back />
 
     <view class="filter-bar">
+      <view class="search-field">
       <input
         class="search-input"
         v-model="searchQuery"
@@ -14,6 +15,7 @@
       <view v-if="searchQuery" class="search-clear" @tap="onClear">
         <text class="search-clear-icon">×</text>
       </view>
+      </view>
       <picker
         class="type-picker"
         mode="selector"
@@ -35,7 +37,7 @@
     <view class="stats-row">
       <view class="stat-item">
         <text class="stat-value">{{ total }}</text>
-        <text class="stat-label">位会员</text>
+        <text class="stat-label">位用户</text>
       </view>
     </view>
 
@@ -47,7 +49,7 @@
       <view class="empty-icon-wrap">
         <view class="empty-icon-person" />
       </view>
-      <text class="empty-text">{{ searchQuery ? '未找到匹配的会员' : '暂无会员数据' }}</text>
+      <text class="empty-text">{{ searchQuery ? '未找到匹配的用户' : '当前筛选下暂无用户' }}</text>
     </view>
 
     <view v-else class="member-list">
@@ -116,17 +118,25 @@ const hasMore = ref(false)
 
 const LIMIT = 20
 const cardTypeOptions = [
-  { label: '全部', value: '' },
+  { label: '会员用户', value: 'ACTIVE' },
+  { label: '全部用户', value: '' },
   { label: '体验卡', value: 'TRIAL' },
   { label: '次卡', value: 'TIMES' },
   { label: '月卡', value: 'DURATION' },
-  { label: '无卡', value: 'NONE' },
+  { label: '无卡用户', value: 'NONE' },
 ]
 const cardTypeIndex = ref(0)
+let requestId = 0
 let cardTypeDebounceTimer: ReturnType<typeof setTimeout> | null = null
 
 function onCardTypeChange(e: { detail: { value: number } }) {
   cardTypeIndex.value = Number(e.detail.value)
+  // Invalidate the old filter immediately, including during the debounce window.
+  requestId++
+  loading.value = true
+  members.value = []
+  total.value = 0
+  hasMore.value = false
   if (cardTypeDebounceTimer) clearTimeout(cardTypeDebounceTimer)
   cardTypeDebounceTimer = setTimeout(() => {
     loadMembers(true)
@@ -135,25 +145,32 @@ function onCardTypeChange(e: { detail: { value: number } }) {
 }
 
 onUnmounted(() => {
+  requestId++
   if (cardTypeDebounceTimer) clearTimeout(cardTypeDebounceTimer)
 })
 
 async function loadMembers(reset = false) {
-  if (loading.value) return
+  if (loading.value && !reset) return
+  const id = ++requestId
+  const requestedPage = reset ? 1 : page.value + 1
   if (reset) {
     page.value = 1
     members.value = []
+    total.value = 0
+    hasMore.value = false
   }
   loading.value = true
   try {
     const search = searchQuery.value.trim()
     const cardType = cardTypeOptions[cardTypeIndex.value].value
     const result = await adminStore.fetchMembers({
-      page: page.value,
+      page: requestedPage,
       limit: LIMIT,
       ...(search ? { search } : {}),
       ...(cardType ? { cardType } : {}),
     })
+    if (id !== requestId) return
+    page.value = requestedPage
     if (reset) {
       members.value = [...result.items]
     } else {
@@ -162,14 +179,15 @@ async function loadMembers(reset = false) {
     total.value = result.total
     hasMore.value = members.value.length < result.total
   } catch {
-    uni.showToast({ title: '加载失败', icon: 'none' })
+    if (id === requestId) uni.showToast({ title: '加载失败', icon: 'none' })
   } finally {
-    loading.value = false
+    if (id === requestId) loading.value = false
   }
 }
 
 async function refreshVisibleMembers() {
   if (loading.value) return
+  const id = ++requestId
   loading.value = true
   try {
     const search = searchQuery.value.trim()
@@ -181,14 +199,15 @@ async function refreshVisibleMembers() {
       ...(search ? { search } : {}),
       ...(cardType ? { cardType } : {}),
     })
+    if (id !== requestId) return
     members.value = [...result.items]
     total.value = result.total
     page.value = Math.max(1, Math.ceil(members.value.length / LIMIT) || 1)
     hasMore.value = members.value.length < result.total
   } catch {
-    uni.showToast({ title: '加载失败', icon: 'none' })
+    if (id === requestId) uni.showToast({ title: '加载失败', icon: 'none' })
   } finally {
-    loading.value = false
+    if (id === requestId) loading.value = false
   }
 }
 
@@ -203,7 +222,6 @@ function onClear() {
 
 onReachBottom(() => {
   if (!hasMore.value || loading.value) return
-  page.value++
   loadMembers(false)
 })
 
@@ -244,19 +262,27 @@ onShow(() => {
   position: relative;
 }
 
+.search-field {
+  flex: 1;
+  min-width: 0;
+  position: relative;
+}
+
 .search-input {
   flex: 1;
+  min-width: 0;
   height: 72rpx;
   background: $bg-page;
   border-radius: 36rpx;
-  padding: 0 28rpx;
+  padding: 0 60rpx 0 24rpx;
   font-size: 26rpx;
   color: $text-primary;
 }
 
 .search-clear {
   position: absolute;
-  right: 260rpx;
+  right: 12rpx;
+  top: 14rpx;
   width: 44rpx;
   height: 44rpx;
   display: flex;
@@ -297,7 +323,7 @@ onShow(() => {
 .type-picker-text {
   font-size: 24rpx;
   color: $text-secondary;
-  max-width: 80rpx;
+  max-width: 120rpx;
   overflow: hidden;
   text-overflow: ellipsis;
   white-space: nowrap;

packages/app/src/stores/admin.ts

@@ -2,6 +2,7 @@ import { defineStore } from 'pinia'
 import { ref } from 'vue'
 import { get, post, put, del } from '../utils/request'
 import type {
+  TeachingAnalytics,
   CardType,
   CreateCardTypeDto,
   UpdateCardTypeDto,
@@ -287,7 +288,12 @@ export const useAdminStore = defineStore('admin', () => {
     return del<{ deleted: boolean }>(`/admin/flash-sales/${id}`)
   }
 
+  async function fetchTeachingAnalytics(month: string): Promise<TeachingAnalytics> {
+    return get<TeachingAnalytics>('/admin/teaching-analytics', { month })
+  }
+
   return {
+    fetchTeachingAnalytics,
     // State
     cardTypes,
     studioConfig,