feat: 优化登录和课程功能
- 修复练习分数显示格式,与考试保持一致 - 增强热门好课报名功能,添加完整的用户反馈和错误处理 - 优化登录流程,添加详细的调试日志 - 修复右上角登录按钮跳转到登录页面 - 添加主标题API接口对接功能 - 改进用户体验和交互反馈
This commit is contained in:
parent
7df60c4ea4
commit
57eb57d0ce
@ -523,12 +523,12 @@
|
|||||||
import { computed, ref, onMounted, onUnmounted } from 'vue'
|
import { computed, ref, onMounted, onUnmounted } from 'vue'
|
||||||
import { useI18n } from 'vue-i18n'
|
import { useI18n } from 'vue-i18n'
|
||||||
import { useRouter } from 'vue-router'
|
import { useRouter } from 'vue-router'
|
||||||
|
import { useMessage } from 'naive-ui'
|
||||||
import { useCourseStore } from '@/stores/course'
|
import { useCourseStore } from '@/stores/course'
|
||||||
import { useUserStore } from '@/stores/user'
|
import { useUserStore } from '@/stores/user'
|
||||||
import { useAuth } from '@/composables/useAuth'
|
import { useAuth } from '@/composables/useAuth'
|
||||||
import LoginModal from '@/components/auth/LoginModal.vue'
|
import LoginModal from '@/components/auth/LoginModal.vue'
|
||||||
import RegisterModal from '@/components/auth/RegisterModal.vue'
|
import RegisterModal from '@/components/auth/RegisterModal.vue'
|
||||||
import { enrollCourseExample } from '@/api/examples/usage'
|
|
||||||
import { CourseApi } from '@/api/modules/course'
|
import { CourseApi } from '@/api/modules/course'
|
||||||
import { ContentApi } from '@/api/modules/content'
|
import { ContentApi } from '@/api/modules/content'
|
||||||
|
|
||||||
@ -536,6 +536,7 @@ import { ContentApi } from '@/api/modules/content'
|
|||||||
|
|
||||||
const { t, locale } = useI18n()
|
const { t, locale } = useI18n()
|
||||||
const router = useRouter()
|
const router = useRouter()
|
||||||
|
const message = useMessage()
|
||||||
const courseStore = useCourseStore()
|
const courseStore = useCourseStore()
|
||||||
// @ts-ignore
|
// @ts-ignore
|
||||||
const userStore = useUserStore()
|
const userStore = useUserStore()
|
||||||
@ -561,6 +562,9 @@ const goToCoursesPage = () => {
|
|||||||
|
|
||||||
// 跳转到课程详情页面
|
// 跳转到课程详情页面
|
||||||
const goToCourseDetail = async (courseId: string) => {
|
const goToCourseDetail = async (courseId: string) => {
|
||||||
|
console.log('🔍 点击课程卡片,课程ID:', courseId)
|
||||||
|
console.log('🔍 用户登录状态:', userStore.isLoggedIn)
|
||||||
|
|
||||||
try {
|
try {
|
||||||
// 检查用户是否已登录
|
// 检查用户是否已登录
|
||||||
if (!userStore.isLoggedIn) {
|
if (!userStore.isLoggedIn) {
|
||||||
@ -599,12 +603,49 @@ const goToCourseDetail = async (courseId: string) => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
// 处理课程报名
|
// 处理课程报名
|
||||||
const handleEnrollCourse = (courseId: string | number, event?: Event) => {
|
const handleEnrollCourse = async (courseId: string | number, event?: Event) => {
|
||||||
// 阻止事件冒泡,避免触发卡片点击事件
|
// 阻止事件冒泡,避免触发卡片点击事件
|
||||||
if (event) {
|
if (event) {
|
||||||
event.stopPropagation()
|
event.stopPropagation()
|
||||||
}
|
}
|
||||||
enrollCourseExample(Number(courseId))
|
|
||||||
|
console.log('🎯 点击报名按钮,课程ID:', courseId)
|
||||||
|
|
||||||
|
try {
|
||||||
|
// 检查用户是否已登录
|
||||||
|
if (!userStore.isLoggedIn) {
|
||||||
|
console.log('用户未登录,显示登录模态框')
|
||||||
|
loginModalVisible.value = true
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
// 调用报名API
|
||||||
|
const response = await CourseApi.enrollCourse(String(courseId))
|
||||||
|
|
||||||
|
if (response.code === 200 || response.code === 0) {
|
||||||
|
console.log('✅ 报名成功:', response.data)
|
||||||
|
// 显示成功提示
|
||||||
|
message.success('报名成功!')
|
||||||
|
|
||||||
|
// 报名成功后跳转到课程详情页
|
||||||
|
router.push(`/course/${courseId}/exchanged`)
|
||||||
|
} else {
|
||||||
|
console.error('❌ 报名失败:', response.message)
|
||||||
|
message.error(response.message || '报名失败,请稍后重试')
|
||||||
|
}
|
||||||
|
} catch (error: any) {
|
||||||
|
console.error('❌ 报名异常:', error)
|
||||||
|
|
||||||
|
// 处理不同类型的错误
|
||||||
|
if (error.response?.status === 401) {
|
||||||
|
message.error('请先登录')
|
||||||
|
loginModalVisible.value = true
|
||||||
|
} else if (error.response?.data?.message) {
|
||||||
|
message.error(error.response.data.message)
|
||||||
|
} else {
|
||||||
|
message.error('报名失败,请检查网络连接')
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
// 显示问题反馈模态框
|
// 显示问题反馈模态框
|
||||||
|
@ -197,7 +197,7 @@ const getIdPlaceholder = () => {
|
|||||||
if (isRegisterMode.value) {
|
if (isRegisterMode.value) {
|
||||||
return '请输入您的工号'
|
return '请输入您的工号'
|
||||||
}
|
}
|
||||||
return activeTab.value === 'teacher' ? '请输入您的工号' : '2014195268'
|
return activeTab.value === 'teacher' ? '请输入您的工号' : '请输入您的学号'
|
||||||
}
|
}
|
||||||
|
|
||||||
// 处理表单提交
|
// 处理表单提交
|
||||||
|
@ -539,7 +539,7 @@
|
|||||||
|
|
||||||
<!-- 分数显示 -->
|
<!-- 分数显示 -->
|
||||||
<div v-if="practice.status === 'finished'" class="practice-score-badge">
|
<div v-if="practice.status === 'finished'" class="practice-score-badge">
|
||||||
<span class="score-text">{{ practice.score }} <span>分</span></span>
|
<span class="score-text">{{ practice.score }}<span>分</span></span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- 考试信息 -->
|
<!-- 考试信息 -->
|
||||||
|
Loading…
x
Reference in New Issue
Block a user