提交 ae9ff7d4 authored 作者: 王鹏飞's avatar 王鹏飞

chore: 修改AI生成图片

上级 599362d7
import httpRequest from '@/utils/axios'
// 新建资料
export function createMaterial(data: { name: string; type: string; content: string; status: string }) {
export function createMaterial(data: any) {
return httpRequest.post('/api/lab/v1/experiment/marketing-ai/create', data)
}
......
......@@ -5,7 +5,7 @@ import { useMapStore } from '@/stores/map'
import { useUserStore } from '@/stores/user'
import { useConnection } from '../composables/useConnection'
import { useIndustry } from '../composables/useIndustry'
import { getNameByValue, materialMethodList, materialUsageList, materialUsersList } from '@/utils/dictionary'
import { getNameByValue, materialMethodList, materialUsageList, materialUsersList, materialPictureStyleList } from '@/utils/dictionary'
import IconComputer from './IconComputer.vue'
import IconUser from './IconUser.vue'
import IconAI from './IconAI.vue'
......@@ -21,17 +21,22 @@ const { industryList } = useIndustry()
const { connectionList } = useConnection()
const welcomeMessage = computed(() => {
const way = getNameByValue(form.value.way, materialMethodList)
const type = getNameByValue(form.value.type, materialType)
const industry = industryList.value.find(item => item.id == form.value.industry_id)?.name
const personnel = getNameByValue(form.value.personnel_type, materialUsersList)
const scenario = getNameByValue(form.value.scenario_type, materialUsageList)
const connection = connectionList.value.find(item => item.id == form.value.channel)?.type_name
const key = form.value.key_points
if (form.value.type == 1) {
return `请帮我创作一个<b class="bold">“${type}内容”</b>,该内容的所属行业是<b class="bold">${industry}”</b>,该内容将以<b class="bold">“${personnel}”</b>的角色向客户发出 ,该内容的主要使用场景是用于<b class="bold">“${scenario}”</b>,该内容的主要投放渠道是<b class="bold">“${connection}”</b>,该内容的关键点包含了:<b class="bold">${key}</b>。该内容的字数控制在“${form.value.word_count}字以内”`
const data = form.value
const way = getNameByValue(data.way, materialMethodList)
const type = getNameByValue(data.type, materialType)
const industry = industryList.value.find(item => item.id == data.industry_id)?.name
const personnel = getNameByValue(data.personnel_type, materialUsersList)
const scenario = getNameByValue(data.scenario_type, materialUsageList)
const connection = connectionList.value.find(item => item.id == data.channel)?.type_name
const extendInfo = data.extend_info || {}
const pictureStyle = getNameByValue(extendInfo.picture_style, materialPictureStyleList)
if (data.type == 1) {
return `请帮我创作一个<b class="bold">“${industry}”</b>,“<b class="bold">${personnel}”</b>,通过<b class="bold">“${connection}”</b>渠道,向客户发送<b class="bold">“${scenario}”</b>的文本,字数控制在“<b class="bold">${extendInfo.text_count}字以内</b>“,关键点需要包含:<b class="bold">${data.key_points}</b>。`
} else if (data.type == 2) {
return `<b class="bold">${extendInfo.person_des}${extendInfo.scene_des}</b>,重点突出<b class="bold">${extendInfo.important_info_desc}${pictureStyle}</b>`
}
return `你将以<b class="bold">${way}</b>的方式创作一个<b class="bold">${type}内容</b>,该营销内容的所属行业是<b class="bold">${industry}</b>,主要使用人员是<b class="bold">${personnel}</b>,主要使用的场景是用于<b class="bold">${scenario}</b>,主要投放渠道是在<b class="bold">${connection}</b>,内容的关键突出点包含了<b class="bold">${key}</b>。`
return `你将以<b class="bold">${way}</b>的方式创作一个<b class="bold">${type}内容</b>,该营销内容的所属行业是<b class="bold">${industry}</b>,主要使用人员是<b class="bold">${personnel}</b>,主要使用的场景是用于<b class="bold">${scenario}</b>,主要投放渠道是在<b class="bold">${connection}</b>,内容的关键突出点包含了<b class="bold">${data.key_points}</b>。`
})
const content = ref('')
......@@ -84,13 +89,13 @@ async function handleSendType(type, content) {
})
switch (type) {
case 2:
content = `我是${userName}${content}`
content = `${content}`
break
case 3:
content = `我是${userName}${content.replace('请帮我创作一个', '请帮我润色一个')}`
content = `我是${userName},请帮我润色以下内容:${content.replace('请帮我创作一个', '')}`
break
case 4:
content = `我是${userName}${content.replace('请帮我创作一个', '请帮我扩写一个')}`
content = `我是${userName},请帮我扩写以下内容:${content.replace('请帮我创作一个', '')}`
break
}
......
......@@ -2,7 +2,7 @@
import { useMapStore } from '@/stores/map'
import { useConnection } from '../composables/useConnection'
import { useIndustry } from '../composables/useIndustry'
import { getNameByValue, materialMethodList, materialUsageList, materialUsersList } from '@/utils/dictionary'
import { getNameByValue, materialMethodList, materialUsageList, materialUsersList, materialPictureStyleList } from '@/utils/dictionary'
defineProps(['action'])
......@@ -19,7 +19,12 @@ const rules = ref({
industry_id: [{ required: true, message: '请选择所属行业' }],
scenario_type: [{ required: true, message: '请选择使用场景' }],
personnel_type: [{ required: true, message: '请选择使用人员' }],
channel: [{ required: true, message: '请选择内容投放渠道' }]
channel: [{ required: true, message: '请选择内容投放渠道' }],
'extend_info.text_count': [{ required: true, message: '请选择文本字数' }],
'extend_info.picture_style': [{ required: true, message: '请选择图片风格' }],
'extend_info.person_des': [{ required: true, message: '请输入人物描述' }],
'extend_info.scene_des': [{ required: true, message: '请输入场景描述' }],
'extend_info.important_info_desc': [{ required: true, message: '请输入突出重点信息描述' }]
})
async function handleValidate() {
......@@ -46,37 +51,56 @@ async function handleNext() {
</el-form>
<el-divider></el-divider>
<el-form label-suffix=":" label-width="130" :model="form" :rules="rules" ref="formRef" :disabled="action === 'view'">
<el-form-item label="所属行业" prop="industry_id">
<el-select v-model="form.industry_id">
<el-option v-for="item in industryList" :key="item.id" :label="item.name" :value="item.id + ''"></el-option>
</el-select>
</el-form-item>
<el-form-item label="使用场景" prop="scenario_type">
<el-radio-group v-model="form.scenario_type">
<el-radio v-for="item in materialUsageList" :key="item.id" :value="item.value">{{ item.label }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="使用人员" prop="personnel_type">
<el-radio-group v-model="form.personnel_type">
<el-radio v-for="item in materialUsersList" :key="item.id" :value="item.value">{{ item.label }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="内容投放渠道" prop="channel">
<el-radio-group v-model="form.channel">
<el-radio v-for="item in connectionList" :key="item.id" :value="item.id">{{ item.type_name }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="文本字数" prop="word_count" v-if="form.type == 1 && form.way == 1">
<el-radio-group v-model="form.word_count">
<el-radio :value="100">100</el-radio>
<el-radio :value="200">200</el-radio>
<el-radio :value="300">300</el-radio>
<el-radio :value="500">500</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="关键点" prop="key_points">
<el-input type="textarea" :rows="4" v-model="form.key_points" placeholder="请输入内容的核心内容或者关键点,多个请使用英文“,”号进行隔离。" />
</el-form-item>
<template v-if="form.type == 2 && form.way == 1">
<!-- 图片AI -->
<el-form-item label="图片风格" prop="extend_info.picture_style">
<el-radio-group v-model="form.extend_info.picture_style">
<el-radio v-for="item in materialPictureStyleList" :key="item.id" :value="item.value">{{ item.label }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="人物描述" prop="extend_info.person_des">
<el-input type="textarea" :rows="3" v-model="form.extend_info.person_des" />
</el-form-item>
<el-form-item label="场景描述" prop="extend_info.scene_des">
<el-input type="textarea" :rows="3" v-model="form.extend_info.scene_des" />
</el-form-item>
<el-form-item label="突出重点信息描述" prop="extend_info.important_info_desc">
<el-input type="textarea" :rows="3" v-model="form.extend_info.important_info_desc" />
</el-form-item>
</template>
<template v-else>
<el-form-item label="所属行业" prop="industry_id">
<el-select v-model="form.industry_id">
<el-option v-for="item in industryList" :key="item.id" :label="item.name" :value="item.id + ''"></el-option>
</el-select>
</el-form-item>
<el-form-item label="使用场景" prop="scenario_type">
<el-radio-group v-model="form.scenario_type">
<el-radio v-for="item in materialUsageList" :key="item.id" :value="item.value">{{ item.label }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="使用人员" prop="personnel_type">
<el-radio-group v-model="form.personnel_type">
<el-radio v-for="item in materialUsersList" :key="item.id" :value="item.value">{{ item.label }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="内容投放渠道" prop="channel">
<el-radio-group v-model="form.channel">
<el-radio v-for="item in connectionList" :key="item.id" :value="item.id">{{ item.type_name }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="文本字数" prop="extend_info.text_count" v-if="form.type == 1 && form.way == 1">
<el-radio-group v-model="form.extend_info.text_count">
<el-radio :value="100">100</el-radio>
<el-radio :value="200">200</el-radio>
<el-radio :value="300">300</el-radio>
<el-radio :value="500">500</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="关键点" prop="key_points">
<el-input type="textarea" :rows="4" v-model="form.key_points" placeholder="请输入内容的核心内容或者关键点,多个请使用英文“,”号进行隔离。" />
</el-form-item>
</template>
</el-form>
<el-row justify="center">
<el-button type="primary" @click="handlePrev">上一步</el-button>
......
......@@ -2,7 +2,7 @@
import { useMapStore } from '@/stores/map'
import { useConnection } from '../composables/useConnection'
import { useIndustry } from '../composables/useIndustry'
import { getNameByValue, materialMethodList, materialUsageList, materialUsersList } from '@/utils/dictionary'
import { getNameByValue, materialMethodList, materialUsageList, materialUsersList, materialPictureStyleList } from '@/utils/dictionary'
import AppUpload from '@/components/base/AppUpload.vue'
const props = defineProps(['data'])
......@@ -25,29 +25,48 @@ const typeName = computed(() => {
</el-form>
<el-divider></el-divider>
<el-form label-suffix=":" label-width="120" ref="formRef">
<el-form-item label="所属行业" prop="industry_id">
<el-select :model-value="data.industry_id">
<el-option v-for="item in industryList" :key="item.id" :label="item.name" :value="item.id + ''"></el-option>
</el-select>
</el-form-item>
<el-form-item label="使用场景" prop="scenario_type">
<el-radio-group :model-value="data.scenario_type">
<el-radio v-for="item in materialUsageList" :key="item.id" :value="item.value">{{ item.label }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="使用人员" prop="personnel_type">
<el-radio-group :model-value="data.personnel_type">
<el-radio v-for="item in materialUsersList" :key="item.id" :value="item.value">{{ item.label }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="内容投放渠道" prop="channel">
<el-radio-group :model-value="data.channel">
<el-radio v-for="item in connectionList" :key="item.id" :value="item.id">{{ item.type_name }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="关键点" prop="key_points">
<el-input type="textarea" :rows="4" :model-value="data.key_points" placeholder="请输入内容的核心内容或者关键点,多个请使用英文“,”号进行隔离。" />
</el-form-item>
<template v-if="data.type == 2 && data.way == 1">
<!-- 图片AI -->
<el-form-item label="图片风格" prop="extend_info.picture_style">
<el-radio-group :modelValue="data.extend_info.picture_style">
<el-radio v-for="item in materialPictureStyleList" :key="item.id" :value="item.value">{{ item.label }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="人物描述" prop="extend_info.person_des">
<el-input type="textarea" :rows="3" :modelValue="data.extend_info.person_des" />
</el-form-item>
<el-form-item label="场景描述" prop="extend_info.scene_des">
<el-input type="textarea" :rows="3" :modelValue="data.extend_info.scene_des" />
</el-form-item>
<el-form-item label="突出重点信息描述" prop="extend_info.important_info_desc">
<el-input type="textarea" :rows="3" :modelValue="data.extend_info.important_info_desc" />
</el-form-item>
</template>
<template v-else>
<el-form-item label="所属行业" prop="industry_id">
<el-select :model-value="data.industry_id">
<el-option v-for="item in industryList" :key="item.id" :label="item.name" :value="item.id + ''"></el-option>
</el-select>
</el-form-item>
<el-form-item label="使用场景" prop="scenario_type">
<el-radio-group :model-value="data.scenario_type">
<el-radio v-for="item in materialUsageList" :key="item.id" :value="item.value">{{ item.label }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="使用人员" prop="personnel_type">
<el-radio-group :model-value="data.personnel_type">
<el-radio v-for="item in materialUsersList" :key="item.id" :value="item.value">{{ item.label }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="内容投放渠道" prop="channel">
<el-radio-group :model-value="data.channel">
<el-radio v-for="item in connectionList" :key="item.id" :value="item.id">{{ item.type_name }}</el-radio>
</el-radio-group>
</el-form-item>
<el-form-item label="关键点" prop="key_points">
<el-input type="textarea" :rows="4" :model-value="data.key_points" placeholder="请输入内容的核心内容或者关键点,多个请使用英文“,”号进行隔离。" />
</el-form-item>
</template>
<el-form-item :label="`${typeName}资源`" prop="content">
<template v-if="data.type == 1">
<!-- 文本 -->
......
......@@ -75,22 +75,22 @@ const listOptions = computed(() => {
return getNameByValue(row.way, materialMethodList)
}
},
{ label: '行业', prop: 'industry_name' },
{
label: '使用场景',
prop: 'scenario_type',
computed: ({ row }: { row: MaterialProp }) => {
return getNameByValue(row.scenario_type, materialUsageList)
}
},
{
label: '使用人员',
prop: 'personnel_type',
computed: ({ row }: { row: MaterialProp }) => {
return getNameByValue(row.personnel_type, materialUsersList)
}
},
{ label: '投放渠道', prop: 'channel_detail.type_name' },
// { label: '行业', prop: 'industry_name' },
// {
// label: '使用场景',
// prop: 'scenario_type',
// computed: ({ row }: { row: MaterialProp }) => {
// return getNameByValue(row.scenario_type, materialUsageList)
// }
// },
// {
// label: '使用人员',
// prop: 'personnel_type',
// computed: ({ row }: { row: MaterialProp }) => {
// return getNameByValue(row.personnel_type, materialUsersList)
// }
// },
// { label: '投放渠道', prop: 'channel_detail.type_name' },
{
label: '状态',
prop: 'status_name',
......@@ -100,12 +100,11 @@ const listOptions = computed(() => {
{
label: '更新人',
prop: 'updated_operator_name',
width: 100,
computed: ({ row }: { row: MaterialProp }) => {
return row.updated_operator.real_name || row.updated_operator.nickname || row.updated_operator.username
}
},
{ label: '更新时间', prop: 'updated_time', width: 180 },
{ label: '更新时间', prop: 'updated_time' },
{ label: '操作', slots: 'table-x', width: 240 }
]
}
......
<script setup lang="ts">
import { ElMessage } from 'element-plus'
import { createMaterial, updateMaterial, getMaterial } from '../api'
import { pickBy } from 'lodash-es'
const props = defineProps<{ action: string }>()
......@@ -23,7 +24,7 @@ const form: any = reactive({
channel: '',
key_points: '',
content: '',
word_count: 100
extend_info: {}
})
const detail = ref()
......@@ -49,7 +50,8 @@ function handleNext() {
// 下一步提交
async function handleNextAndSubmit() {
if (!form.id && form.way == 1) {
const res = await createMaterial(form)
const params = pickBy(form, item => item !== '' && item != '0')
const res = await createMaterial(params)
form.id = res.data.id
}
handleNext()
......@@ -60,14 +62,16 @@ async function handleSubmit() {
}
// 创建
async function handleCreate() {
await createMaterial(form)
const params = pickBy(form, item => item !== '' && item != '0')
await createMaterial(params)
ElMessage.success('创建成功')
router.replace('/material')
}
// 修改
async function handleUpdate() {
await updateMaterial(form)
const params = pickBy(form, item => item !== '' && item != '0')
await updateMaterial(params)
ElMessage.success('修改成功')
router.replace('/material')
}
......
......@@ -134,3 +134,17 @@ export const materialUsersList = [
{ label: '运维人员 ', value: '4' },
{ label: '机器系统 ', value: '5' }
]
// 图片风格
export const materialPictureStyleList = [
{ label: '商务风格 ', value: '1' },
{ label: '扁平化 ', value: '2' },
{ label: '清新文艺 ', value: '3' },
{ label: '古典中国风 ', value: '4' },
{ label: '创意简约风 ', value: '5' },
{ label: '艺术插画 ', value: '6' },
{ label: '大气渐变 ', value: '7' },
{ label: '手绘水彩风 ', value: '8' },
{ label: '时尚杂志风 ', value: '9' },
{ label: '漫画风格 ', value: '10' }
]
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论