ieplus-app/src/pagesStudy/pages/study-history/components/knowledge-history-teacher.vue

<template>
  <view class="mt-40 flex items-center justify-end gap-x-10">
    <text class="text-24 text-fore-light">平均正确率</text>
    <text class="text-30 text-fore-title font-bold">80%</text>
  </view>
  <view class="mt-10">
    <progress :percent="80" stroke-width="12" activeColor="#68D119" backgroundColor="#F2F2F2" :border-radius="8"
      class="custom-progress" />
  </view>
  <view class="mt-76">
    <student-stat-table :teach-class="teachClass" :data="studentStatData" />
  </view>
</template>
<script lang="ts" setup>
import studentStatTable from './student-stat-table.vue';
import { StudentStat, TeachClass } from '@/types/study';
const props = defineProps({
  teachClass: {
    type: Object as PropType<TeachClass>,
    default: () => ({})
  }
});
const studentStatData = ref<StudentStat[]>([
  {
    id: 1,
    name: '张三',
    questionNum: 10,
    dateNum: 10,
    rate: 80
  },
  {
    id: 2,
    name: '李四',
    questionNum: 10,
    dateNum: 10,
    rate: 80
  }
]);
watch(() => props.teachClass, (newVal) => {
  if (newVal.classId) {
    console.log('新的班级', newVal);
    loadData();
  }
}, {
  deep: true,
  immediate: true
});

const loadData = async () => {
  // const res = await getStudentStat(props.teachClass.classId);
  // console.log(res);
}
</script>
<style lang="scss" scoped></style>