ieplus-app/src/pagesStudy/components/teacher-class-view.vue

<template>
  <view class="p-30">
    <view class="flex items-center justify-between">
      <text class="text-30 text-fore-title font-bold">我的班级</text>
      <view>
        <ie-picker ref="pickerRef" v-model="classId" :list="classList" placeholder="选择班级" title="选择班级" icon="arrow-down"
          key-label="name" key-value="classId" @change="handleClassChange"></ie-picker>
      </view>
    </view>
    <view>
      <slot :teachClass="selectedClass"></slot>
    </view>
  </view>

</template>
<script lang="ts" setup>
import { TeachClass } from '@/types/study';
const classId = ref<number>(0);
const classList = ref<TeachClass[]>([]);
const selectedClass = ref<TeachClass>();
const pickerRef = ref();
const loadData = async () => {
  // const res = await getClassHistory();
  // 模拟数据
  classList.value = [
    { classId: 1, schoolId: 1, year: 2025, name: '班级1' },
    { classId: 2, schoolId: 1, year: 2025, name: '班级2' },
    { classId: 3, schoolId: 1, year: 2025, name: '班级3' },
  ];
  // 默认选中第一个
  classId.value = classList.value[0].classId;
  selectedClass.value = classList.value[0];
}
onMounted(() => {
  loadData();
});
const handleClassChange = (value: number, selectedItem: TeachClass) => {
  classId.value = value;
  selectedClass.value = selectedItem;
}
</script>
<style lang="scss" scoped></style>