增加克隆次数显示 弹框

main
guofei 2024-12-03 17:42:41 +08:00
parent 684e71358c
commit 44f9b6f8ff
2 changed files with 53 additions and 29 deletions

View File

@ -3,6 +3,12 @@
<template #header> <template #header>
<div class="flex justify-between items-center w-full"> <div class="flex justify-between items-center w-full">
<span>克隆角色音频</span> <span>克隆角色音频</span>
<div class="text-sm text-gray-500">
剩余克隆次数
<span :class="{ 'text-red-500': character?.remainingCloneCount === 0, 'text-green-500': character?.remainingCloneCount > 0 }">
{{ character?.remainingCloneCount || 0 }}
</span>
</div>
<el-button type="primary" link @click="showHistory"> <el-button type="primary" link @click="showHistory">
<el-icon class="mr-1"><List /></el-icon> <el-icon class="mr-1"><List /></el-icon>
克隆历史 克隆历史
@ -73,7 +79,11 @@ import CloneHistory from "./CloneHistory.vue";
const props = defineProps<{ const props = defineProps<{
visible: boolean; visible: boolean;
character: any; character: {
id: string;
roleName: string;
remainingCloneCount?: number;
};
}>(); }>();
const emit = defineEmits<{ const emit = defineEmits<{

View File

@ -50,10 +50,8 @@
</div> </div>
<div class="flex justify-end"> <div class="flex justify-end">
<ElButton @click="handleEdit(item)" type="warning" size="small">编辑</ElButton> <ElButton @click="handleEdit(item)" type="warning" size="small">编辑</ElButton>
<template v-if="!item.activate"> <ElButton @click="handleClone(item)" type="primary" size="small" class="ml-2"> 克隆音频 </ElButton>
<ElButton @click="handleClone(item)" type="primary" size="small" class="ml-2" :disabled="item.remainingCloneCount === 0"> 克隆音频 </ElButton> <ElButton v-if="item.originAudioUrl && !item.activate" @click="handleActivate(item)" type="success" size="small" class="ml-2"> </ElButton>
<ElButton v-if="item.originAudioUrl" @click="handleActivate(item)" type="success" size="small" class="ml-2"> </ElButton>
</template>
</div> </div>
</div> </div>
</el-card> </el-card>
@ -150,7 +148,7 @@
<el-icon><Document /></el-icon> <el-icon><Document /></el-icon>
<span>快速导入</span> <span>快速导入</span>
</div> </div>
<el-input v-model="formatJson" type="textarea" :rows="13" placeholder="贴格式化的JSON数据" class="format-input" /> <el-input v-model="formatJson" type="textarea" :rows="13" placeholder="贴格式化的JSON数据" class="format-input" />
<el-button type="primary" class="w-full mt-4" @click="handleAutoFormat"> <el-button type="primary" class="w-full mt-4" @click="handleAutoFormat">
<el-icon><Check /></el-icon> <el-icon><Check /></el-icon>
</el-button> </el-button>
@ -394,18 +392,39 @@ const handleRemoveImage = () => {
}; };
// //
const handleClone = (item: any) => { const handleClone = async (item: any) => {
currentCharacter.value = item; try {
//
const detail = await getSystemCharterDetailAPI(item.id);
currentCharacter.value = {
...item,
...detail.data,
};
cloneDialogVisible.value = true; cloneDialogVisible.value = true;
} catch (error) {
ElMessage.error("获取角色信息失败");
}
}; };
const showTaskList = () => { const showTaskList = () => {
taskListVisible.value = true; taskListVisible.value = true;
}; };
// //
const handleActivate = async (item: any) => { const handleActivate = async (item: any) => {
try { //
const detail = await getSystemCharterDetailAPI(item.id);
const character = {
...item,
...detail.data,
};
//
if (!character.originAudioUrl) {
ElMessage.warning("该角色还未克隆声音,无法激活");
return;
}
await ElMessageBox.confirm("激活后将不能继续克隆,是否确认激活?", "激活确认", { await ElMessageBox.confirm("激活后将不能继续克隆,是否确认激活?", "激活确认", {
confirmButtonText: "确定", confirmButtonText: "确定",
cancelButtonText: "取消", cancelButtonText: "取消",
@ -414,18 +433,13 @@ const handleActivate = async (item: any) => {
const loading = ElLoading.service(); const loading = ElLoading.service();
try { try {
await activateVoiceAPI(item.id); await activateVoiceAPI(character.id);
ElMessage.success("激活成功"); ElMessage.success("激活成功");
// //
initSystemCharterDataSource(); initSystemCharterDataSource();
} finally { } finally {
loading.close(); loading.close();
} }
} catch (error) {
if (error !== "cancel") {
ElMessage.error("激活失败");
}
}
}; };
</script> </script>