feat: add authentication modal component and user authentication logic

- Implemented AuthModal.vue for user login and registration with form handling.
- Created useAuth composable for managing user state and authentication requests.
- Added admin route middleware to protect admin routes.
- Developed admin login page with authentication checks.
- Implemented API endpoints for user management (login, logout, fetch user, register).
- Created database migrations for users table and updated movies table.
- Added utility functions for password hashing and JWT token management.

server/api/admin/movies.get.ts

@@ -1,5 +1,5 @@
 import { movies } from '../../database/schema'
-import { desc, like, sql } from 'drizzle-orm'
+import { desc, eq, like, sql } from 'drizzle-orm'
 
 export default defineEventHandler(async (event) => {
   const db = useDb()
@@ -26,7 +26,7 @@ export default defineEventHandler(async (event) => {
       .select()
       .from(movies)
       .where(whereClause)
-      .orderBy(desc(movies.syncedAt))
+      .orderBy(desc(movies.apiUpdatedAt), desc(movies.year), desc(movies.syncedAt))
       .limit(limit)
       .offset(offset),
     db

server/api/admin/sync.post.ts

@@ -66,6 +66,7 @@ export default defineEventHandler(async (event) => {
           categories: movie.categories || null,
           countries: movie.countries || null,
           sources: movie.sources || null,
+          apiUpdatedAt: movie.updatedAt ? new Date(movie.updatedAt) : null,
           syncedAt: new Date(),
         })
         .where(eq(movies.id, existing[0].id))
@@ -88,6 +89,7 @@ export default defineEventHandler(async (event) => {
         categories: movie.categories || null,
         countries: movie.countries || null,
         sources: movie.sources || null,
+        apiUpdatedAt: movie.updatedAt ? new Date(movie.updatedAt) : null,
         active: false,
       })
       created++

server/api/admin/thanh-vien.get.ts

@@ -0,0 +1,38 @@
+import { users } from '../../database/schema'
+import { desc, like, sql } from 'drizzle-orm'
+
+export default defineEventHandler(async (event) => {
+  const db = useDb()
+  const query = getQuery(event)
+  const keyword = typeof query.keyword === 'string' ? query.keyword.trim() : ''
+
+  const whereClause = keyword
+    ? like(users.name, `%${keyword}%`)
+    : undefined
+
+  const [items, countResult] = await Promise.all([
+    db
+      .select({
+        id: users.id,
+        name: users.name,
+        email: users.email,
+        role: users.role,
+        avatar: users.avatar,
+        active: users.active,
+        createdAt: users.createdAt,
+      })
+      .from(users)
+      .where(whereClause)
+      .orderBy(desc(users.createdAt))
+      .limit(100),
+    db
+      .select({ count: sql<number>`count(*)` })
+      .from(users)
+      .where(whereClause),
+  ])
+
+  return {
+    items,
+    total: countResult[0]?.count ?? 0,
+  }
+})

server/api/admin/thanh-vien/[id].delete.ts

@@ -0,0 +1,25 @@
+import { users } from '../../../database/schema'
+import { eq } from 'drizzle-orm'
+
+export default defineEventHandler(async (event) => {
+  const db = useDb()
+  const id = Number(getRouterParam(event, 'id'))
+
+  if (!id) {
+    throw createError({ statusCode: 400, message: 'Thiếu ID thành viên' })
+  }
+
+  const existing = await db.select().from(users).where(eq(users.id, id)).limit(1)
+  if (!existing.length) {
+    throw createError({ statusCode: 404, message: 'Không tìm thấy thành viên' })
+  }
+
+  const currentUser = event.context.user
+  if (currentUser?.id === id) {
+    throw createError({ statusCode: 400, message: 'Không thể xoá chính mình' })
+  }
+
+  await db.delete(users).where(eq(users.id, id))
+
+  return { success: true, id }
+})

server/api/admin/thanh-vien/[id].patch.ts

@@ -0,0 +1,35 @@
+import { users } from '../../../database/schema'
+import { eq } from 'drizzle-orm'
+
+export default defineEventHandler(async (event) => {
+  const db = useDb()
+  const id = Number(getRouterParam(event, 'id'))
+  const body = await readBody(event)
+
+  if (!id) {
+    throw createError({ statusCode: 400, message: 'Thiếu ID thành viên' })
+  }
+
+  const existing = await db.select().from(users).where(eq(users.id, id)).limit(1)
+  if (!existing.length) {
+    throw createError({ statusCode: 404, message: 'Không tìm thấy thành viên' })
+  }
+
+  const updates: Record<string, any> = {}
+
+  if ('role' in body && ['admin', 'moderator', 'user'].includes(body.role)) {
+    updates.role = body.role
+  }
+
+  if (typeof body.active === 'boolean') {
+    updates.active = body.active
+  }
+
+  if (!Object.keys(updates).length) {
+    throw createError({ statusCode: 400, message: 'Không có dữ liệu cập nhật' })
+  }
+
+  await db.update(users).set(updates).where(eq(users.id, id))
+
+  return { success: true, id, ...updates }
+})

server/api/auth/login.post.ts

@@ -0,0 +1,42 @@
+import { users } from '../../database/schema'
+import { eq, and } from 'drizzle-orm'
+import { verifyPassword, signToken } from '../../utils/auth'
+
+export default defineEventHandler(async (event) => {
+  const db = useDb()
+  const body = await readBody(event)
+
+  const email = typeof body.email === 'string' ? body.email.trim().toLowerCase() : ''
+  const password = typeof body.password === 'string' ? body.password : ''
+
+  if (!email || !password) {
+    throw createError({ statusCode: 400, message: 'Email và mật khẩu là bắt buộc' })
+  }
+
+  const result = await db.select().from(users).where(and(eq(users.email, email), eq(users.active, true))).limit(1)
+  if (!result.length) {
+    throw createError({ statusCode: 401, message: 'Email hoặc mật khẩu không đúng' })
+  }
+
+  const user = result[0]
+  const valid = await verifyPassword(password, user.password)
+  if (!valid) {
+    throw createError({ statusCode: 401, message: 'Email hoặc mật khẩu không đúng' })
+  }
+
+  const payload = { id: user.id, email: user.email, role: user.role }
+  const token = signToken(payload)
+
+  setCookie(event, 'token', token, {
+    httpOnly: true,
+    secure: false,
+    sameSite: 'lax',
+    maxAge: 60 * 60 * 24 * 7,
+    path: '/',
+  })
+
+  return {
+    user: { id: user.id, email: user.email, name: user.name, role: user.role, avatar: user.avatar },
+    token,
+  }
+})

server/api/auth/logout.post.ts

@@ -0,0 +1,4 @@
+export default defineEventHandler((event) => {
+  deleteCookie(event, 'token', { path: '/' })
+  return { success: true }
+})

server/api/auth/me.get.ts

@@ -0,0 +1,32 @@
+import { users } from '../../database/schema'
+import { eq } from 'drizzle-orm'
+import { getTokenFromEvent, verifyToken } from '../../utils/auth'
+
+export default defineEventHandler(async (event) => {
+  const token = getTokenFromEvent(event)
+  if (!token) {
+    throw createError({ statusCode: 401, message: 'Chưa đăng nhập' })
+  }
+
+  const payload = verifyToken(token)
+  if (!payload) {
+    deleteCookie(event, 'token', { path: '/' })
+    throw createError({ statusCode: 401, message: 'Phiên đăng nhập hết hạn' })
+  }
+
+  const db = useDb()
+  const result = await db.select().from(users).where(eq(users.id, payload.id)).limit(1)
+  if (!result.length || !result[0].active) {
+    deleteCookie(event, 'token', { path: '/' })
+    throw createError({ statusCode: 401, message: 'Tài khoản không tồn tại hoặc đã bị khóa' })
+  }
+
+  const user = result[0]
+  return {
+    id: user.id,
+    email: user.email,
+    name: user.name,
+    role: user.role,
+    avatar: user.avatar,
+  }
+})

server/api/auth/register.post.ts

@@ -0,0 +1,56 @@
+import { users } from '../../database/schema'
+import { eq, sql } from 'drizzle-orm'
+import { hashPassword, signToken } from '../../utils/auth'
+
+export default defineEventHandler(async (event) => {
+  const db = useDb()
+  const body = await readBody(event)
+
+  const email = typeof body.email === 'string' ? body.email.trim().toLowerCase() : ''
+  const password = typeof body.password === 'string' ? body.password : ''
+  const name = typeof body.name === 'string' ? body.name.trim() : ''
+
+  if (!email || !password) {
+    throw createError({ statusCode: 400, message: 'Email và mật khẩu là bắt buộc' })
+  }
+
+  if (!/^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email)) {
+    throw createError({ statusCode: 400, message: 'Email không hợp lệ' })
+  }
+
+  if (password.length < 6) {
+    throw createError({ statusCode: 400, message: 'Mật khẩu phải có ít nhất 6 ký tự' })
+  }
+
+  const existing = await db.select().from(users).where(eq(users.email, email)).limit(1)
+  if (existing.length) {
+    throw createError({ statusCode: 409, message: 'Email đã được sử dụng' })
+  }
+
+  const hashedPassword = await hashPassword(password)
+  const isAdmin = (await db.select({ count: sql<number>`count(*)` }).from(users))[0]?.count === 0
+
+  const result = await db.insert(users).values({
+    email,
+    password: hashedPassword,
+    name: name || email.split('@')[0],
+    role: isAdmin ? 'admin' : 'user',
+  })
+
+  const userId = result[0].insertId
+  const user = { id: userId, email, role: isAdmin ? 'admin' : 'user' }
+  const token = signToken(user)
+
+  setCookie(event, 'token', token, {
+    httpOnly: true,
+    secure: false,
+    sameSite: 'lax',
+    maxAge: 60 * 60 * 24 * 7,
+    path: '/',
+  })
+
+  return {
+    user: { id: userId, email, name: name || email.split('@')[0], role: user.role },
+    token,
+  }
+})

server/api/movies.get.ts

@@ -31,7 +31,7 @@ export default defineEventHandler(async (event) => {
       .select()
       .from(movies)
       .where(whereClause)
-      .orderBy(desc(movies.syncedAt))
+      .orderBy(desc(movies.apiUpdatedAt), desc(movies.year), desc(movies.syncedAt))
       .limit(limit)
       .offset(offset),
     db