fix(admin): 剧集列表改用服务端分页修复列表为空

This commit is contained in:
Zhou Weidong committed 2026-10-22 09:18:59 +08:00
1 parent 99bb666e47
commit 6bcabea261
2 files changed
+42 -11

No files matched your search

+19 -1
View File
@@ -4,12 +4,30 @@ import request from '@/axios'
import type { EpisodeItem, EpisodeSaveData, PageResult } from './types' import type { EpisodeItem, EpisodeSaveData, PageResult } from './types'
export interface EpisodePageParams { export interface EpisodePageParams {
dramaId: number dramaId: number | string
status?: string status?: string
pageIndex?: number pageIndex?: number
pageSize?: number pageSize?: number
} }
/**
* 解包剧集列表分页。
* 契约(OpenAPI PageResultEpisodeRespVO):data = { total, list }。
* 兼容误把 data 当数组的旧调用,避免列表空白。
*/
export function parseEpisodePage(payload: unknown): PageResult<EpisodeItem> {
if (Array.isArray(payload)) {
return { total: payload.length, list: payload as EpisodeItem[] }
}
if (payload && typeof payload === 'object') {
const page = payload as { total?: unknown; list?: unknown }
const list = Array.isArray(page.list) ? (page.list as EpisodeItem[]) : []
const total = Number(page.total)
return { total: Number.isFinite(total) ? total : list.length, list }
}
return { total: 0, list: [] }
}
export const listEpisodesApi = (params: EpisodePageParams) => { export const listEpisodesApi = (params: EpisodePageParams) => {
return request.get<PageResult<EpisodeItem>>({ url: '/admin/episodes', params }) return request.get<PageResult<EpisodeItem>>({ url: '/admin/episodes', params })
} }
@@ -6,7 +6,12 @@ import { useRoute } from 'vue-router'
import { ElMessage, ElMessageBox } from 'element-plus' import { ElMessage, ElMessageBox } from 'element-plus'
import { AppIcons } from '@/constants/icons' import { AppIcons } from '@/constants/icons'
import { pageDramasApi } from '@/api/admin/drama' import { pageDramasApi } from '@/api/admin/drama'
import { deleteEpisodeApi, listEpisodesApi, sortEpisodesApi } from '@/api/admin/episode' import {
deleteEpisodeApi,
listEpisodesApi,
parseEpisodePage,
sortEpisodesApi
} from '@/api/admin/episode'
import { useRbac } from '@/stores/rbac' import { useRbac } from '@/stores/rbac'
import { formatCount } from '@/utils/format' import { formatCount } from '@/utils/format'
import { statusClass } from '@/utils/status' import { statusClass } from '@/utils/status'
@@ -50,6 +55,8 @@ const showPagination = computed(() => {
return Math.ceil(total.value / pageSize.value) > 1 return Math.ceil(total.value / pageSize.value) > 1
}) })
const showEmpty = computed(() => !loading.value && episodes.value.length === 0)
async function loadDramas() { async function loadDramas() {
const res = await pageDramasApi({ pageIndex: 1, pageSize: 200 }) const res = await pageDramasApi({ pageIndex: 1, pageSize: 200 })
dramas.value = res.data?.list || [] dramas.value = res.data?.list || []
@@ -77,8 +84,10 @@ async function loadEpisodes() {
pageIndex: pageIndex.value, pageIndex: pageIndex.value,
pageSize: pageSize.value pageSize: pageSize.value
}) })
episodes.value = res.data?.list || [] // 按 OpenAPI PageResult{total,list} 解包,禁止再把 data 当数组切片
total.value = res.data?.total || 0 const page = parseEpisodePage(res.data)
episodes.value = page.list
total.value = page.total
await clampOrRetreatPage() await clampOrRetreatPage()
} finally { } finally {
loading.value = false loading.value = false
@@ -100,10 +109,10 @@ async function refreshSnapshot() {
pageIndex: page, pageIndex: page,
pageSize: SNAPSHOT_PAGE_SIZE pageSize: SNAPSHOT_PAGE_SIZE
}) })
const list = res.data?.list || [] const parsed = parseEpisodePage(res.data)
totalCount = Number(res.data?.total || 0) totalCount = parsed.total
collected.push(...list) collected.push(...parsed.list)
if (!list.length) break if (!parsed.list.length) break
page += 1 page += 1
} while (collected.length < totalCount) } while (collected.length < totalCount)
snapshotEpisodes.value = collected snapshotEpisodes.value = collected
@@ -227,7 +236,6 @@ async function move(row, offset) {
async function onDramaChange() { async function onDramaChange() {
pageIndex.value = 1 pageIndex.value = 1
statusFilter.value = undefined
await loadEpisodes() await loadEpisodes()
openBatchIfPendingSessions() openBatchIfPendingSessions()
} }
@@ -327,12 +335,17 @@ onMounted(async () => {
v-loading="loading" v-loading="loading"
:data="episodes" :data="episodes"
row-key="id" row-key="id"
empty-text="该短剧暂无剧集"
class="drama-el-table episode-el-table" class="drama-el-table episode-el-table"
> >
<template #empty>
<el-empty
v-if="showEmpty"
:description="selectedDramaId ? '该短剧暂无剧集' : '请先选择短剧'"
/>
</template>
<el-table-column label="集数" width="90" <el-table-column label="集数" width="90"
><template #default="{ row }">{{ ><template #default="{ row }">{{
String(row.number).padStart(2, '0') String(row.number ?? 0).padStart(2, '0')
}}</template></el-table-column }}</template></el-table-column
> >
<el-table-column label="剧集名称" min-width="240" <el-table-column label="剧集名称" min-width="240"