feat(router): 添加我的课程页面路由和组件

在路由配置中添加了 `/profile/courses` 路径，并创建了 `MyCoursesPage.vue` 组件，用于展示用户的课程列表。该组件使用了 `van-list` 实现分页加载功能，并提供了无数据时的提示界面。

@@ -90,6 +90,12 @@ const routes = [
     props: true,
     props: true,
     meta: { title: '结账' }
     meta: { title: '结账' }
   },
   },
+  {
+    path: '/profile/courses',
+    name: 'MyCourses',
+    component: () => import('../views/courses/MyCoursesPage.vue'),
+    meta: { title: '我的课程' }
+  },
 ]
 ]
 
 
 const router = createRouter({
 const router = createRouter({

+<template>
+  <div class="bg-gradient-to-b from-green-50/70 to-white/90 min-h-screen pb-20">
+    <!-- Course List -->
+    <van-list
+      v-model:loading="loading"
+      :finished="finished"
+      finished-text="没有更多了"
+      @load="onLoad"
+      class="px-4 py-3 space-y-4"
+    >
+      <CourseCard v-for="course in courses" :key="course.id" :course="course" />
+    </van-list>
+
+    <!-- 无数据提示 -->
+    <div v-if="!loading && courses.length === 0" class="flex flex-col items-center justify-center py-12">
+      <svg xmlns="http://www.w3.org/2000/svg" class="h-16 w-16 text-gray-300" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+        <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 5H7a2 2 0 00-2 2v12a2 2 0 002 2h10a2 2 0 002-2V7a2 2 0 00-2-2h-2M9 5a2 2 0 002 2h2a2 2 0 002-2M9 5a2 2 0 012-2h2a2 2 0 012 2" />
+      </svg>
+      <p class="mt-4 text-gray-500">暂无课程记录</p>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+import CourseCard from '@/components/ui/CourseCard.vue';
+import { courses as mockCourses } from '@/utils/mockData';
+import { useTitle } from '@vueuse/core';
+
+const $route = useRoute();
+const $router = useRouter();
+useTitle($route.meta.title);
+const courses = ref([])
+const loading = ref(false)
+const finished = ref(false)
+const page = ref(1)
+const pageSize = 10
+
+const onLoad = () => {
+  loading.value = true
+  // 模拟异步加载数据
+  setTimeout(() => {
+    const start = (page.value - 1) * pageSize
+    const end = start + pageSize
+    const newCourses = mockCourses.slice(start, end)
+    courses.value.push(...newCourses)
+    loading.value = false
+    if (courses.value.length >= mockCourses.length) {
+      finished.value = true
+    }
+    page.value++
+  }, 1000)
+}
+</script>