fix(admin): 简化批量建分集表单并将移除操作置右

This commit is contained in:
Zhou Weidong authored and trae-solo-agent committed 2026-10-21 22:20:10 +08:00
1 parent 836600b811
commit 5741ebbf17
4 files changed
+55 -55

No files matched your search

+3 -3
View File
@@ -554,19 +554,19 @@ export default {
resumeMatched: 'Matched {count} file(s) and resumed', resumeMatched: 'Matched {count} file(s) and resumed',
resumeUnmatched: '{count} session(s) could not match local files; pick again manually', resumeUnmatched: '{count} session(s) could not match local files; pick again manually',
createTitle: 'Create episodes in batch', createTitle: 'Create episodes in batch',
createHint:
'Title uses the video file name; episode numbers are assigned automatically. You can edit them later in episode settings.',
colSource: 'Source file', colSource: 'Source file',
colNumber: 'Episode No.', colNumber: 'Episode No.',
colTitle: 'Title', colTitle: 'Title',
colFree: 'Free', colFree: 'Free',
colResult: 'Result', colResult: 'Result',
numberConflict: 'Episode number conflict',
missingVideo: 'Missing video URL', missingVideo: 'Missing video URL',
createOk: 'Created', createOk: 'Created',
createFailed: 'Create failed', createFailed: 'Create failed',
createAllSuccess: 'All episodes created', createAllSuccess: 'All episodes created',
createPartial: 'Some episodes failed; you can retry', createPartial: 'Some episodes failed; you can retry',
fixConflict: 'Resolve episode number conflicts first', submitCreate: 'Create',
submitCreate: 'Submit',
retryFailed: 'Retry failed', retryFailed: 'Retry failed',
status: { status: {
waiting: 'Waiting', waiting: 'Waiting',
+2 -3
View File
@@ -546,19 +546,18 @@ export default {
resumeMatched: '已匹配 {count} 个文件并开始续传', resumeMatched: '已匹配 {count} 个文件并开始续传',
resumeUnmatched: '有 {count} 个会话无法匹配本地文件,请手动重选', resumeUnmatched: '有 {count} 个会话无法匹配本地文件,请手动重选',
createTitle: '批量创建分集', createTitle: '批量创建分集',
createHint: '标题取视频文件名,集号自动顺延分配,创建后可在分集编辑中修改',
colSource: '源文件', colSource: '源文件',
colNumber: '集号', colNumber: '集号',
colTitle: '标题', colTitle: '标题',
colFree: '免费', colFree: '免费',
colResult: '结果', colResult: '结果',
numberConflict: '集号冲突',
missingVideo: '缺少视频地址', missingVideo: '缺少视频地址',
createOk: '已创建', createOk: '已创建',
createFailed: '创建失败', createFailed: '创建失败',
createAllSuccess: '全部分集已创建', createAllSuccess: '全部分集已创建',
createPartial: '部分分集创建失败,可重试', createPartial: '部分分集创建失败,可重试',
fixConflict: '请先解决集号冲突', submitCreate: '创建',
submitCreate: '提交创建',
retryFailed: '重试失败项', retryFailed: '重试失败项',
status: { status: {
waiting: '等待中', waiting: '等待中',
@@ -1,5 +1,5 @@
<!-- Author: fruit.com.cn --> <!-- Author: fruit.com.cn -->
<!-- 批量创建分集:自然排序预填集号与标题,冲突标红,失败可重试 --> <!-- 批量创建分集确认清单:标题取文件名,集号自动顺延,失败可重试 -->
<script setup lang="ts"> <script setup lang="ts">
import { ref, watch } from 'vue' import { ref, watch } from 'vue'
@@ -51,22 +51,37 @@ function compareNatural(left: string, right: string): number {
return left.localeCompare(right, undefined, { numeric: true, sensitivity: 'base' }) return left.localeCompare(right, undefined, { numeric: true, sensitivity: 'base' })
} }
/** 从起点起跳过已占用集号,返回下一个可用值。 */
function nextFreeNumber(start: number, used: Set<number>): number {
let candidate = start
while (used.has(candidate)) {
candidate += 1
}
return candidate
}
function buildRows(): void { function buildRows(): void {
const sorted = [...props.doneItems].sort((left, right) => const sorted = [...props.doneItems].sort((left, right) =>
compareNatural(baseName(left.fileName), baseName(right.fileName)) compareNatural(baseName(left.fileName), baseName(right.fileName))
) )
let number = props.nextEpisodeNumber const used = new Set(props.existingNumbers)
rows.value = sorted.map((item) => ({ let cursor = props.nextEpisodeNumber
key: item.id, rows.value = sorted.map((item) => {
sourceName: item.fileName, const number = nextFreeNumber(cursor, used)
number: number++, used.add(number)
title: baseName(item.fileName), cursor = number + 1
isFree: true, return {
videoUrl: item.url || '', key: item.id,
durationSec: item.durationSec || 0, sourceName: item.fileName,
saved: false, number,
error: '' title: baseName(item.fileName),
})) isFree: true,
videoUrl: item.url || '',
durationSec: item.durationSec || 0,
saved: false,
error: ''
}
})
} }
watch( watch(
@@ -76,12 +91,6 @@ watch(
} }
) )
function conflictOf(row: EpisodeDraft): boolean {
if (row.saved) return false
const duplicated = rows.value.filter((item) => item.number === row.number).length > 1
return duplicated || props.existingNumbers.includes(Number(row.number))
}
function errorText(error: unknown): string { function errorText(error: unknown): string {
if (error instanceof Error && error.message) return error.message if (error instanceof Error && error.message) return error.message
return t('episodeBatch.createFailed') return t('episodeBatch.createFailed')
@@ -96,7 +105,7 @@ async function createOne(row: EpisodeDraft): Promise<void> {
await createEpisodeApi({ await createEpisodeApi({
dramaId: props.dramaId as unknown as number, dramaId: props.dramaId as unknown as number,
number: row.number, number: row.number,
title: row.title.trim(), title: baseName(row.sourceName),
durationSec: row.durationSec, durationSec: row.durationSec,
videoUrl: row.videoUrl, videoUrl: row.videoUrl,
isFree: row.isFree, isFree: row.isFree,
@@ -112,10 +121,6 @@ async function createOne(row: EpisodeDraft): Promise<void> {
async function submit(): Promise<void> { async function submit(): Promise<void> {
if (submitting.value) return if (submitting.value) return
if (rows.value.some((row) => conflictOf(row))) {
ElMessage.warning(t('episodeBatch.fixConflict'))
return
}
submitting.value = true submitting.value = true
try { try {
for (const row of rows.value) { for (const row of rows.value) {
@@ -150,6 +155,7 @@ function hasFailed(): boolean {
:close-on-click-modal="false" :close-on-click-modal="false"
@update:model-value="emit('update:modelValue', $event)" @update:model-value="emit('update:modelValue', $event)"
> >
<p class="create-episode-hint">{{ t('episodeBatch.createHint') }}</p>
<div class="create-episode-head"> <div class="create-episode-head">
<span>{{ t('episodeBatch.colSource') }}</span> <span>{{ t('episodeBatch.colSource') }}</span>
<span>{{ t('episodeBatch.colNumber') }}</span> <span>{{ t('episodeBatch.colNumber') }}</span>
@@ -162,24 +168,14 @@ function hasFailed(): boolean {
v-for="row in rows" v-for="row in rows"
:key="row.key" :key="row.key"
class="create-episode-row" class="create-episode-row"
:class="{ 'is-conflict': conflictOf(row), 'is-saved': row.saved }" :class="{ 'is-saved': row.saved }"
> >
<b class="create-episode-source" :title="row.sourceName">{{ row.sourceName }}</b> <b class="create-episode-source" :title="row.sourceName">{{ row.sourceName }}</b>
<el-input-number <span class="create-episode-number">{{ row.number }}</span>
v-model="row.number" <span class="create-episode-title" :title="row.title">{{ row.title }}</span>
:min="1"
:max="999"
:disabled="row.saved"
controls-position="right"
/>
<el-input v-model="row.title" maxlength="100" :disabled="row.saved" />
<el-switch v-model="row.isFree" :disabled="row.saved" /> <el-switch v-model="row.isFree" :disabled="row.saved" />
<span class="create-episode-result"> <span class="create-episode-result">
{{ {{ row.saved ? t('episodeBatch.createOk') : row.error }}
row.saved
? t('episodeBatch.createOk')
: row.error || (conflictOf(row) ? t('episodeBatch.numberConflict') : '')
}}
</span> </span>
</div> </div>
</div> </div>
@@ -193,10 +189,17 @@ function hasFailed(): boolean {
</template> </template>
<style scoped> <style scoped>
.create-episode-hint {
margin: 0 0 12px;
color: var(--el-text-color-secondary);
font-size: 13px;
line-height: 1.5;
}
.create-episode-head, .create-episode-head,
.create-episode-row { .create-episode-row {
display: grid; display: grid;
grid-template-columns: minmax(120px, 1.2fr) 120px minmax(140px, 1.4fr) 48px minmax(80px, 0.8fr); grid-template-columns: minmax(120px, 1.2fr) 72px minmax(140px, 1.4fr) 48px minmax(80px, 0.8fr);
gap: 8px; gap: 8px;
align-items: center; align-items: center;
} }
@@ -215,26 +218,22 @@ function hasFailed(): boolean {
overflow: auto; overflow: auto;
} }
.create-episode-source { .create-episode-source,
.create-episode-title {
overflow: hidden; overflow: hidden;
text-overflow: ellipsis; text-overflow: ellipsis;
white-space: nowrap; white-space: nowrap;
} }
.create-episode-number {
font-variant-numeric: tabular-nums;
}
.create-episode-result { .create-episode-result {
color: var(--el-text-color-secondary); color: var(--el-text-color-secondary);
font-size: 12px; font-size: 12px;
} }
.create-episode-row.is-conflict :deep(.el-input-number) {
box-shadow: 0 0 0 1px var(--el-color-danger) inset;
border-radius: 4px;
}
.create-episode-row.is-conflict .create-episode-result {
color: var(--el-color-danger);
}
.create-episode-row.is-saved .create-episode-result { .create-episode-row.is-saved .create-episode-result {
color: var(--el-color-success); color: var(--el-color-success);
} }
@@ -108,6 +108,8 @@ const canRemove = computed(
margin-top: 8px; margin-top: 8px;
display: flex; display: flex;
gap: 8px; gap: 8px;
justify-content: flex-end;
margin-left: auto;
} }
.upload-task-row.is-failed { .upload-task-row.is-failed {