hookehuyr

refactor(打卡): 重构打卡相关代码结构

- 移除打卡首页的标题显示
- 将打卡类型数据从mockData移动到各自组件中
- 清理个人页面的废弃打卡代码
- 添加TODO标记准备后端数据接入
```

这个提交消息:
1. 使用了`refactor`类型,因为主要是代码结构调整
2. 添加了`(打卡)`作为scope,明确修改范围
3. 描述中简要说明了主要的重构内容
4. 在body中列出了具体的重构点
5. 符合中文语言习惯和commit message规范
......@@ -73,9 +73,16 @@
<script setup>
import { ref } from 'vue'
import { showToast } from 'vant'
import { checkInTypes } from '@/utils/mockData'
import { useRoute, useRouter } from 'vue-router'
// TODO: 从后端获取
const checkInTypes = [
{ id: 'reading', name: '课程打卡', icon: 'book', path: '/checkin/reading' },
{ id: 'exercise', name: '签到打卡', icon: 'running', path: '/checkin/exercise' },
{ id: 'reflection', name: '学习打卡', icon: 'pencil-alt', path: '/checkin/writing' },
{ id: 'mix', name: '图文打卡', icon: 'pencil-alt', path: '/checkin/index' }
];
const route = useRoute()
const router = useRouter()
......
/*
* @Date: 2025-03-21 13:28:30
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-06-03 11:29:54
* @LastEditTime: 2025-06-03 18:36:49
* @FilePath: /mlaj/src/router/checkin.js
* @Description: 文件描述
*/
......@@ -47,7 +47,7 @@ export default [
name: 'IndexCheckIn',
component: () => import('@/views/checkin/IndexCheckInPage.vue'),
meta: {
title: '打卡首页',
title: '',
requiresAuth: true
}
},
......
<!--
* @Date: 2025-03-20 19:55:21
* @LastEditors: hookehuyr hookehuyr@gmail.com
* @LastEditTime: 2025-06-03 14:26:36
* @LastEditTime: 2025-06-04 09:38:40
* @FilePath: /mlaj/src/views/HomePage.vue
* @Description: 美乐爱觉教育首页组件
*
......@@ -518,7 +518,7 @@ import SummerCampCard from '@/components/ui/SummerCampCard.vue'
import VideoPlayer from '@/components/ui/VideoPlayer.vue'
// 导入模拟数据和工具函数
import { courses, liveStreams, activities, checkInTypes } from '@/utils/mockData'
import { courses, liveStreams, activities } from '@/utils/mockData'
import { useTitle } from '@vueuse/core'
import { useAuth } from '@/contexts/auth'
import { showToast } from 'vant'
......@@ -565,6 +565,14 @@ const getRecommendations = (random = false) => {
return userRecommendations.value.slice(0, 4)
}
// TODO: 从后端获取
const checkInTypes = [
{ id: 'reading', name: '课程打卡', icon: 'book', path: '/checkin/reading' },
{ id: 'exercise', name: '签到打卡', icon: 'running', path: '/checkin/exercise' },
// { id: 'study', name: '团队打卡', icon: 'graduation-cap', path: '/checkin/study' },
{ id: 'reflection', name: '学习打卡', icon: 'pencil-alt', path: '/checkin/writing' },
{ id: 'mix', name: '图文打卡', icon: 'pencil-alt', path: '/checkin/index' }
];
// 自动轮播
let carouselInterval
......
......@@ -68,91 +68,6 @@
</FrostedGlass>
</div>
<!-- Check-in Types -->
<!-- <div class="px-4 mb-5">
<FrostedGlass class="p-4 rounded-xl">
<h3 class="font-semibold text-base mb-4">打卡项目</h3>
<div class="grid grid-cols-4 gap-2">
<div
v-for="type in checkInTypes"
:key="type.id"
class="flex flex-col items-center cursor-pointer"
@click="handleCheckInClick(type.path)"
>
<div
class="w-12 h-12 rounded-full bg-green-100 flex items-center justify-center mb-1"
>
<svg
v-if="type.icon === 'book'"
xmlns="http://www.w3.org/2000/svg"
class="h-6 w-6 text-green-600"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M12 6.253v13m0-13C10.832 5.477 9.246 5 7.5 5S4.168 5.477 3 6.253v13C4.168 18.477 5.754 18 7.5 18s3.332.477 4.5 1.253m0-13C13.168 5.477 14.754 5 16.5 5c1.747 0 3.332.477 4.5 1.253v13C19.832 18.477 18.247 18 16.5 18c-1.746 0-3.332.477-4.5 1.253"
/>
</svg>
<svg
v-if="type.icon === 'running'"
xmlns="http://www.w3.org/2000/svg"
class="h-6 w-6 text-green-600"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M13 10V3L4 14h7v7l9-11h-7z"
/>
</svg>
<svg
v-if="type.icon === 'graduation-cap'"
xmlns="http://www.w3.org/2000/svg"
class="h-6 w-6 text-green-600"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path d="M12 14l9-5-9-5-9 5 9 5z" />
<path
d="M12 14l6.16-3.422a12.083 12.083 0 01.665 6.479A11.952 11.952 0 0012 20.055a11.952 11.952 0 00-6.824-2.998 12.078 12.078 0 01.665-6.479L12 14z"
/>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M12 14l9-5-9-5-9 5 9 5zm0 0l6.16-3.422a12.083 12.083 0 01.665 6.479A11.952 11.952 0 0012 20.055a11.952 11.952 0 00-6.824-2.998 12.078 12.078 0 01.665-6.479L12 14zm-4 6v-7.5l4-2.222"
/>
</svg>
<svg
v-if="type.icon === 'pencil-alt'"
xmlns="http://www.w3.org/2000/svg"
class="h-6 w-6 text-green-600"
fill="none"
viewBox="0 0 24 24"
stroke="currentColor"
>
<path
stroke-linecap="round"
stroke-linejoin="round"
stroke-width="2"
d="M15.232 5.232l3.536 3.536m-2.036-5.036a2.5 2.5 0 113.536 3.536L6.5 21.036H3v-3.572L16.732 3.732z"
/>
</svg>
</div>
<span class="text-xs">{{ type.name }}</span>
</div>
</div>
</FrostedGlass>
</div> -->
<!-- User Menu Options -->
<div class="px-4 pb-16">
<FrostedGlass class="rounded-xl overflow-hidden mb-5">
......@@ -209,24 +124,25 @@ import AppLayout from "@/components/layout/AppLayout.vue";
import FrostedGlass from "@/components/ui/FrostedGlass.vue";
import MenuItem from "@/components/ui/MenuItem.vue";
import { useAuth } from "@/contexts/auth";
import { userProfile, checkInTypes } from "@/utils/mockData";
import CheckInDialog from "@/components/ui/CheckInDialog.vue";
import { getUserInfoAPI } from "@/api/users";
import { showToast } from "vant";
import { useTitle } from "@vueuse/core";
const router = useRouter();
const $route = useRoute();
useTitle($route.meta.title);
const { logout } = useAuth();
const profile = ref({});
onMounted(async () => {
const { code, data } = await getUserInfoAPI();
if (code) {
profile.value = data.user;
}
})
const showCheckInDialog = ref(false);
// 处理打卡成功
......@@ -240,6 +156,7 @@ const handleCheckInSuccess = () => {
};
// Handle logout
const { logout } = useAuth();
const handleLogout = () => {
logout();
window.location.href = import.meta.env.VITE_BASE || '/';
......