Skip to content

S
saas-dml
提交 ae9ff7d4 authored 作者: 王鹏飞's avatar 王鹏飞
浏览文件
操作

chore: 修改AI生成图片

上级 599362d7
显示空白字符变更
内嵌 并排
正在显示 包含 107 行增加 和 42 行删除
src/modules/material/all/api.ts
浏览文件 @ ae9ff7d4
import httpRequest from '@/utils/axios' 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) return httpRequest.post('/api/lab/v1/experiment/marketing-ai/create', data)
} }
......
src/modules/material/all/components/AIChat.vue
浏览文件 @ ae9ff7d4
...@@ -5,7 +5,7 @@ import { useMapStore } from '@/stores/map' ...@@ -5,7 +5,7 @@ import { useMapStore } from '@/stores/map'
import { useUserStore } from '@/stores/user' import { useUserStore } from '@/stores/user'
import { useConnection } from '../composables/useConnection' import { useConnection } from '../composables/useConnection'
import { useIndustry } from '../composables/useIndustry' 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 IconComputer from './IconComputer.vue'
import IconUser from './IconUser.vue' import IconUser from './IconUser.vue'
import IconAI from './IconAI.vue' import IconAI from './IconAI.vue'
...@@ -21,17 +21,22 @@ const { industryList } = useIndustry() ...@@ -21,17 +21,22 @@ const { industryList } = useIndustry()
const { connectionList } = useConnection() const { connectionList } = useConnection()
const welcomeMessage = computed(() => { const welcomeMessage = computed(() => {
const way = getNameByValue(form.value.way, materialMethodList) const data = form.value
const type = getNameByValue(form.value.type, materialType) const way = getNameByValue(data.way, materialMethodList)
const industry = industryList.value.find(item => item.id == form.value.industry_id)?.name const type = getNameByValue(data.type, materialType)
const personnel = getNameByValue(form.value.personnel_type, materialUsersList) const industry = industryList.value.find(item => item.id == data.industry_id)?.name
const scenario = getNameByValue(form.value.scenario_type, materialUsageList) const personnel = getNameByValue(data.personnel_type, materialUsersList)
const connection = connectionList.value.find(item => item.id == form.value.channel)?.type_name const scenario = getNameByValue(data.scenario_type, materialUsageList)
const key = form.value.key_points const connection = connectionList.value.find(item => item.id == data.channel)?.type_name
if (form.value.type == 1) { const extendInfo = data.extend_info || {}
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 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('') const content = ref('')
...@@ -84,13 +89,13 @@ async function handleSendType(type, content) { ...@@ -84,13 +89,13 @@ async function handleSendType(type, content) {
}) })
switch (type) { switch (type) {
case 2: case 2:
content = `我是${userName}，${content}` content = `${content}`
break break
case 3: case 3:
content = `我是${userName}，${content.replace('请帮我创作一个', '请帮我润色一个')}` content = `我是${userName},请帮我润色以下内容：${content.replace('请帮我创作一个', '')}`
break break
case 4: case 4:
content = `我是${userName}，${content.replace('请帮我创作一个', '请帮我扩写一个')}` content = `我是${userName},请帮我扩写以下内容：${content.replace('请帮我创作一个', '')}`
break break
} }
......
src/modules/material/all/components/StepTwo.vue
浏览文件 @ ae9ff7d4
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
import { useMapStore } from '@/stores/map' import { useMapStore } from '@/stores/map'
import { useConnection } from '../composables/useConnection' import { useConnection } from '../composables/useConnection'
import { useIndustry } from '../composables/useIndustry' import { useIndustry } from '../composables/useIndustry'
import { getNameByValue, materialMethodList, materialUsageList, materialUsersList } from '@/utils/dictionary' import { getNameByValue, materialMethodList, materialUsageList, materialUsersList, materialPictureStyleList } from '@/utils/dictionary'
defineProps(['action']) defineProps(['action'])
...@@ -19,7 +19,12 @@ const rules = ref({ ...@@ -19,7 +19,12 @@ const rules = ref({
industry_id: [{ required: true, message: '请选择所属行业' }], industry_id: [{ required: true, message: '请选择所属行业' }],
scenario_type: [{ required: true, message: '请选择使用场景' }], scenario_type: [{ required: true, message: '请选择使用场景' }],
personnel_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() { async function handleValidate() {
...@@ -46,6 +51,24 @@ async function handleNext() { ...@@ -46,6 +51,24 @@ async function handleNext() {
</el-form> </el-form>
<el-divider></el-divider> <el-divider></el-divider>
<el-form label-suffix="：" label-width="130" :model="form" :rules="rules" ref="formRef" :disabled="action === 'view'"> <el-form label-suffix="：" label-width="130" :model="form" :rules="rules" ref="formRef" :disabled="action === 'view'">
<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-form-item label="所属行业" prop="industry_id">
<el-select v-model="form.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-option v-for="item in industryList" :key="item.id" :label="item.name" :value="item.id + ''"></el-option>
...@@ -66,8 +89,8 @@ async function handleNext() { ...@@ -66,8 +89,8 @@ async function handleNext() {
<el-radio v-for="item in connectionList" :key="item.id" :value="item.id">{{ item.type_name }}</el-radio> <el-radio v-for="item in connectionList" :key="item.id" :value="item.id">{{ item.type_name }}</el-radio>
</el-radio-group> </el-radio-group>
</el-form-item> </el-form-item>
<el-form-item label="文本字数" prop="word_count" v-if="form.type == 1 && form.way == 1"> <el-form-item label="文本字数" prop="extend_info.text_count" v-if="form.type == 1 && form.way == 1">
<el-radio-group v-model="form.word_count"> <el-radio-group v-model="form.extend_info.text_count">
<el-radio :value="100">100</el-radio> <el-radio :value="100">100</el-radio>
<el-radio :value="200">200</el-radio> <el-radio :value="200">200</el-radio>
<el-radio :value="300">300</el-radio> <el-radio :value="300">300</el-radio>
...@@ -77,6 +100,7 @@ async function handleNext() { ...@@ -77,6 +100,7 @@ async function handleNext() {
<el-form-item label="关键点" prop="key_points"> <el-form-item label="关键点" prop="key_points">
<el-input type="textarea" :rows="4" v-model="form.key_points" placeholder="请输入内容的核心内容或者关键点，多个请使用英文“,”号进行隔离。" /> <el-input type="textarea" :rows="4" v-model="form.key_points" placeholder="请输入内容的核心内容或者关键点，多个请使用英文“,”号进行隔离。" />
</el-form-item> </el-form-item>
</template>
</el-form> </el-form>
<el-row justify="center"> <el-row justify="center">
<el-button type="primary" @click="handlePrev">上一步</el-button> <el-button type="primary" @click="handlePrev">上一步</el-button>
......
src/modules/material/all/components/ViewDialog.vue
浏览文件 @ ae9ff7d4
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
import { useMapStore } from '@/stores/map' import { useMapStore } from '@/stores/map'
import { useConnection } from '../composables/useConnection' import { useConnection } from '../composables/useConnection'
import { useIndustry } from '../composables/useIndustry' 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' import AppUpload from '@/components/base/AppUpload.vue'
const props = defineProps(['data']) const props = defineProps(['data'])
...@@ -25,6 +25,24 @@ const typeName = computed(() => { ...@@ -25,6 +25,24 @@ const typeName = computed(() => {
</el-form> </el-form>
<el-divider></el-divider> <el-divider></el-divider>
<el-form label-suffix="：" label-width="120" ref="formRef"> <el-form label-suffix="：" label-width="120" ref="formRef">
<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-form-item label="所属行业" prop="industry_id">
<el-select :model-value="data.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-option v-for="item in industryList" :key="item.id" :label="item.name" :value="item.id + ''"></el-option>
...@@ -48,6 +66,7 @@ const typeName = computed(() => { ...@@ -48,6 +66,7 @@ const typeName = computed(() => {
<el-form-item label="关键点" prop="key_points"> <el-form-item label="关键点" prop="key_points">
<el-input type="textarea" :rows="4" :model-value="data.key_points" placeholder="请输入内容的核心内容或者关键点，多个请使用英文“,”号进行隔离。" /> <el-input type="textarea" :rows="4" :model-value="data.key_points" placeholder="请输入内容的核心内容或者关键点，多个请使用英文“,”号进行隔离。" />
</el-form-item> </el-form-item>
</template>
<el-form-item :label="`${typeName}资源`" prop="content"> <el-form-item :label="`${typeName}资源`" prop="content">
<template v-if="data.type == 1"> <template v-if="data.type == 1">
<!-- 文本 --> <!-- 文本 -->
......
src/modules/material/all/views/Index.vue
浏览文件 @ ae9ff7d4
...@@ -75,22 +75,22 @@ const listOptions = computed(() => { ...@@ -75,22 +75,22 @@ const listOptions = computed(() => {
return getNameByValue(row.way, materialMethodList) return getNameByValue(row.way, materialMethodList)
} }
}, },
{ label: '行业', prop: 'industry_name' }, // { label: '行业', prop: 'industry_name' },
{ // {
label: '使用场景', // label: '使用场景',
prop: 'scenario_type', // prop: 'scenario_type',
computed: ({ row }: { row: MaterialProp }) => { // computed: ({ row }: { row: MaterialProp }) => {
return getNameByValue(row.scenario_type, materialUsageList) // return getNameByValue(row.scenario_type, materialUsageList)
} // }
}, // },
{ // {
label: '使用人员', // label: '使用人员',
prop: 'personnel_type', // prop: 'personnel_type',
computed: ({ row }: { row: MaterialProp }) => { // computed: ({ row }: { row: MaterialProp }) => {
return getNameByValue(row.personnel_type, materialUsersList) // return getNameByValue(row.personnel_type, materialUsersList)
} // }
}, // },
{ label: '投放渠道', prop: 'channel_detail.type_name' }, // { label: '投放渠道', prop: 'channel_detail.type_name' },
{ {
label: '状态', label: '状态',
prop: 'status_name', prop: 'status_name',
...@@ -100,12 +100,11 @@ const listOptions = computed(() => { ...@@ -100,12 +100,11 @@ const listOptions = computed(() => {
{ {
label: '更新人', label: '更新人',
prop: 'updated_operator_name', prop: 'updated_operator_name',
width: 100,
computed: ({ row }: { row: MaterialProp }) => { computed: ({ row }: { row: MaterialProp }) => {
return row.updated_operator.real_name || row.updated_operator.nickname || row.updated_operator.username 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 } { label: '操作', slots: 'table-x', width: 240 }
] ]
} }
......
src/modules/material/all/views/Update.vue
浏览文件 @ ae9ff7d4
<script setup lang="ts"> <script setup lang="ts">
import { ElMessage } from 'element-plus' import { ElMessage } from 'element-plus'
import { createMaterial, updateMaterial, getMaterial } from '../api' import { createMaterial, updateMaterial, getMaterial } from '../api'
import { pickBy } from 'lodash-es'
const props = defineProps<{ action: string }>() const props = defineProps<{ action: string }>()
...@@ -23,7 +24,7 @@ const form: any = reactive({ ...@@ -23,7 +24,7 @@ const form: any = reactive({
channel: '', channel: '',
key_points: '', key_points: '',
content: '', content: '',
word_count: 100 extend_info: {}
}) })
const detail = ref() const detail = ref()
...@@ -49,7 +50,8 @@ function handleNext() { ...@@ -49,7 +50,8 @@ function handleNext() {
// 下一步提交 // 下一步提交
async function handleNextAndSubmit() { async function handleNextAndSubmit() {
if (!form.id && form.way == 1) { 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 form.id = res.data.id
} }
handleNext() handleNext()
...@@ -60,14 +62,16 @@ async function handleSubmit() { ...@@ -60,14 +62,16 @@ async function handleSubmit() {
} }
// 创建 // 创建
async function handleCreate() { async function handleCreate() {
await createMaterial(form) const params = pickBy(form, item => item !== '' && item != '0')
await createMaterial(params)
ElMessage.success('创建成功') ElMessage.success('创建成功')
router.replace('/material') router.replace('/material')
} }
// 修改 // 修改
async function handleUpdate() { async function handleUpdate() {
await updateMaterial(form) const params = pickBy(form, item => item !== '' && item != '0')
await updateMaterial(params)
ElMessage.success('修改成功') ElMessage.success('修改成功')
router.replace('/material') router.replace('/material')
} }
......
src/utils/dictionary.ts
浏览文件 @ ae9ff7d4
...@@ -134,3 +134,17 @@ export const materialUsersList = [ ...@@ -134,3 +134,17 @@ export const materialUsersList = [
{ label: '运维人员 ', value: '4' }, { label: '运维人员 ', value: '4' },
{ label: '机器系统 ', value: '5' } { 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 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论