hookehuyr

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

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

这个提交消息:
1. 使用了`refactor`类型,因为主要是代码结构调整
2. 添加了`(打卡)`作为scope,明确修改范围
3. 描述中简要说明了主要的重构内容
4. 在body中列出了具体的重构点
5. 符合中文语言习惯和commit message规范
...@@ -73,9 +73,16 @@ ...@@ -73,9 +73,16 @@
73 <script setup> 73 <script setup>
74 import { ref } from 'vue' 74 import { ref } from 'vue'
75 import { showToast } from 'vant' 75 import { showToast } from 'vant'
76 -import { checkInTypes } from '@/utils/mockData'
77 import { useRoute, useRouter } from 'vue-router' 76 import { useRoute, useRouter } from 'vue-router'
78 77
78 +// TODO: 从后端获取
79 +const checkInTypes = [
80 + { id: 'reading', name: '课程打卡', icon: 'book', path: '/checkin/reading' },
81 + { id: 'exercise', name: '签到打卡', icon: 'running', path: '/checkin/exercise' },
82 + { id: 'reflection', name: '学习打卡', icon: 'pencil-alt', path: '/checkin/writing' },
83 + { id: 'mix', name: '图文打卡', icon: 'pencil-alt', path: '/checkin/index' }
84 +];
85 +
79 const route = useRoute() 86 const route = useRoute()
80 const router = useRouter() 87 const router = useRouter()
81 88
......
1 /* 1 /*
2 * @Date: 2025-03-21 13:28:30 2 * @Date: 2025-03-21 13:28:30
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2025-06-03 11:29:54 4 + * @LastEditTime: 2025-06-03 18:36:49
5 * @FilePath: /mlaj/src/router/checkin.js 5 * @FilePath: /mlaj/src/router/checkin.js
6 * @Description: 文件描述 6 * @Description: 文件描述
7 */ 7 */
...@@ -47,7 +47,7 @@ export default [ ...@@ -47,7 +47,7 @@ export default [
47 name: 'IndexCheckIn', 47 name: 'IndexCheckIn',
48 component: () => import('@/views/checkin/IndexCheckInPage.vue'), 48 component: () => import('@/views/checkin/IndexCheckInPage.vue'),
49 meta: { 49 meta: {
50 - title: '打卡首页', 50 + title: '',
51 requiresAuth: true 51 requiresAuth: true
52 } 52 }
53 }, 53 },
......
1 <!-- 1 <!--
2 * @Date: 2025-03-20 19:55:21 2 * @Date: 2025-03-20 19:55:21
3 * @LastEditors: hookehuyr hookehuyr@gmail.com 3 * @LastEditors: hookehuyr hookehuyr@gmail.com
4 - * @LastEditTime: 2025-06-03 14:26:36 4 + * @LastEditTime: 2025-06-04 09:38:40
5 * @FilePath: /mlaj/src/views/HomePage.vue 5 * @FilePath: /mlaj/src/views/HomePage.vue
6 * @Description: 美乐爱觉教育首页组件 6 * @Description: 美乐爱觉教育首页组件
7 * 7 *
...@@ -518,7 +518,7 @@ import SummerCampCard from '@/components/ui/SummerCampCard.vue' ...@@ -518,7 +518,7 @@ import SummerCampCard from '@/components/ui/SummerCampCard.vue'
518 import VideoPlayer from '@/components/ui/VideoPlayer.vue' 518 import VideoPlayer from '@/components/ui/VideoPlayer.vue'
519 519
520 // 导入模拟数据和工具函数 520 // 导入模拟数据和工具函数
521 -import { courses, liveStreams, activities, checkInTypes } from '@/utils/mockData' 521 +import { courses, liveStreams, activities } from '@/utils/mockData'
522 import { useTitle } from '@vueuse/core' 522 import { useTitle } from '@vueuse/core'
523 import { useAuth } from '@/contexts/auth' 523 import { useAuth } from '@/contexts/auth'
524 import { showToast } from 'vant' 524 import { showToast } from 'vant'
...@@ -565,6 +565,14 @@ const getRecommendations = (random = false) => { ...@@ -565,6 +565,14 @@ const getRecommendations = (random = false) => {
565 return userRecommendations.value.slice(0, 4) 565 return userRecommendations.value.slice(0, 4)
566 } 566 }
567 567
568 +// TODO: 从后端获取
569 +const checkInTypes = [
570 + { id: 'reading', name: '课程打卡', icon: 'book', path: '/checkin/reading' },
571 + { id: 'exercise', name: '签到打卡', icon: 'running', path: '/checkin/exercise' },
572 + // { id: 'study', name: '团队打卡', icon: 'graduation-cap', path: '/checkin/study' },
573 + { id: 'reflection', name: '学习打卡', icon: 'pencil-alt', path: '/checkin/writing' },
574 + { id: 'mix', name: '图文打卡', icon: 'pencil-alt', path: '/checkin/index' }
575 +];
568 576
569 // 自动轮播 577 // 自动轮播
570 let carouselInterval 578 let carouselInterval
......
...@@ -68,91 +68,6 @@ ...@@ -68,91 +68,6 @@
68 </FrostedGlass> 68 </FrostedGlass>
69 </div> 69 </div>
70 70
71 - <!-- Check-in Types -->
72 - <!-- <div class="px-4 mb-5">
73 - <FrostedGlass class="p-4 rounded-xl">
74 - <h3 class="font-semibold text-base mb-4">打卡项目</h3>
75 - <div class="grid grid-cols-4 gap-2">
76 - <div
77 - v-for="type in checkInTypes"
78 - :key="type.id"
79 - class="flex flex-col items-center cursor-pointer"
80 - @click="handleCheckInClick(type.path)"
81 - >
82 - <div
83 - class="w-12 h-12 rounded-full bg-green-100 flex items-center justify-center mb-1"
84 - >
85 - <svg
86 - v-if="type.icon === 'book'"
87 - xmlns="http://www.w3.org/2000/svg"
88 - class="h-6 w-6 text-green-600"
89 - fill="none"
90 - viewBox="0 0 24 24"
91 - stroke="currentColor"
92 - >
93 - <path
94 - stroke-linecap="round"
95 - stroke-linejoin="round"
96 - stroke-width="2"
97 - 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"
98 - />
99 - </svg>
100 - <svg
101 - v-if="type.icon === 'running'"
102 - xmlns="http://www.w3.org/2000/svg"
103 - class="h-6 w-6 text-green-600"
104 - fill="none"
105 - viewBox="0 0 24 24"
106 - stroke="currentColor"
107 - >
108 - <path
109 - stroke-linecap="round"
110 - stroke-linejoin="round"
111 - stroke-width="2"
112 - d="M13 10V3L4 14h7v7l9-11h-7z"
113 - />
114 - </svg>
115 - <svg
116 - v-if="type.icon === 'graduation-cap'"
117 - xmlns="http://www.w3.org/2000/svg"
118 - class="h-6 w-6 text-green-600"
119 - fill="none"
120 - viewBox="0 0 24 24"
121 - stroke="currentColor"
122 - >
123 - <path d="M12 14l9-5-9-5-9 5 9 5z" />
124 - <path
125 - 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"
126 - />
127 - <path
128 - stroke-linecap="round"
129 - stroke-linejoin="round"
130 - stroke-width="2"
131 - 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"
132 - />
133 - </svg>
134 - <svg
135 - v-if="type.icon === 'pencil-alt'"
136 - xmlns="http://www.w3.org/2000/svg"
137 - class="h-6 w-6 text-green-600"
138 - fill="none"
139 - viewBox="0 0 24 24"
140 - stroke="currentColor"
141 - >
142 - <path
143 - stroke-linecap="round"
144 - stroke-linejoin="round"
145 - stroke-width="2"
146 - 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"
147 - />
148 - </svg>
149 - </div>
150 - <span class="text-xs">{{ type.name }}</span>
151 - </div>
152 - </div>
153 - </FrostedGlass>
154 - </div> -->
155 -
156 <!-- User Menu Options --> 71 <!-- User Menu Options -->
157 <div class="px-4 pb-16"> 72 <div class="px-4 pb-16">
158 <FrostedGlass class="rounded-xl overflow-hidden mb-5"> 73 <FrostedGlass class="rounded-xl overflow-hidden mb-5">
...@@ -209,24 +124,25 @@ import AppLayout from "@/components/layout/AppLayout.vue"; ...@@ -209,24 +124,25 @@ import AppLayout from "@/components/layout/AppLayout.vue";
209 import FrostedGlass from "@/components/ui/FrostedGlass.vue"; 124 import FrostedGlass from "@/components/ui/FrostedGlass.vue";
210 import MenuItem from "@/components/ui/MenuItem.vue"; 125 import MenuItem from "@/components/ui/MenuItem.vue";
211 import { useAuth } from "@/contexts/auth"; 126 import { useAuth } from "@/contexts/auth";
212 -import { userProfile, checkInTypes } from "@/utils/mockData";
213 import CheckInDialog from "@/components/ui/CheckInDialog.vue"; 127 import CheckInDialog from "@/components/ui/CheckInDialog.vue";
214 import { getUserInfoAPI } from "@/api/users"; 128 import { getUserInfoAPI } from "@/api/users";
215 import { showToast } from "vant"; 129 import { showToast } from "vant";
216 130
217 import { useTitle } from "@vueuse/core"; 131 import { useTitle } from "@vueuse/core";
132 +
218 const router = useRouter(); 133 const router = useRouter();
219 const $route = useRoute(); 134 const $route = useRoute();
220 useTitle($route.meta.title); 135 useTitle($route.meta.title);
221 136
222 -const { logout } = useAuth();
223 const profile = ref({}); 137 const profile = ref({});
138 +
224 onMounted(async () => { 139 onMounted(async () => {
225 const { code, data } = await getUserInfoAPI(); 140 const { code, data } = await getUserInfoAPI();
226 if (code) { 141 if (code) {
227 profile.value = data.user; 142 profile.value = data.user;
228 } 143 }
229 }) 144 })
145 +
230 const showCheckInDialog = ref(false); 146 const showCheckInDialog = ref(false);
231 147
232 // 处理打卡成功 148 // 处理打卡成功
...@@ -240,6 +156,7 @@ const handleCheckInSuccess = () => { ...@@ -240,6 +156,7 @@ const handleCheckInSuccess = () => {
240 }; 156 };
241 157
242 // Handle logout 158 // Handle logout
159 +const { logout } = useAuth();
243 const handleLogout = () => { 160 const handleLogout = () => {
244 logout(); 161 logout();
245 window.location.href = import.meta.env.VITE_BASE || '/'; 162 window.location.href = import.meta.env.VITE_BASE || '/';
......