Merge branches 'dev' and 'dev' of http://110.42.96.64:19890/GoCo/OL-LearnPlatform-Frontend into dev
This commit is contained in:
commit
27f41332d4
@ -19,8 +19,8 @@ export const API_BASE_URL = import.meta.env.VITE_API_BASE_URL || 'http://localho
|
|||||||
export const API_ENDPOINTS = {
|
export const API_ENDPOINTS = {
|
||||||
// 认证相关
|
// 认证相关
|
||||||
AUTH: {
|
AUTH: {
|
||||||
LOGIN: '/biz/user/login',
|
LOGIN: '/aiol/aiolUser/login',
|
||||||
USER_INFO: '/biz/user/info',
|
USER_INFO: '/aiol/aiolUser/info',
|
||||||
REGISTER: '/auth/register',
|
REGISTER: '/auth/register',
|
||||||
LOGOUT: '/auth/logout',
|
LOGOUT: '/auth/logout',
|
||||||
REFRESH: '/auth/refresh',
|
REFRESH: '/auth/refresh',
|
||||||
@ -36,12 +36,12 @@ export const API_ENDPOINTS = {
|
|||||||
|
|
||||||
// 课程相关
|
// 课程相关
|
||||||
COURSES: {
|
COURSES: {
|
||||||
LIST: '/biz/course/list',
|
LIST: '/aiol/aiolCourse/query_list',
|
||||||
SEARCH: '/courses/search',
|
SEARCH: '/courses/search',
|
||||||
POPULAR: '/courses/popular',
|
POPULAR: '/courses/popular',
|
||||||
LATEST: '/courses/latest',
|
LATEST: '/courses/latest',
|
||||||
RECOMMENDED: '/courses/recommended',
|
RECOMMENDED: '/courses/recommended',
|
||||||
DETAIL: '/biz/course/detail',
|
DETAIL: '/aiol/aiolCourse/detail',
|
||||||
CHAPTERS: '/courses/:id/chapters',
|
CHAPTERS: '/courses/:id/chapters',
|
||||||
LESSONS: '/courses/:id/lessons',
|
LESSONS: '/courses/:id/lessons',
|
||||||
ENROLL: '/courses/:id/enroll',
|
ENROLL: '/courses/:id/enroll',
|
||||||
@ -54,18 +54,18 @@ export const API_ENDPOINTS = {
|
|||||||
|
|
||||||
// 分类相关
|
// 分类相关
|
||||||
CATEGORIES: {
|
CATEGORIES: {
|
||||||
LIST: '/biz/course/category/list',
|
LIST: '/aiol/aiolCourse/category/list',
|
||||||
COURSES: '/categories/:id/courses',
|
COURSES: '/categories/:id/courses',
|
||||||
},
|
},
|
||||||
|
|
||||||
// 专题相关
|
// 专题相关
|
||||||
SUBJECTS: {
|
SUBJECTS: {
|
||||||
LIST: '/biz/course/subject/list',
|
LIST: '/aiol/aiolCourse/subject/list',
|
||||||
},
|
},
|
||||||
|
|
||||||
// 难度相关
|
// 难度相关
|
||||||
DIFFICULTIES: {
|
DIFFICULTIES: {
|
||||||
LIST: '/biz/course/difficulty/list',
|
LIST: '/aiol/aiolCourse/difficulty/list',
|
||||||
},
|
},
|
||||||
|
|
||||||
// 章节课时相关
|
// 章节课时相关
|
||||||
@ -187,14 +187,14 @@ export const API_ENDPOINTS = {
|
|||||||
// 考试题库相关
|
// 考试题库相关
|
||||||
EXAM: {
|
EXAM: {
|
||||||
// 题库管理
|
// 题库管理
|
||||||
REPO_CREATE: '/biz/repo/courseAdd',
|
REPO_CREATE: '/aiol/repo/courseAdd',
|
||||||
REPO_LIST: '/biz/repo/repoList',
|
REPO_LIST: '/aiol/repo/repoList',
|
||||||
REPO_DELETE: '/gen/repo/repo/delete',
|
REPO_DELETE: '/gen/repo/repo/delete',
|
||||||
REPO_EDIT: '/gen/repo/repo/edit',
|
REPO_EDIT: '/gen/repo/repo/edit',
|
||||||
|
|
||||||
// 题目管理
|
// 题目管理
|
||||||
QUESTION_LIST: '/biz/repo/questionList/:repoId',
|
QUESTION_LIST: '/aiol/repo/questionList/:repoId',
|
||||||
QUESTION_DETAIL: '/biz/repo/repoList/:questionId',
|
QUESTION_DETAIL: '/aiol/repo/repoList/:questionId',
|
||||||
QUESTION_ADD: '/gen/question/question/add',
|
QUESTION_ADD: '/gen/question/question/add',
|
||||||
QUESTION_EDIT: '/gen/question/question/edit',
|
QUESTION_EDIT: '/gen/question/question/edit',
|
||||||
QUESTION_DELETE: '/gen/question/question/delete',
|
QUESTION_DELETE: '/gen/question/question/delete',
|
||||||
|
@ -25,10 +25,10 @@ export class AuthApi {
|
|||||||
password: data.password
|
password: data.password
|
||||||
}
|
}
|
||||||
|
|
||||||
console.log('🚀 发送登录请求:', { url: '/biz/user/login', data: { ...loginData, password: '***' } })
|
console.log('🚀 发送登录请求:', { url: '/aiol/aiolUser/login', data: { ...loginData, password: '***' } })
|
||||||
|
|
||||||
// 调用后端API
|
// 调用后端API
|
||||||
const response = await ApiRequest.post<any>('/biz/user/login', loginData)
|
const response = await ApiRequest.post<any>('/aiol/aiolUser/login', loginData)
|
||||||
|
|
||||||
console.log('🔍 Login API Response:', response)
|
console.log('🔍 Login API Response:', response)
|
||||||
console.log('🔍 Response Code:', response.code)
|
console.log('🔍 Response Code:', response.code)
|
||||||
@ -231,7 +231,7 @@ export class AuthApi {
|
|||||||
|
|
||||||
// 获取当前用户信息 - 使用后端实际接口
|
// 获取当前用户信息 - 使用后端实际接口
|
||||||
static async getUserInfo(): Promise<UserInfoResponse> {
|
static async getUserInfo(): Promise<UserInfoResponse> {
|
||||||
const response = await ApiRequest.get<any>('/biz/user/info')
|
const response = await ApiRequest.get<any>('/aiol/aiolUser/info')
|
||||||
|
|
||||||
console.log('🔍 getUserInfo - 原始响应:', response)
|
console.log('🔍 getUserInfo - 原始响应:', response)
|
||||||
|
|
||||||
|
@ -12,7 +12,7 @@ export class ContentApi {
|
|||||||
static async getContent(contentKey: string): Promise<any> {
|
static async getContent(contentKey: string): Promise<any> {
|
||||||
try {
|
try {
|
||||||
console.log(`🚀 调用内容API,contentKey: ${contentKey}`)
|
console.log(`🚀 调用内容API,contentKey: ${contentKey}`)
|
||||||
const response = await ApiRequest.get(`/biz/index/content/${contentKey}`)
|
const response = await ApiRequest.get(`/aiol/index/content/${contentKey}`)
|
||||||
console.log('📋 内容API响应:', response)
|
console.log('📋 内容API响应:', response)
|
||||||
return response
|
return response
|
||||||
} catch (error) {
|
} catch (error) {
|
||||||
|
@ -109,7 +109,7 @@ export class CourseApi {
|
|||||||
console.log('🔍 查询参数:', queryParams)
|
console.log('🔍 查询参数:', queryParams)
|
||||||
|
|
||||||
// 调用后端API
|
// 调用后端API
|
||||||
const response = await ApiRequest.get<any>('/biz/course/list', queryParams)
|
const response = await ApiRequest.get<any>('/aiol/aiolCourse/query_list', queryParams)
|
||||||
console.log('🔍 课程列表API响应:', response)
|
console.log('🔍 课程列表API响应:', response)
|
||||||
|
|
||||||
// 处理后端响应格式
|
// 处理后端响应格式
|
||||||
@ -187,7 +187,7 @@ export class CourseApi {
|
|||||||
console.log('🚀 调用课程详情API,课程ID:', id)
|
console.log('🚀 调用课程详情API,课程ID:', id)
|
||||||
|
|
||||||
// 调用后端API
|
// 调用后端API
|
||||||
const response = await ApiRequest.get<any>('/biz/course/detail', { id })
|
const response = await ApiRequest.get<any>('/aiol/aiolCourse/detail', { id })
|
||||||
|
|
||||||
console.log('🔍 课程详情API响应:', response)
|
console.log('🔍 课程详情API响应:', response)
|
||||||
|
|
||||||
@ -294,7 +294,7 @@ export class CourseApi {
|
|||||||
static async getCourseById(id: string): Promise<ApiResponse<Course>> {
|
static async getCourseById(id: string): Promise<ApiResponse<Course>> {
|
||||||
try {
|
try {
|
||||||
// 调用后端课程详情接口
|
// 调用后端课程详情接口
|
||||||
const response = await ApiRequest.get<any>('/biz/course/detail', { id })
|
const response = await ApiRequest.get<any>('/aiol/aiolCourse/detail', { id })
|
||||||
|
|
||||||
console.log('🔍 课程详情API响应:', response)
|
console.log('🔍 课程详情API响应:', response)
|
||||||
|
|
||||||
@ -408,7 +408,7 @@ export class CourseApi {
|
|||||||
console.log('🚀 获取课程分类列表')
|
console.log('🚀 获取课程分类列表')
|
||||||
|
|
||||||
// 调用后端API(不需要token)
|
// 调用后端API(不需要token)
|
||||||
const response = await ApiRequest.get<any>('/biz/course/category/list')
|
const response = await ApiRequest.get<any>('/aiol/aiolCourse/category/list')
|
||||||
|
|
||||||
console.log('🔍 分类API响应:', response)
|
console.log('🔍 分类API响应:', response)
|
||||||
|
|
||||||
@ -452,7 +452,7 @@ export class CourseApi {
|
|||||||
console.log('🚀 获取课程专题列表')
|
console.log('🚀 获取课程专题列表')
|
||||||
|
|
||||||
// 调用后端API(不需要token)
|
// 调用后端API(不需要token)
|
||||||
const response = await ApiRequest.get<any>('/biz/course/subject/list')
|
const response = await ApiRequest.get<any>('/aiol/aiolCourse/subject/list')
|
||||||
|
|
||||||
console.log('🔍 专题API响应:', response)
|
console.log('🔍 专题API响应:', response)
|
||||||
|
|
||||||
@ -496,7 +496,7 @@ export class CourseApi {
|
|||||||
console.log('🚀 获取课程难度列表')
|
console.log('🚀 获取课程难度列表')
|
||||||
|
|
||||||
// 调用后端API(不需要token)
|
// 调用后端API(不需要token)
|
||||||
const response = await ApiRequest.get<any>('/biz/course/difficulty/list')
|
const response = await ApiRequest.get<any>('/aiol/aiolCourse/difficulty/list')
|
||||||
|
|
||||||
console.log('🔍 难度API响应:', response)
|
console.log('🔍 难度API响应:', response)
|
||||||
|
|
||||||
@ -551,9 +551,9 @@ export class CourseApi {
|
|||||||
}>> {
|
}>> {
|
||||||
try {
|
try {
|
||||||
console.log('🔍 报名课程,课程ID:', courseId)
|
console.log('🔍 报名课程,课程ID:', courseId)
|
||||||
console.log('🔍 API请求URL: /biz/course/' + courseId + '/enroll')
|
console.log('🔍 API请求URL: /aiol/aiolCourse/' + courseId + '/enroll')
|
||||||
|
|
||||||
const response = await ApiRequest.post<any>(`/biz/course/${courseId}/enroll`)
|
const response = await ApiRequest.post<any>(`/aiol/aiolCourse/${courseId}/enroll`)
|
||||||
console.log('🔍 报名API响应:', response)
|
console.log('🔍 报名API响应:', response)
|
||||||
|
|
||||||
// 处理后端响应格式
|
// 处理后端响应格式
|
||||||
@ -623,9 +623,9 @@ export class CourseApi {
|
|||||||
}>> {
|
}>> {
|
||||||
try {
|
try {
|
||||||
console.log('🔍 检查课程报名状态,课程ID:', courseId)
|
console.log('🔍 检查课程报名状态,课程ID:', courseId)
|
||||||
console.log('🔍 API请求URL: /biz/course/' + courseId + '/is_enrolled')
|
console.log('🔍 API请求URL: /aiol/aiolCourse/' + courseId + '/is_enrolled')
|
||||||
|
|
||||||
const response = await ApiRequest.get<any>(`/biz/course/${courseId}/is_enrolled`)
|
const response = await ApiRequest.get<any>(`/aiol/aiolCourse/${courseId}/is_enrolled`)
|
||||||
console.log('🔍 报名状态API响应:', response)
|
console.log('🔍 报名状态API响应:', response)
|
||||||
|
|
||||||
// 处理后端响应格式
|
// 处理后端响应格式
|
||||||
@ -695,9 +695,9 @@ export class CourseApi {
|
|||||||
static async getCourseSections(courseId: string): Promise<ApiResponse<CourseSectionListResponse>> {
|
static async getCourseSections(courseId: string): Promise<ApiResponse<CourseSectionListResponse>> {
|
||||||
try {
|
try {
|
||||||
console.log('🔍 获取课程章节数据,课程ID:', courseId)
|
console.log('🔍 获取课程章节数据,课程ID:', courseId)
|
||||||
console.log('🔍 API请求URL: /biz/course/' + courseId + '/section')
|
console.log('🔍 API请求URL: /aiol/aiolCourse/' + courseId + '/section')
|
||||||
|
|
||||||
const response = await ApiRequest.get<any>(`/biz/course/${courseId}/section`)
|
const response = await ApiRequest.get<any>(`/aiol/aiolCourse/${courseId}/section`)
|
||||||
console.log('🔍 章节API响应:', response)
|
console.log('🔍 章节API响应:', response)
|
||||||
|
|
||||||
// 处理后端响应格式
|
// 处理后端响应格式
|
||||||
@ -907,9 +907,9 @@ export class CourseApi {
|
|||||||
static async getCourseInstructors(courseId: string): Promise<ApiResponse<Instructor[]>> {
|
static async getCourseInstructors(courseId: string): Promise<ApiResponse<Instructor[]>> {
|
||||||
try {
|
try {
|
||||||
console.log('🔍 获取课程讲师数据,课程ID:', courseId)
|
console.log('🔍 获取课程讲师数据,课程ID:', courseId)
|
||||||
console.log('🔍 API请求URL: /biz/course/' + courseId + '/teachers')
|
console.log('🔍 API请求URL: /aiol/aiolCourse/' + courseId + '/teachers')
|
||||||
|
|
||||||
const response = await ApiRequest.get<any>(`/biz/course/${courseId}/teachers`)
|
const response = await ApiRequest.get<any>(`/aiol/aiolCourse/${courseId}/teachers`)
|
||||||
console.log('🔍 讲师API响应:', response)
|
console.log('🔍 讲师API响应:', response)
|
||||||
|
|
||||||
// 处理后端响应格式
|
// 处理后端响应格式
|
||||||
@ -968,9 +968,9 @@ export class CourseApi {
|
|||||||
static async getSectionVideos(courseId: string, sectionId: string): Promise<ApiResponse<SectionVideo[]>> {
|
static async getSectionVideos(courseId: string, sectionId: string): Promise<ApiResponse<SectionVideo[]>> {
|
||||||
try {
|
try {
|
||||||
console.log('🔍 获取章节视频数据,课程ID:', courseId, '章节ID:', sectionId)
|
console.log('🔍 获取章节视频数据,课程ID:', courseId, '章节ID:', sectionId)
|
||||||
console.log('🔍 API请求URL: /biz/course/' + courseId + '/section_video/' + sectionId)
|
console.log('🔍 API请求URL: /aiol/aiolCourse/' + courseId + '/section_video/' + sectionId)
|
||||||
|
|
||||||
const response = await ApiRequest.get<any>(`/biz/course/${courseId}/section_video/${sectionId}`)
|
const response = await ApiRequest.get<any>(`/aiol/aiolCourse/${courseId}/section_video/${sectionId}`)
|
||||||
console.log('🔍 章节视频API响应:', response)
|
console.log('🔍 章节视频API响应:', response)
|
||||||
|
|
||||||
// 处理后端响应格式
|
// 处理后端响应格式
|
||||||
@ -1090,9 +1090,9 @@ export class CourseApi {
|
|||||||
static async getCourseComments(courseId: string): Promise<ApiResponse<CourseComment[]>> {
|
static async getCourseComments(courseId: string): Promise<ApiResponse<CourseComment[]>> {
|
||||||
try {
|
try {
|
||||||
console.log('🔍 获取课程评论数据,课程ID:', courseId)
|
console.log('🔍 获取课程评论数据,课程ID:', courseId)
|
||||||
console.log('🔍 API请求URL: /biz/comment/course/' + courseId + '/list')
|
console.log('🔍 API请求URL: /aiol/aiolComment/course/' + courseId + '/list')
|
||||||
|
|
||||||
const response = await ApiRequest.get<any>(`/biz/comment/course/${courseId}/list`)
|
const response = await ApiRequest.get<any>(`/aiol/aiolComment/course/${courseId}/list`)
|
||||||
console.log('🔍 评论API响应:', response)
|
console.log('🔍 评论API响应:', response)
|
||||||
|
|
||||||
// 处理后端响应格式
|
// 处理后端响应格式
|
||||||
|
@ -29,7 +29,7 @@ export class ExamApi {
|
|||||||
*/
|
*/
|
||||||
static async createCourseRepo(data: CreateRepoRequest): Promise<ApiResponse<string>> {
|
static async createCourseRepo(data: CreateRepoRequest): Promise<ApiResponse<string>> {
|
||||||
console.log('🚀 创建课程题库:', data)
|
console.log('🚀 创建课程题库:', data)
|
||||||
const response = await ApiRequest.post<string>('/biz/repo/courseAdd', data)
|
const response = await ApiRequest.post<string>('/aiol/repo/courseAdd', data)
|
||||||
console.log('✅ 创建课程题库成功:', response)
|
console.log('✅ 创建课程题库成功:', response)
|
||||||
return response
|
return response
|
||||||
}
|
}
|
||||||
@ -38,7 +38,7 @@ export class ExamApi {
|
|||||||
* 获取课程题库
|
* 获取课程题库
|
||||||
*/
|
*/
|
||||||
static async getCourseRepoList(): Promise<ApiResponseWithResult<Repo[]>> {
|
static async getCourseRepoList(): Promise<ApiResponseWithResult<Repo[]>> {
|
||||||
const response = await ApiRequest.get<{ result: Repo[] }>(`/biz/repo/repoList`)
|
const response = await ApiRequest.get<{ result: Repo[] }>(`/aiol/repo/repoList`)
|
||||||
console.log('✅ 获取课程题库列表成功:', response)
|
console.log('✅ 获取课程题库列表成功:', response)
|
||||||
return response
|
return response
|
||||||
}
|
}
|
||||||
|
@ -1697,9 +1697,10 @@ onMounted(() => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
max-width: 1400px;
|
max-width: none;
|
||||||
margin: 0 auto;
|
margin: 0;
|
||||||
padding: 0 32px;
|
padding-left: 120px;
|
||||||
|
padding-right: 125px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.breadcrumb {
|
.breadcrumb {
|
||||||
@ -1723,7 +1724,7 @@ onMounted(() => {
|
|||||||
|
|
||||||
.course-content {
|
.course-content {
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: 30px;
|
gap: 64px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
flex-direction: row-reverse;
|
flex-direction: row-reverse;
|
||||||
}
|
}
|
||||||
@ -3635,10 +3636,21 @@ onMounted(() => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/* 响应式设计 */
|
/* 响应式设计 */
|
||||||
|
/* 大屏幕 - 使用120px左右边距 */
|
||||||
|
@media (min-width: 1400px) {
|
||||||
|
.container {
|
||||||
|
padding-left: 120px;
|
||||||
|
padding-right: 120px;
|
||||||
|
max-width: none;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@media (max-width: 1399px) and (min-width: 1200px) {
|
@media (max-width: 1399px) and (min-width: 1200px) {
|
||||||
.container {
|
.container {
|
||||||
padding: 0 24px;
|
padding: 0 24px;
|
||||||
max-width: 1200px;
|
max-width: 1200px;
|
||||||
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar {
|
.sidebar {
|
||||||
@ -3650,6 +3662,7 @@ onMounted(() => {
|
|||||||
.container {
|
.container {
|
||||||
padding: 0 20px;
|
padding: 0 20px;
|
||||||
max-width: 992px;
|
max-width: 992px;
|
||||||
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.course-content {
|
.course-content {
|
||||||
@ -3666,6 +3679,7 @@ onMounted(() => {
|
|||||||
.container {
|
.container {
|
||||||
padding: 0 16px;
|
padding: 0 16px;
|
||||||
max-width: 768px;
|
max-width: 768px;
|
||||||
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.course-content {
|
.course-content {
|
||||||
@ -3682,6 +3696,7 @@ onMounted(() => {
|
|||||||
.container {
|
.container {
|
||||||
padding: 0 16px;
|
padding: 0 16px;
|
||||||
max-width: 576px;
|
max-width: 576px;
|
||||||
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.course-content {
|
.course-content {
|
||||||
@ -3703,6 +3718,7 @@ onMounted(() => {
|
|||||||
.container {
|
.container {
|
||||||
padding: 0 16px;
|
padding: 0 16px;
|
||||||
max-width: 576px;
|
max-width: 576px;
|
||||||
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.video-player.unregistered {
|
.video-player.unregistered {
|
||||||
@ -3967,6 +3983,8 @@ onMounted(() => {
|
|||||||
@media (max-width: 480px) {
|
@media (max-width: 480px) {
|
||||||
.container {
|
.container {
|
||||||
padding: 0 12px;
|
padding: 0 12px;
|
||||||
|
margin: 0 auto;
|
||||||
|
max-width: 480px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.video-player.unregistered {
|
.video-player.unregistered {
|
||||||
@ -4025,6 +4043,8 @@ onMounted(() => {
|
|||||||
@media (max-width: 360px) {
|
@media (max-width: 360px) {
|
||||||
.container {
|
.container {
|
||||||
padding: 0 8px;
|
padding: 0 8px;
|
||||||
|
margin: 0 auto;
|
||||||
|
max-width: 360px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.video-player.unregistered {
|
.video-player.unregistered {
|
||||||
|
@ -126,8 +126,8 @@
|
|||||||
|
|
||||||
<!-- 课程描述 -->
|
<!-- 课程描述 -->
|
||||||
<div class="course-description">
|
<div class="course-description">
|
||||||
<div>本课程中的部分图片、音频和视频素材来源于网络,仅供教学使用。如有问题,请点击 <span>这里</span> 反馈</div>
|
<div>本课程中的部分图片、音频和视频素材来源于网络,仅供教学使用。如有问题,请点击 <span @click="openComplaintModal('feedback')">这里</span> 反馈</div>
|
||||||
<span>稿件投诉</span>
|
<span @click="openComplaintModal('complaint')">稿件投诉</span>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
|
||||||
@ -696,10 +696,10 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="ai-assistant-interface">
|
<div class="ai-assistant-interface">
|
||||||
<div class="banner-button">
|
<!-- <div class="banner-button">
|
||||||
<img src="/images/aiCompanion/切换@2x.png" alt="切换" class="button-icon-image">
|
<img src="/images/aiCompanion/切换@2x.png" alt="切换" class="button-icon-image">
|
||||||
<span class="button-text">普通</span>
|
<span class="button-text">普通</span>
|
||||||
</div>
|
</div> -->
|
||||||
|
|
||||||
|
|
||||||
<!-- AI主要内容区域 -->
|
<!-- AI主要内容区域 -->
|
||||||
@ -966,6 +966,59 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<!-- 投诉/反馈弹窗 -->
|
||||||
|
<n-modal v-model:show="complaintModalVisible" style="width: 600px;">
|
||||||
|
<div class="complaint-modal">
|
||||||
|
<!-- 自定义标题 -->
|
||||||
|
<div class="complaint-modal-header">
|
||||||
|
<div class="complaint-modal-title">投诉/反馈</div>
|
||||||
|
<div class="complaint-modal-divider"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="complaint-modal-content">
|
||||||
|
<!-- 投诉内容 -->
|
||||||
|
<div class="complaint-section">
|
||||||
|
<div class="complaint-label">投诉内容:</div>
|
||||||
|
<div class="complaint-input-wrapper">
|
||||||
|
<n-input
|
||||||
|
v-model:value="complaintContent"
|
||||||
|
type="textarea"
|
||||||
|
placeholder="请输入您想要投诉或反馈的内容"
|
||||||
|
:rows="8"
|
||||||
|
:maxlength="500"
|
||||||
|
show-count
|
||||||
|
class="complaint-textarea"
|
||||||
|
/>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 上传图片 -->
|
||||||
|
<div class="upload-section">
|
||||||
|
<div class="upload-label">上传图片:</div>
|
||||||
|
<div class="upload-wrapper">
|
||||||
|
<n-upload
|
||||||
|
v-model:file-list="uploadFileList"
|
||||||
|
:max="5"
|
||||||
|
list-type="image-card"
|
||||||
|
accept="image/*"
|
||||||
|
:custom-request="handleUpload"
|
||||||
|
>
|
||||||
|
<div class="upload-area">
|
||||||
|
<div class="upload-plus">+</div>
|
||||||
|
</div>
|
||||||
|
</n-upload>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 底部按钮 -->
|
||||||
|
<div class="modal-actions">
|
||||||
|
<n-button @click="cancelComplaint" class="cancel-btn">取消</n-button>
|
||||||
|
<n-button type="primary" @click="submitComplaint" class="submit-btn">提交</n-button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</n-modal>
|
||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script setup lang="ts">
|
<script setup lang="ts">
|
||||||
@ -1935,6 +1988,63 @@ const notesList = ref([
|
|||||||
])
|
])
|
||||||
const editingNoteIndex = ref(-1)
|
const editingNoteIndex = ref(-1)
|
||||||
|
|
||||||
|
// 投诉/反馈弹窗相关状态
|
||||||
|
const complaintModalVisible = ref(false)
|
||||||
|
const complaintContent = ref('')
|
||||||
|
const complaintType = ref<'feedback' | 'complaint'>('feedback')
|
||||||
|
const uploadFileList = ref([])
|
||||||
|
|
||||||
|
// 打开投诉弹窗
|
||||||
|
const openComplaintModal = (type: 'feedback' | 'complaint') => {
|
||||||
|
complaintType.value = type
|
||||||
|
complaintModalVisible.value = true
|
||||||
|
complaintContent.value = ''
|
||||||
|
uploadFileList.value = []
|
||||||
|
}
|
||||||
|
|
||||||
|
// 取消投诉
|
||||||
|
const cancelComplaint = () => {
|
||||||
|
complaintModalVisible.value = false
|
||||||
|
complaintContent.value = ''
|
||||||
|
uploadFileList.value = []
|
||||||
|
}
|
||||||
|
|
||||||
|
// 提交投诉
|
||||||
|
const submitComplaint = async () => {
|
||||||
|
if (!complaintContent.value.trim()) {
|
||||||
|
message.warning('请输入投诉内容')
|
||||||
|
return
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
// 这里可以调用API提交投诉
|
||||||
|
console.log('提交投诉:', {
|
||||||
|
type: complaintType.value,
|
||||||
|
content: complaintContent.value,
|
||||||
|
files: uploadFileList.value
|
||||||
|
})
|
||||||
|
|
||||||
|
message.success('提交成功,我们会尽快处理您的反馈')
|
||||||
|
complaintModalVisible.value = false
|
||||||
|
complaintContent.value = ''
|
||||||
|
uploadFileList.value = []
|
||||||
|
} catch (error) {
|
||||||
|
console.error('提交投诉失败:', error)
|
||||||
|
message.error('提交失败,请稍后重试')
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
// 处理文件上传
|
||||||
|
const handleUpload = ({ file, onFinish, onError }: any) => {
|
||||||
|
// 这里可以实现真实的文件上传逻辑
|
||||||
|
console.log('上传文件:', file)
|
||||||
|
|
||||||
|
// 模拟上传成功
|
||||||
|
setTimeout(() => {
|
||||||
|
onFinish()
|
||||||
|
}, 1000)
|
||||||
|
}
|
||||||
|
|
||||||
// 发送聊天消息
|
// 发送聊天消息
|
||||||
const sendMessage = () => {
|
const sendMessage = () => {
|
||||||
if (chatMessage.value.trim()) {
|
if (chatMessage.value.trim()) {
|
||||||
@ -2097,9 +2207,10 @@ onActivated(() => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
.container {
|
.container {
|
||||||
/* max-width: 1400px; */
|
max-width: none;
|
||||||
width: 100%;
|
margin: 0;
|
||||||
margin: 0 auto;
|
padding-left: 120px;
|
||||||
|
padding-right: 120px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.breadcrumb {
|
.breadcrumb {
|
||||||
@ -2126,7 +2237,7 @@ onActivated(() => {
|
|||||||
|
|
||||||
.course-content {
|
.course-content {
|
||||||
display: flex;
|
display: flex;
|
||||||
gap: 20px;
|
gap: 32px;
|
||||||
width: 100%;
|
width: 100%;
|
||||||
flex-direction: row-reverse;
|
flex-direction: row-reverse;
|
||||||
}
|
}
|
||||||
@ -4109,7 +4220,8 @@ onActivated(() => {
|
|||||||
/* AI助手界面样式 */
|
/* AI助手界面样式 */
|
||||||
.ai-assistant-interface {
|
.ai-assistant-interface {
|
||||||
position: relative;
|
position: relative;
|
||||||
min-width: 360px;
|
width: 360px; /* 固定宽度,不再自适应 */
|
||||||
|
flex-shrink: 0; /* 防止收缩 */
|
||||||
/* background: white; */
|
/* background: white; */
|
||||||
padding-top: 12px;
|
padding-top: 12px;
|
||||||
margin-top: 30px;
|
margin-top: 30px;
|
||||||
@ -5023,10 +5135,29 @@ onActivated(() => {
|
|||||||
}
|
}
|
||||||
|
|
||||||
/* 响应式设计 */
|
/* 响应式设计 */
|
||||||
|
/* 大屏幕 - 使用120px左右边距 */
|
||||||
|
@media (min-width: 1400px) {
|
||||||
|
.container {
|
||||||
|
padding-left: 120px;
|
||||||
|
padding-right: 120px;
|
||||||
|
max-width: none;
|
||||||
|
margin: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.course-content {
|
||||||
|
gap: 32px;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
@media (max-width: 1399px) and (min-width: 1200px) {
|
@media (max-width: 1399px) and (min-width: 1200px) {
|
||||||
.container {
|
.container {
|
||||||
padding: 0 24px;
|
padding: 0 24px;
|
||||||
max-width: 1200px;
|
max-width: 1200px;
|
||||||
|
margin: 0 auto;
|
||||||
|
}
|
||||||
|
|
||||||
|
.course-content {
|
||||||
|
gap: 20px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.sidebar {
|
.sidebar {
|
||||||
@ -5038,6 +5169,7 @@ onActivated(() => {
|
|||||||
.container {
|
.container {
|
||||||
padding: 0 20px;
|
padding: 0 20px;
|
||||||
max-width: 992px;
|
max-width: 992px;
|
||||||
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.course-content {
|
.course-content {
|
||||||
@ -5054,6 +5186,7 @@ onActivated(() => {
|
|||||||
.container {
|
.container {
|
||||||
padding: 0 16px;
|
padding: 0 16px;
|
||||||
max-width: 768px;
|
max-width: 768px;
|
||||||
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.course-content {
|
.course-content {
|
||||||
@ -5070,6 +5203,7 @@ onActivated(() => {
|
|||||||
.container {
|
.container {
|
||||||
padding: 0 16px;
|
padding: 0 16px;
|
||||||
max-width: 576px;
|
max-width: 576px;
|
||||||
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.course-content {
|
.course-content {
|
||||||
@ -5091,6 +5225,7 @@ onActivated(() => {
|
|||||||
.container {
|
.container {
|
||||||
padding: 0 16px;
|
padding: 0 16px;
|
||||||
max-width: 576px;
|
max-width: 576px;
|
||||||
|
margin: 0 auto;
|
||||||
}
|
}
|
||||||
|
|
||||||
.video-player.unregistered {
|
.video-player.unregistered {
|
||||||
@ -5355,6 +5490,8 @@ onActivated(() => {
|
|||||||
@media (max-width: 480px) {
|
@media (max-width: 480px) {
|
||||||
.container {
|
.container {
|
||||||
padding: 0 12px;
|
padding: 0 12px;
|
||||||
|
margin: 0 auto;
|
||||||
|
max-width: 480px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.video-player.unregistered {
|
.video-player.unregistered {
|
||||||
@ -5413,6 +5550,8 @@ onActivated(() => {
|
|||||||
@media (max-width: 360px) {
|
@media (max-width: 360px) {
|
||||||
.container {
|
.container {
|
||||||
padding: 0 8px;
|
padding: 0 8px;
|
||||||
|
margin: 0 auto;
|
||||||
|
max-width: 360px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.video-player.unregistered {
|
.video-player.unregistered {
|
||||||
@ -5599,7 +5738,7 @@ onActivated(() => {
|
|||||||
background: transparent;
|
background: transparent;
|
||||||
border: none;
|
border: none;
|
||||||
cursor: pointer;
|
cursor: pointer;
|
||||||
font-size: 12px;
|
font-size: 16px; /* 调整字体大小从12px到16px */
|
||||||
color: #666;
|
color: #666;
|
||||||
border-radius: 4px;
|
border-radius: 4px;
|
||||||
transition: all 0.2s ease;
|
transition: all 0.2s ease;
|
||||||
@ -6189,4 +6328,167 @@ onActivated(() => {
|
|||||||
.no-comments {
|
.no-comments {
|
||||||
color: #999;
|
color: #999;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* 投诉/反馈弹窗样式 */
|
||||||
|
.complaint-modal {
|
||||||
|
background: white;
|
||||||
|
border-radius: 2px;
|
||||||
|
padding: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.complaint-modal-header {
|
||||||
|
margin-bottom: 24px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.complaint-modal-title {
|
||||||
|
width: 72px;
|
||||||
|
height: 22px;
|
||||||
|
font-family: PingFangSC, PingFang SC;
|
||||||
|
font-weight: 500;
|
||||||
|
font-size: 16px;
|
||||||
|
color: #000000;
|
||||||
|
line-height: 22px;
|
||||||
|
text-align: left;
|
||||||
|
font-style: normal;
|
||||||
|
margin-bottom: 16px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.complaint-modal-divider {
|
||||||
|
width: 506px;
|
||||||
|
height: 1px;
|
||||||
|
background: #E6E6E6;
|
||||||
|
}
|
||||||
|
|
||||||
|
.complaint-modal-content {
|
||||||
|
padding: 20px 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
.complaint-section {
|
||||||
|
display: flex;
|
||||||
|
margin-bottom: 24px;
|
||||||
|
align-items: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.complaint-label {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #333;
|
||||||
|
font-weight: 500;
|
||||||
|
margin-right: 16px;
|
||||||
|
white-space: nowrap;
|
||||||
|
padding-top: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.complaint-input-wrapper {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.complaint-textarea {
|
||||||
|
width: 428px;
|
||||||
|
height: 214px;
|
||||||
|
background: #F5F8FB;
|
||||||
|
border-radius: 2px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.upload-section {
|
||||||
|
display: flex;
|
||||||
|
margin-bottom: 24px;
|
||||||
|
align-items: flex-start;
|
||||||
|
}
|
||||||
|
|
||||||
|
.upload-label {
|
||||||
|
font-size: 14px;
|
||||||
|
color: #333;
|
||||||
|
font-weight: 500;
|
||||||
|
margin-right: 16px;
|
||||||
|
white-space: nowrap;
|
||||||
|
padding-top: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.upload-wrapper {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
.upload-area {
|
||||||
|
width: 100px;
|
||||||
|
height: 100px;
|
||||||
|
background: white;
|
||||||
|
border: 1px dashed #d9d9d9;
|
||||||
|
border-radius: 1px;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
cursor: pointer;
|
||||||
|
transition: border-color 0.3s;
|
||||||
|
}
|
||||||
|
|
||||||
|
.upload-area:hover {
|
||||||
|
border-color: #40a9ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.upload-plus {
|
||||||
|
width: 20px;
|
||||||
|
height: 20px;
|
||||||
|
position: relative;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
justify-content: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.upload-plus::before,
|
||||||
|
.upload-plus::after {
|
||||||
|
content: '';
|
||||||
|
position: absolute;
|
||||||
|
background: #666666;
|
||||||
|
}
|
||||||
|
|
||||||
|
.upload-plus::before {
|
||||||
|
width: 10px;
|
||||||
|
height: 1px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.upload-plus::after {
|
||||||
|
width: 1px;
|
||||||
|
height: 10px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.modal-actions {
|
||||||
|
display: flex;
|
||||||
|
justify-content: flex-end;
|
||||||
|
gap: 12px;
|
||||||
|
padding-top: 24px;
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
.cancel-btn {
|
||||||
|
background: #f5f5f5;
|
||||||
|
border: 1px solid #d9d9d9;
|
||||||
|
color: #666;
|
||||||
|
}
|
||||||
|
|
||||||
|
.cancel-btn:hover {
|
||||||
|
background: #e6f7ff;
|
||||||
|
border-color: #40a9ff;
|
||||||
|
color: #40a9ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.submit-btn {
|
||||||
|
background: #1890ff;
|
||||||
|
border: 1px solid #1890ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
.submit-btn:hover {
|
||||||
|
background: #40a9ff;
|
||||||
|
border-color: #40a9ff;
|
||||||
|
}
|
||||||
|
|
||||||
|
/* 课程描述中的可点击元素样式 */
|
||||||
|
.course-description span {
|
||||||
|
color: #1890ff;
|
||||||
|
cursor: pointer;
|
||||||
|
text-decoration: underline;
|
||||||
|
}
|
||||||
|
|
||||||
|
.course-description span:hover {
|
||||||
|
color: #40a9ff;
|
||||||
|
}
|
||||||
</style>
|
</style>
|
Loading…
x
Reference in New Issue
Block a user