添加任务-从原料库中添加

This commit is contained in:
lq
2025-09-23 17:11:51 +08:00
parent ab31959733
commit 288d4ffddf
4 changed files with 90 additions and 20 deletions

View File

@ -6,6 +6,7 @@
placement="right"
v-model:visible="showDriwer"
@after-visible-change="showDriwerChange"
@ok="handleCreateTask"
width="480px"
class="task-drawer"
style="z-index: 999"
@ -70,8 +71,22 @@
</template>
从原料库添加
</Button>
<div v-if="hasChoseMaterial" class="flex flex-col items-center">
<div v-if="hasChoseMaterial" class="flex flex-col items-center w-full">
<div
v-for="item in selectedMaterials.texts"
:key="item.id"
class="flex items-center bg-#F7F8FA border-rounded-8px w-full justify-items-center pt-8px pb-8px pl-12px pr-12px mb-16px"
>
{{ item }}
</div>
<div class="flex items-center w-full">
<img
v-for="item in selectedMaterials.images"
:key="item.id"
:src="item.cover"
class="w-88 h-88 mr-8px border-rounded-8px"
/>
</div>
</div>
<div v-else class="flex flex-col items-center">
<p class="material-hint">AI会参考添加的文本图片视频等素材完成符合需求的创作</p>
@ -206,7 +221,8 @@ const props = defineProps({
// 本地筛选状态(保持上次选择)
const localQuery = ref({
accounts: props.query?.ids || [],
accounts: props.query?.name || [],
ids: props.query?.ids || [],
});
// 原料库查询参数
@ -234,7 +250,7 @@ const selectedMaterials = ref({
data: [],
text: '',
images: [],
texts: []
texts: [],
});
const selectedProducts = ref({
@ -276,7 +292,7 @@ const handleMaterialConfirm = (result) => {
data: result.selectedData,
text: result.choseText,
images: result.choseImgArray,
texts: result.selectedTexts || []
texts: result.selectedTexts || [],
};
hasChoseMaterial.value = result.selectedKeys.length > 0;
};
@ -341,14 +357,49 @@ watch(showDriwer, (newVal) => {
}
});
// 点击创建任务按钮时触发
const handleCreateTask = () => {
// 验证表单
if (isActive.value === 'chose' && selectedProducts.value.keys.length === 0) {
// 可以添加错误提示:请选择发布内容
console.log('请选择发布内容');
return;
}
console.log(localQuery.value);
// 准备提交的数据
const taskData = {
media_account_id: localQuery.value.ids[0],
is_ai_generate: isActive.value == 'chose' ? 0 : 1,
description: taskDescription.value,
raw_material_ids: selectedMaterials.value.keys,
products: selectedProducts.value.keys,
publish_type: publishType.value == 'immediate' ? 0 : 1,
execution_time:
publishType.value === 'timing' ? `${dayjs(currentDate.value).format('YYYY-MM-DD')} ${strValue.value}` : null,
};
// 发射创建任务事件
emit('create-task', taskData);
// 关闭抽屉
showDriwer.value = false;
};
// 暴露方法给父组件
const showDrawer = (accountInfo = null) => {
const showDrawer = (accountInfo = null, selectedDate = null) => {
showDriwer.value = true;
if (accountInfo && accountInfo.id) {
nextTick(() => {
localQuery.value.accounts = [accountInfo.name];
localQuery.value.ids = [accountInfo.id];
});
}
console.log('selectedDate', selectedDate);
// 如果传入了日期,则设置为默认日期
if (selectedDate) {
currentDate.value = selectedDate;
console.log('currentDate', currentDate.value);
publishType.value = 'timing';
}
};
// 定义事件发射器

View File

@ -2,7 +2,7 @@
<a-trigger trigger="click" position="br" @click.stop>
<div class="task-item">
<div class="color-indicator" :style="{ background: getTaskColor() }"></div>
<div class="task-name" :title="task?.name || '-'">{{ task?.name || '-' }}</div>
<div class="task-name" :title="task?.name || '-'">{{ task?.name || 'AI生成内容' }}</div>
</div>
<template #content>
<div class="flex flex-col items-start popup-content" @click="gotoDetail">
@ -13,7 +13,7 @@
:src="getPlatformIcon(record.platform)"
style="border-radius: 8px; width: 16px; height: 16px; margin-right: 8px; font-size: 14px"
/>
<div class="task-title" :title="record.name || '-'">{{ record.name || '-' }}</div>
<div class="task-title" :title="record.name || 'AI生成内容'">{{ record.name || 'AI生成内容' }}</div>
</div>
<div
class="status-tag"
@ -31,8 +31,8 @@
</div>
</div>
<div class="font-size-14px color-#211F24 color-#211F24 task-description" :title="task.name || '未命名'">
{{ task.name || '未命名' }}
<div class="font-size-14px color-#211F24 color-#211F24 task-description" :title="task.name || 'AI生成内容'">
{{ task.name || 'AI生成内容' }}
</div>
<div v-if="task.ai_generate_status == 0" class="AILoding">
<ASpin />