fix(admin): 简化批量建分集表单并将移除操作置右
This commit is contained in:
1 parent
836600b811
commit
5741ebbf17
4 files changed
+55
-55
No files matched your search
+3
-3
@@ -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',
|
||||||
|
|||||||
@@ -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 {
|
||||||
|
|||||||
Reference in new issue
Block a user