feat(mobile): filter practice mistakes by cause

mobile-uni/src/pages/user/learning/index.vue

@@ -78,8 +78,20 @@
           {{ mistakeLoading ? '加载中' : '刷新' }}
         </button>
       </view>
-      <view v-if="mistakes.length" class="mistake-list">
-        <view v-for="item in mistakes" :key="item.id" class="mistake-row">
+      <view class="chip-row mistake-filter-row">
+        <button
+          v-for="cause in mistakeFilters"
+          :key="cause"
+          class="chip"
+          :class="{ active: cause === activeMistakeCause }"
+          :disabled="mistakeLoading"
+          @click="activeMistakeCause = cause"
+        >
+          {{ cause }}
+        </button>
+      </view>
+      <view v-if="visibleMistakes.length" class="mistake-list">
+        <view v-for="item in visibleMistakes" :key="item.id" class="mistake-row">
           <view class="mistake-copy">
             <view class="mistake-meta">
               <text class="mistake-cause">{{ item.cause }}</text>
@@ -98,7 +110,9 @@
           </button>
         </view>
       </view>
-      <view v-else-if="!mistakeLoading" class="empty">完成训练后，低分和红线回合会自动出现在这里</view>
+      <view v-else-if="!mistakeLoading" class="empty">
+        {{ mistakes.length ? '当前归因筛选暂无错题' : '完成训练后，低分和红线回合会自动出现在这里' }}
+      </view>
     </view>
 
     <view v-if="loggedIn" class="panel">
@@ -210,6 +224,8 @@ const positionSopSummary = ref<PositionSopSummary | null>(null);
 const activeTopic = ref('岗前 SOP');
 const assignmentLoading = ref(false);
 const mistakeLoading = ref(false);
+const mistakeFilters = ['全部', '红线话术', '情绪承接', '流程合规', '综合得分不足'];
+const activeMistakeCause = ref('全部');
 const prepLoading = ref(false);
 const knowledgeLoading = ref(false);
 const positionProfile = ref(getSelectedPositionProfile());
@@ -230,6 +246,9 @@ const firstPracticeAssignment = computed(() =>
   || null
 );
 const prepScenarioId = computed(() => firstPracticeAssignment.value?.scenarioId || defaultScenarioId);
+const visibleMistakes = computed(() => activeMistakeCause.value === '全部'
+  ? mistakes.value
+  : mistakes.value.filter((item) => item.cause === activeMistakeCause.value));
 
 const refreshAuthState = () => {
   loggedIn.value = isLoggedIn();
@@ -436,6 +455,11 @@ onShow(() => {
   gap: 10px;
 }
 
+.mistake-filter-row {
+  margin-top: 12px;
+  margin-bottom: 12px;
+}
+
 .mistake-row {
   display: flex;
   gap: 12px;