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