feat: add episode total handling and display across movie pages

- Implemented `getEpisodeDisplay` function to format episode information for movies.
- Updated movie display components to show episode information using the new function.
- Added `episodeTotal` field to the movies schema and updated related API endpoints to handle this new field.
- Enhanced movie synchronization process to fetch and store episode totals from external sources.
- Created a new error page component for better user experience on 404 errors.
- Added migration scripts to update the database schema for episode totals.

server/api/admin/movies.get.ts

@@ -1,5 +1,5 @@
 import { movies } from '../../database/schema'
-import { desc, eq, like, sql } from 'drizzle-orm'
+import { desc, eq, like, and, sql } from 'drizzle-orm'
 
 export default defineEventHandler(async (event) => {
   const db = useDb()
@@ -9,17 +9,18 @@ export default defineEventHandler(async (event) => {
   const offset = (page - 1) * limit
   const keyword = typeof query.keyword === 'string' ? query.keyword.trim() : ''
   const status = typeof query.status === 'string' ? query.status : ''
+  const source = typeof query.source === 'string' ? query.source : ''
+  const type = typeof query.type === 'string' ? query.type : ''
 
-  let whereClause = undefined
-  if (keyword && status === 'active') {
-    whereClause = sql`${like(movies.name, `%${keyword}%`)} AND ${movies.active} = true`
-  } else if (keyword) {
-    whereClause = like(movies.name, `%${keyword}%`)
-  } else if (status === 'active') {
-    whereClause = eq(movies.active, true)
-  } else if (status === 'inactive') {
-    whereClause = eq(movies.active, false)
-  }
+  const conditions: any[] = []
+
+  if (keyword) conditions.push(like(movies.name, `%${keyword}%`))
+  if (status === 'active') conditions.push(eq(movies.active, true))
+  else if (status === 'inactive') conditions.push(eq(movies.active, false))
+  if (source) conditions.push(eq(movies.source, source))
+  if (type) conditions.push(eq(movies.type, type))
+
+  const whereClause = conditions.length > 0 ? and(...conditions) : undefined
 
   const [items, countResult] = await Promise.all([
     db

server/api/admin/stats.get.ts

@@ -1,5 +1,5 @@
 import { movies } from '../../database/schema'
-import { sql } from 'drizzle-orm'
+import { sql, eq } from 'drizzle-orm'
 
 export default defineEventHandler(async () => {
   const db = useDb()
@@ -8,11 +8,34 @@ export default defineEventHandler(async () => {
     total: sql<number>`count(*)`,
     active: sql<number>`SUM(CASE WHEN ${movies.active} = true THEN 1 ELSE 0 END)`,
     inactive: sql<number>`SUM(CASE WHEN ${movies.active} = false THEN 1 ELSE 0 END)`,
+    series: sql<number>`SUM(CASE WHEN ${movies.type} = 'series' THEN 1 ELSE 0 END)`,
+    single: sql<number>`SUM(CASE WHEN ${movies.type} = 'single' THEN 1 ELSE 0 END)`,
+    totalViews: sql<number>`COALESCE(SUM(${movies.views}), 0)`,
+    ophim: sql<number>`SUM(CASE WHEN ${movies.source} = 'ophim' THEN 1 ELSE 0 END)`,
+    nguonc: sql<number>`SUM(CASE WHEN ${movies.source} = 'nguonc' THEN 1 ELSE 0 END)`,
+    kkphim: sql<number>`SUM(CASE WHEN ${movies.source} = 'kkphim' THEN 1 ELSE 0 END)`,
   }).from(movies)
 
+  const topMovies = await db.select({
+    name: movies.name,
+    views: movies.views,
+    slug: movies.slug,
+    source: movies.source,
+  }).from(movies)
+    .where(eq(movies.active, true))
+    .orderBy(sql`${movies.views} DESC`)
+    .limit(5)
+
   return {
     total: stats?.total ?? 0,
     active: stats?.active ?? 0,
     inactive: stats?.inactive ?? 0,
+    series: stats?.series ?? 0,
+    single: stats?.single ?? 0,
+    totalViews: stats?.totalViews ?? 0,
+    ophim: stats?.ophim ?? 0,
+    nguonc: stats?.nguonc ?? 0,
+    kkphim: stats?.kkphim ?? 0,
+    topMovies: topMovies || [],
   }
 })

server/api/admin/sync.post.ts

@@ -1,9 +1,50 @@
 import { movies } from '../../database/schema'
 import { eq, and } from 'drizzle-orm'
-import { getOphimKoreanMovies, getNguoncKoreanMovies, getKkphimKoreanMovies } from '../../utils/movies'
+import {
+  getOphimKoreanMovies,
+  getNguoncKoreanMovies,
+  getKkphimKoreanMovies,
+  getOphimDetail,
+  getNguoncDetail,
+  getKkphimDetail,
+} from '../../utils/movies'
 
 const SYNC_PAGES = 10
 const ALL_SOURCES = ['ophim', 'nguonc', 'kkphim'] as const
+const DETAIL_CONCURRENCY = 5
+
+const detailFetchers = {
+  ophim: getOphimDetail,
+  nguonc: getNguoncDetail,
+  kkphim: getKkphimDetail,
+}
+
+async function fetchEpisodeTotal(source: string, slug: string): Promise<string | undefined> {
+  const fetcher = detailFetchers[source as keyof typeof detailFetchers]
+  if (!fetcher) return undefined
+  try {
+    const detail = await fetcher(slug)
+    return detail.episodeTotal || undefined
+  } catch {
+    return undefined
+  }
+}
+
+async function enrichWithEpisodeTotal(moviesList: any[]): Promise<void> {
+  const moviesNeedTotal = moviesList.filter((m) => m.type !== 'single' && !m.episodeTotal && m.slug)
+
+  for (let i = 0; i < moviesNeedTotal.length; i += DETAIL_CONCURRENCY) {
+    const batch = moviesNeedTotal.slice(i, i + DETAIL_CONCURRENCY)
+    const results = await Promise.allSettled(
+      batch.map((movie) => fetchEpisodeTotal(movie.source, movie.slug)),
+    )
+    results.forEach((result, idx) => {
+      if (result.status === 'fulfilled' && result.value) {
+        batch[idx].episodeTotal = result.value
+      }
+    })
+  }
+}
 
 export default defineEventHandler(async (event) => {
   const db = useDb()
@@ -38,6 +79,8 @@ export default defineEventHandler(async (event) => {
     }
   }
 
+  await enrichWithEpisodeTotal(allMovies)
+
   let created = 0
   let updated = 0
 
@@ -59,6 +102,7 @@ export default defineEventHandler(async (event) => {
           year: movie.year || null,
           time: movie.time || null,
           episode: movie.episode || null,
+          episodeTotal: movie.episodeTotal || null,
           quality: movie.quality || null,
           lang: movie.lang || null,
           type: movie.type || null,
@@ -82,6 +126,7 @@ export default defineEventHandler(async (event) => {
         year: movie.year || null,
         time: movie.time || null,
         episode: movie.episode || null,
+        episodeTotal: movie.episodeTotal || null,
         quality: movie.quality || null,
         lang: movie.lang || null,
         type: movie.type || null,

server/api/movies.get.ts

@@ -72,6 +72,7 @@ function mapMovieToResponse(movie: any) {
     year: movie.year || undefined,
     time: movie.time || undefined,
     episode: movie.episode || undefined,
+    episodeTotal: movie.episodeTotal || undefined,
     quality: movie.quality || undefined,
     lang: movie.lang || undefined,
     type: movie.type || undefined,

server/api/movies/[slug].get.ts

@@ -19,7 +19,9 @@ export default defineEventHandler(async (event) => {
     .where(and(eq(movies.slug, slug), eq(movies.source, source), eq(movies.active, true)))
     .limit(1)
 
-  if (!existing.length) {
+  let recordToUpdate = existing.length ? existing[0] : null
+
+  if (!recordToUpdate) {
     const fallback = await db
       .select()
       .from(movies)
@@ -29,9 +31,22 @@ export default defineEventHandler(async (event) => {
     if (!fallback.length) {
       throw createError({ statusCode: 404, statusMessage: 'Phim không tồn tại hoặc đã bị ẩn' })
     }
+    recordToUpdate = fallback[0]
   }
 
   const refs = parseSourceRefs(query.sources || query.srcs, query.source, slug)
 
-  return await getMovieDetailGroup(refs)
+  const detail = await getMovieDetailGroup(refs)
+
+  if (detail.episodeTotal && recordToUpdate) {
+    try {
+      await db
+        .update(movies)
+        .set({ episodeTotal: detail.episodeTotal })
+        .where(eq(movies.id, recordToUpdate.id))
+    } catch {
+    }
+  }
+
+  return detail
 })