feat: Add initial frontend setup including authentication, instructor, and admin course management modules.
This commit is contained in:
parent
9fd217e1db
commit
19844f343b
16 changed files with 2065 additions and 293 deletions
|
|
@ -31,6 +31,127 @@ export interface UsersListResponse {
|
|||
data: AdminUserResponse[];
|
||||
}
|
||||
|
||||
// Pending Course interfaces
|
||||
export interface PendingCourseUser {
|
||||
id: number;
|
||||
email: string;
|
||||
username: string;
|
||||
}
|
||||
|
||||
export interface PendingCourseInstructor {
|
||||
user_id: number;
|
||||
is_primary: boolean;
|
||||
user: PendingCourseUser;
|
||||
}
|
||||
|
||||
export interface PendingCourseSubmission {
|
||||
id: number;
|
||||
submitted_by: number;
|
||||
created_at: string;
|
||||
submitter: PendingCourseUser;
|
||||
}
|
||||
|
||||
export interface PendingCourse {
|
||||
id: number;
|
||||
title: {
|
||||
th: string;
|
||||
en: string;
|
||||
};
|
||||
slug: string;
|
||||
description: {
|
||||
th: string;
|
||||
en: string;
|
||||
};
|
||||
thumbnail_url: string | null;
|
||||
status: string;
|
||||
created_at: string;
|
||||
updated_at: string;
|
||||
created_by: number;
|
||||
creator: PendingCourseUser;
|
||||
instructors: PendingCourseInstructor[];
|
||||
chapters_count: number;
|
||||
lessons_count: number;
|
||||
latest_submission: PendingCourseSubmission | null;
|
||||
}
|
||||
|
||||
export interface PendingCoursesListResponse {
|
||||
code: number;
|
||||
message: string;
|
||||
data: PendingCourse[];
|
||||
total: number;
|
||||
}
|
||||
|
||||
// Course Detail interfaces for admin review
|
||||
export interface CourseCategory {
|
||||
id: number;
|
||||
name: {
|
||||
th: string;
|
||||
en: string;
|
||||
};
|
||||
}
|
||||
|
||||
export interface CourseLesson {
|
||||
id: number;
|
||||
title: {
|
||||
th: string;
|
||||
en: string;
|
||||
};
|
||||
type: string;
|
||||
sort_order: number;
|
||||
is_published: boolean;
|
||||
}
|
||||
|
||||
export interface CourseChapter {
|
||||
id: number;
|
||||
title: {
|
||||
th: string;
|
||||
en: string;
|
||||
};
|
||||
sort_order: number;
|
||||
is_published: boolean;
|
||||
lessons: CourseLesson[];
|
||||
}
|
||||
|
||||
export interface ApprovalHistory {
|
||||
id: number;
|
||||
action: string;
|
||||
comment: string | null;
|
||||
created_at: string;
|
||||
submitter: PendingCourseUser;
|
||||
reviewer: PendingCourseUser | null;
|
||||
}
|
||||
|
||||
export interface CourseDetailForReview {
|
||||
id: number;
|
||||
title: {
|
||||
th: string;
|
||||
en: string;
|
||||
};
|
||||
slug: string;
|
||||
description: {
|
||||
th: string;
|
||||
en: string;
|
||||
};
|
||||
thumbnail_url: string | null;
|
||||
price: number;
|
||||
is_free: boolean;
|
||||
have_certificate: boolean;
|
||||
status: string;
|
||||
created_at: string;
|
||||
updated_at: string;
|
||||
category: CourseCategory;
|
||||
creator: PendingCourseUser;
|
||||
instructors: PendingCourseInstructor[];
|
||||
chapters: CourseChapter[];
|
||||
approval_history: ApprovalHistory[];
|
||||
}
|
||||
|
||||
export interface CourseDetailForReviewResponse {
|
||||
code: number;
|
||||
message: string;
|
||||
data: CourseDetailForReview;
|
||||
}
|
||||
|
||||
// Mock data for development
|
||||
const MOCK_USERS: AdminUserResponse[] = [
|
||||
{
|
||||
|
|
@ -83,6 +204,121 @@ const MOCK_USERS: AdminUserResponse[] = [
|
|||
}
|
||||
];
|
||||
|
||||
// Mock pending courses data
|
||||
const MOCK_PENDING_COURSES: PendingCourse[] = [
|
||||
{
|
||||
id: 1,
|
||||
title: { th: 'พื้นฐาน JavaScript', en: 'JavaScript Fundamentals' },
|
||||
slug: 'javascript-fundamentals',
|
||||
description: { th: 'เรียนรู้ JavaScript ตั้งแต่เริ่มต้น', en: 'Learn JavaScript from scratch' },
|
||||
thumbnail_url: null,
|
||||
status: 'PENDING',
|
||||
created_at: '2024-02-01T00:00:00Z',
|
||||
updated_at: '2024-02-10T00:00:00Z',
|
||||
created_by: 2,
|
||||
creator: { id: 2, email: 'instructor@elearning.local', username: 'instructor' },
|
||||
instructors: [
|
||||
{
|
||||
user_id: 2,
|
||||
is_primary: true,
|
||||
user: { id: 2, email: 'instructor@elearning.local', username: 'instructor' }
|
||||
}
|
||||
],
|
||||
chapters_count: 5,
|
||||
lessons_count: 15,
|
||||
latest_submission: {
|
||||
id: 1,
|
||||
submitted_by: 2,
|
||||
created_at: '2024-02-10T00:00:00Z',
|
||||
submitter: { id: 2, email: 'instructor@elearning.local', username: 'instructor' }
|
||||
}
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: { th: 'React สำหรับผู้เริ่มต้น', en: 'React for Beginners' },
|
||||
slug: 'react-for-beginners',
|
||||
description: { th: 'เรียนรู้ React ตั้งแต่พื้นฐาน', en: 'Learn React from basics' },
|
||||
thumbnail_url: null,
|
||||
status: 'PENDING',
|
||||
created_at: '2024-02-05T00:00:00Z',
|
||||
updated_at: '2024-02-12T00:00:00Z',
|
||||
created_by: 2,
|
||||
creator: { id: 2, email: 'instructor@elearning.local', username: 'instructor' },
|
||||
instructors: [
|
||||
{
|
||||
user_id: 2,
|
||||
is_primary: true,
|
||||
user: { id: 2, email: 'instructor@elearning.local', username: 'instructor' }
|
||||
}
|
||||
],
|
||||
chapters_count: 8,
|
||||
lessons_count: 24,
|
||||
latest_submission: {
|
||||
id: 2,
|
||||
submitted_by: 2,
|
||||
created_at: '2024-02-12T00:00:00Z',
|
||||
submitter: { id: 2, email: 'instructor@elearning.local', username: 'instructor' }
|
||||
}
|
||||
}
|
||||
];
|
||||
|
||||
// Mock course detail for review
|
||||
const MOCK_COURSE_DETAIL: CourseDetailForReview = {
|
||||
id: 1,
|
||||
title: { th: 'พื้นฐาน JavaScript', en: 'JavaScript Fundamentals' },
|
||||
slug: 'javascript-fundamentals',
|
||||
description: { th: 'เรียนรู้ JavaScript ตั้งแต่เริ่มต้น รวมถึง ES6+ features และ best practices', en: 'Learn JavaScript from scratch including ES6+ features and best practices' },
|
||||
thumbnail_url: null,
|
||||
price: 990,
|
||||
is_free: false,
|
||||
have_certificate: true,
|
||||
status: 'PENDING',
|
||||
created_at: '2024-02-01T00:00:00Z',
|
||||
updated_at: '2024-02-10T00:00:00Z',
|
||||
category: { id: 1, name: { th: 'การพัฒนาเว็บไซต์', en: 'Web Development' } },
|
||||
creator: { id: 2, email: 'instructor@elearning.local', username: 'instructor' },
|
||||
instructors: [
|
||||
{
|
||||
user_id: 2,
|
||||
is_primary: true,
|
||||
user: { id: 2, email: 'instructor@elearning.local', username: 'instructor' }
|
||||
}
|
||||
],
|
||||
chapters: [
|
||||
{
|
||||
id: 1,
|
||||
title: { th: 'แนะนำ JavaScript', en: 'Introduction to JavaScript' },
|
||||
sort_order: 1,
|
||||
is_published: true,
|
||||
lessons: [
|
||||
{ id: 1, title: { th: 'JavaScript คืออะไร', en: 'What is JavaScript' }, type: 'VIDEO', sort_order: 1, is_published: true },
|
||||
{ id: 2, title: { th: 'ติดตั้ง Development Environment', en: 'Setup Development Environment' }, type: 'VIDEO', sort_order: 2, is_published: true },
|
||||
{ id: 3, title: { th: 'แบบทดสอบบทที่ 1', en: 'Chapter 1 Quiz' }, type: 'QUIZ', sort_order: 3, is_published: true }
|
||||
]
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
title: { th: 'Variables และ Data Types', en: 'Variables and Data Types' },
|
||||
sort_order: 2,
|
||||
is_published: true,
|
||||
lessons: [
|
||||
{ id: 4, title: { th: 'var, let และ const', en: 'var, let and const' }, type: 'VIDEO', sort_order: 1, is_published: true },
|
||||
{ id: 5, title: { th: 'Primitive Data Types', en: 'Primitive Data Types' }, type: 'VIDEO', sort_order: 2, is_published: true }
|
||||
]
|
||||
}
|
||||
],
|
||||
approval_history: [
|
||||
{
|
||||
id: 1,
|
||||
action: 'SUBMITTED',
|
||||
comment: null,
|
||||
created_at: '2024-02-10T10:00:00Z',
|
||||
submitter: { id: 2, email: 'instructor@elearning.local', username: 'instructor' },
|
||||
reviewer: null
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
// Helper function to get auth token from cookie or localStorage
|
||||
const getAuthToken = (): string => {
|
||||
const tokenCookie = useCookie('token');
|
||||
|
|
@ -174,6 +410,87 @@ export const adminService = {
|
|||
});
|
||||
},
|
||||
|
||||
// ============ Pending Courses ============
|
||||
async getPendingCourses(): Promise<PendingCourse[]> {
|
||||
const config = useRuntimeConfig();
|
||||
const useMockData = config.public.useMockData as boolean;
|
||||
|
||||
if (useMockData) {
|
||||
await new Promise(resolve => setTimeout(resolve, 500));
|
||||
return MOCK_PENDING_COURSES;
|
||||
}
|
||||
|
||||
const token = getAuthToken();
|
||||
const response = await $fetch<PendingCoursesListResponse>('/api/admin/courses/pending', {
|
||||
baseURL: config.public.apiBaseUrl as string,
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`
|
||||
}
|
||||
});
|
||||
|
||||
return response.data;
|
||||
},
|
||||
|
||||
async getCourseForReview(courseId: number): Promise<CourseDetailForReview> {
|
||||
const config = useRuntimeConfig();
|
||||
const useMockData = config.public.useMockData as boolean;
|
||||
|
||||
if (useMockData) {
|
||||
await new Promise(resolve => setTimeout(resolve, 500));
|
||||
return MOCK_COURSE_DETAIL;
|
||||
}
|
||||
|
||||
const token = getAuthToken();
|
||||
const response = await $fetch<CourseDetailForReviewResponse>(`/api/admin/courses/${courseId}`, {
|
||||
baseURL: config.public.apiBaseUrl as string,
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`
|
||||
}
|
||||
});
|
||||
|
||||
return response.data;
|
||||
},
|
||||
|
||||
async approveCourse(courseId: number, comment?: string): Promise<void> {
|
||||
const config = useRuntimeConfig();
|
||||
const useMockData = config.public.useMockData as boolean;
|
||||
|
||||
if (useMockData) {
|
||||
await new Promise(resolve => setTimeout(resolve, 500));
|
||||
return;
|
||||
}
|
||||
|
||||
const token = getAuthToken();
|
||||
await $fetch(`/api/admin/courses/${courseId}/approve`, {
|
||||
method: 'POST',
|
||||
baseURL: config.public.apiBaseUrl as string,
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`
|
||||
},
|
||||
body: { comment: comment || '' }
|
||||
});
|
||||
},
|
||||
|
||||
async rejectCourse(courseId: number, comment: string): Promise<void> {
|
||||
const config = useRuntimeConfig();
|
||||
const useMockData = config.public.useMockData as boolean;
|
||||
|
||||
if (useMockData) {
|
||||
await new Promise(resolve => setTimeout(resolve, 500));
|
||||
return;
|
||||
}
|
||||
|
||||
const token = getAuthToken();
|
||||
await $fetch(`/api/admin/courses/${courseId}/reject`, {
|
||||
method: 'POST',
|
||||
baseURL: config.public.apiBaseUrl as string,
|
||||
headers: {
|
||||
Authorization: `Bearer ${token}`
|
||||
},
|
||||
body: { comment }
|
||||
});
|
||||
},
|
||||
|
||||
// ============ Categories ============
|
||||
async getCategories(): Promise<CategoryResponse[]> {
|
||||
const config = useRuntimeConfig();
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue